/* Chalk Talk app FX: premium finish to match the website. Visual only, loaded after polish.css. */
:root{--goldg:linear-gradient(180deg,#FFF0A0 0%,#FDDB25 45%,#EDAE17 100%);--fxe:cubic-bezier(.2,.8,.2,1)}

/* a quiet gold glow and a fading board grid behind everything */
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(900px 420px at 50% -120px,rgba(253,219,37,.09),transparent 70%),
  radial-gradient(600px 400px at 100% 100%,rgba(127,178,255,.05),transparent 70%)}
html:not([data-mode="night"]) body::after{opacity:1}

/* primary buttons: gold, lit from above */
.btn.accent,.btn.brand{background:var(--goldg)!important;border-color:transparent!important;color:#141006!important;
  box-shadow:0 8px 24px -12px rgba(253,219,37,.75),inset 0 1px 0 rgba(255,255,255,.55);transition:transform .18s var(--fxe),box-shadow .18s,filter .18s}
.btn.accent:hover:not(:disabled),.btn.brand:hover:not(:disabled){transform:translateY(-1px);filter:none!important;box-shadow:0 14px 30px -12px rgba(253,219,37,.9),inset 0 1px 0 rgba(255,255,255,.55)}
.btn.accent:active:not(:disabled){transform:translateY(0)}
.btn:not(.accent):not(.brand){transition:transform .18s var(--fxe),border-color .18s,background .18s}
.btn:not(.accent):not(.brand):hover:not(:disabled){transform:translateY(-1px)}

/* ===== Home hero: the website's look, inside the app ===== */
#homeBody>.hhero{grid-column:1/-1!important;margin:0!important}
.th-hero.hx{margin-bottom:22px}
:is(.hhero,.th-hero).hx{position:relative;overflow:hidden;isolation:isolate;display:grid!important;grid-template-columns:minmax(0,1.35fr) minmax(300px,.85fr)!important;grid-template-areas:"copy spot" "stats spot";gap:22px 34px!important;align-items:stretch!important;
  padding:40px 40px 30px!important;border-radius:28px!important;min-height:380px;
  background:radial-gradient(640px 380px at 78% 30%,rgba(253,219,37,.16),transparent 65%),radial-gradient(500px 300px at 0% 0%,rgba(127,178,255,.07),transparent 70%),#07080B!important;
  border:1px solid rgba(253,219,37,.2)!important;box-shadow:0 40px 90px -40px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.05)!important}
