/* Editorial Krug concept: solid reading cards above an animated color field. */
.help-entry .secondary{display:inline-flex;align-items:center;justify-content:center;min-height:46px}
.help-intro{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.help-intro .logo{width:42px;height:42px;margin:0;flex:none;border-radius:14px}
.help-intro p{margin:0;line-height:1.6}
.help-topics details{border-bottom:1px solid var(--line,#dfe6f1);padding:0}
.help-topics summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:62px;padding:14px 0;font-weight:650;cursor:pointer}
.help-topics summary::-webkit-details-marker{display:none}
.help-topics summary svg{width:18px;height:18px;transition:transform .18s ease}
.help-topics details[open] summary svg{transform:rotate(90deg)}
.help-topics details p{margin:0 0 20px;line-height:1.7;color:var(--secondary-ink,#61728d)}
.help-replay{margin-top:24px;min-height:46px;width:100%}
.welcome-dialog{width:min(480px,calc(100% - 24px))}
.welcome-tour{text-align:center;padding:8px 8px 4px}
.welcome-tour-icon{display:grid;place-items:center;width:72px;height:72px;margin:0 auto 20px;border-radius:24px;background:#879ee81c;color:var(--brand,#5366d9)}
.welcome-tour-icon>.logo{width:54px;height:54px;border-radius:18px;margin:0}
.welcome-tour-icon>svg{width:34px;height:34px}
.welcome-counter{font-size:.8rem;color:var(--secondary-ink,#61728d);margin:0 0 12px}
.welcome-tour h3{font-size:1.5rem;line-height:1.2;margin:0 0 18px;color:var(--ink)}
.welcome-tour>p:not(.welcome-counter){line-height:1.7;margin:0 0 16px}
.welcome-tour .sub{min-height:4.8em}
.welcome-dots{display:flex;justify-content:center;gap:7px;margin:22px 0}
.welcome-dots i{width:6px;height:6px;border-radius:50%;background:#8d9cbb55}
.welcome-dots i.active{background:var(--brand,#5366d9);width:20px;border-radius:4px}
.welcome-controls{display:flex;gap:10px;margin-bottom:10px}
.welcome-controls>button{flex:1;min-height:48px}
.welcome-tour>.text-button{min-height:44px;font-size:.85rem}
@media(max-height:550px){.welcome-tour-icon{width:48px;height:48px;margin-bottom:10px}.welcome-tour-icon>.logo{width:40px;height:40px}.welcome-tour .sub{min-height:0}.welcome-tour h3{font-size:1.2rem}.welcome-dots{margin:12px 0}}
@media(prefers-reduced-motion:reduce){.help-topics summary svg{transition:none}}
.logo {
  position: relative; overflow: hidden; border: 0;
  background: linear-gradient(145deg, #789ef0, #5366d9);
  box-shadow: inset 0 1px 1px #ffffff80, 0 5px 14px #15243c20;
}
.logo::before, .page-brand-mark::before {
  content: ''; position: absolute; left: 50%; top: 50%;
  width: 52%; height: 52%; border: 5px solid #fff;
  border-right-color: #ffbb8d; border-radius: 50%;
  transform: translate(-50%, -50%) rotate(-35deg);
  background: none; box-shadow: none;
}
.logo::after, .page-brand-mark::after { content: none; }
.page-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 2px 0 25px;
  color: var(--ink);
  font-size: 1.15rem;
  font-weight: 780;
  letter-spacing: -.04em;
}
.page-brand-mark {
  position: relative; display: block; width: 32px; height: 32px; flex: none;
  border-radius: 11px; background: linear-gradient(145deg, #789ef0, #5366d9);
  box-shadow: inset 0 1px 1px #ffffff80;
}
.page-brand-mark::before { border-width: 3.5px; }
.launch-mark .logo::before { animation: krug-logo-spin 1.8s linear infinite; }
@keyframes krug-logo-spin {
  from { transform: translate(-50%, -50%) rotate(-35deg); }
  to { transform: translate(-50%, -50%) rotate(325deg); }
}
@media(prefers-reduced-motion:reduce){.launch-mark .logo::before{animation:none}}
.screen h1, .chat-list-title h1 {
  font-size: clamp(2.15rem, 3.4vw, 3rem);
  line-height: 1.07;
  font-weight: 800;
  letter-spacing: -.058em;
}
.screen .intro { margin: 9px 0 26px; font-size: 1rem; line-height: 1.45; }
.planner-title { align-items: center; }
.planner-title .intro { margin-bottom: 0; }
.new-count {
  align-self: flex-start;
  margin-top: 10px;
  padding: 9px 13px;
  border-radius: 999px;
  background: #dce9ff;
  color: #285ccf;
  font-size: .84rem;
  letter-spacing: 0;
  box-shadow: inset 0 1px 1px #fff;
}
.planner-tabs { margin-top: 25px; margin-bottom: 27px; }
.planner-tabs button.selected { box-shadow: 0 4px 14px -9px #4965a982, inset 0 1px 1px #fff; }
.announcement-list { display: grid; gap: 17px; }
.announcement-card {
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: clamp(22px, 3.5vw, 34px) !important;
  border-radius: 29px;
  box-shadow: 0 16px 35px -26px #49659173, inset 0 1px 1px #fff;
}
.announcement-card::after {
  content: '';
  position: absolute;
  top: 62px;
  right: 27px;
  width: 86px;
  height: 86px;
  pointer-events: none;
  border-radius: 28px 40px 32px 36px;
  transform: rotate(-15deg);
  background: radial-gradient(circle at 76% 18%, #97b5ff, transparent 39%),
    linear-gradient(145deg, #dceaff, #91b0ff 58%, #7898ed);
  box-shadow: 16px 10px 0 -4px #ffe0c65c, 0 13px 24px -13px #5376c973;
  opacity: .86;
}
.announcement-card:nth-child(even)::after {
  border-radius: 33px 26px 40px 28px;
  transform: rotate(12deg);
  background: radial-gradient(circle at 75% 22%, #ffe6d2, transparent 38%),
    linear-gradient(145deg, #ffdcc8, #f7b6a5 61%, #dca1bd);
  box-shadow: -14px 9px 0 -4px #dceaff75, 0 13px 24px -13px #a3749273;
}
.announcement-card .head-row { position: relative; z-index: 1; }
.announcement-card .tag { font-size: .8rem; padding: 8px 12px; border-radius: 999px; background: #e7f0ff; color: #3067ca; }
.announcement-card:nth-child(even) .tag { background: #fff0e8; color: #bb694a; }
.announcement-card h3 {
  position: relative;
  z-index: 1;
  max-width: calc(100% - 100px);
  margin: 28px 0 14px;
  font-size: clamp(1.22rem, 2.2vw, 1.6rem);
  line-height: 1.24;
  font-weight: 790;
  letter-spacing: -.035em;
}
.announcement-card .announcement-meta { margin-bottom: 17px; font-size: .86rem; }
.announcement-card > p:not(.announcement-meta) { font-size: .97rem; line-height: 1.65; }
.announcement-card .planner-actions { border-top: 1px solid #e9edf5; padding-top: 17px; margin-top: 20px; }
.announcement-card .planner-actions .primary { min-height: 45px; padding-inline: 19px; border-radius: 16px; }
.announcement-card .planner-actions .text-button { min-height: 44px; }
.announcement-card .event-card { margin-top: 21px; }
.planner-event { border-radius: 22px; padding: 19px; }
.month-card { border-radius: 27px; }

/* The same type and color rhythm carries through the working screens. */
.screen:not(.planner-screen) { max-width: 1010px; width: 100%; margin: 0 auto; }
.management-screen > .head-row, .profile-screen > h1 { margin-top: 0; }
.management-screen > .intro, .profile-screen > .intro { margin-bottom: 27px; }
.screen-card { border-radius: 25px; }
.screen-card h3 { font-size: 1.16rem; letter-spacing: -.025em; }
.management-screen .screen-card h3,
.profile-screen .screen-card h3 { font-weight: 760; }
.management-screen .admin-row { min-height: 68px; }
.profile-screen .profile-row h2 { font-size: 1.35rem; letter-spacing: -.025em; }
.profile-screen .profile-row .avatar { width: 74px; height: 74px; border-radius: 23px; }
.profile-setting { min-height: 55px; }
.list-head { padding-top: 26px; }
.chat-list-title h1 { font-size: 2rem; }
.conversation { min-height: 72px; margin-block: 4px; }
.conversation.active { box-shadow: 0 8px 22px -17px #4568999c; }
.channel-header { min-height: 94px; }
.channel-identity h2 { font-size: 1.03rem; letter-spacing: -.02em; }
.message { border-radius: 19px 19px 19px 7px; }
.message.mine { border-radius: 19px 19px 7px 19px; }
.composer { border-radius: 30px; }
.email-login {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--scene-base);
}
.email-login::before {
  content: '';
  position: fixed;
  z-index: -1;
  inset: -20%;
  pointer-events: none;
  background: radial-gradient(ellipse at 17% 20%, var(--scene-blue), transparent 52%),
    radial-gradient(ellipse at 85% 78%, var(--scene-peach), transparent 54%),
    radial-gradient(ellipse at 86% 12%, var(--scene-lilac), transparent 56%),
    var(--scene-base);
  animation: krug-aurora 26s ease-in-out infinite alternate;
}
.login-card,
.onboarding {
  background: var(--surface);
  border: 1px solid var(--stroke);
  border-radius: 30px;
  box-shadow: 0 20px 50px -32px #3954808f, inset 0 1px 0 #fff;
}
.login-card h1 { color: var(--ink); font-weight: 800; letter-spacing: -.05em; }
.login-card input { border-radius: 16px; }
.login-card .primary { border-radius: 16px; }
.live-dialog { border-radius: 27px; }
/* Chat tools float above the conversation and never resize its scroll area. */
.workspace{position:relative}
.feed{scroll-behavior:auto;overflow-anchor:none}
.message-attachment img{height:220px;object-fit:contain}
.jump-latest{position:absolute;right:18px;bottom:100px;width:44px;height:44px;min-width:44px;padding:11px;margin:0;border-radius:50%;display:grid;place-items:center;z-index:4;background:var(--glass-bg,#f6f9ffcc);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:inset 0 1px 1px #ffffffb3,0 4px 16px #24395722}
.jump-latest[hidden]{display:none}
.jump-latest svg{width:22px;height:22px}
.private-conversation{display:flex;align-items:center;min-width:0;position:relative}
.private-conversation>.conversation{flex:1;min-width:0;padding-right:48px}
.contact-menu-button{position:absolute;right:4px;width:44px;height:44px;font-size:24px}
.contact-menu{display:grid;gap:10px}
.contact-menu>button{text-align:left;min-height:48px}
.danger{color:#c33e55}
/* The editor follows the visible viewport, including the software keyboard. */
.live-dialog[open]{display:flex;flex-direction:column;overflow:hidden;max-height:calc(var(--phone-height,100dvh) - 32px)}
.dialog-heading{flex:none;gap:12px;margin-bottom:16px}
.dialog-heading h2{min-width:0;overflow-wrap:anywhere;color:var(--ink)}
.dialog-heading .icon-btn{flex:none}
.dialog-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:1px 3px 3px;scroll-padding:16px}
.dialog-body:has(>.dialog-form){display:flex;overflow:hidden}
.live-dialog .dialog-form{display:flex;flex-direction:column;min-height:0;width:100%;margin-top:0}
.dialog-fields{min-height:0;overflow-y:auto;overscroll-behavior:contain;scroll-padding:16px;padding-right:4px}
.dialog-actions{flex:none;display:flex;gap:8px;padding-top:14px}
.dialog-actions>.primary{flex:1;min-height:46px}
@media(max-width:760px){
 .message-attachment img{height:180px}
 .live-dialog[open]{position:fixed;inset:auto 10px auto;top:calc(var(--phone-top,0px) + 10px);margin:0 auto;width:calc(100% - 20px);max-height:calc(var(--phone-height,100dvh) - 20px);padding:18px}
 .dialog-heading{margin-bottom:12px}
 .dialog-body .field input,.dialog-body .field textarea,.dialog-body .field select{font-size:16px;scroll-margin:14px}
 body:has(dialog[open]) .composer-footer,body:has(dialog[open]) .rail{visibility:hidden}
 .private-header{flex-wrap:nowrap;gap:4px;padding:10px 12px;min-height:76px}
 .private-header .channel-identity{flex:1 1 0;min-width:0;gap:7px}
 .private-header .contact-identity{min-width:0;gap:8px}
 .private-header .contact-identity>div{min-width:0}
 .private-header .contact-identity h2,.private-header .sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .private-header .contact-identity .avatar{display:inline-flex;width:38px;height:38px;flex:none}
 .private-header .header-actions{flex:none;margin:0;padding:2px;background:none;border:0;box-shadow:none;backdrop-filter:none}
 .private-header .header-actions .icon-btn{width:38px;min-width:38px;padding:8px}
 .private-header .header-actions [data-action=mute-chat]{display:none}
}

/* Keep the glass on navigation and controls, with a clearer active lens. */
.rail .liquid-lens,
.filter-row .liquid-lens {
  background: radial-gradient(ellipse at 25% 0, #ffffffe3, transparent 62%),
    linear-gradient(125deg, #dfebffbc, #bfd2f9a1 58%, #f5d8e089);
  box-shadow: 0 0 0 1px #6387bd49, 0 7px 16px -9px #4b70b18c,
    inset 0 2px 2px #fff, inset 0 -2px 2px #688ac75b;
}
.rail::before, .search::before, .filter-row::before, .composer::before, .planner-tabs::before { opacity: .96; }
.rail-item.active::after { background: #4d74e2; }

:root[data-appearance='dark'] .announcement-card { box-shadow: 0 18px 36px -27px #020718aa, inset 0 1px 1px #c6d9ff19; }
[data-appearance='dark'] .announcement-card::after {
  opacity: .92;
  background: radial-gradient(circle at 27% 18%, #d1e0ff9c, transparent 38%),
    linear-gradient(145deg, #84b7f2, #627fde 60%, #706cc5);
  box-shadow: 15px 9px 0 -4px #d195916b, 0 13px 24px -12px #4d65b78c;
}
[data-appearance='dark'] .announcement-card:nth-child(even)::after {
  background: radial-gradient(circle at 24% 18%, #ffe1d5a3, transparent 39%),
    linear-gradient(145deg, #f4bdad, #d487a4 64%, #9d83d7);
  box-shadow: -13px 9px 0 -4px #8db5f67a, 0 13px 24px -12px #895f968c;
}
[data-appearance='dark'] .announcement-card .tag { background: #334c7d; color: #d6e4ff; }
[data-appearance='dark'] .announcement-card:nth-child(even) .tag { background: #634555; color: #ffd9ca; }
[data-appearance='dark'] .announcement-card .planner-actions { border-color: #91a8c436; }
[data-appearance='dark'] .event-info strong,
[data-appearance='dark'] .planner-event span span { color: #e3ecfa; }
[data-appearance='dark'] .announcement-card .event-card,
[data-appearance='dark'] .post .event-card,
[data-appearance='dark'] .screen-card .event-card {
  background: linear-gradient(120deg, #2a3f65, #343e60);
  border: 1px solid #7994c45c;
  box-shadow: inset 0 1px 1px #b9d2ff22;
}
[data-appearance='dark'] .event-card .date-box {
  background: linear-gradient(150deg, #c48178, #a86678);
  color: #fff1e8;
}
[data-appearance='dark'] .event-card .date-box b { color: #fff1e8; }
[data-appearance='dark'] .event-card .event-info strong { color: #f0f4ff; }
[data-appearance='dark'] .event-card .event-info small { color: #c2d0e9; }
[data-appearance='dark'] .event-card button,
[data-appearance='dark'] .event-card > svg { color: #aac4ff; }
[data-appearance='dark'] .new-count { background: #34558f; color: #e7f1ff; box-shadow: inset 0 1px 1px #a9c3fa39; }
[data-appearance='dark'] .rail .liquid-lens,
[data-appearance='dark'] .filter-row .liquid-lens {
  background: radial-gradient(ellipse at 25% 0, #cfddff77, transparent 62%),
    linear-gradient(125deg, #799dec63, #5775b167 60%, #986b8454);
  box-shadow: inset 0 1px 1px #d9e4ff8a, 0 5px 13px #020a1b70;
}
[data-appearance='dark'] .rail-item.active svg { color: inherit; }
@media (min-width: 761px) {
  :root:not([data-appearance='dark']) .rail-item,
  :root:not([data-appearance='dark']) .rail-bottom .icon-btn { color: #3e5579; }
  :root:not([data-appearance='dark']) .rail-item.active,
  :root:not([data-appearance='dark']) .rail-item.active svg { color: #244fba; }
  :root:not([data-appearance='dark']) .rail-item:hover { color: #244fba; }
}
[data-appearance='dark'] .rail-item.active::after { background: #f3b79e; }
[data-appearance='dark'] .login-card,
[data-appearance='dark'] .onboarding { background: #1c2943f2; border-color: #9eb8dc2e; box-shadow: 0 20px 48px -30px #010713b8; color: #eaf1fc; }
[data-appearance='dark'] .login-card h1,
[data-appearance='dark'] .onboarding h1 { color: #f2f6ff; }
[data-appearance='dark'] .login-card p,
[data-appearance='dark'] .login-card .login-school,
[data-appearance='dark'] .login-card .sub,
[data-appearance='dark'] .onboarding p { color: #b7c7de; }
[data-appearance='dark'] .login-card input { background: #25354f; border-color: #718bad66; color: #f1f5fc; }

@media (max-width: 760px) {
  /* Content scrolls behind the floating glass bar, with no separate footer strip. */
  .shell:not(.mobile-detail), .mascot-enabled .shell:not(.mobile-detail) { padding-bottom: 0; }
  .shell-screen .screen, .mascot-enabled .other-screen > .screen { padding-bottom: calc(110px + env(safe-area-inset-bottom)); }
  .shell:not(.mobile-detail) .conversations { padding-bottom: calc(120px + env(safe-area-inset-bottom)); }
  .shell:not(.mobile-detail) .list-foot { position: absolute; left: 0; right: 0; bottom: calc(78px + env(safe-area-inset-bottom)); padding: 4px 24px; background: transparent; border: 0; pointer-events: none; }
  .page-brand { margin: 1px 2px 28px; font-size: 1.12rem; }
  .screen h1 { font-size: clamp(2.1rem, 9vw, 2.55rem); }
  .screen .intro { font-size: .96rem; }
  .planner-title { align-items: flex-start; }
  .planner-title .new-count { margin-top: 5px; }
  .planner-tabs { margin-top: 23px; }
  .announcement-list { gap: 14px; }
  .announcement-card { padding: 24px 22px !important; border-radius: 28px; }
  .announcement-card h3 { max-width: calc(100% - 71px); font-size: 1.27rem; margin-top: 26px; }
  .announcement-card::after { width: 68px; height: 68px; right: 20px; top: 67px; }
  .announcement-card .planner-actions { gap: 7px; }
  .announcement-card .planner-actions .primary { width: 100%; }
  .rail { border-radius: 999px; background: #f7fbffe0; }
  .rail .liquid-lens { border-radius: 999px; }
  .rail-item.active::after { display: none; }
  .rail-item.active { color: #2f61d2; }
  .profile-screen .profile-row .avatar { width: 62px; height: 62px; border-radius: 19px; }
  .profile-screen .profile-row h2 { font-size: 1.1rem; }
  .profile-screen .profile-actions { gap: 7px; }
  .profile-screen .profile-actions > button,
  .profile-screen .profile-actions > a { flex: 1 1 140px; }
  [data-appearance='dark'] .rail { background: #263a5adc; }
}
@media (max-width: 390px) {
  .announcement-card h3 { max-width: none; padding-right: 50px; }
  .announcement-card::after { width: 44px; height: 44px; top: 80px; right: 24px; }
  .planner-title .new-count { padding: 7px 9px; font-size: .74rem; }
}
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  .rail .liquid-lens, .filter-row .liquid-lens { background: #dbe7fc; }
  [data-appearance='dark'] .rail .liquid-lens,
  [data-appearance='dark'] .filter-row .liquid-lens { background: #3d5886; }
}
@media (prefers-reduced-motion: reduce) {
  .email-login::before { animation: none; }
  .logo::before, .logo::after,
  .page-brand-mark::before, .page-brand-mark::after,
  .announcement-card::after { animation: none; }
}
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  .rail, .header-actions, .search, .filter-row, .composer, .planner-tabs,
  .list-actions .icon-btn, .back { background: #f2f6ff; border-color: #95a8c5; }
  [data-appearance='dark'] .rail, [data-appearance='dark'] .header-actions,
  [data-appearance='dark'] .search, [data-appearance='dark'] .filter-row,
  [data-appearance='dark'] .composer, [data-appearance='dark'] .planner-tabs,
  [data-appearance='dark'] .list-actions .icon-btn, [data-appearance='dark'] .back {
    background: #273957; border-color: #8fa9d1;
  }
}

/* Clear optical controls: a quiet transparent centre and a lit perimeter. */
:root {
  --glass-fill: linear-gradient(145deg, #ffffff63, #ffffff20 42%, #ffffff34 78%, #ffffff58);
  --glass-shadow: 0 9px 25px -17px #334d7780, inset 0 1px 0 #fff,
    inset 0 -1px 2px #8298bb53;
  --glass-rim: conic-gradient(from 120deg, #ffffffef, #738db354 13%, #ffffff4d 30%,
    #ffffffef 45%, #8ca4ca59 62%, #ffffffce 78%, #6383b76e 91%, #ffffffef);
}
.rail, .header-actions, .search, .filter-row, .composer, .planner-tabs,
.list-actions .icon-btn, .back {
  background: var(--glass-fill);
  border-color: #ffffff96;
  box-shadow: var(--glass-shadow);
}
.rail::before, .search::before, .filter-row::before, .composer::before,
.planner-tabs::before { opacity: 1; }
.rail .liquid-lens, .filter-row .liquid-lens {
  background: linear-gradient(140deg, #ffffff7e, #ffffff1c 48%, #ffffff64);
  border-color: #ffffffb5;
  box-shadow: 0 6px 17px -12px #38557e8c, inset 0 2px 1px #ffffffeb,
    inset 0 -2px 3px #6984ab5c;
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .rail, .header-actions, .search, .filter-row, .planner-tabs,
  .list-actions .icon-btn, .back {
    backdrop-filter: blur(14px) saturate(1.08);
    -webkit-backdrop-filter: blur(14px) saturate(1.08);
  }
  .composer { backdrop-filter: blur(14px) saturate(1.08); -webkit-backdrop-filter: blur(14px) saturate(1.08); }
}
html[data-glass-optics] .rail,
html[data-glass-optics] .search { backdrop-filter: blur(14px) saturate(1.08); }
[data-appearance='dark'] .rail,
[data-appearance='dark'] .header-actions,
[data-appearance='dark'] .search,
[data-appearance='dark'] .filter-row,
[data-appearance='dark'] .composer,
[data-appearance='dark'] .planner-tabs,
[data-appearance='dark'] .list-actions .icon-btn,
[data-appearance='dark'] .back {
  background: linear-gradient(145deg, #d2e0ff32, #9cb3e815 43%, #b9caff20 78%, #ffffff31);
  border-color: #dbe7ff66;
  box-shadow: 0 12px 27px -16px #020817bd, inset 0 1px 1px #eef4ffc2,
    inset 0 -2px 2px #07132c8c;
}
[data-appearance='dark'] .rail .liquid-lens,
[data-appearance='dark'] .filter-row .liquid-lens {
  background: linear-gradient(145deg, #dce8ff57, #d2dfff0e 46%, #d8e7ff43);
  border-color: #e5eeff8c;
  box-shadow: inset 0 2px 1px #f1f6ffc7, inset 0 -2px 3px #142c5988,
    0 7px 18px -10px #020917a8;
}

/* The supplied video shows one soft silhouette flowing through several shapes. */
.announcement-card::after {
  will-change: transform;
}
.announcement-card::after {
  animation: krug-flow 12s ease-in-out infinite, krug-drift 16s ease-in-out infinite;
  animation-delay: var(--krug-motion-phase, 0s), var(--krug-motion-phase, 0s);
}
.announcement-card:nth-child(even)::after {
  animation: krug-flow 16s ease-in-out infinite reverse, krug-drift 12s ease-in-out infinite reverse;
  animation-delay: calc(var(--krug-motion-phase, 0s) - 4s), calc(var(--krug-motion-phase, 0s) - 4s);
}
@keyframes krug-flow {
  0%, 100% { border-radius: 58% 42% 51% 49% / 46% 57% 43% 54%; }
  33.333% { border-radius: 46% 54% 42% 58% / 56% 44% 56% 44%; }
  66.667% { border-radius: 54% 46% 59% 41% / 43% 55% 45% 57%; }
}
@keyframes krug-drift {
  0%, 100% { transform: rotate(-5deg) scale(1); }
  50% { transform: rotate(7deg) scale(1.025, .985); }
}
@media (prefers-reduced-motion: reduce) {
  .announcement-card::after, .logo::before, .logo::after,
  .page-brand-mark::before, .page-brand-mark::after { animation: none; will-change: auto; }
}
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  .rail, .header-actions, .search, .filter-row, .composer, .planner-tabs,
  .list-actions .icon-btn, .back { background: #f2f6ff; border-color: #95a8c5; }
  .rail .liquid-lens, .filter-row .liquid-lens { background: #dbe7fc; }
  [data-appearance='dark'] .rail, [data-appearance='dark'] .header-actions,
  [data-appearance='dark'] .search, [data-appearance='dark'] .filter-row,
  [data-appearance='dark'] .composer, [data-appearance='dark'] .planner-tabs,
  [data-appearance='dark'] .list-actions .icon-btn, [data-appearance='dark'] .back {
    background: #273957; border-color: #8fa9d1;
  }
  [data-appearance='dark'] .rail .liquid-lens,
  [data-appearance='dark'] .filter-row .liquid-lens { background: #3d5886; }
}