/* Persistent brand, nature-led light palette, and compact onboarding. */
.sidebar-brand span,.overview-brand-hero{display:none!important}
.side{padding-top:0!important}
.sidebar-brand{display:grid;width:100%;height:250px!important;margin:0!important;justify-items:center!important;justify-content:center!important;align-content:center!important;padding:12px 0!important;border:0;background:transparent;color:inherit;cursor:pointer}
.sidebar-brand img{width:164px!important;height:180px!important;object-fit:contain}
.top{display:grid!important;grid-template-columns:minmax(90px,1fr) minmax(800px,920px) minmax(230px,1fr)!important;align-items:center!important;height:250px!important;min-height:250px!important;padding:8px 20px!important}
.top>#title{grid-column:1;grid-row:1;margin:0!important;font-size:1rem!important}
.persistent-brand{grid-column:2;grid-row:1;display:flex;align-items:center;justify-content:center;gap:9px;min-width:0;border:0;background:transparent;cursor:pointer;padding:0}
.persistent-brand>img{display:none;width:45px;height:48px;object-fit:contain}
.persistent-brand>span{display:flex;min-width:0;flex-direction:column;align-items:center;gap:1px}
.persistent-brand>span img:first-child{width:800px;max-width:100%;height:auto;object-fit:contain}
.persistent-brand>span img:last-child{width:600px;max-width:75%;height:auto;object-fit:contain}
.top>.actions{grid-column:3;grid-row:1;justify-self:end}
.nav button,.mobile button{font-family:Baskerville,"Palatino Linotype",Palatino,serif!important;font-size:1.02rem!important;letter-spacing:.01em}
.clock-format{width:100%;border:1px solid var(--ct-border);border-radius:10px;background:var(--ct-surface);color:var(--ct-secondary);padding:7px 8px;font:700 .72rem/1.2 inherit;cursor:pointer}
html[data-theme="light"]{--nature-ink:#17291f;--nature-green:#2f6f5f;--nature-sage:#8fa894;--nature-leaf:#dce8da;--nature-paper:#fbf8ef}
html[data-theme="light"] body{background:radial-gradient(circle at 8% 8%,rgba(122,157,130,.24),transparent 28%),radial-gradient(circle at 92% 18%,rgba(157,183,145,.22),transparent 31%),linear-gradient(135deg,#f7f4e9,#eef4ec 56%,#f8f1e8)!important;color:var(--nature-ink)!important}
html[data-theme="light"] .side{background:linear-gradient(180deg,#edf3e9,#f7f3e9)!important;border-color:#becdbd!important}
html[data-theme="light"] .top{background:rgba(249,247,238,.92)!important;border-color:#b9c9b8!important}
html[data-theme="light"] .panel,html[data-theme="light"] .dashboard-card,html[data-theme="light"] .family{border-color:#c7d3c4!important;background:rgba(255,253,246,.94)!important}
html[data-theme="light"] .eyebrow{color:#347363!important}
html[data-theme="light"] .nav button.active{background:#213b2e!important;color:#fff!important}
html[data-theme="light"] .nav button:not(.active):hover{background:#dce8da!important;color:#193226!important}
html[data-theme="dark"] .persistent-brand img{filter:brightness(1.08) contrast(1.22) drop-shadow(0 0 1px #fff) drop-shadow(0 0 10px rgba(255,255,255,.48)) drop-shadow(0 3px 8px rgba(0,0,0,.8))!important}
html[data-theme="dark"] .persistent-brand{background:radial-gradient(ellipse at center,rgba(255,255,255,.12),rgba(255,255,255,.025) 54%,transparent 76%)}
.identity-onboarding-banner{position:fixed!important;right:18px!important;bottom:18px!important;top:auto!important;left:auto!important;z-index:80!important;width:min(360px,calc(100vw - 36px))!important;padding:12px 14px!important;display:grid!important;grid-template-columns:1fr auto!important;text-align:left!important}
.identity-onboarding-banner span{grid-column:1;font-size:.78rem}.identity-onboarding-banner b{grid-column:2;grid-row:1/3;align-self:center}
#accountIdentityMount:not(:empty){margin-bottom:16px}#accountIdentityMount .identity-settings-v2{max-width:720px}
.identity-required-modal{z-index:200!important}.identity-required-modal .dialog{max-width:520px!important}.identity-required-modal p{color:var(--ct-secondary);line-height:1.55}.identity-required-modal .btn{width:100%;margin-top:8px}

/* Field rhythm: labels and help text always occupy their own line outside controls. */
.fields,.party-form{row-gap:12px!important}
.fields>label,.party-form>label{display:grid!important;gap:6px!important;min-width:0}
.field-label,.party-field-label{display:block!important;margin:0!important;line-height:1.35!important}
.input,.select,textarea{min-height:48px!important;padding:11px 13px!important;line-height:1.35!important}
.identity-field-message,.party-message,.sub[aria-live],#tzmsg,#importmsg{position:static!important;display:block!important;min-height:1.25em!important;margin:6px 0 0!important;line-height:1.35!important;text-decoration:none!important}
.identity-field-message+label{margin-top:4px}
.password-control{position:relative;display:grid}.password-control .input{padding-right:82px!important}
.password-reveal{position:absolute;top:4px;right:4px;bottom:4px;min-width:70px;border:0;border-left:1px solid var(--ct-border);border-radius:0 8px 8px 0;background:var(--ct-surface);color:var(--ct-secondary);font:800 .76rem/1 inherit;cursor:pointer}
.password-reveal:hover,.password-reveal:focus-visible{color:var(--ct-text);background:color-mix(in srgb,var(--ct-surface) 82%,var(--nature-leaf,#30433a))}
.password-strength{display:grid;grid-template-columns:repeat(4,1fr) auto;align-items:center;gap:5px;min-height:20px;margin-top:6px;color:var(--ct-muted);font-size:.7rem}
.password-strength[hidden]{display:none!important}
.password-strength i{height:4px;border-radius:999px;background:var(--ct-border)}.password-strength span{min-width:64px;text-align:right;font-weight:800}
.password-strength[data-score="1"] i:nth-child(-n+1),.password-strength[data-score="2"] i:nth-child(-n+2){background:#c4793d}.password-strength[data-score="3"] i:nth-child(-n+3){background:#9a8a39}.password-strength[data-score="4"] i{background:#347363}
@media(min-width:901px) and (max-width:1350px){.sidebar-brand{height:200px!important}.sidebar-brand img{width:132px!important;height:148px!important}.top{grid-template-columns:minmax(80px,1fr) minmax(600px,680px) minmax(210px,1fr)!important;height:200px!important;min-height:200px!important}.persistent-brand>span img:first-child{width:600px}.persistent-brand>span img:last-child{width:450px}}
@media(max-width:900px){.top{grid-template-columns:minmax(0,1fr) auto!important;height:108px!important;min-height:108px!important;padding:5px 12px!important}.top>#title{display:none!important}.persistent-brand{grid-column:1;justify-self:start;justify-content:flex-start}.persistent-brand>img{display:block}.persistent-brand>span{align-items:flex-start}.persistent-brand>span img:first-child{width:245px;height:auto;max-height:55px}.persistent-brand>span img:last-child{width:190px;height:auto;max-height:16px}.top>.actions{grid-column:2}}
@media(max-width:560px){.top{height:88px!important;min-height:88px!important}.persistent-brand>span img:first-child{width:158px;height:auto;max-height:36px}.persistent-brand>span img:last-child{width:125px;height:auto;max-height:12px}.persistent-brand>img{width:35px;height:39px}.top .pill{display:none}.top{padding-inline:8px!important}.top>.actions{gap:5px}.theme-toggle .theme-label{display:none}}

/* Responsive clarity pass: glass navigation, brand legibility, mastery controls and notices. */
:root{
  --ui-glass-dark:rgba(8,14,28,.82);
  --ui-glass-light:rgba(252,250,243,.84);
  --ui-glass-border-dark:rgba(255,255,255,.16);
  --ui-glass-border-light:rgba(38,53,44,.20);
}

/* Header artwork stays readable over every finish theme without changing the source artwork. */
.persistent-brand{border-radius:18px!important;isolation:isolate}
.persistent-brand>span img:first-child,.persistent-brand>span img:last-child{filter:contrast(1.12) saturate(1.04) drop-shadow(0 1px 1px rgba(0,0,0,.42)) drop-shadow(0 0 8px rgba(255,255,255,.16))!important}
html[data-theme="light"] .persistent-brand>span img:first-child,html[data-theme="light"] .persistent-brand>span img:last-child{filter:contrast(1.18) saturate(.96) drop-shadow(0 1px 0 rgba(255,255,255,.95)) drop-shadow(0 2px 5px rgba(35,43,37,.28))!important}
html[data-theme="dark"] .top{box-shadow:0 12px 34px rgba(0,0,0,.16)}
html[data-theme="light"] .top{box-shadow:0 10px 28px rgba(45,55,47,.10)}

/* Mastery filter is button-based; give every state its own contrast instead of inherited text colours. */
.mastery-filter-v5{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.mastery-filter-v5 button{min-height:42px;padding:9px 14px;border:1px solid color-mix(in srgb,var(--ct-secondary) 32%,transparent);border-radius:999px;background:color-mix(in srgb,var(--st-surface-2) 90%,transparent);color:var(--ct-text)!important;font:800 .76rem/1.15 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.005em;box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 8%,transparent);cursor:pointer;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease}
.mastery-filter-v5 button:hover,.mastery-filter-v5 button:focus-visible{border-color:color-mix(in srgb,var(--ct-accent) 62%,var(--st-border));background:color-mix(in srgb,var(--st-surface-2) 78%,var(--ct-accent));outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--ct-accent) 14%,transparent)}
.mastery-filter-v5 button.active{border-color:color-mix(in srgb,var(--ct-accent) 70%,#fff 12%);background:linear-gradient(135deg,color-mix(in srgb,var(--ct-accent) 78%,#fff 8%),color-mix(in srgb,var(--ct-accent) 58%,var(--st-surface-2)));color:var(--ct-on-accent)!important;box-shadow:0 6px 18px color-mix(in srgb,var(--ct-accent) 22%,transparent),inset 0 1px 0 rgba(255,255,255,.28)}
html[data-theme="light"] .mastery-filter-v5 button{background:rgba(255,255,255,.72);border-color:rgba(43,60,49,.28);color:#243028!important;box-shadow:0 2px 8px rgba(45,55,47,.06)}
html[data-theme="light"] .mastery-filter-v5 button.active{background:linear-gradient(135deg,#2e7468,#4e9185);border-color:#245e55;color:#fff!important}
.overview-filter-title,#overviewShownV5{color:var(--ct-secondary)!important}

/* Quack unlock dialog must never inherit a finish-theme colour that hides its actions. */
.quack-unlock-shell{background:rgba(2,5,10,.74)!important;backdrop-filter:blur(8px)}
.quack-unlock-dialog{background:linear-gradient(155deg,color-mix(in srgb,var(--st-surface) 96%,#111827),color-mix(in srgb,var(--st-surface-2) 92%,#0b1220))!important;color:var(--ct-text)!important;border-color:color-mix(in srgb,var(--ct-gold) 55%,var(--st-border))!important;box-shadow:0 26px 80px rgba(0,0,0,.48),0 0 0 1px color-mix(in srgb,var(--ct-gold) 14%,transparent)!important}
.quack-unlock-dialog h2{color:var(--ct-text)!important}
.quack-unlock-dialog p{color:var(--ct-secondary)!important}
.quack-unlock-dialog .btn{width:100%;min-height:48px;background:color-mix(in srgb,var(--st-surface-2) 88%,transparent)!important;border-color:color-mix(in srgb,var(--ct-secondary) 36%,transparent)!important;color:var(--ct-text)!important;font-weight:850}
.quack-unlock-dialog .btn.primary{background:linear-gradient(135deg,#f0ce57,#d8ae31)!important;border-color:#f7dc72!important;color:#171307!important;text-shadow:none!important}
.quack-unlock-dialog .btn:not(.primary):hover,.quack-unlock-dialog .btn:not(.primary):focus-visible{background:color-mix(in srgb,var(--st-surface-2) 76%,var(--ct-gold))!important;border-color:color-mix(in srgb,var(--ct-gold) 48%,var(--st-border))!important}
html[data-theme="light"] .quack-unlock-shell{background:rgba(21,27,23,.48)!important}
html[data-theme="light"] .quack-unlock-dialog{background:linear-gradient(155deg,#fffdf6,#f2ead4)!important;color:#1f2722!important;border-color:#a98426!important}
html[data-theme="light"] .quack-unlock-dialog h2{color:#1b211d!important}
html[data-theme="light"] .quack-unlock-dialog p{color:#4f5a52!important}
html[data-theme="light"] .quack-unlock-dialog .btn:not(.primary){background:#fffaf0!important;border-color:#7d887f!important;color:#202923!important}
html[data-theme="light"] .quack-unlock-dialog .btn.primary{background:linear-gradient(135deg,#d2a82d,#b88918)!important;border-color:#9f7715!important;color:#181407!important}

/* Release/update notice: strong surface, readable hierarchy, obvious actions. */
.release-toast-v4{border-color:color-mix(in srgb,var(--ct-accent) 46%,var(--st-border))!important;background:linear-gradient(145deg,color-mix(in srgb,var(--st-surface) 97%,#0a1220),color-mix(in srgb,var(--st-surface-2) 94%,var(--ct-accent)))!important;color:var(--ct-text)!important;box-shadow:0 24px 70px rgba(0,0,0,.50),0 0 0 1px color-mix(in srgb,var(--ct-accent) 12%,transparent)!important}
.release-toast-v4 span{color:var(--ct-accent)!important}.release-toast-v4 strong{color:var(--ct-text)!important;font-size:.98rem}.release-toast-v4 small{color:var(--ct-secondary)!important;line-height:1.35}
.release-toast-v4 .btn{min-height:42px;background:color-mix(in srgb,var(--st-surface-2) 88%,transparent)!important;border-color:color-mix(in srgb,var(--ct-secondary) 34%,transparent)!important;color:var(--ct-text)!important;font-weight:850}
.release-toast-v4 .btn.primary{background:linear-gradient(135deg,var(--ct-accent),color-mix(in srgb,var(--ct-accent) 72%,#fff))!important;border-color:color-mix(in srgb,var(--ct-accent) 72%,#fff)!important;color:var(--ct-on-accent)!important}
html[data-theme="light"] .release-toast-v4{background:linear-gradient(145deg,rgba(255,253,247,.98),rgba(235,243,237,.98))!important;border-color:#7f9b88!important;box-shadow:0 22px 55px rgba(49,58,51,.22)!important}
html[data-theme="light"] .release-toast-v4 strong{color:#1c2720!important}html[data-theme="light"] .release-toast-v4 small{color:#4d5c52!important}
html[data-theme="light"] .release-toast-v4 .btn:not(.primary){background:#fffdf7!important;border-color:#89958d!important;color:#243028!important}

/* Mobile bottom nav: theme-aware glass that remains legible over Sprite cards and finish themes. */
@media(max-width:900px){
  .mobile{left:max(8px,var(--safe-left,0px))!important;right:max(8px,var(--safe-right,0px))!important;bottom:max(8px,var(--safe-bottom,0px))!important;width:auto!important;border:1px solid var(--ui-glass-border-dark)!important;border-radius:20px!important;background:linear-gradient(180deg,rgba(15,24,42,.84),rgba(7,13,26,.90))!important;box-shadow:0 16px 48px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.10)!important;backdrop-filter:blur(22px) saturate(1.18)!important;-webkit-backdrop-filter:blur(22px) saturate(1.18)!important;padding:6px max(6px,var(--safe-right,0px)) max(6px,var(--safe-bottom,0px)) max(6px,var(--safe-left,0px))!important;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
  .mobile::-webkit-scrollbar{display:none}
  .mobile button{flex:1 0 min(116px,22vw);min-width:74px!important;min-height:58px!important;padding:7px 8px!important;border:1px solid transparent!important;border-radius:14px!important;background:transparent!important;color:#d6deea!important;font-size:.92rem!important;font-weight:700!important;line-height:1.05!important;text-shadow:0 1px 2px rgba(0,0,0,.72);opacity:1!important}
  .mobile button:hover,.mobile button:focus-visible{background:rgba(255,255,255,.07)!important;border-color:rgba(255,255,255,.12)!important;color:#fff!important;outline:none}
  .mobile button.active{background:linear-gradient(145deg,rgba(47,88,129,.72),rgba(27,57,91,.84))!important;border-color:rgba(143,196,235,.28)!important;color:#fff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 5px 16px rgba(0,0,0,.20)!important;text-shadow:0 1px 2px rgba(0,0,0,.65)}
  html[data-theme="light"] .mobile{background:linear-gradient(180deg,rgba(255,253,247,.86),rgba(239,242,235,.92))!important;border-color:var(--ui-glass-border-light)!important;box-shadow:0 14px 38px rgba(44,55,47,.20),inset 0 1px 0 rgba(255,255,255,.88)!important}
  html[data-theme="light"] .mobile button{color:#2b3b31!important;text-shadow:0 1px 0 rgba(255,255,255,.85)}
  html[data-theme="light"] .mobile button:hover,html[data-theme="light"] .mobile button:focus-visible{background:rgba(53,87,66,.08)!important;border-color:rgba(46,80,60,.16)!important;color:#17261d!important}
  html[data-theme="light"] .mobile button.active{background:linear-gradient(145deg,#284b39,#345d49)!important;border-color:#203f31!important;color:#fff!important;text-shadow:none!important;box-shadow:0 5px 16px rgba(37,65,49,.20),inset 0 1px 0 rgba(255,255,255,.16)!important}
  .content{padding-bottom:calc(92px + var(--safe-bottom,0px))!important}
  .release-toast-v4{bottom:calc(96px + var(--safe-bottom,0px))!important}
  .finish-theme-message{bottom:calc(96px + var(--safe-bottom,0px))!important}
}

@media(max-width:620px){
  .mastery-filter-v5{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:8px}
  .mastery-filter-v5 button{width:100%;min-width:0;padding:10px 8px;font-size:.72rem}
  .mastery-filter-v5 button[data-mastery-filter="mastered-below"]{grid-column:1/-1}
  .overview-filters-v5{position:relative!important;top:auto!important;padding:12px!important;gap:10px!important}
  .overview-filter-title{margin-bottom:1px}.overview-filters-v5 strong{padding-top:2px}
  .release-toast-v4{left:12px!important;right:12px!important;grid-template-columns:1fr 1fr!important;padding:14px!important;border-radius:18px!important}
  .quack-unlock-dialog{padding:24px 18px!important;border-radius:22px!important}
  .persistent-brand{padding:4px 5px!important;background:color-mix(in srgb,var(--st-bg) 20%,transparent)!important}
}

@media(min-width:901px){
  .release-toast-v4{right:24px!important;bottom:24px!important}
  .mastery-filter-v5 button{min-height:38px}
}

@media(prefers-reduced-transparency:reduce){.mobile,.quack-unlock-shell,.release-toast-v4{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}.mobile{background:#0b1323!important}html[data-theme="light"] .mobile{background:#f6f3e9!important}}

/* Desktop sidebar: reserve space for navigation and prevent footer overlap. */
@media(min-width:901px){.side{display:flex!important;flex-direction:column!important;overflow:hidden!important}.sidebar-brand{flex:0 0 auto}.side .nav{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-bottom:12px;scrollbar-width:thin}.sidefoot{position:static!important;flex:0 0 auto;margin-top:8px}}
@media(min-width:901px) and (max-height:900px){.sidebar-brand{height:150px!important}.sidebar-brand img{width:112px!important;height:126px!important}.side .nav{gap:4px}.side .nav button{min-height:40px;padding:8px 12px}.sidefoot{gap:6px}.sidebar-event-timer,.sidefoot .clock{padding:8px 10px!important}}