/* Layout: projector-first classroom app. Thin tool bar on top, one activity "stage" below.
   Root font scales with min(vw, vh) so the stage is ~69rem wide on BOTH 4:3 and 16:9; only height differs.
   Exercise-book grid paper ground; every WA module owns one hue (--mc). */
:root{
  --fs:1;
  --paper:#F3F6FC; --grid:#E1E7F4; --card:#FFFFFF; --card2:#EAEFF9; --ink:#18203D; --muted:#56618A; --line:#C9D2E6;
  --sun:#FFC83D; --sun-ink:#3A2A00;
  --good:#17894D; --good-bg:#DCF4E6; --bad:#C93636; --bad-bg:#FBE3E3;
  --wa01:#D9481F; --wa02:#0B8585; --wa03:#B86200; --wa04:#2B63D6; --wa05:#1E8A3E; --wa06:#8540D0;
  --mc:#2B3566; --on-mc:#FFFFFF;
  --f-head:"Fredoka","Noto Sans HK","Microsoft JhengHei","PingFang HK",system-ui,sans-serif;
  --f-body:"Noto Sans HK","Microsoft JhengHei","PingFang HK",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
  --r:.9rem;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#0F1428; --grid:#18203B; --card:#18203A; --card2:#232C4C; --ink:#EEF1FB; --muted:#A8B2D6; --line:#323D66;
  --sun:#FFD25E; --sun-ink:#2A1E00;
  --good:#4BD58A; --good-bg:#123522; --bad:#FF7A7A; --bad-bg:#3B1919;
  --wa01:#FF7D57; --wa02:#2CCFCF; --wa03:#FFAE3B; --wa04:#7BA4FF; --wa05:#55D575; --wa06:#BC88FF;
  --mc:#AFC0FF; --on-mc:#0F1428; color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#0F1428; --grid:#18203B; --card:#18203A; --card2:#232C4C; --ink:#EEF1FB; --muted:#A8B2D6; --line:#323D66;
  --sun:#FFD25E; --sun-ink:#2A1E00;
  --good:#4BD58A; --good-bg:#123522; --bad:#FF7A7A; --bad-bg:#3B1919;
  --wa01:#FF7D57; --wa02:#2CCFCF; --wa03:#FFAE3B; --wa04:#7BA4FF; --wa05:#55D575; --wa06:#BC88FF;
  --mc:#AFC0FF; --on-mc:#0F1428; color-scheme:dark}
[data-mod="wa01"]{--mc:var(--wa01)} [data-mod="wa02"]{--mc:var(--wa02)} [data-mod="wa03"]{--mc:var(--wa03)}
[data-mod="wa04"]{--mc:var(--wa04)} [data-mod="wa05"]{--mc:var(--wa05)} [data-mod="wa06"]{--mc:var(--wa06)}

*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
html{font-size:calc(var(--fs) * clamp(14px, min(1.45vw, 2.6vh), 46px))}
body{margin:0;background-color:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:1.15rem;line-height:1.45;display:flex;flex-direction:column;overflow:hidden;
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:2.2rem 2.2rem}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:.2rem solid var(--sun);outline-offset:2px}
h1,h2,h3{font-family:var(--f-head);line-height:1.15;margin:0;text-wrap:balance}
p{margin:0}
.muted{color:var(--muted)}
.mono{font-family:var(--f-mono)}

/* ---------- top bar ---------- */
.top{flex:none;display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;background:var(--card);border-bottom:.15rem solid var(--line);
  padding-block:.35rem;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));font-size:.78rem;position:relative;z-index:20}
.brand{display:flex;align-items:center;gap:.45rem;border:0;background:none;padding:0;font-family:var(--f-head);font-weight:700;font-size:1.15rem;color:var(--ink)}
.brand .mascot{width:2.3rem;height:2.3rem}
.crumb{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted);font-weight:700}
.tools{display:flex;gap:.3rem;flex-wrap:wrap;align-items:center}
.tool{border:.12rem solid var(--line);background:var(--card);border-radius:.6rem;padding:.25em .6em;font-weight:700;display:inline-flex;align-items:center;gap:.3em;color:var(--ink);line-height:1.2}
.tool:hover{border-color:var(--ink)}
.tool.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.tool .k{font-family:var(--f-mono);font-size:.75em;opacity:.6}
.fs-val{font-family:var(--f-mono);min-width:3.2em;text-align:center;font-weight:700}