:is(.hhero,.th-hero).hx::before{display:none!important}
:is(.hhero,.th-hero).hx::after{display:none!important}
.hx-warp{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.hx-floor{position:absolute;left:-25%;right:-25%;bottom:0;height:55%;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(253,219,37,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(253,219,37,.17) 1px,transparent 1px);
  background-size:56px 56px;transform:perspective(480px) rotateX(64deg);transform-origin:50% 100%;
  -webkit-mask:linear-gradient(to top,#000,transparent 80%);mask:linear-gradient(to top,#000,transparent 80%);animation:afxFloor 2.8s linear infinite}
@keyframes afxFloor{to{background-position:0 56px,0 0}}
:is(.hhero,.th-hero).hx .hh-copy{grid-area:copy;align-content:start;gap:18px!important}
:is(.hhero,.th-hero).hx .hh-hi{display:inline-flex;align-items:center;gap:9px;font:700 12px var(--body,system-ui)!important;letter-spacing:.16em;text-transform:uppercase;color:#FDDB25!important}
:is(.hhero,.th-hero).hx .hh-hi i{width:8px;height:8px;border-radius:50%;background:#50E3A4;animation:afxLive 2s infinite}
@keyframes afxLive{0%{box-shadow:0 0 0 0 rgba(80,227,164,.6)}70%{box-shadow:0 0 0 8px rgba(80,227,164,0)}100%{box-shadow:0 0 0 0 rgba(80,227,164,0)}}
:is(.hhero,.th-hero).hx .hh-q{font:800 clamp(36px,4.6vw,64px)/.92 var(--head)!important;letter-spacing:-.05em!important;text-transform:uppercase;margin:0!important;color:#fff;text-wrap:balance}
:is(.hhero,.th-hero).hx .hh-q em{font-style:normal;background:var(--goldg);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 26px rgba(253,219,37,.35))}
:is(.hhero,.th-hero).hx .hh-ask{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.16)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);max-width:600px;padding:7px 7px 7px 16px!important;box-shadow:0 20px 50px -24px rgba(0,0,0,.9)!important}
:is(.hhero,.th-hero).hx .hh-ask:focus-within{border-color:rgba(253,219,37,.6)!important;box-shadow:0 0 0 4px rgba(253,219,37,.12),0 20px 50px -24px rgba(0,0,0,.9)!important}
:is(.hhero,.th-hero).hx .hh-ask input{font-size:16.5px!important;color:#fff!important}
:is(.hhero,.th-hero).hx .hh-ask .btn{height:46px!important;min-height:46px!important;padding:0 24px!important}
:is(.hhero,.th-hero).hx .hh-course{background:rgba(255,255,255,.05)!important;border-color:rgba(255,255,255,.14)!important}
/* stats: one clean row along the bottom */
:is(.hhero,.th-hero).hx .hh-stats{grid-area:stats;align-self:end;display:flex!important;flex-wrap:wrap;align-items:center;gap:14px 26px!important;padding:0!important;background:none!important;border:0!important;border-radius:0!important}
:is(.hhero,.th-hero).hx .hh-ring{grid-row:auto!important;width:58px!important;height:58px!important}
:is(.hhero,.th-hero).hx .hh-ring b{width:47px!important;height:47px!important;padding-top:13px!important;font-size:17px!important;background:#07080B!important}
:is(.hhero,.th-hero).hx .hh-st{padding-left:22px;border-left:1px solid rgba(255,255,255,.12)}
:is(.hhero,.th-hero).hx .hh-ring+.hh-st{padding-left:0;border:0}
:is(.hhero,.th-hero).hx .hh-st b{font:800 15px var(--head)!important;color:#fff}
/* spotlight: the next thing to do */
.hspot{grid-area:spot;position:relative;display:flex;flex-direction:column;gap:10px;padding:24px;border-radius:22px;align-self:stretch;
  background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);box-shadow:0 30px 70px -30px rgba(0,0,0,.95);animation:afxSpot .9s .15s var(--fxe) backwards}
@keyframes afxSpot{from{opacity:0;transform:translateY(18px) scale(.97)}}
.hspot:empty{display:none}
.hs-k{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font:600 12.5px var(--body,system-ui);color:#A6A9B0}
.hs-k span{font:800 11px var(--body,system-ui);letter-spacing:.14em;text-transform:uppercase;color:#141006;background:var(--goldg);padding:4px 8px;border-radius:6px}
.hs-cd{display:flex;align-items:flex-end;gap:10px;margin-top:6px}
.hs-cd b{font:800 clamp(64px,7vw,96px)/.8 var(--head);letter-spacing:-.06em;background:var(--goldg);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 30px rgba(253,219,37,.3))}
.hs-cd small{font:700 12px/1.25 var(--body,system-ui);letter-spacing:.12em;text-transform:uppercase;color:#C9CBD0;padding-bottom:6px}
.hs-n{font:800 22px/1.15 var(--head);letter-spacing:-.025em;color:#fff}
.hs-n.hs-big{font-size:clamp(26px,2.6vw,34px);line-height:1.02;margin-top:6px}
.hs-bar{height:6px;border-radius:9px;background:rgba(255,255,255,.1);overflow:hidden}
.hs-bar i{display:block;height:100%;border-radius:9px;background:var(--goldg);box-shadow:0 0 12px rgba(253,219,37,.6)}
.hs-r{color:#A6A9B0;font-size:13.5px}
.hs-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:10px}
.hs-acts .btn{min-height:44px}
.btn.hs-gh{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.2)!important;color:#fff!important}
.btn.hs-gh:hover{background:rgba(255,255,255,.12)!important}
@media (max-width:899px){
  :is(.hhero,.th-hero).hx{grid-template-columns:minmax(0,1fr)!important;grid-template-areas:"copy" "spot" "stats";padding:26px 20px 22px!important;min-height:0;border-radius:24px!important}
  :is(.hhero,.th-hero).hx .hh-q{font-size:clamp(34px,10vw,46px)!important}
  .hs-cd b{font-size:68px}
  :is(.hhero,.th-hero).hx .hh-st{padding-left:14px}
}

/* ===== Home flow: hero, then due + today side by side, then exams, then the rest ===== */
@media (min-width:900px){
  #homeBody>#hDueSlot{grid-column:1/6!important}
  #homeBody>.tday{grid-column:6/13!important}
  #homeBody:has(#hDueSlot:empty)>.tday,#homeBody:not(:has(>.tday))>#hDueSlot{grid-column:1/-1!important}
  #homeBody>#hDueSlot>*{height:100%;margin:0!important}
  #homeBody>.tday{margin:0!important}
}
#homeBody>#hDueSlot:empty{display:none}
/* section headings get the website's gold tick */
#homeBody :is(.xd-h h3,.hsec>h3,.hsec-h h3,.td-hl h3,.dv-due h3){display:flex;align-items:center;gap:10px}
#homeBody :is(.xd-h h3,.hsec>h3,.hsec-h h3,.td-hl h3,.dv-due h3)::before{content:"";width:4px;height:1em;border-radius:3px;background:var(--goldg);box-shadow:0 0 12px rgba(253,219,37,.5);flex:none}
/* exam cards: gold rim, countdown in gold */
.xd{border-color:rgba(253,219,37,.16)!important;transition:transform .25s var(--fxe),border-color .25s,box-shadow .25s}
.xd:hover{transform:translateY(-3px);border-color:rgba(253,219,37,.45)!important;box-shadow:0 26px 60px -30px rgba(0,0,0,.95)}
.xd-cd b{background:var(--goldg);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.xd-bar i,.dv-bar i{background:var(--goldg)!important}
.hr,.hm{transition:transform .2s var(--fxe),border-color .2s,background .2s}
.hr:hover,.hm:hover{transform:translateY(-2px);border-color:rgba(253,219,37,.45)!important}

/* cards lift and catch a gold edge */
.ch-act,.dv-c,.dv-due,.m-hero,.imp-o,.ig-hero,[class*="pe-card"],.th-q{transition:transform .25s var(--fxe),box-shadow .25s,border-color .25s}
.ch-act:hover,.dv-c:hover,.imp-o:hover{transform:translateY(-3px);border-color:rgba(253,219,37,.45)!important;box-shadow:0 22px 50px -24px rgba(0,0,0,.9),0 0 0 1px rgba(253,219,37,.12)}
.ch-act:first-child{background:var(--goldg)!important;box-shadow:0 18px 50px -22px rgba(253,219,37,.7)}

/* tab switches: sections rise in, one after another */
[data-pane]>*{animation:afxUp .55s var(--fxe) backwards}
[data-pane]>*:nth-child(2){animation-delay:.05s}[data-pane]>*:nth-child(3){animation-delay:.1s}[data-pane]>*:nth-child(4){animation-delay:.15s}[data-pane]>*:nth-child(n+5){animation-delay:.2s}
@keyframes afxUp{from{opacity:0;transform:translateY(14px)}}

/* active tab gets a gold underline glow */
button[data-tab][aria-current="page"]{box-shadow:inset 0 -2px 0 #FDDB25,0 6px 18px -10px rgba(253,219,37,.7)}

@media (prefers-reduced-motion:reduce){.hhero::after,[data-pane]>*{animation:none!important}.btn,.ch-act,.dv-c,.imp-o{transition:none!important}}
/* reading order: hero, what's due + today's plan, then exam details, then the rest */
#homeBody>*{order:5}
#homeBody>.hhero{order:0}#homeBody>.hdrive{order:1}#homeBody>#hDueSlot{order:2}#homeBody>.tday{order:3}#homeBody>.xdash{order:4}
#homeBody>#hDueSlot>.dv-due{align-content:start}
@media (max-width:560px){.dv-due .dn{flex-basis:calc(100% - 82px)}}
/* ===== Other pages: same finish ===== */
.ch-head{position:relative;overflow:hidden;isolation:isolate;padding:26px 26px 24px!important;border-radius:24px;background:radial-gradient(520px 260px at 90% 0%,rgba(253,219,37,.14),transparent 65%),#0B0C10;border:1px solid rgba(253,219,37,.18);margin-bottom:6px}
.ch-head::after{content:"";position:absolute;left:-20%;right:-20%;bottom:0;height:70%;z-index:-1;pointer-events:none;background-image:linear-gradient(rgba(253,219,37,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(253,219,37,.14) 1px,transparent 1px);background-size:44px 44px;transform:perspective(420px) rotateX(62deg);transform-origin:50% 100%;-webkit-mask:linear-gradient(to top,#000,transparent 85%);mask:linear-gradient(to top,#000,transparent 85%)}
.ch-head h2{font:800 clamp(28px,3.4vw,44px)/1 var(--head)!important;letter-spacing:-.045em!important;text-transform:uppercase}
.ch-act.main{background:var(--goldg)!important;border-color:transparent!important;box-shadow:0 22px 50px -22px rgba(253,219,37,.7)!important}
.pane-head h2,.pane-head .h{font:800 clamp(32px,4vw,52px)/.95 var(--head)!important;letter-spacing:-.045em!important;text-transform:uppercase}
.pane-head h2::after{content:"";display:block;width:56px;height:4px;border-radius:3px;margin-top:12px;background:var(--goldg);box-shadow:0 0 16px rgba(253,219,37,.5)}
#homeBody>.hnext{display:none!important}

/* ===== Teacher home: same hero, glass quick-make tiles, stats along the bottom ===== */
.th-hero.hx .th-quick{grid-template-columns:repeat(3,minmax(0,1fr))!important;margin-top:4px!important;max-width:640px}
.th-hero.hx .th-q{min-height:74px;background:rgba(255,255,255,.05)!important;color:#fff!important;border:1px solid rgba(255,255,255,.14)!important;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-weight:700;box-shadow:inset 0 2px 0 var(--qc,#FDDB25);transition:transform .2s var(--fxe),border-color .2s,background .2s}
.th-hero.hx .th-q:hover{background:rgba(255,255,255,.1)!important;border-color:rgba(253,219,37,.5)!important;transform:translateY(-2px)}
.th-hero.hx .th-q:nth-child(1){--qc:#FDDB25;background:var(--goldg)!important;color:#141006!important;border-color:transparent!important;box-shadow:0 16px 40px -18px rgba(253,219,37,.7)}
.th-hero.hx .th-q:nth-child(2){--qc:#FF9EC7}.th-hero.hx .th-q:nth-child(3){--qc:#7FB2FF}.th-hero.hx .th-q:nth-child(4){--qc:#50E3A4}.th-hero.hx .th-q:nth-child(5){--qc:#C9A7FF}
.th-hero.hx .th-q.th-more{grid-column:1/-1;min-height:0;background:none!important;border:0!important;box-shadow:none!important;backdrop-filter:none;color:#A6A9B0!important;justify-content:flex-start!important}
.th-hero.hx .th-stats{grid-area:stats;align-self:end;display:flex!important;gap:28px!important;background:none!important;border:0!important;padding:0!important}
.th-hero.hx .th-stats div{background:none!important;border:0!important;box-shadow:none!important;padding:0 0 0 22px!important;border-left:1px solid rgba(255,255,255,.12)!important;border-radius:0!important;display:grid}
.th-hero.hx .th-stats div:first-child{padding-left:0!important;border:0!important}
.th-hero.hx .th-stats b{font:800 34px/1 var(--head);letter-spacing:-.04em;color:#fff}
.th-hero.hx .th-stats .hot b{background:var(--goldg);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.th-hero.hx .th-stats small{text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:700;color:#A6A9B0!important}
@media (max-width:640px){.th-hero.hx .th-quick{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
.th-cols .cl-sec-h h3{display:flex;align-items:center;gap:10px}
.th-cols .cl-sec-h h3::before{content:"";width:4px;height:1em;border-radius:3px;background:var(--goldg);box-shadow:0 0 12px rgba(253,219,37,.5)}
.th-cols .cl-sec{animation:afxUp .6s var(--fxe) backwards}.th-cols .th-col:nth-child(2) .cl-sec{animation-delay:.08s}

/* ===== Sign-in moment ===== */
.ct-intro{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:#05060A;overflow:hidden;cursor:pointer;transition:clip-path .8s cubic-bezier(.7,0,.2,1),opacity .4s .5s;clip-path:inset(0 0 0 0)}
.ct-intro.out{clip-path:inset(0 0 100% 0)}
.ct-intro canvas{position:absolute;inset:0;width:100%;height:100%}
.ct-intro .ci-floor{position:absolute;left:-30%;right:-30%;bottom:0;height:50%;background-image:linear-gradient(rgba(253,219,37,.28) 1px,transparent 1px),linear-gradient(90deg,rgba(253,219,37,.2) 1px,transparent 1px);background-size:64px 64px;transform:perspective(500px) rotateX(64deg);transform-origin:50% 100%;-webkit-mask:linear-gradient(to top,#000,transparent 80%);mask:linear-gradient(to top,#000,transparent 80%);animation:afxFloor 1.2s linear infinite}
.ct-intro .ci-in{position:relative;display:grid;justify-items:center;gap:18px;text-align:center;padding:0 24px}
.ct-intro .ci-mark{display:inline-grid;line-height:.86;padding:10px 13px 13px;border-radius:14px;background:#FDDB25;color:#111214;font:400 26px 'Dela Gothic One','Arial Black',sans-serif;box-shadow:0 0 80px rgba(253,219,37,.55);animation:ciPop .7s cubic-bezier(.2,1.5,.4,1) .1s backwards}
.ct-intro .ci-mark span:last-child{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:3px}
.ct-intro .ci-k{font:700 12.5px var(--body,system-ui);letter-spacing:.24em;text-transform:uppercase;color:#FDDB25;animation:ciUp .7s .35s cubic-bezier(.2,.8,.2,1) backwards}
.ct-intro .ci-h{margin:0;font:800 clamp(40px,7vw,88px)/.9 var(--head,'Bricolage Grotesque',sans-serif);letter-spacing:-.05em;text-transform:uppercase;color:#fff;animation:ciUp .8s .45s cubic-bezier(.2,.8,.2,1) backwards}
.ct-intro .ci-h em{font-style:normal;background:var(--goldg);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 30px rgba(253,219,37,.45))}
.ct-intro .ci-s{color:#A6A9B0;font-size:16px;animation:ciUp .7s .6s cubic-bezier(.2,.8,.2,1) backwards}
.ct-intro .ci-bar{width:180px;height:3px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}
.ct-intro .ci-bar i{display:block;height:100%;background:var(--goldg);animation:ciLoad 1.5s .3s cubic-bezier(.4,0,.2,1) backwards}
@keyframes ciPop{from{opacity:0;transform:scale(.4) rotate(-8deg)}}
@keyframes ciUp{from{opacity:0;transform:translateY(24px);filter:blur(8px)}}
@keyframes ciLoad{from{transform:translateX(-100%)}}
body.ct-entering [data-pane]>*{animation:none}
body.ct-entered [data-pane]>*{animation:afxUp2 .8s var(--fxe) backwards}
body.ct-entered [data-pane]>*:nth-child(2){animation-delay:.08s}body.ct-entered [data-pane]>*:nth-child(3){animation-delay:.16s}
@keyframes afxUp2{from{opacity:0;transform:translateY(30px) scale(.98);filter:blur(6px)}}
@media (max-width:640px){.th-hero.hx .th-q{min-height:58px!important;font-size:15px}.th-hero.hx .th-q::after{top:8px}}
/* ===== Log in / Create account ===== */
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:999px;background:var(--surface2,#1D2025);border:1px solid var(--line,#2A2D33);margin:6px 0 2px}
.auth-tabs button{height:42px;border:0;border-radius:999px;background:transparent;color:var(--ink2,#A6A9B0);font:700 15px var(--body,system-ui);cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.auth-tabs button:hover{color:var(--ink,#F4F3EF)}
.auth-tabs button.on{background:var(--goldg);color:#141006;box-shadow:0 8px 22px -10px rgba(253,219,37,.7),inset 0 1px 0 rgba(255,255,255,.5)}
#authModal{border:1px solid rgba(253,219,37,.22)!important;box-shadow:0 40px 120px -30px rgba(0,0,0,.95),0 0 90px -30px rgba(253,219,37,.3)!important}
#authModal::backdrop{background:radial-gradient(800px 500px at 50% 30%,rgba(253,219,37,.08),transparent 70%),rgba(5,6,10,.82);backdrop-filter:blur(6px)}
#authModal #authTitle{font:800 30px/1 var(--head)!important;letter-spacing:-.04em;text-transform:uppercase}
.auth-tabs button:focus-visible{outline:2px solid #FDDB25;outline-offset:2px}

/* ===== Every other page: same finish ===== */
/* page headers on tool pages */
.tool-head h2{font:800 clamp(30px,3.6vw,48px)/.95 var(--head)!important;letter-spacing:-.045em!important;text-transform:uppercase}
.tool-head h2::after{content:"";display:block;width:56px;height:4px;border-radius:3px;margin-top:12px;background:var(--goldg);box-shadow:0 0 16px rgba(253,219,37,.5)}
.tool-head .kicker,.kicker{color:#FDDB25!important;letter-spacing:.16em}
/* segmented controls: gold when on */
.seg button[aria-pressed="true"]{background:var(--goldg)!important;color:#141006!important;box-shadow:0 8px 20px -10px rgba(253,219,37,.7)!important}
/* cards and panels: a soft glass gradient, gold edge on hover for anything you can click */
.panel:not(.hnext),.tday,.xd,.sj-card,.cl-card,.tcard:not(.hpro):not([style*="FDDB25"]),.hr,.dv-c,.ch-sec,.cl-sec{background:linear-gradient(160deg,rgba(255,255,255,.045),rgba(255,255,255,.012)),var(--surface,#16181C)!important;border-color:rgba(255,255,255,.09)!important}
.tcard,.sj-card,.cl-card,.mx-card,.nu,button.card{transition:transform .25s var(--fxe),border-color .25s,box-shadow .25s!important}
.tcard:hover,.sj-card:hover,.cl-card:hover,.mx-card:hover,.nu:hover{transform:translateY(-3px);border-color:rgba(253,219,37,.45)!important;box-shadow:0 24px 54px -26px rgba(0,0,0,.95),0 0 0 1px rgba(253,219,37,.12)!important}
.tcard .ti{box-shadow:0 10px 24px -12px var(--c,#FDDB25);transition:transform .3s var(--fxe)}
.tcard:hover .ti{transform:scale(1.08) rotate(-4deg)}
.tcard.soon{opacity:.6}
/* section titles inside pages get the gold tick */
:is(.tg-head,.cl-sec-h,.pl-head,.cr-h) :is(h3,h2,b):first-child,.tg-head>h3,.panel>h3:first-child{display:flex;align-items:center;gap:10px}
:is(.tg-head,.cl-sec-h,.pl-head,.cr-h) :is(h3,h2,b):first-child::before,.tg-head>h3::before{content:"";width:4px;height:1em;border-radius:3px;background:var(--goldg);box-shadow:0 0 12px rgba(253,219,37,.5);flex:none}
/* the chalkboard: framed and lit */
.stage{border-radius:22px!important;box-shadow:0 0 0 1px rgba(253,219,37,.16),0 40px 90px -40px rgba(0,0,0,.95),0 0 90px -40px rgba(253,219,37,.35)!important;overflow:hidden}
.cover-title{font:800 clamp(26px,3vw,40px)/1 var(--head)!important;letter-spacing:-.04em!important;text-transform:uppercase}
.cover-btn{box-shadow:0 0 0 10px rgba(253,219,37,.12),0 0 50px rgba(253,219,37,.45)!important;animation:afxPulse 2.6s ease-in-out infinite}
@keyframes afxPulse{50%{box-shadow:0 0 0 18px rgba(253,219,37,.05),0 0 70px rgba(253,219,37,.55)}}
.nu{border-radius:16px!important}
/* practice: an inviting empty state */
.probs:empty{min-height:260px;display:grid;place-items:center;border:1px dashed rgba(253,219,37,.25);border-radius:22px;margin-top:18px;background:radial-gradient(400px 200px at 50% 0%,rgba(253,219,37,.07),transparent 70%)}
.probs:empty::before{content:"Pick how many and how hard, then tap Write problems.\A Every answer is checked before you see it.";white-space:pre-line;text-align:center;color:#A6A9B0;font:500 15.5px/1.6 var(--body,system-ui)}
.toolbar{border-radius:20px!important}
/* progress */
.xp-row b,.pg-two b{font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){.cover-btn{animation:none}.tcard,.sj-card,.cl-card{transition:none!important}}
.seg button.on,.seg button[aria-selected="true"],.pl-view button.on{background:var(--goldg)!important;color:#141006!important;box-shadow:0 8px 20px -10px rgba(253,219,37,.7)!important}
.tabbar button[aria-current="page"]{background:var(--goldg)!important;color:#141006!important;box-shadow:0 10px 24px -10px rgba(253,219,37,.8)!important}