:root{
  --bg:#F2F7FF; --surface:#FFFFFF; --ink:#1F2A5C; --soft:#56628F; --line:#D6E4F7;
  --sky:#6EC6FF; --skyd:#2F8FD6; --sun:#FFC93C; --pink:#F27BA3; --mint:#3FB58A;
  --night:#1F2A5C; --math:#FFC93C; --reading:#F27BA3; --science:#5DCB9E;
  color-scheme:light; box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --bg:#121A3D; --surface:#1C2652; --ink:#F2F4FF; --soft:#B4BCE0; --line:#2C3870; --night:#0E1532; --skyd:#7CC8FF; color-scheme:dark; }
}
:root[data-theme="dark"]{ --bg:#121A3D; --surface:#1C2652; --ink:#F2F4FF; --soft:#B4BCE0; --line:#2C3870; --night:#0E1532; --skyd:#7CC8FF; color-scheme:dark; }
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 80px)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Baloo 2","Trebuchet MS",system-ui,sans-serif;font-size:clamp(1.02rem,0.95rem + 0.4vw,1.15rem);line-height:1.5;-webkit-text-size-adjust:100%}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:4px solid var(--pink);outline-offset:3px;border-radius:10px}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px 40px}

/* shared header */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--bg);border-bottom:2px solid var(--line)}
.site-head .in{max-width:1040px;margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.site-head .logo{display:flex;align-items:center;margin-right:auto}
.site-head .logo img{height:44px;width:auto;display:block}
.site-nav{display:flex;gap:6px;flex-wrap:wrap}
.site-nav a{display:inline-flex;align-items:center;gap:6px;text-decoration:none;font-weight:800;padding:6px 14px;border-radius:999px;background:var(--surface);box-shadow:0 3px 0 var(--line);font-size:1rem}
.site-nav a .dot{width:12px;height:12px;border-radius:50%}
.site-nav a[aria-current="page"]{background:var(--ink);color:var(--bg);box-shadow:none}
.site-nav a.home{background:var(--sun);color:#1F2A5C;box-shadow:0 3px 0 #D9A41C}
@media (max-width:560px){.site-head .in{gap:8px}.site-head .logo img{height:36px}.site-nav{width:100%;flex-wrap:nowrap;gap:3px}.site-nav a{flex:1 1 auto;justify-content:center;padding:5px 3px;font-size:.84rem;white-space:nowrap;min-width:0}.site-nav a .dot{display:none}}

/* common */
h1{font-size:clamp(2.1rem,6.5vw,3.4rem);line-height:1;margin:22px 0 8px;font-weight:800;letter-spacing:-.5px}
h2{font-size:clamp(1.5rem,4.2vw,2rem);line-height:1.1;margin:0 0 8px;font-weight:800}
.lead{color:var(--soft);margin:0 0 18px;max-width:58ch}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:16px;padding:8px 20px;min-height:52px;font:inherit;font-weight:800;font-size:1.12rem;text-decoration:none;background:var(--sun);color:#1F2A5C;box-shadow:0 5px 0 #D9A41C;cursor:pointer}
.btn:active{transform:translateY(4px);box-shadow:0 1px 0 #D9A41C}
.btn.ghost{background:var(--surface);color:var(--ink);box-shadow:0 5px 0 var(--line)}
.btn.done{background:var(--mint);color:#fff;box-shadow:0 5px 0 #2A8A67}
.card{background:var(--surface);border-radius:24px;padding:clamp(16px,4vw,22px);box-shadow:0 5px 0 var(--line)}
.bar{height:14px;border-radius:999px;background:var(--bg);overflow:hidden;box-shadow:inset 0 0 0 2px var(--line)}
.bar span{display:block;height:100%;background:var(--mint);transition:width .3s}
.crumbs{font-size:.98rem;color:var(--soft);margin-top:18px;display:flex;flex-wrap:wrap;gap:6px}
.crumbs a{font-weight:700}
.sec{margin-top:44px}

/* home */
.sky{position:relative;overflow:hidden;background:var(--night);color:#fff;border-radius:32px;padding:clamp(26px,6vw,56px);display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:20px;margin-top:20px}
.sky::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(2px 2px at 8% 20%,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 22% 70%,#fff 50%,transparent 51%),radial-gradient(2px 2px at 35% 12%,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 48% 85%,#fff 50%,transparent 51%),radial-gradient(2.5px 2.5px at 58% 30%,#FFC93C 50%,transparent 51%),radial-gradient(1.5px 1.5px at 66% 62%,#fff 50%,transparent 51%),radial-gradient(2px 2px at 78% 14%,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 90% 48%,#fff 50%,transparent 51%),radial-gradient(2px 2px at 95% 88%,#F27BA3 50%,transparent 51%)}
.sky>*{position:relative}
.sky h1{margin:0 0 12px;max-width:13ch}
.sky p{margin:0 0 20px;color:#D7DEFA;max-width:38ch}
.sky img{width:min(100%,300px);justify-self:center;animation:arrive 1.2s cubic-bezier(.2,.8,.2,1) 1}
@keyframes arrive{from{transform:translate(60px,-40px) rotate(14deg) scale(.8);opacity:0}to{transform:none;opacity:1}}
.subjects{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.subj{display:flex;flex-direction:column;gap:10px;text-decoration:none;border-top:12px solid var(--c)}
.subj h3{margin:0;font-size:1.6rem;line-height:1.1;font-weight:800}
.subj p{margin:0;color:var(--soft);font-size:1rem}
.subj .next{margin-top:auto;font-weight:800;font-size:1rem;background:var(--bg);border-radius:14px;padding:8px 12px}
.subj .next small{display:block;font-weight:700;color:var(--soft)}
.feature{display:flex;align-items:center;gap:18px;flex-wrap:wrap;text-decoration:none}
.feature .art{display:flex;gap:8px;align-items:center;background:#FFD6E3;border-radius:18px;padding:16px}
.feature .box{display:inline-grid;grid-template-columns:repeat(5,9px);grid-auto-rows:9px;gap:3px;padding:7px 7px 11px;border-radius:9px;background:#F27BA3;box-shadow:inset 0 -5px 0 #D9547F}
.feature .box i{display:block;width:9px;height:9px;border-radius:50%;background:#E2A04A}
.feature .cookie{width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#5B3315 0 2.5px,transparent 3px),radial-gradient(circle at 65% 62%,#5B3315 0 2.5px,transparent 3px),#E2A04A}
.feature h3{margin:0;font-size:1.4rem;font-weight:800}
.feature p{margin:0;color:var(--soft)}
.how{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.how b{display:block;font-size:1.15rem}
.how p{margin:0;color:var(--soft);font-size:1rem}

/* subject page */
.subhead{border-left:12px solid var(--c);padding-left:16px;margin-top:22px}
.subhead h1{margin-top:0}
.prog{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:6px 0 4px}
.prog .bar{flex:1;min-width:160px}
.unit{margin-top:34px}
.unit h2{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.unit h2 small{font-size:1rem;color:var(--soft);font-weight:700}
.weeks{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.wk{display:flex;flex-direction:column;gap:2px;text-decoration:none;background:var(--surface);border-radius:18px;padding:12px 14px;box-shadow:0 4px 0 var(--line);border-left:6px solid var(--line);transition:transform .12s}
.wk:hover{transform:translateY(-2px)}
.wk small{font-weight:800;color:var(--soft);font-size:.9rem}
.wk b{font-size:1.12rem;line-height:1.2}
.wk.is-done{border-left-color:var(--mint)}
.wk.is-done small::after{content:" · Done";color:var(--mint)}
.wk.is-next{border-left-color:var(--c);box-shadow:0 4px 0 var(--c)}

/* lesson page */
.lesson-head{border-left:12px solid var(--c);padding-left:16px;margin-top:14px}
.lesson-head h1{margin:6px 0}
.kicker{font-weight:800;color:var(--soft)}
.goal{font-size:1.2rem;margin:0}
.lgrid{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;margin-top:22px;align-items:start}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.steps label{display:flex;gap:12px;align-items:flex-start;background:var(--bg);border-radius:14px;padding:10px 12px;cursor:pointer}
.steps input{width:26px;height:26px;flex:none;accent-color:var(--mint);margin-top:2px}
.steps label.is-done span{text-decoration:line-through;color:var(--soft)}
.steps .n{font-weight:800}
.mat{margin:0;font-size:1.05rem}
.game{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.quiz .q{margin:14px 0 0}
.quiz .q p{margin:0 0 8px;font-weight:800;font-size:1.12rem}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt{border:3px solid var(--line);background:var(--bg);color:var(--ink);border-radius:14px;padding:6px 14px;min-height:48px;font:inherit;font-weight:700;font-size:1.05rem;cursor:pointer}
.opt.right{border-color:var(--mint);background:var(--mint);color:#fff}
.opt.wrong{border-color:#E5603F;animation:shake .35s}
@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.qfb{min-height:1.5em;font-weight:800;margin-top:6px;font-size:1rem}
.qfb.ok{color:var(--mint)} .qfb.no{color:#E5603F}
.finish{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px}
.pager{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:30px}
.site-foot{max-width:1040px;margin:50px auto 0;padding:0 20px 30px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--soft);font-size:.95rem}
.site-foot img{height:28px}

@media (max-width:820px){.subjects{grid-template-columns:1fr}.how{grid-template-columns:1fr}.lgrid{grid-template-columns:1fr}.sky{grid-template-columns:1fr}.sky img{width:170px;order:-1;justify-self:start}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* learner chip */
.site-head .who{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:800;font-size:1rem;background:var(--surface);border-radius:999px;padding:4px 14px 4px 4px;box-shadow:0 3px 0 var(--line)}
.site-head .who.empty{padding:6px 14px;background:var(--pink);color:#1F2A5C;box-shadow:0 3px 0 #D9547F}
.site-head .who b{color:var(--skyd)}
.av{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--sky);color:#1F2A5C;font-weight:800}
.av.big{width:52px;height:52px;font-size:1.5rem}
.btn.small{min-height:40px;padding:4px 14px;font-size:1rem}
.notice{margin-top:16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;border-left:8px solid var(--pink)}
.wkst{font-size:.9rem;font-weight:800;color:var(--skyd)}

/* practice */
.practice{border-top:10px solid var(--c)}
.act-top{display:flex;justify-content:space-between;gap:10px;font-weight:800;color:var(--soft);font-size:1rem;flex-wrap:wrap}
.act-stars{letter-spacing:2px}
.dim{opacity:.35}
.act-q{display:flex;align-items:flex-start;gap:10px;margin:8px 0}
.act-q p{margin:0;font-size:clamp(1.15rem,3.6vw,1.4rem);font-weight:800;flex:1}
.say{border:none;background:var(--bg);border-radius:12px;font-size:1.3rem;min-width:46px;min-height:46px;cursor:pointer}
.act-vis{margin:8px 0 12px;overflow-x:auto}
.act-fb{min-height:1.6em;font-weight:800;margin-top:10px}
.act-fb.ok{color:var(--mint)} .act-fb.no{color:#E5603F}
.numwrap{display:flex;flex-direction:column;align-items:center;gap:10px}
.numans{font-size:2.2rem;font-weight:800;min-width:3em;text-align:center;border-bottom:5px solid var(--ink);padding:0 10px}
.numans.right{border-color:var(--mint);color:var(--mint)}
.pad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:min(100%,300px)}
.padk{border:none;border-radius:14px;min-height:54px;font:inherit;font-weight:800;font-size:1.4rem;background:var(--sun);color:#1F2A5C;box-shadow:0 4px 0 #D9A41C;cursor:pointer}
.padk.go{background:var(--mint);color:#fff;box-shadow:0 4px 0 #2A8A67}
.bins{display:flex;flex-wrap:wrap;gap:10px}
.bin{flex:1;min-width:120px;min-height:64px;border:none;border-radius:18px;font:inherit;font-weight:800;font-size:1.15rem;cursor:pointer;color:#1F2A5C}
.bin.b0{background:#FFE08A;box-shadow:0 5px 0 #D9B44A}.bin.b1{background:#9ED8FF;box-shadow:0 5px 0 #5AAEE6}.bin.b2{background:#A8E6C9;box-shadow:0 5px 0 #5DBF93}.bin.b3{background:#FFC3D6;box-shadow:0 5px 0 #E58AA8}.bin.b4{background:#D8C8FF;box-shadow:0 5px 0 #A58BE8}
.bin.right{outline:4px solid var(--mint)}
.bin.wrong{animation:shake .35s}
.placed{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin-top:12px}
.placed small{display:block;font-weight:800;color:var(--soft)}
.chip{display:inline-block;background:var(--bg);border-radius:999px;padding:0 10px;margin:2px;font-size:.95rem}
.slots{display:flex;gap:8px;justify-content:center;margin:6px 0 14px;flex-wrap:wrap}
.slot{width:48px;height:56px;border-bottom:5px solid var(--ink);display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:800}
.slots.right .slot{border-color:var(--mint);color:var(--mint)}
.tiles{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:12px}
.tile{width:54px;height:58px;border:none;border-radius:14px;background:var(--sky);color:#1F2A5C;font:inherit;font-weight:800;font-size:1.7rem;box-shadow:0 4px 0 #3E9FE0;cursor:pointer}
.tile:disabled{opacity:.3}
.opt.go{background:var(--mint);border-color:var(--mint);color:#fff}
.ordered{margin:0 0 10px;padding-left:1.4em;font-weight:700}
.ordered li{background:var(--bg);border-radius:12px;padding:6px 10px;margin:6px 0}
.ordopts{display:flex;flex-direction:column;gap:8px}
.ordopts .opt{text-align:left}
.act-done{text-align:center}
.act-done .big{font-size:2rem;letter-spacing:4px}

/* visuals */
.v-bt{display:flex;flex-wrap:wrap;gap:6px;align-items:flex-end}
.v-bt.hide{display:none}
.v-bt .hund{width:66px;height:66px;background:repeating-linear-gradient(0deg,transparent 0 5px,rgba(0,0,0,.15) 5px 6.6px),repeating-linear-gradient(90deg,#F27BA3 0 5px,#D9547F 5px 6.6px);border-radius:4px}
.v-bt .ten{width:14px;height:66px;background:repeating-linear-gradient(0deg,#F27BA3 0 5.6px,#D9547F 5.6px 6.6px);border-radius:3px}
.v-bt .ones{display:flex;flex-wrap:wrap;width:44px;gap:3px}
.v-bt .one{width:11px;height:11px;background:#E2A04A;border-radius:2px}
.v-pairs{display:flex;flex-wrap:wrap;gap:8px}
.v-pairs .pr{display:flex;flex-direction:column;gap:4px;background:var(--bg);padding:5px;border-radius:10px}
.v-pairs i,.v-arr i,.v-groups i{display:block;width:18px;height:18px;border-radius:50%;background:var(--pink)}
.v-arr{display:grid;gap:6px}
.v-arr i{width:22px;height:22px;background:var(--sky)}
.v-groups{display:flex;flex-wrap:wrap;gap:10px}
.v-groups .grp{display:flex;flex-wrap:wrap;gap:4px;width:66px;padding:8px;border:3px dashed var(--line);border-radius:50%;justify-content:center}
.v-clock{width:170px;height:170px}
.v-clock .face{fill:var(--surface);stroke:var(--ink);stroke-width:4}
.v-clock text{font-size:12px;font-weight:800;fill:var(--ink);font-family:inherit}
.v-clock .hh{stroke:var(--pink);stroke-width:6;stroke-linecap:round}
.v-clock .mh{stroke:var(--skyd);stroke-width:4;stroke-linecap:round}
.v-clock .pin{fill:var(--ink)}
.v-ruler{width:100%;max-width:520px}
.v-ruler .bar1{fill:var(--pink)}.v-ruler .bar2{fill:var(--sky)}
.v-ruler .rul{fill:#FFE08A;stroke:#C9A23A}
.v-ruler .tick{stroke:#1F2A5C;stroke-width:1.5}
.v-ruler text{font-size:10px;font-weight:700;fill:#1F2A5C;font-family:inherit}
.v-ruler .unit{fill:var(--soft)}
.v-coins{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.coin{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;font-weight:800;font-size:.95rem;color:#1F2A5C;box-shadow:inset 0 -4px 0 rgba(0,0,0,.18)}
.coin.c1{width:44px;height:44px;background:#D9895B}.coin.c5{width:52px;height:52px;background:#C9CED6}.coin.c10{width:40px;height:40px;background:#DDE1E7}.coin.c25{width:60px;height:60px;background:#C3C9D2}
.v-poly{width:140px;height:140px}.v-poly polygon{fill:var(--sky);stroke:var(--ink);stroke-width:3}
.v-frac{width:100%;max-width:300px}.v-frac rect{fill:#FFE08A;stroke:var(--ink);stroke-width:3}.v-frac line{stroke:var(--ink);stroke-width:3}
.v-bars{width:100%;max-width:360px}.v-bars text{font-size:11px;font-weight:700;fill:var(--ink);font-family:inherit}.v-bars .grid{stroke:var(--line)}.v-bars .b0{fill:#F2545B}.v-bars .b1{fill:#3E9FE0}.v-bars .b2{fill:#3FB58A}
.v-pic{display:grid;gap:6px}.v-pic div{display:flex;gap:10px;align-items:center;background:var(--bg);border-radius:12px;padding:6px 10px}.v-pic b{min-width:80px}.v-pic span{font-size:1.4rem;letter-spacing:3px}

/* stars page */
.learners{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:16px;margin-top:10px}
.learner.is-me{box-shadow:0 5px 0 var(--sun);outline:3px solid var(--sun)}
.lhead{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.lhead h2{margin:0}
.lhead .tot{margin-left:auto;font-size:1.6rem;font-weight:800;white-space:nowrap}
.sub-stars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:14px 0 6px}
.sub-stars span{background:var(--bg);border-radius:14px;padding:8px 2px;text-align:center;font-size:.8rem;overflow-wrap:anywhere;font-weight:700;border-top:5px solid var(--c)}
.sub-stars b{display:block;font-size:1.4rem}
.lbtns{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.addrow{display:flex;gap:10px;flex-wrap:wrap}
.addrow input,.ren{font:inherit;font-size:1.2rem;font-weight:700;color:var(--ink);background:var(--bg);border:3px solid var(--line);border-radius:14px;padding:8px 12px;flex:1;min-width:160px}
@media (max-width:560px){.site-head .who{font-size:.92rem}.sub-stars{grid-template-columns:repeat(2,1fr)}}

/* lesson tabs and teacher plan */
.ltabs{display:flex;gap:6px;margin:16px 0 4px;background:var(--surface);padding:5px;border-radius:999px;width:max-content;max-width:100%;box-shadow:0 3px 0 var(--line)}
.ltab{border:none;background:transparent;border-radius:999px;padding:6px 16px;font:inherit;font-weight:800;color:var(--soft);cursor:pointer}
.ltab.on{background:var(--ink);color:var(--bg)}
.qn{color:var(--soft)}
.tplan{margin-top:16px}
.tplan h3{margin:20px 0 6px;font-size:1.2rem}
.tp-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.tp-top h2{margin:4px 0}
.tp-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tp-grid ul{margin:0;padding-left:1.2em}
.flow{padding-left:1.3em}.flow>li{margin:8px 0}.flow ol{margin:6px 0}
.tp-easy,.tp-hard{background:var(--bg);border-radius:16px;padding:4px 14px 12px;border-left:6px solid var(--mint)}
.tp-hard{border-left-color:var(--pink)}
.akey{padding-left:1.3em}.akey li{margin:4px 0}.akey b{color:var(--mint)}
.tlinks{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.tl{text-decoration:none;display:flex;flex-direction:column;gap:4px}.tl b{font-size:1.15rem}.tl span{color:var(--soft);font-size:1rem}
.week{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:10px}
.week div{background:var(--bg);border-radius:14px;padding:10px}.week b{display:block}.week span{font-size:.95rem;color:var(--soft)}
.yr-wrap{overflow-x:auto}
.yr{border-collapse:collapse;width:100%;min-width:640px;background:var(--surface);border-radius:16px;overflow:hidden}
.yr th,.yr td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top;font-size:1rem}
.yr th{background:var(--ink);color:var(--bg)}
.yr td a{font-weight:700}.yr td small{display:block;color:var(--soft);font-size:.82rem}
.sup{margin-top:16px}
.chk{display:flex;gap:12px;align-items:flex-start;background:var(--bg);border-radius:14px;padding:10px 12px;margin:8px 0;cursor:pointer}
.chk input{width:24px;height:24px;flex:none;margin-top:3px;accent-color:var(--mint)}
.chk small{display:block;color:var(--soft)}
.chk.is-done b{text-decoration:line-through;color:var(--soft)}
.qty{font-weight:700;color:var(--skyd)}
.home{font-size:.8rem;font-weight:800;background:var(--surface);border-radius:999px;padding:0 8px;color:var(--soft)}
@media (max-width:760px){.tp-grid,.tlinks{grid-template-columns:1fr}.week{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.site-nav{overflow-x:auto;scrollbar-width:none}.site-nav::-webkit-scrollbar{display:none}.site-nav a{flex:none;padding:5px 9px}}
@media print{.site-head,.site-foot,.ltabs,.pager,.notice,.crumbs,.lbtns,.tp-top .btn,#kidView[hidden],#teachView[hidden]{display:none!important}body{background:#fff;color:#000}.card,.yr{box-shadow:none;border:1px solid #bbb}.wrap{max-width:none}}

/* games */
.gamehero{display:flex;gap:20px;align-items:center;background:var(--gc);color:#fff;border-radius:28px;padding:clamp(20px,5vw,36px);margin-top:16px;flex-wrap:wrap}
.gamehero h1{margin:4px 0;color:#fff}.gamehero p{margin:4px 0;max-width:46ch}.gamehero .kicker{color:rgba(255,255,255,.85)}
.gtot{font-weight:800;font-size:1.2rem}
.gemoji{font-size:clamp(3.5rem,12vw,5.5rem);line-height:1;filter:drop-shadow(0 6px 0 rgba(0,0,0,.15))}
.gemoji.sm{font-size:2.6rem}
.stations{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.station{display:flex;flex-direction:column;gap:6px;text-align:left;border:none;font:inherit;color:var(--ink);cursor:pointer;border-top:10px solid var(--gc)}
.station b{font-size:1.25rem}.station span{color:var(--soft);font-size:1rem}
.station .btn{align-self:flex-start;margin-top:auto;color:#1F2A5C}
.snum{display:inline-flex;width:34px;height:34px;border-radius:50%;background:var(--gc);color:#fff!important;font-weight:800;align-items:center;justify-content:center}
.sstars{font-size:1.3rem;letter-spacing:2px}
.gameplay{border-top:10px solid var(--c)}
.popgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:8px}
.bubble{border:none;border-radius:50%;aspect-ratio:1;background:radial-gradient(circle at 30% 30%,#fff 0 12%,transparent 13%),var(--sky);color:#1F2A5C;font:inherit;font-weight:800;font-size:clamp(.85rem,3vw,1.15rem);cursor:pointer;box-shadow:inset 0 -6px 0 rgba(0,0,0,.12);padding:4px;display:flex;align-items:center;justify-content:center;transition:transform .15s}
.bubble:hover{transform:scale(1.05)}
.bubble.popped{animation:popb .35s forwards}
@keyframes popb{60%{transform:scale(1.25)}100%{transform:scale(0);opacity:0}}
.bubble.wrong{animation:shake .35s;background:#FFB4A8}
.shp{fill:var(--pink);stroke:#1F2A5C;stroke-width:2.5}
.memgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:8px}
.mem{position:relative;border:none;border-radius:16px;min-height:96px;font:inherit;font-weight:800;cursor:pointer;background:var(--ink);color:var(--bg);padding:6px}
.mem .front{display:none;font-size:.98rem;line-height:1.2}.mem .back{font-size:2rem}
.mem.up{background:var(--sun);color:#1F2A5C}.mem.up .front{display:block}.mem.up .back{display:none}
.mem.got{background:var(--mint);color:#fff}
.track{position:relative;height:60px;background:repeating-linear-gradient(90deg,var(--bg) 0 30px,var(--surface) 30px 60px);border-radius:16px;margin:10px 0;box-shadow:inset 0 0 0 3px var(--line)}
.runner{position:absolute;left:0;top:8px;font-size:2.2rem;transition:left .4s}
.finish{position:absolute;right:8px;top:10px;font-size:2rem}
.board{display:grid;grid-template-columns:repeat(auto-fill,minmax(46px,1fr));gap:6px;margin:10px 0}
.sq{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:12px;background:var(--bg);font-weight:800;color:var(--soft);font-size:1rem}
.sq.here{background:var(--sun);font-size:1.6rem}.sq.end{background:var(--mint);font-size:1.4rem}
.tray{min-height:70px;background:var(--bg);border-radius:16px;padding:10px;margin:10px 0;overflow-x:auto}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.tok{border-radius:10px;padding:2px 10px;font-weight:800;color:#1F2A5C}
.t100,.tokbtn.t100{background:#F27BA3}.t10,.tokbtn.t10{background:#FFC93C}.t1,.tokbtn.t1{background:#9ED8FF}.tg,.tokbtn.tg{background:#A8E6C9}
.c25,.tokbtn.c25{background:#C3C9D2}.c10,.tokbtn.c10{background:#DDE1E7}.c5,.tokbtn.c5{background:#C9CED6}.c1,.tokbtn.c1{background:#D9895B}
.tokbtn{color:#1F2A5C!important;border:none!important}
.pile{font-size:1.6rem;letter-spacing:4px;line-height:1.4;background:var(--bg);border-radius:14px;padding:8px 12px;margin:6px 0}
.pile.bar{background:transparent;padding:0}
.clockset{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.ckbtns{display:grid;grid-template-columns:auto auto auto;gap:8px;align-items:center;font-weight:800}
.arcade{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.agame{display:flex;flex-direction:column;gap:4px;text-decoration:none;border-top:10px solid var(--gc)}
.agame b{font-size:1.2rem}.agame small{color:var(--soft)}
.gst{font-weight:800;color:var(--skyd);margin-top:auto}
.unitgame{display:flex;align-items:center;gap:12px;text-decoration:none;background:var(--bg);border-radius:18px;padding:10px 14px;margin-top:14px;border-left:8px solid var(--gc)}
.unitgame small{display:block;font-weight:800;color:var(--soft)}.unitgame b{font-size:1.15rem}.unitgame .gst{margin-left:auto}
@media (max-width:760px){.stations{grid-template-columns:1fr}.popgrid,.memgrid{grid-template-columns:repeat(3,1fr)}}
.popgrid{max-width:560px}.bubble svg{width:72%;height:auto}.mem svg{width:60px;height:auto}