/* ---------- main stage ---------- */
main{flex:1;min-height:0;overflow:auto;padding-block:.7rem 2rem;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap{max-width:72rem;margin:0 auto;display:flex;flex-direction:column;gap:.8rem}

/* ---------- mascot ---------- */
.mascot{flex:none;width:4.2rem;height:4.2rem}
.mascot.happy{animation:hop .5s ease 2}
.mascot.oops{animation:wob .45s ease}
@keyframes hop{50%{transform:translateY(-.6rem) rotate(-6deg)}}
@keyframes wob{25%{transform:rotate(-10deg)}75%{transform:rotate(10deg)}}

/* ---------- home ---------- */
.hero{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
.hero .mascot{width:6rem;height:6rem}
.hero h1{font-size:3rem;font-weight:700;letter-spacing:-.01em}
.hero p{font-size:1.15rem;color:var(--muted)}
.hero .txt{flex:1;min-width:16rem;display:flex;flex-direction:column;gap:.3rem}
.gradebar{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.gradebar .lbl{font-weight:900;margin-right:.3rem}
.gchip{border:.15rem solid var(--line);background:var(--card);border-radius:99rem;padding:.3em 1em;font-weight:900;font-size:1.05rem;color:var(--ink)}
.gchip.on{background:var(--sun);border-color:var(--sun);color:var(--sun-ink)}
.mods{display:grid;grid-template-columns:repeat(auto-fit,minmax(21rem,1fr));gap:1rem}
.mod{background:var(--card);border:.15rem solid var(--line);border-radius:1.1rem;overflow:hidden;display:flex;flex-direction:column}
.mod-head{background:var(--mc);color:var(--on-mc);padding:.7rem 1rem;display:flex;gap:.7rem;align-items:center}
.mod-head .ic{font-size:2.2rem;line-height:1}
.mod-head .no{font-family:var(--f-mono);font-size:.8rem;font-weight:700;opacity:.9}
.mod-head h2{font-size:1.4rem}
.mod-list{display:flex;flex-direction:column;gap:.45rem;padding:.8rem}
.mod-list a{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink);border:.12rem solid var(--line);border-radius:.7rem;padding:.45rem .7rem;font-weight:700;background:var(--card)}
.mod-list a:hover,.mod-list a:focus-visible{border-color:var(--mc);background:var(--card2)}
.mod-list a .t{flex:1 1 9rem;min-width:0}
.mod-list .empty{color:var(--muted);font-size:.95rem;padding:.4rem}
.gtag{font-family:var(--f-head);font-size:.72rem;font-weight:700;border-radius:99rem;padding:.08em .55em;background:var(--card2);color:var(--muted);white-space:nowrap}
.gtag.hl{background:var(--sun);color:var(--sun-ink)}
.home-foot{color:var(--muted);font-size:.9rem}

/* ---------- activity shell ---------- */
.sib{display:flex;gap:.35rem;flex-wrap:wrap;align-items:center;font-size:.8rem}
.sib .mtag{background:var(--mc);color:var(--on-mc);font-family:var(--f-mono);font-weight:700;border-radius:.5rem;padding:.2em .6em;text-decoration:none}
.sib a{color:var(--ink);text-decoration:none;border:.12rem solid var(--line);border-radius:.55rem;padding:.2em .7em;font-weight:700;background:var(--card)}
.sib a.on{border-color:var(--mc);background:var(--mc);color:var(--on-mc)}
.act-top{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.act-title{flex:1 1 20rem;min-width:0;display:flex;flex-direction:column;gap:.3rem}
.act-title h1{font-size:2.1rem;color:var(--ink)}
.act-title .meta{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
.guide{flex:1 1 28rem;min-width:0;display:flex;gap:.6rem;align-items:center}
.bubble{position:relative;flex:1;min-width:0;background:var(--card);border:.15rem solid var(--mc);border-radius:1rem;padding:.6rem 3.2rem .6rem 1rem;font-size:1.15rem;font-weight:700;min-height:3.2rem;display:flex;align-items:center}
.bubble::before{content:"";position:absolute;left:-.62rem;top:50%;width:1rem;height:1rem;background:var(--card);border-left:.15rem solid var(--mc);border-bottom:.15rem solid var(--mc);transform:translateY(-50%) rotate(45deg)}
.bubble.good{border-color:var(--good);background:var(--good-bg)} .bubble.good::before{background:var(--good-bg);border-color:var(--good)}
.bubble.oops{border-color:var(--bad);background:var(--bad-bg)} .bubble.oops::before{background:var(--bad-bg);border-color:var(--bad)}
.bubble .spk{position:absolute;right:.4rem;top:50%;transform:translateY(-50%);border:0;background:var(--card2);border-radius:50%;width:2.3rem;height:2.3rem;font-size:1.1rem;display:grid;place-items:center}
.work{display:flex;flex-direction:column;gap:1rem}
.notes{display:none;border:.15rem dashed var(--mc);border-radius:1rem;padding:.8rem 1rem;font-size:1rem;background:var(--card)}
.notes h3{font-size:1rem;color:var(--mc);margin-bottom:.3rem}
.notes ul{margin:.2rem 0 0;padding-left:1.2rem}
body.show-notes .notes{display:block}

/* ---------- shared bits ---------- */
.panel{background:var(--card);border:.15rem solid var(--line);border-radius:1.1rem;padding:1rem}
.row{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}
.btn{border:.15rem solid var(--line);background:var(--card);border-radius:.75rem;padding:.4em .9em;font-weight:900;color:var(--ink);line-height:1.2;display:inline-flex;align-items:center;gap:.35em;justify-content:center}
.btn:hover{border-color:var(--ink)}
.btn.pri{background:var(--mc);border-color:var(--mc);color:var(--on-mc)}
.btn.sun{background:var(--sun);border-color:var(--sun);color:var(--sun-ink)}
.btn.sm{font-size:.85rem;padding:.3em .7em}
.btn.big{font-size:1.3rem;padding:.55em 1.2em}
.btn:disabled{opacity:.45;cursor:default}
.seg{display:inline-flex;flex-wrap:wrap;gap:.3rem;background:var(--card2);border-radius:.9rem;padding:.3rem}
.seg button{border:0;background:none;border-radius:.65rem;padding:.35em .9em;font-weight:900;color:var(--muted)}
.seg button.on{background:var(--card);color:var(--ink);box-shadow:0 .12rem 0 var(--line)}
input[type=text],input[type=number],input[type=search],select,textarea{background:var(--card);border:.15rem solid var(--line);border-radius:.7rem;padding:.35em .6em;min-width:0}
input[type=range]{accent-color:var(--mc);width:100%}
.pill{display:inline-flex;align-items:center;gap:.3em;border-radius:99rem;padding:.1em .7em;font-weight:900;background:var(--card2)}
.pill.good{background:var(--good-bg);color:var(--good)} .pill.bad{background:var(--bad-bg);color:var(--bad)}
.big-ic{font-size:3rem;line-height:1}
.stars{font-size:1.4rem;letter-spacing:.1em}
.shake{animation:shake .45s}
@keyframes shake{20%,60%{transform:translateX(-.4rem)}40%,80%{transform:translateX(.4rem)}}
.pop{animation:pop .35s ease}
@keyframes pop{0%{transform:scale(.6);opacity:0}100%{transform:scale(1);opacity:1}}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.split{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:1rem;align-items:start}
@media (max-width:700px){.grid2,.grid3,.split{grid-template-columns:1fr}}

/* sort engine */
.sort{display:flex;flex-direction:column;gap:1rem}
.pool{display:flex;flex-wrap:wrap;gap:.6rem;min-height:4rem;padding:.8rem;border:.15rem dashed var(--line);border-radius:1rem;background:var(--card)}
.pool:empty::after{content:"全部完成！";color:var(--muted);font-weight:900;align-self:center}
.bins{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:.8rem}
.bin{border:.18rem solid var(--mc);border-radius:1rem;background:var(--card);min-height:8rem;display:flex;flex-direction:column;cursor:pointer}
.bin-head{background:var(--mc);color:var(--on-mc);padding:.4rem .8rem;font-weight:900;font-size:1.2rem;display:flex;gap:.4rem;align-items:center;border-radius:.75rem .75rem 0 0}
.bin-drop{flex:1;display:flex;flex-wrap:wrap;gap:.4rem;padding:.6rem;align-content:flex-start}
.bin.hover{background:var(--card2)}
.card-item{touch-action:none;user-select:none;border:.15rem solid var(--line);background:var(--card);border-radius:.8rem;padding:.4rem .8rem;font-weight:900;font-size:1.2rem;display:inline-flex;align-items:center;gap:.4rem;color:var(--ink)}
.card-item .ci-ic{font-size:1.7rem;line-height:1}
.card-item.sel{border-color:var(--sun);box-shadow:0 0 0 .25rem var(--sun)}
.card-item.done{border-color:var(--good);background:var(--good-bg);font-size:1rem;cursor:default}
.card-item.done .ci-ic{font-size:1.3rem}
.card-item.dragging{opacity:.35}
.ghost{position:fixed;z-index:100;pointer-events:none;transform:rotate(-3deg);box-shadow:0 .5rem 1.2rem rgba(0,0,0,.25)}

/* order engine */
.order{display:flex;flex-direction:column;gap:1rem}
.slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:.7rem}
.slot{min-height:7rem;border:.18rem dashed var(--line);border-radius:1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;padding:.5rem;background:var(--card);position:relative;text-align:center;font-weight:900}
.slot .n{position:absolute;top:.3rem;left:.5rem;font-family:var(--f-head);font-weight:700;color:var(--muted);font-size:1rem}
.slot.filled{border-style:solid;border-color:var(--mc);cursor:pointer}
.slot.ok{border-color:var(--good);background:var(--good-bg)}
.slot.no{border-color:var(--bad);background:var(--bad-bg)}
.slot.run{box-shadow:0 0 0 .3rem var(--sun);transform:scale(1.04);transition:transform .2s}
.slot .ic{font-size:2.6rem;line-height:1}
.ostep{border:.15rem solid var(--line);background:var(--card);border-radius:.9rem;padding:.5rem .9rem;font-weight:900;font-size:1.15rem;display:inline-flex;align-items:center;gap:.5rem;color:var(--ink)}
.ostep .ic{font-size:2rem;line-height:1}

/* quiz engine */
.quiz{display:flex;flex-direction:column;gap:1rem}
.quiz-top{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;font-weight:900;color:var(--muted)}
.quiz-q{display:flex;gap:1rem;align-items:center;font-family:var(--f-head);font-size:2rem;font-weight:700}
.quiz-q .big-ic{font-size:4rem}
.opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:.8rem}
.opt{border:.18rem solid var(--line);background:var(--card);border-radius:1rem;padding:.8rem 1rem;font-weight:900;font-size:1.4rem;display:flex;align-items:center;gap:.7rem;text-align:left;color:var(--ink)}
.opt .ic{font-size:2.4rem;line-height:1}
.opt:hover{border-color:var(--mc)}
.opt.ok{border-color:var(--good);background:var(--good-bg)}
.opt.no{border-color:var(--bad);background:var(--bad-bg)}
.why{background:var(--card2);border-radius:1rem;padding:.8rem 1rem;font-size:1.2rem;font-weight:700}

/* tool popovers */
.pop-panel{position:fixed;z-index:60;right:max(16px,env(safe-area-inset-right,0px));top:3.4rem;background:var(--card);border:.15rem solid var(--line);border-radius:1rem;padding:1rem;box-shadow:0 .6rem 2rem rgba(0,0,0,.2);display:flex;flex-direction:column;gap:.7rem;font-size:1rem;max-width:calc(100vw - 32px)}
.pop-panel h3{font-size:1.1rem}
.timer-big{position:fixed;z-index:55;left:50%;transform:translateX(-50%);bottom:calc(1rem + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--paper);font-family:var(--f-head);font-weight:700;font-size:3rem;border-radius:1.2rem;padding:.2rem 1.2rem;display:flex;gap:1rem;align-items:center;font-variant-numeric:tabular-nums}
.timer-big button{font-size:1rem;background:transparent;border:.12rem solid currentColor;color:inherit;border-radius:.6rem;padding:.2em .6em}
.timer-big.done{background:var(--bad);color:#fff;animation:pulse 1s infinite}
@keyframes pulse{50%{transform:translateX(-50%) scale(1.06)}}
.picker-num{font-family:var(--f-head);font-weight:700;font-size:6rem;text-align:center;line-height:1;min-width:3ch;font-variant-numeric:tabular-nums}
.score{position:fixed;z-index:50;left:max(16px,env(safe-area-inset-left,0px));bottom:calc(1rem + env(safe-area-inset-bottom,0px));display:flex;gap:.5rem;flex-wrap:wrap}
.team{border-radius:1rem;padding:.3rem .5rem .3rem .8rem;display:flex;align-items:center;gap:.4rem;font-weight:900;color:#fff;font-size:1.1rem}
.team .v{font-family:var(--f-head);font-size:2rem;min-width:1.6ch;text-align:center;font-variant-numeric:tabular-nums}
.team button{border:0;border-radius:.5rem;background:rgba(255,255,255,.25);color:#fff;font-weight:900;width:2rem;height:2rem}
#confetti{position:fixed;inset:0;pointer-events:none;z-index:90}

@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}
@media (max-width:700px){.act-title h1{font-size:1.7rem}.hero h1{font-size:2rem}}

/* ---------- teaching decks ---------- */
body.in-deck main{overflow:hidden;padding-block:.5rem}
.deck{height:100%;max-width:76rem;margin:0 auto;display:flex;flex-direction:column;gap:.5rem}
.deck-top{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;font-size:.85rem}
.deck-name{font-family:var(--f-head);font-size:1.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:22rem}
.deck-prog{flex:1;display:flex;gap:.3rem;min-width:0}
.seg-sec{flex:1;min-width:0;border:0;background:var(--card);border-radius:.5rem;padding:.2rem .4rem;display:flex;flex-direction:column;gap:.15rem;color:var(--muted);border-bottom:.25rem solid var(--line)}
.seg-sec .lbl{font-size:.7rem;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
.seg-sec .ticks{display:flex;gap:.15rem}
.seg-sec i{flex:1;height:.3rem;border-radius:1rem;background:var(--card2)}
.seg-sec i.done{background:var(--sc);opacity:.5} .seg-sec i.cur{background:var(--sc)}
.seg-sec.on{border-bottom-color:var(--sc);color:var(--ink)}
.slide{flex:1;min-height:0;overflow:auto;background:var(--card);border:.2rem solid var(--line);border-top:.5rem solid var(--mc);border-radius:1.2rem;padding:1.2rem 1.6rem;display:flex;flex-direction:column;gap:1rem}
.slide.sl-act{background:var(--paper)}
.slide>:not(.notes){zoom:var(--fit,1)}
.slide{scrollbar-gutter:stable}
.deck-nav{display:flex;align-items:center;justify-content:center;gap:.8rem;flex-wrap:wrap}
.sl-eye{font-family:var(--f-head);font-weight:700;font-size:.95rem;color:var(--mc);letter-spacing:.04em}
.sl-h1{font-size:4rem;font-weight:700}
.sl-h2{font-size:2.8rem;font-weight:700}
.sl-lead{font-size:1.75rem;line-height:1.5;font-weight:700}
.sl-note{font-size:1.2rem;color:var(--muted);font-weight:700}
.sl-bigic{font-size:7rem;line-height:1.1;text-align:center}
.sl-center{display:flex;flex-direction:column;align-items:center;gap:.8rem;justify-content:center;flex:1}
.sl-hero{display:flex;gap:2rem;align-items:center}
.sl-hero .sl-bigic{font-size:9rem}
.sl-box{background:var(--card2);border-radius:1.1rem;padding:1rem 1.4rem}
.sl-box h3{font-size:1.5rem;margin-bottom:.4rem}
.sl-list{margin:0;padding-left:1.4em;font-size:1.5rem;font-weight:700;display:flex;flex-direction:column;gap:.3rem}
.sl-reveal{align-self:stretch;background:var(--good-bg);border:.18rem solid var(--good);border-radius:1rem;padding:.8rem 1.2rem;font-size:1.5rem;font-weight:900;text-align:center}
.sl-cards{display:grid;gap:1rem}
.sl-card{background:var(--card);border:.18rem solid var(--line);border-radius:1.1rem;padding:1rem;display:flex;flex-direction:column;gap:.4rem;align-items:center;text-align:center}
.sl-card .ic{font-size:4rem;line-height:1.1}
.sl-card b{font-size:1.7rem;font-family:var(--f-head)}
.sl-card p{font-size:1.25rem;font-weight:700;color:var(--muted)}
.dim{opacity:.08;transition:opacity .3s}
.sl-chain{display:flex;align-items:stretch;justify-content:center;gap:.8rem;flex-wrap:wrap}
.sl-chain .arr{font-size:3rem;align-self:center;color:var(--mc);font-weight:900;transition:opacity .3s}
.sl-node{background:var(--card);border:.2rem solid var(--mc);border-radius:1.1rem;padding:1rem;display:flex;flex-direction:column;align-items:center;gap:.3rem;text-align:center;min-width:11rem;max-width:17rem;flex:1}
.sl-node .ic{font-size:4rem;line-height:1.1}
.sl-node b{font-size:1.6rem}
.sl-node p{font-size:1.15rem;color:var(--muted);font-weight:700}
.sl-node .lab{color:#fff;border-radius:99rem;padding:.1em .8em;font-weight:900;font-size:1.1rem}
.sl-bul{display:flex;flex-direction:column;gap:.7rem}
.sl-bul .it{display:flex;gap:1rem;align-items:center;background:var(--card2);border-radius:1rem;padding:.6rem 1rem}
.sl-bul .ic{font-size:2.6rem;min-width:3.2rem;text-align:center;line-height:1}
.sl-bul .ic.num{font-family:var(--f-head);font-weight:700;color:var(--on-mc);background:var(--mc);border-radius:50%;width:3rem;height:3rem;min-width:3rem;font-size:1.6rem;display:grid;place-items:center}
.sl-bul b{font-size:1.65rem}
.sl-bul p{font-size:1.2rem;color:var(--muted);font-weight:700}
.sl-q{background:var(--card2);border-radius:1rem;padding:.8rem 1rem;display:flex;flex-direction:column;gap:.6rem;font-size:1.6rem}
.sl-q .qn{font-family:var(--f-head);font-weight:700;color:var(--on-mc);background:var(--mc);border-radius:.6rem;padding:0 .5rem}
.sl-q .sl-reveal{font-size:1.25rem;text-align:left}
.sl-teams{justify-content:center}
.slide .quiz-q{font-size:2.2rem}
.act-top.emb{gap:.6rem 1rem}
.act-top.emb .act-title{flex:0 1 auto}
.act-top.emb .act-title h1{font-size:1.5rem}
.act-top.emb .guide{flex:1 1 24rem}
.act-top.emb .mascot{width:3rem;height:3rem}
.act-top.emb .bubble{font-size:1.05rem;min-height:2.6rem}
.slide.sl-act{gap:.7rem;padding-top:.8rem}
.home-h{font-size:1.9rem;margin-top:.6rem}
.deck-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:.7rem}
.deck-card{display:flex;align-items:center;gap:.8rem;background:var(--card);border:.15rem solid var(--line);border-left:.5rem solid var(--mc);border-radius:1rem;padding:.7rem 1rem;color:var(--ink);text-decoration:none}
.deck-card b{font-size:1.3rem}
.deck-card .ic{font-size:2.4rem}
.deck-card .go{font-size:1.4rem;color:var(--mc)}
a.deck-card:hover{background:var(--card2)}
.deck-card.plan{border-left-color:var(--line);opacity:.85}
.deck-ov{position:fixed;inset:0;z-index:70;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;padding:2rem max(16px,env(safe-area-inset-right,0px)) 2rem max(16px,env(safe-area-inset-left,0px))}
@media (max-width:700px){.sl-hero{flex-direction:column}.sl-cards{grid-template-columns:1fr!important}.sl-h1{font-size:2.4rem}.sl-h2{font-size:1.8rem}}