:root{--sky-top: #62c1ff;--sky-bottom: #dff4ff;--paper: #ffffff;--ink: #33302b;--muted: #7d7466;--line: #eadfcb;--primary: #ff8a3d;--primary-dark: #e06a1b;--blue: #3d8bff;--green: #2fa968;--green-bg: #e3f6eb;--red: #e25555;--red-bg: #fde8e8;--yellow: #ffc83d;--theme: var(--primary);--soft: #fff1e6;--kai: "Kaiti SC", STKaiti, KaiTi, "BiauKai", "Noto Serif SC", serif;--fun: "ZCOOL KuaiLe", "Yuanti SC", "PingFang SC", "Microsoft YaHei", sans-serif;--tzg: min(100%, 300px);font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei,Noto Sans SC,system-ui,sans-serif;font-size:18px;color:var(--ink);background:var(--sky-bottom);-webkit-tap-highlight-color:transparent}:root.classroom{font-size:26px;--tzg: min(100%, 440px)}:root.classroom .page{max-width:1280px}*{box-sizing:border-box}body{margin:0;min-height:100vh;overflow-x:hidden}h1,h2{margin:.2em 0;font-family:var(--fun);font-weight:400}button{font:inherit;color:inherit;cursor:pointer;border:none;background:none;touch-action:manipulation}button:disabled{cursor:default}.row{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;align-items:center;margin-top:1rem}.scene{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background:linear-gradient(var(--sky-top),var(--sky-bottom) 70%);overflow:hidden}.sun{position:absolute;top:4.5rem;right:6%;width:90px;height:90px;border-radius:50%;background:radial-gradient(#fff3a0,#ffd43b 60%);box-shadow:0 0 0 14px #ffd43b40,0 0 0 28px #ffd43b1f}.cloud{position:absolute;width:120px;height:40px;border-radius:40px;background:#fff;opacity:.9;animation:drift 60s linear infinite}.cloud:before,.cloud:after{content:"";position:absolute;background:#fff;border-radius:50%}.cloud:before{width:54px;height:54px;top:-26px;left:18px}.cloud:after{width:40px;height:40px;top:-18px;left:62px}.cloud.c1{top:9rem;left:-10%}.cloud.c2{top:16rem;left:-30%;transform:scale(.7);animation-duration:80s;animation-delay:-30s}.cloud.c3{top:6rem;left:-50%;transform:scale(.5);animation-duration:95s;animation-delay:-60s}@keyframes drift{to{translate:160vw 0}}.hills{position:absolute;left:0;bottom:0;width:100%;height:140px}.topbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;padding:.5rem 1rem;background:#ffffffd9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-bottom:3px solid rgba(255,255,255,.9)}.brand{font-family:var(--fun);font-size:1.3rem}.star-total{margin-left:auto;font-family:var(--fun);font-size:1.4rem;padding:.1rem .8rem;border-radius:999px;background:#fff4cf;border:3px solid var(--yellow)}.top-tools{display:flex;gap:.5rem;align-items:center}.lang{display:flex;border-radius:999px;border:2px solid var(--line);overflow:hidden;background:#fff}.lang button{padding:.25rem .6rem;font-size:.8rem;font-weight:700;color:var(--muted)}.lang button.on{background:var(--blue);color:#fff}.classroom-toggle{padding:.25rem .7rem;border-radius:999px;border:2px solid var(--line);background:#fff;font-size:.8rem;color:var(--muted)}.classroom-toggle.on{background:var(--green);border-color:var(--green);color:#fff}.groups{flex-basis:100%;display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}.group{display:flex;align-items:center;gap:.4rem;padding:.2rem .6rem;border-radius:.8rem;background:#fff;border:2px solid var(--line);font-size:.85rem}.group.lead{border-color:var(--yellow);background:#fff4cf}.group-adjust button{width:1.6rem;height:1.6rem;border-radius:50%;background:var(--paper);border:1px solid var(--line);margin-left:.15rem}.round-btn{width:3.4rem;height:3.4rem;border-radius:50%;background:#fff;border:3px solid var(--line);box-shadow:0 5px 0 var(--line);font-size:1.4rem;display:inline-flex;align-items:center;justify-content:center;position:relative;transition:transform .08s,box-shadow .08s}.round-btn:active:not(:disabled){transform:translateY(4px);box-shadow:0 1px 0 var(--line)}.round-btn:disabled{opacity:.35}.round-btn.big{width:5rem;height:5rem;font-size:2rem}.round-btn.primary{background:var(--primary);border-color:var(--primary-dark);box-shadow:0 6px 0 var(--primary-dark);color:#fff}.round-btn.home{width:2.8rem;height:2.8rem;font-size:1.3rem;box-shadow:0 3px 0 var(--line)}.pill{min-height:2.6rem;padding:.3rem 1.1rem;border-radius:999px;background:#fff;border:2px solid var(--line);box-shadow:0 3px 0 var(--line);font-weight:700}.link{color:var(--blue);text-decoration:underline;padding:0 .4rem}.speak{min-width:2.4rem;min-height:2.4rem;border-radius:999px;background:#eaf2ff;font-size:1rem;display:inline-flex;align-items:center;justify-content:center;gap:.3rem;flex-shrink:0}.speak.playing{background:var(--blue)}.stars .on,.stop-stars .on{color:var(--yellow)}.stars .off,.stop-stars .off{color:#ddd3c0}.hint{color:var(--muted);margin:.5rem 0;min-height:1.4em}.hint.warn{color:var(--red);font-weight:700}.pinyin{font-family:Avenir Next,Nunito,system-ui,sans-serif;color:var(--blue);font-weight:600}.page{max-width:900px;margin:0 auto;padding:1rem 1rem 9rem}.sign{width:fit-content;margin:.5rem auto 0;padding:.5rem 2rem .7rem;text-align:center;background:#c98a4b;border:4px solid #8d5a2b;border-radius:1rem;color:#fff;box-shadow:0 6px #8d5a2b}.sign small{font-family:var(--fun);opacity:.85}.sign h1{font-size:2.2rem;margin:0}.map{list-style:none;padding:0;margin:1rem auto;max-width:520px}.stop{position:relative}.path-seg{display:block;width:100%;height:3.2rem}.path-seg path{fill:none;stroke:#fff;stroke-dasharray:2 14;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-width:8px}.stop-inner{position:relative;width:40%;display:flex;flex-direction:column;align-items:center}.stop.left .stop-inner{margin-left:10%}.stop.right .stop-inner{margin-left:50%}.bubble-stop{width:7rem;height:7rem;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#ffe3cc 70%);border:5px solid var(--primary);box-shadow:0 8px 0 var(--primary-dark);display:flex;align-items:center;justify-content:center}.bubble-stop.next{animation:bounce 1.2s ease-in-out infinite}.bubble-stop.locked{background:#eee;border-color:#c9c2b6;box-shadow:0 8px #b5ad9f}.stop-emoji{font-size:3.2rem}.locked .stop-emoji{font-size:2.4rem;opacity:.7}.stop-label{margin-top:.7rem;padding:.15rem .9rem;border-radius:999px;background:#ffffffe6;text-align:center;display:flex;flex-direction:column}.stop-label b{font-family:var(--fun);font-weight:400;font-size:1.3rem}.stop-stars{font-size:1.1rem;letter-spacing:.1em;color:var(--muted)}.stop-mascot{position:absolute;top:1.4rem;left:calc(50% + 3.8rem)}.stop.right .stop-mascot{left:auto;right:calc(50% + 3.8rem)}.stop.right .stop-mascot .mascot{transform:scaleX(-1)}.parent-note{max-width:520px;margin:1rem auto;padding:.8rem 1rem;border-radius:1rem;background:#ffffffe6;color:var(--muted);font-size:.9rem;line-height:1.5}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-14px)}}.stepper{display:flex;gap:.5rem;justify-content:center;margin-bottom:.8rem}.stepper button{display:flex;flex-direction:column;align-items:center;padding:.3rem .5rem;border-radius:1rem;background:#fffc;border:3px solid transparent;font-size:.7rem;min-width:3.6rem}.stepper button.current{border-color:var(--theme);background:#fff}.stepper .icon{font-size:1.5rem}.lesson{background:#ffffffeb;border-radius:1.2rem;padding:.5rem 1rem;margin:1.4rem 0 1rem}.lesson summary{cursor:pointer;font-family:var(--fun);font-size:1.1rem;min-height:2.4rem;display:flex;align-items:center;gap:.5rem}.lesson summary small{font-family:inherit;color:var(--muted);font-size:.8rem}.lesson-body p{font-family:var(--kai);font-size:1.6rem;margin:.3rem 0;display:flex;align-items:center;gap:.5rem;border-radius:.5rem}.lesson-body p.reading{background:#fff4cf}.game-card{position:relative;background:var(--paper);border-radius:2rem;padding:1rem 1.2rem 1.6rem;border:5px solid var(--theme);box-shadow:0 10px color-mix(in srgb,var(--theme) 70%,#000);text-align:center}.game-top{display:flex;align-items:center;gap:.9rem;text-align:left}.bubble{position:relative;flex:1;padding:.6rem 1rem;border-radius:1.2rem;background:var(--soft);border:3px solid var(--theme)}.bubble:before{content:"";position:absolute;left:-14px;top:50%;margin-top:-10px;border:10px solid transparent;border-right:14px solid var(--theme);border-left:0}.bubble .zh{margin:0;font-family:var(--fun);font-size:1.35rem;display:flex;align-items:center;gap:.5rem;justify-content:space-between}.help-line{margin:.2rem 0 0;font-size:.8rem;color:var(--muted);font-style:italic}.dots{list-style:none;display:flex;gap:.4rem;justify-content:center;padding:0;margin:.9rem 0}.dots li{width:.9rem;height:.9rem;border-radius:50%;background:#eee6d8}.dots li.on{background:var(--theme)}.dots li.now{background:#fff;box-shadow:0 0 0 3px var(--theme);animation:pulse 1.2s infinite}@keyframes pulse{50%{transform:scale(1.3)}}.big-card{position:relative;display:flex;flex-direction:column;align-items:center;margin:0 auto 1rem;min-width:12rem;padding:.6rem 2rem 1rem;border-radius:1.6rem;background:var(--soft);border:4px solid var(--theme);box-shadow:0 6px color-mix(in srgb,var(--theme) 60%,#fff);animation:card-in .35s ease-out}.big-card.hanzi{font-family:var(--kai);font-size:6rem;line-height:1.1}.big-card .hanzi{font-family:var(--kai);font-size:4.2rem;line-height:1.2}.big-card .pinyin{font-size:1.6rem;min-height:1.3em}.big-card.right{border-color:var(--green);background:var(--green-bg)}.big-card .replay{position:absolute;right:.5rem;bottom:.4rem;font-size:1.1rem;opacity:.6}@keyframes card-in{0%{transform:scale(.6) rotate(-6deg);opacity:0}}.flash-stage{display:flex;align-items:center;justify-content:center;gap:1rem}.flash-stage .big-card{margin:0 0 .8rem}.big-card.dim{opacity:.55}.arrow{width:3.6rem;height:3.6rem;flex-shrink:0;border-radius:50%;background:var(--theme);color:#fff;font-size:1.5rem;box-shadow:0 5px color-mix(in srgb,var(--theme) 70%,#000);transition:transform .08s,box-shadow .08s}.arrow:active:not(:disabled){transform:translateY(4px);box-shadow:0 1px color-mix(in srgb,var(--theme) 70%,#000)}.arrow:disabled{opacity:.25}.status{position:relative;display:flex;align-items:center;gap:.6rem;width:fit-content;min-height:3.6rem;margin:0 auto;padding:.4rem 1.4rem;border-radius:999px;background:#f4efe6;overflow:hidden;animation:card-in .25s ease-out}.status.idle{opacity:.4}.status-icon{font-size:1.9rem}.status.listen{background:#ffe8e8;box-shadow:0 0 0 4px #ffb3b3}.status.listen .status-icon{animation:pulse .8s infinite}.status.right{background:var(--green-bg);box-shadow:0 0 0 4px var(--green)}.status.retry,.status.timer{background:#fff4cf}.read-text{font-family:var(--fun);font-size:1.4rem;display:flex;flex-direction:column;text-align:left}.read-text small{font-family:system-ui,sans-serif;font-size:.7rem;color:var(--muted)}.status .bar{position:absolute;left:0;bottom:0;height:5px;width:0;background:var(--yellow);animation:fill linear forwards}.status.listen .bar{background:var(--red)}@keyframes fill{to{width:100%}}.heard{margin:.4rem 0 0;font-size:.85rem;color:var(--muted)}.pause-wrap{position:relative}.big-pill{min-width:9rem;min-height:3.8rem;padding:.4rem 1.6rem;border-radius:999px;font-family:var(--fun);font-size:1.5rem;color:#fff;transition:transform .08s,box-shadow .08s}.big-pill.pause{background:var(--theme);box-shadow:0 6px color-mix(in srgb,var(--theme) 70%,#000)}.big-pill.resume{--theme: var(--green);background:var(--green);box-shadow:0 6px #1e7a4a}.big-pill:active{transform:translateY(4px);box-shadow:none}.mini-pill{min-height:2.6rem;padding:.3rem 1rem;border-radius:999px;background:#fff;border:3px solid var(--line);color:var(--muted);font-weight:700}.mini-pill.on{border-color:var(--red);color:var(--red);background:#fff5f5}.help-line.center{text-align:center;min-height:1.2em;margin-top:2.6rem}.mic-card{display:flex;flex-direction:column;align-items:center;gap:.8rem;max-width:460px;margin:0 auto}.mic-start{display:flex;flex-direction:column;align-items:center;width:9rem;height:9rem;border-radius:50%;background:var(--red);color:#fff;font-family:var(--fun);font-size:1.6rem;box-shadow:0 8px #a83232;justify-content:center;animation:bounce 1.4s ease-in-out infinite}.mic-start span{font-size:3rem;line-height:1.1}.choices{position:relative;display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;width:fit-content;margin:0 auto 1.6rem;padding:.8rem;border-radius:1.6rem}.glow{animation:glow 1.4s ease-in-out infinite}@keyframes glow{0%,to{box-shadow:0 0 color-mix(in srgb,var(--theme) 0%,transparent)}50%{box-shadow:0 0 0 8px color-mix(in srgb,var(--theme) 35%,transparent)}}.choice{min-width:5.6rem;min-height:5.6rem;padding:.3rem 1rem;border-radius:1.3rem;background:#fff;border:4px solid var(--line);box-shadow:0 6px 0 var(--line);transition:transform .08s,box-shadow .08s}.choice:active{transform:translateY(4px);box-shadow:0 2px 0 var(--line)}.choice.hanzi{font-family:var(--kai);font-size:3.4rem;line-height:1}.choice.pinyin{font-family:Avenir Next,Nunito,system-ui,sans-serif;font-size:1.9rem;font-weight:600;color:var(--blue)}.choice.right{border-color:var(--green);background:var(--green-bg);box-shadow:0 6px 0 var(--green);animation:pop .4s}.choice.wrong{border-color:#e5dfd6;background:#f1ede6;color:#c3bbae;box-shadow:none}.shake{animation:shake .4s}@keyframes shake{20%,60%{translate:-8px 0}40%,80%{translate:8px 0}}@keyframes pop{50%{transform:scale(1.25)}}.pointer{position:absolute;left:50%;bottom:-2.4rem;translate:-50% 0;display:flex;flex-direction:column;align-items:center;pointer-events:none;animation:point .9s ease-in-out infinite}.pointer span{font-size:2.2rem;filter:drop-shadow(0 2px 2px rgba(0,0,0,.2))}.pointer small{font-size:.7rem;color:var(--muted);background:#fff;padding:0 .4rem;border-radius:.4rem;white-space:nowrap}.choices .pointer{animation:sweep 2.4s ease-in-out infinite}@keyframes sweep{0%,to{left:15%}50%{left:85%}}@keyframes point{50%{transform:translateY(-10px)}}.sentence{font-family:var(--kai);font-size:3.4rem;margin:.2rem 0 1rem;animation:card-in .35s ease-out}.slot{display:inline-block;min-width:1.2em;min-height:1em;margin:0 .1em;border-bottom:5px solid var(--theme);color:var(--green);line-height:1}.slot.filled{animation:pop .35s}.picture{display:flex;flex-direction:column;align-items:center}.picture .emoji{font-size:5rem;line-height:1;animation:card-in .35s ease-out}.picture .sentence{margin-bottom:.6rem}.stroke-practice{display:flex;gap:1.4rem;justify-content:center;align-items:flex-start;flex-wrap:wrap}.tzg-wrap{position:relative;width:var(--tzg);border-radius:.6rem}.tianzige{width:100%;aspect-ratio:1;border:4px solid var(--red);border-radius:.4rem;background:linear-gradient(to right,transparent calc(50% - 1px),rgba(226,85,85,.35) calc(50% - 1px),rgba(226,85,85,.35) calc(50% + 1px),transparent calc(50% + 1px)),linear-gradient(to bottom,transparent calc(50% - 1px),rgba(226,85,85,.35) calc(50% - 1px),rgba(226,85,85,.35) calc(50% + 1px),transparent calc(50% + 1px)),#fff;touch-action:none}.tzg-wrap .pointer{bottom:1.2rem}.char-info{flex:1 1 240px;max-width:400px;text-align:left}.char-head{display:flex;align-items:center;gap:.6rem}.pinyin.big{font-size:2.2rem}.count{margin-left:auto;font-family:var(--fun);color:var(--muted)}.stroke-names{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}.stroke-names li{padding:.3rem .7rem;border-radius:.8rem;border:3px solid var(--line);font-size:1.1rem;transition:transform .15s}.stroke-names li small{color:var(--muted);margin-right:.25rem}.stroke-names li.active{border-color:var(--theme);background:var(--soft);font-weight:800;transform:scale(1.15)}.stroke-names li.past{border-color:var(--green);color:var(--green)}.result{--theme: var(--yellow);padding-top:1.4rem}.result-stars{font-size:4rem;margin:.2rem 0;letter-spacing:.1em}.result-stars span{display:inline-block;color:#e6ddcc}.result-stars .on{color:var(--yellow);animation:star-in .5s backwards;text-shadow:0 4px 0 #e0a800}@keyframes star-in{0%{transform:scale(0) rotate(-180deg)}70%{transform:scale(1.4)}}.countdown{position:absolute;top:-10px;right:-10px;bottom:-10px;left:-10px;width:calc(100% + 20px);height:calc(100% + 20px);transform:rotate(-90deg);pointer-events:none}.countdown circle{fill:none;stroke:var(--yellow);stroke-width:6;stroke-linecap:round;stroke-dasharray:289;stroke-dashoffset:289;animation:countdown linear forwards}@keyframes countdown{to{stroke-dashoffset:0}}.award{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;align-items:center;margin:.6rem 0}.celebrate{position:relative;overflow:hidden;text-align:center;padding:2rem 1rem 2.5rem;background:#fff;border-radius:2rem;border:5px solid var(--yellow);box-shadow:0 10px #e0a800}.celebrate h1{font-size:2.4rem}.big-stars{font-family:var(--fun);font-size:3rem;margin:.4rem 0}.confetti i{position:absolute;top:-1rem;left:calc(var(--i) * 3.4%);width:.6rem;height:1rem;background:hsl(calc(var(--i) * 47),85%,60%);animation:fall 2.6s calc(var(--i) * .07s) ease-in infinite}@keyframes fall{to{transform:translateY(560px) rotate(540deg);opacity:0}}.flying-star{position:fixed;left:0;top:0;z-index:50;margin:-.8rem 0 0 -.8rem;font-size:1.6rem;pointer-events:none}.mascot{flex-shrink:0;overflow:visible}.mascot .body{transform-box:view-box;transform-origin:60px 100px}.mascot.talking .body{animation:bob .45s ease-in-out infinite}.mascot.talking .beak-lower{animation:talk .22s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:top center}.mascot.happy .body{animation:hop .5s ease-out 3}.mascot.dance .body{animation:dance .8s ease-in-out infinite}.mascot.happy .wing,.mascot.dance .wing{animation:flap .25s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center top}.mascot.oops .body{transform:rotate(-12deg);transition:transform .2s}@keyframes bob{50%{transform:translateY(-4px) scale(1.03,.97)}}@keyframes talk{to{transform:translateY(5px) scaleY(1.4)}}@keyframes hop{40%{transform:translateY(-18px)}}@keyframes dance{25%{transform:translateY(-14px) rotate(-8deg)}75%{transform:translateY(-14px) rotate(8deg)}}@keyframes flap{to{transform:rotate(-30deg)}}@media (max-width: 520px){:root:not(.classroom){font-size:16px}.brand{font-size:1.05rem}.page{padding:.7rem .7rem 8rem}.game-card{padding:.8rem .8rem 1.2rem;border-radius:1.5rem}.game-top .mascot{width:64px;height:64px}.bubble .zh{font-size:1.15rem}.sentence{font-size:2.8rem}.choice{min-width:4.8rem;min-height:4.8rem}.flash-stage{gap:.4rem}.flash-stage .big-card{min-width:0;padding:.5rem 1rem .9rem}.big-card .hanzi{font-size:3.2rem}.arrow{width:2.8rem;height:2.8rem;font-size:1.1rem}.stop-inner{width:55%}.stop.left .stop-inner{margin-left:4%}.stop.right .stop-inner{margin-left:41%}.stop-mascot .mascot{width:56px;height:56px}.char-info{text-align:center}.char-head,.stroke-names{justify-content:center}.sun{width:60px;height:60px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important}.confetti{display:none}}:root[data-audience=adult]{--paper: #ffffff;--ink: #1f2933;--muted: #66707a;--line: #e3e6ea;--primary: #2563eb;--primary-dark: #1d4ed8;--fun: system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;background:#f5f6f8}[data-audience=adult] h1,[data-audience=adult] h2{font-weight:700;letter-spacing:-.01em}[data-audience=adult] .topbar{background:#fff;border-bottom:1px solid var(--line)}[data-audience=adult] .brand{font-weight:700;font-size:1.1rem}[data-audience=adult] .star-total{font-size:1rem;font-weight:700;border-width:1px;background:#fffbea}[data-audience=adult] .round-btn{border-radius:.8rem;border-width:1px;box-shadow:none}[data-audience=adult] .round-btn.primary{box-shadow:none}[data-audience=adult] .pill,[data-audience=adult] .mini-pill{border-width:1px;box-shadow:none;border-radius:.6rem}[data-audience=adult] .game-card,[data-audience=adult] .celebrate{border:1px solid var(--line);border-top:4px solid var(--theme);border-radius:1rem;box-shadow:0 1px 3px #10182814}[data-audience=adult] .result{border-top-color:var(--yellow)}[data-audience=adult] .adult-icon{width:3rem;height:3rem;flex-shrink:0;border-radius:.8rem;background:var(--soft);display:flex;align-items:center;justify-content:center;font-size:1.5rem}[data-audience=adult] .bubble{border:none;background:transparent;padding:0}[data-audience=adult] .bubble:before{display:none}[data-audience=adult] .bubble .zh{font-size:1.15rem;font-weight:600}[data-audience=adult] .help-line{font-style:normal;font-size:.9rem}[data-audience=adult] .big-card,[data-audience=adult] .choice{border-width:2px;box-shadow:0 2px 0 var(--line);border-radius:.9rem;animation:none}[data-audience=adult] .big-card{border-color:var(--line);background:#fafbfc}[data-audience=adult] .choice.right{box-shadow:none}[data-audience=adult] .arrow,[data-audience=adult] .big-pill{border-radius:.8rem;box-shadow:none}[data-audience=adult] .big-pill{font-size:1.1rem;font-weight:700;min-height:3rem}[data-audience=adult] .status{border-radius:.8rem;min-height:3rem}[data-audience=adult] .read-text{font-size:1.1rem;font-weight:600}[data-audience=adult] .pointer,[data-audience=adult] .confetti{display:none}[data-audience=adult] .glow{animation:none}[data-audience=adult] .stepper button{border-radius:.7rem;border-width:2px;background:#fff}[data-audience=adult] .dots li.now{animation:none}.done-check{width:5rem;height:5rem;margin:0 auto;border-radius:50%;background:var(--green);color:#fff;font-size:2.8rem;line-height:5rem}[data-audience=adult] .sign{background:none;border:none;box-shadow:none;color:var(--ink);padding:.5rem 0;text-align:left;width:auto;max-width:640px}[data-audience=adult] .sign small{color:var(--muted)}[data-audience=adult] .map{max-width:640px;display:flex;flex-direction:column;gap:.6rem}[data-audience=adult] .stop-inner{width:100%!important;margin:0!important;flex-direction:row;gap:1rem;padding:.8rem 1rem;background:#fff;border:1px solid var(--line);border-radius:1rem}[data-audience=adult] .bubble-stop{width:3.4rem;height:3.4rem;border-radius:.8rem;border-width:2px;box-shadow:none;background:#eef3ff;animation:none}[data-audience=adult] .stop-emoji{font-size:1.7rem}[data-audience=adult] .stop-label{margin:0;background:none;text-align:left;padding:0}[data-audience=adult] .stop-label b{font-weight:700}[data-audience=adult] .parent-note{max-width:640px;background:#fff;border:1px solid var(--line)}.stop-sub{display:none;color:var(--muted);font-size:.75rem}[data-audience=adult] .stop-sub{display:block}.panel,.panel-head{max-width:720px;margin:.5rem auto 1rem}.panel{padding:1.4rem;border-radius:1.4rem;background:#fffffff2;border:1px solid var(--line)}.panel.center{text-align:center}.panel-head{padding:.6rem 1rem;border-radius:1rem;background:#ffffffd9}[data-audience=adult] .panel-head{background:none;padding:.6rem 0}.big-emoji{font-size:3.4rem;margin:0}.course-grid{max-width:720px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.9rem}.course-card{display:flex;align-items:center;gap:.9rem;padding:1rem 1.1rem;border-radius:1.2rem;background:#fff;border:3px solid var(--primary);box-shadow:0 6px 0 var(--primary-dark);text-align:left}.course-card.adult,[data-audience=adult] .course-card{border:1px solid var(--line);box-shadow:0 1px 3px #10182814;border-radius:1rem}.course-emoji{font-size:2.2rem}.course-text{display:flex;flex-direction:column;flex:1}.course-text small,.course-en{color:var(--muted);font-size:.8rem}.course-text b{font-size:1.15rem}.course-stars{font-weight:700;white-space:nowrap}.dev-link{text-align:center;margin-top:2rem;font-size:.8rem}.dev-link a{color:var(--muted)}.dev-program h2{font-size:1.2rem;margin-top:1.2rem}.dev-program h2 small{font-size:.75rem;color:var(--muted)}.dev-course{margin:.7rem 0}.dev-grades{display:flex;flex-wrap:wrap;gap:.4rem 1rem;margin-top:.3rem}.dev-grades label{display:flex;align-items:center;gap:.3rem;min-height:2rem}.dev-grades label.has-content span{color:var(--green)}.mini-pill.switch{font-size:.8rem;min-height:2.2rem;border-width:2px}.welcome{max-width:720px;margin:1rem auto;padding:1.6rem;border-radius:1.6rem;background:#fffffff2;text-align:center}.welcome h1{font-size:2.2rem}.welcome>.link{display:block;text-align:left}.role-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.2rem;margin-top:1.4rem}.role-card{display:flex;flex-direction:column;align-items:center;gap:.2rem;padding:1.4rem 1rem;border-radius:1.6rem;background:#fff;border:4px solid var(--primary);box-shadow:0 8px 0 var(--primary-dark)}.role-card.teacher{border-color:var(--blue);box-shadow:0 8px #2a6ad8}.role-card span{font-size:4rem}.role-card b{font-family:var(--fun);font-size:1.8rem;font-weight:400}.role-card small{color:var(--muted)}.group-grid{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;margin-top:1rem}.group-card{padding:1rem 1.4rem;border-radius:1.2rem;background:#fff4cf;border:3px solid var(--yellow);font-family:var(--fun);font-size:1.3rem}.avatar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:1rem;margin-top:1rem}.avatar-card{display:flex;flex-direction:column;align-items:center;padding:.8rem;border-radius:1.4rem;background:#fff;border:3px solid var(--line);box-shadow:0 6px 0 var(--line)}.avatar-card span{font-size:3.6rem}.avatar-card b{font-family:var(--fun);font-weight:400;font-size:1.3rem}.who{display:flex;align-items:center;gap:.3rem;padding:.15rem .7rem .15rem .3rem;border-radius:999px;background:#fff;border:2px solid var(--line)}.who span{font-size:1.4rem}.who small{font-size:.75rem;color:var(--muted)}.teacher-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.teacher-layout{display:grid;grid-template-columns:260px 1fr;gap:1.2rem;margin-top:1rem;align-items:start}.student-list,.student-detail{background:#fff;border:1px solid var(--line);border-radius:1rem;padding:.8rem}.student-list h3{font-size:.8rem;color:var(--muted);margin:.8rem .4rem .3rem}.student-row{display:flex;align-items:center;gap:.5rem;width:100%;padding:.4rem .5rem;border-radius:.6rem;text-align:left}.student-row:hover{background:#f5f6f8}.student-row.on{background:#eef3ff;box-shadow:inset 3px 0 0 var(--primary)}.student-row .avatar{font-size:1.5rem}.student-row .name{flex:1;font-weight:600}.student-row .total{font-size:.8rem;color:var(--muted)}.add-student{display:flex;flex-direction:column;gap:.4rem;margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--line)}.teacher input[type=text],.teacher input:not([type]),.teacher input[list]{font:inherit;padding:.45rem .6rem;border-radius:.5rem;border:1px solid var(--line)}.student-detail h2{font-size:1.1rem;margin-top:1.4rem;padding-top:1rem;border-top:1px solid var(--line)}.student-detail h3{font-size:.95rem;margin:.8rem 0 .4rem}.detail-head{display:flex;align-items:flex-end;gap:1rem;flex-wrap:wrap}.big-avatar{font-size:3rem;width:4.4rem;height:4.4rem;border-radius:1rem;background:#f5f6f8}.detail-fields{display:flex;gap:.8rem;flex:1;flex-wrap:wrap}.detail-fields label{display:flex;flex-direction:column;font-size:.8rem;color:var(--muted);gap:.2rem}.link.danger{color:var(--red)}.avatar-pick{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.6rem}.avatar-pick button{font-size:1.6rem;width:2.6rem;height:2.6rem;border-radius:.6rem}.avatar-pick button.on{background:#eef3ff}.enroll-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:.4rem 1.4rem}.enroll-course{margin:.4rem 0 .7rem}.enroll-grades{display:flex;flex-wrap:wrap;gap:.2rem .9rem;margin-top:.2rem}.enroll-grades label,.unit-row,.level-row{display:flex;align-items:center;gap:.35rem;min-height:2rem;cursor:pointer}.enroll-grades label.has-content span{color:var(--green)}.unlock-block{margin-bottom:1rem}.unlock-unit{border:1px solid var(--line);border-radius:.8rem;padding:.5rem .8rem;margin-bottom:.6rem}.unit-row small{color:var(--muted);font-size:.75rem}.level-row{padding-left:1.6rem}.level-row.not-ready{color:#aab0b8;cursor:default}.level-stars{margin-left:auto;font-size:.85rem;color:var(--muted)}.level-stars.done{color:#b7791f;font-weight:700}.copy-row{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}@media (max-width: 720px){.teacher-layout{grid-template-columns:1fr}}.login{max-width:480px}.login-bird{font-size:4rem;line-height:1}.login form{display:flex;flex-direction:column;align-items:center;gap:1rem;margin:1.2rem 0 .6rem}.code-input{width:100%;max-width:340px;padding:.4rem .6rem;border-radius:1rem;border:4px solid var(--primary);background:#fff;text-align:center;font-family:Avenir Next,Nunito,ui-monospace,monospace;font-size:2.4rem;font-weight:700;letter-spacing:.35em;text-indent:.35em;color:var(--ink)}.code-input:focus{outline:none;box-shadow:0 0 0 5px color-mix(in srgb,var(--primary) 30%,transparent)}.big-pill:disabled{opacity:.4}.teacher-login{max-width:420px}.teacher-login form,.teacher-login label{display:flex;flex-direction:column;gap:.5rem}.teacher-login form{margin:1rem 0}.teacher-login label{gap:.2rem;font-size:.85rem;color:var(--muted)}.teacher input[type=password]{font:inherit;padding:.5rem .6rem;border-radius:.5rem;border:1px solid var(--line)}.login-card{display:flex;gap:1rem;align-items:flex-start;flex-wrap:wrap;margin-top:1rem;padding:.9rem;border-radius:.9rem;background:#f7f9fc;border:1px solid var(--line)}.login-card img{border-radius:.5rem;background:#fff}.login-info{flex:1;min-width:220px}.login-info h3{margin:0 0 .3rem;font-size:.95rem}.login-info p{margin:.3rem 0}.login-info .code{font-family:ui-monospace,monospace;font-size:1.3rem;letter-spacing:.15em;padding:.1rem .5rem;border-radius:.4rem;background:#fff;border:1px solid var(--line)}.link-text{font-size:.8rem;color:var(--muted);word-break:break-all}.row.left{justify-content:flex-start;margin-top:.4rem}.unlock-table{width:100%;border-collapse:collapse;margin-bottom:.8rem;border:1px solid var(--line);border-radius:.8rem;overflow:hidden}.unlock-table th,.unlock-table td{padding:.45rem .6rem;text-align:left;border-bottom:1px solid var(--line)}.unlock-table thead{background:#f7f9fc}.unlock-table .check-col{width:2rem}.unlock-table .score-col{text-align:right;white-space:nowrap;color:var(--muted);font-size:.85rem}.unlock-table .score-col.done{color:#b7791f;font-weight:700}.unlock-table tr.not-ready td{color:#aab0b8}.big-card.listening{border-color:var(--red);background:#fff5f5;animation:listen-ring 1.2s ease-out infinite}@keyframes listen-ring{0%{box-shadow:0 0 #e255558c,0 6px #f3b4b4}to{box-shadow:0 0 0 26px #e2555500,0 6px #f3b4b4}}.mic-badge{position:absolute;top:-1.1rem;right:-1.1rem;width:2.8rem;height:2.8rem;border-radius:50%;background:var(--red);color:#fff;font-size:1.4rem;display:flex;align-items:center;justify-content:center;box-shadow:0 3px #a83232;animation:mic-bounce .6s ease-in-out infinite alternate}@keyframes mic-bounce{to{transform:scale(1.18) rotate(-8deg)}}.status.listen{min-height:4.2rem;padding:.5rem 1.6rem .7rem;background:var(--red);color:#fff;box-shadow:0 0 0 4px #ffb3b3}.status.listen .read-text{font-size:1.7rem}.status.listen .read-text small{color:#ffffffe6}.status.listen .bar{background:#fffc}.mic-ripple{position:relative;width:3rem;height:3rem;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center}.mic-ripple .status-icon{font-size:1.7rem;animation:none}.mic-ripple:before,.mic-ripple:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:3px solid #fff;animation:ripple 1.4s ease-out infinite}.mic-ripple:after{animation-delay:.7s}@keyframes ripple{0%{transform:scale(1);opacity:.9}to{transform:scale(2);opacity:0}}.eq{display:flex;align-items:center;gap:4px;height:2rem}.eq i{width:6px;height:100%;border-radius:3px;background:#fff;animation:eq .6s ease-in-out infinite alternate}@keyframes eq{0%{transform:scaleY(.25)}to{transform:scaleY(1)}}[data-audience=adult] .status.listen .read-text{font-size:1.3rem}.choice.text{font-size:1.6rem;min-width:5rem;min-height:4rem;padding:.4rem 1.1rem;font-family:var(--kai)}.quiz-show{margin:.2rem 0 1rem;display:flex;align-items:center;justify-content:center;gap:.6rem;animation:card-in .35s ease-out}.quiz-show.hanzi{font-family:var(--kai);font-size:4rem}.quiz-show.pinyin{font-family:Avenir Next,Nunito,system-ui,sans-serif;font-size:3rem;font-weight:600;color:var(--blue)}.quiz-show.text{font-family:var(--fun);font-size:1.6rem}.passage{text-align:left;max-width:560px;margin:0 auto 1rem;padding:.6rem .9rem;border-radius:1rem;background:var(--soft)}.passage p{font-family:var(--kai);font-size:1.35rem;margin:.35rem 0;display:flex;align-items:center;gap:.5rem}.glyph-wrap{display:flex;justify-content:center;margin-bottom:1rem;animation:card-in .35s ease-out}.glyph{max-width:60vw;height:auto}.wrong-sentence{position:relative;display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:.3rem;width:fit-content;max-width:100%;margin:.4rem auto 2.4rem;padding:.8rem;border-radius:1.4rem}.char-tile{min-width:3.4rem;min-height:3.8rem;padding:0 .2rem;border-radius:.8rem;background:#fff;border:3px solid var(--line);box-shadow:0 4px 0 var(--line);font-family:var(--kai);font-size:2.3rem}.char-tile.fixed{border-color:var(--green);background:var(--green-bg);color:var(--green);animation:pop .4s}.char-tile s{color:var(--red);font-size:1.2rem;margin-right:.15rem}.punct{font-family:var(--kai);font-size:2.3rem}.built{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.2rem;min-height:4rem;margin:.2rem auto 1rem;padding:.5rem 1rem;max-width:600px;border-radius:1rem;border:3px dashed var(--line);font-family:var(--kai);font-size:2rem}.built.done{border-style:solid;border-color:var(--green);background:var(--green-bg)}.built-word{animation:pop .3s}.built-slot{width:2.4rem;border-bottom:4px solid var(--theme);height:1.6rem;animation:pulse 1.2s infinite}.word-cards{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem;width:fit-content;max-width:100%;margin:0 auto 2.2rem;padding:.8rem;border-radius:1.4rem}@media (max-width: 520px){.char-tile,.punct{font-size:1.8rem}.char-tile{min-width:2.7rem;min-height:3.2rem}.quiz-show.hanzi{font-size:3.2rem}}.stepper{flex-wrap:wrap}.game-body{position:relative}.countdown-layer{position:absolute;top:-.4rem;right:-.4rem;bottom:-.8rem;left:-.4rem;min-height:12rem;z-index:3;display:flex;align-items:flex-start;padding-top:1.2rem;justify-content:center;border-radius:1.4rem;background:#ffffffd9;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);cursor:pointer}.cd-num{font-family:var(--fun);font-size:9rem;line-height:1;color:var(--theme);text-shadow:0 8px 0 color-mix(in srgb,var(--theme) 30%,transparent);animation:count-pop .8s ease-out both}.cd-num.go{font-size:5rem;color:var(--green);animation-duration:.55s}@keyframes count-pop{0%{transform:scale(.3);opacity:0}35%{transform:scale(1.15);opacity:1}to{transform:scale(.95);opacity:.85}}[data-audience=adult] .countdown-layer{border-radius:.8rem}[data-audience=adult] .cd-num{font-size:6rem;text-shadow:none}.mascot.listening .body{animation:listen-tilt 1.6s ease-in-out infinite}@keyframes listen-tilt{0%,to{transform:rotate(8deg)}50%{transform:rotate(13deg) translateY(-2px)}}.mascot .waves path{animation:wave 1.2s ease-out infinite}.mascot .waves path:nth-child(2){animation-delay:.2s}.mascot .waves path:nth-child(3){animation-delay:.4s}@keyframes wave{0%{opacity:0}30%{opacity:1}to{opacity:0}}.listen-bird{display:flex;align-items:center;justify-content:center;width:5.6rem;height:5.6rem;margin:-.8rem 0;border-radius:50%;background:#fff;box-shadow:0 0 0 4px #ffd6d6}.listen-bird .mascot{transform:translate(-11px)}.status.listen{overflow:visible}.mic-notice{max-width:520px;margin:.4rem auto 0;padding:.6rem .9rem;border-radius:.9rem;background:#fff4e6;color:#9a5b13;font-size:.95rem;display:flex;flex-direction:column;align-items:center;gap:.35rem}.mic-notice small{color:var(--muted);font-size:.8rem}.save-error{flex-basis:100%;padding:.4rem .8rem;border-radius:.6rem;background:var(--red-bg);color:var(--red);font-size:.9rem}.teacher input[type=email]{font:inherit;padding:.5rem .6rem;border-radius:.5rem;border:1px solid var(--line)}