:root{color-scheme:light dark;--bg: #fbf3ea;--bg2: #f4e7da;--card: #fffdfa;--ink: #2b2420;--mut: #7b6e65;--bd: #eadccd;--acc: #e0563b;--acc-ink: #fff;--good: #2f9e6e;--bad: #d1453b;--warn: #c98a12;--ring: #e0563b55;--bubble: #fffdfa;--shadow: 0 10px 30px rgba(80, 50, 30, .1);--hz: "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Noto Sans CJK SC", "Source Han Sans SC", "Microsoft YaHei", sans-serif;--ui: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--glass: rgba(255, 252, 247, .93);--glass-bd: rgba(120, 90, 60, .16);--sky1: #ffe9d2;--sky2: #fbf3ea;--dock-h: 0px}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #1b1715;--bg2: #241e1b;--card: #2a2320;--ink: #f4ece4;--mut: #b4a69b;--bd: #3e3430;--bubble: #2c2522;--shadow: 0 10px 30px rgba(0, 0, 0, .35);--ring: #e0563b66;--glass: rgba(34, 28, 26, .92);--glass-bd: rgba(255, 240, 225, .12);--sky1: #3a2f2a;--sky2: #1b1715}}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 var(--ui);-webkit-tap-highlight-color:transparent}body{min-height:100dvh;overflow-x:hidden}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}[hidden]{display:none!important}.boot{text-align:center;padding:40vh 16px;color:var(--mut)}.muted{color:var(--mut)}.small{font-size:14px}.tiny{font-size:12px}.center{text-align:center;justify-content:center}.row{display:flex;gap:8px;align-items:center}.row.wrap{flex-wrap:wrap}hr{border:0;border-top:1px solid var(--bd);margin:16px 0}.status{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--mut);min-height:22px;margin:0}.status .dot{width:9px;height:9px;border-radius:50%;background:var(--bd);flex:none}.status-speak .status .dot,.status.status-speak .dot{background:var(--acc);animation:pulse 1s infinite}.status-shadow .status,.status.status-shadow{color:var(--good);font-weight:600}.status-shadow .status .dot,.status.status-shadow .dot{background:var(--good);animation:pulse .8s infinite}.status-bad .status,.status.status-bad{color:var(--bad)}@keyframes pulse{50%{transform:scale(1.5);opacity:.6}}.countdown{margin-left:auto;width:60px;height:4px;border-radius:2px;background:var(--good);transform-origin:left;animation:shrink linear forwards}@keyframes shrink{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.hanzi{font-family:var(--hz);font-weight:500;line-height:1.25;margin:6px 0 2px;text-align:center;overflow-wrap:anywhere;word-break:break-all;letter-spacing:.02em}.hz-g{white-space:nowrap;display:inline-block}.hz--on{color:var(--acc)}.hz--dim{opacity:.38}.hz{font:inherit;border:0;background:none;padding:0 .02em;border-radius:8px;line-height:inherit}.hz:hover,.hz:focus-visible{background:#e0563b1f;outline:none}.punct{opacity:.75}.hanzi--hidden{font-size:64px;color:var(--mut)}.pinyin{text-align:center;color:var(--acc);font-size:19px;margin:0}.meaning{text-align:center;font-size:18px;margin:4px 0 0}.meaning--prompt{font-size:22px;font-weight:600;margin:10px 0}.vocab{margin-top:10px;border-top:1px dashed var(--bd);padding-top:8px;font-size:15px}.vocab-item b{font-family:var(--hz);font-size:18px}.vocab-item i{color:var(--acc);font-style:normal}.note-line{margin:6px 0 0;color:var(--mut);font-size:14px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:8px 14px;border-radius:12px;border:1px solid var(--bd);background:var(--card);font-weight:600;text-decoration:none;color:var(--ink)}.btn:disabled{opacity:.5;cursor:default}.btn--primary{background:var(--acc);color:var(--acc-ink);border-color:transparent}.btn--good{background:var(--good);color:#fff;border-color:transparent}.btn--bad{background:var(--bad);color:#fff;border-color:transparent}.btn--big{min-height:54px;font-size:17px;flex:1}.btn.on{border-color:var(--acc)}.link{border:0;background:none;color:var(--mut);text-decoration:underline;text-underline-offset:3px;padding:8px 4px;font-size:14px}.chip{min-height:34px;padding:4px 12px;border-radius:999px;border:1px solid var(--bd);background:var(--card);font-size:14px}.chip.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}.chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px}.hz-chip{font-family:var(--hz);font-size:20px;min-width:44px}.seg{display:flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:14px;background:var(--bg2)}.seg button{flex:1 1 auto;min-height:40px;padding:6px 10px;border:0;border-radius:10px;background:transparent;font-size:14px;font-weight:600;color:var(--mut)}.seg button.on{background:var(--card);color:var(--ink);box-shadow:0 1px 4px #00000014}.seg--sm button{min-height:36px;padding:4px 8px;font-size:13px}.seg button.on.lv-chua{color:var(--bad)}.seg button.on.lv-dang{color:var(--warn)}.seg button.on.lv-da{color:var(--good)}.toggle{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--bd);background:var(--card);border-radius:999px;padding:6px 12px 6px 6px;min-height:40px;font-size:14px}.toggle-dot{width:34px;height:20px;border-radius:10px;background:var(--bd);position:relative;transition:background .2s}.toggle-dot:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .2s}.toggle.on .toggle-dot{background:var(--good)}.toggle.on .toggle-dot:after{transform:translate(14px)}.fav{width:48px;height:48px;flex:none;border-radius:14px;border:1px solid var(--bd);background:var(--card);font-size:22px;color:var(--mut)}.fav.on{color:#e8a800}.controls{display:flex;justify-content:center;align-items:center;gap:10px}.ctl{width:54px;height:54px;border-radius:50%;border:1px solid var(--bd);background:var(--card);font-size:19px;display:grid;place-items:center;font-family:var(--hz)}.ctl--main{width:74px;height:74px;background:var(--acc);color:#fff;border:0;font-size:26px;box-shadow:0 8px 22px #e0563b55}.ctl--huge{width:112px;height:112px;font-size:38px}.card{background:var(--card);border:1px solid var(--bd);border-radius:18px;padding:16px;box-shadow:var(--shadow)}.card h2{margin:0 0 4px;font-size:20px}.card p{margin:4px 0 10px}.done-card{border-color:var(--good)}.field{display:grid;gap:6px;margin:12px 0}.field>label{font-weight:600;font-size:14px}.input,select,textarea.json{width:100%;min-height:44px;padding:8px 12px;border-radius:12px;border:1px solid var(--bd);background:var(--bg)}.field .row select{flex:1;min-width:0}textarea.json{min-height:120px;font:13px/1.4 ui-monospace,Menlo,monospace;margin:8px 0}.msg{margin:6px 0;font-size:14px}.msg.bad{color:var(--bad)}.rate-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px}.rate-row>span{min-width:92px;color:var(--mut)}.help{font-size:14px;background:var(--bg2);border-radius:12px;padding:8px 12px;margin:8px 0}.help summary{font-weight:600;cursor:pointer}.help ul{padding-left:18px}.notes{display:grid;gap:6px;margin-top:8px}.note{display:flex;gap:8px;align-items:flex-start;padding:8px 8px 8px 12px;border-radius:12px;font-size:14px;border:1px solid var(--bd);background:var(--card)}.note span{flex:1;padding-top:6px}.note .icon-btn{width:32px;height:32px;font-size:13px}.note--bad{border-color:var(--bad)}.note--warn{border-color:var(--warn)}.steps{display:flex;gap:6px;font-size:13px;color:var(--mut);justify-content:center;flex-wrap:wrap}.steps span{padding:4px 10px;border-radius:999px;background:var(--bg2)}.steps .on{background:var(--ink);color:var(--bg)}.steps .done{color:var(--good)}.onboard-nav{display:flex;justify-content:space-between;gap:10px}.skin-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.skin-card{text-align:left;padding:10px;border-radius:14px;border:2px solid var(--bd);background:var(--card);display:grid;gap:2px}.skin-card small{color:var(--mut);font-size:12px;line-height:1.3}.skin-card.on{border-color:var(--acc)}.swatches{display:flex;gap:8px;flex-wrap:wrap}.swatch{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:4px 12px 4px 6px;border-radius:999px;border:2px solid var(--bd);background:var(--card);font-size:14px}.swatch span{width:24px;height:24px;border-radius:50%;border:1px solid #0002}.swatch.on{border-color:var(--acc)}@media(max-width:420px){.skin-card small{display:none}}.lesson-grid{list-style:none;padding:0;margin:0;display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}.lesson{width:100%;display:flex;gap:10px;align-items:center;text-align:left;padding:10px;border-radius:14px;border:2px solid var(--bd);background:var(--card)}.lesson:disabled{opacity:.55;cursor:default}.lesson.on{border-color:var(--acc)}.lesson-n{font-weight:800;font-size:18px;width:34px;text-align:center;color:var(--acc)}.lesson-t{display:grid}.lesson-t small{color:var(--mut);font-size:13px}.sheet-backdrop{position:fixed;inset:0;background:#140c0861;z-index:50;display:flex;align-items:flex-end;justify-content:center}.sheet{width:100%;max-width:560px;max-height:88dvh;display:flex;flex-direction:column;background:var(--card);border-radius:22px 22px 0 0;box-shadow:0 -10px 40px #0003;animation:up .2s ease-out}.sheet--wide{max-width:720px}@media(min-width:720px){.sheet-backdrop{align-items:center}.sheet{border-radius:22px}}@keyframes up{0%{transform:translateY(30px);opacity:0}}.sheet-head{display:flex;align-items:center;gap:8px;padding:12px 12px 8px 18px;border-bottom:1px solid var(--bd)}.sheet-head h2{flex:1;margin:0;font-size:18px}.sheet-body{overflow:auto;padding:12px 18px calc(18px + env(safe-area-inset-bottom));overscroll-behavior:contain}.goals{margin:0 0 8px;padding-left:18px;color:var(--mut);font-size:14px}.list-cluster h3{font-size:15px;margin:14px 0 6px}.list-cluster ol{list-style:none;padding:0;margin:0;display:grid;gap:4px}.list-item{width:100%;display:flex;gap:10px;align-items:center;text-align:left;border:1px solid transparent;background:var(--bg);border-radius:12px;padding:8px 10px}.list-item.on{border-color:var(--acc)}.list-item .no{font:12px ui-monospace,monospace;color:var(--mut)}.list-item .txt{flex:1;display:grid;min-width:0}.list-item .txt b{font-family:var(--hz);font-weight:500;font-size:18px}.list-item .txt small{color:var(--mut);font-size:13px}.marks{display:flex;gap:4px;align-items:center;color:#e8a800}.marks i{font-style:normal;font-size:11px;padding:2px 6px;border-radius:999px;background:var(--bg2);color:var(--mut)}.marks .lv-chua{color:var(--bad)}.marks .lv-dang{color:var(--warn)}.marks .lv-da{color:var(--good)}.marks .due{color:#3f8fd6}.pattern{font-size:15px}.pattern b{font-family:var(--hz);font-size:18px}.pattern i{color:var(--acc);font-style:normal}.stroke-head{display:flex;gap:14px;align-items:center}.stroke-head p{margin:2px 0}.stroke-big{font:500 64px/1 var(--hz)}.stroke-box{position:relative;margin:12px auto;color:#d8c2b0;background:#fffaf3;border-radius:8px}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .stroke-box{background:#f3ebe0}}.mi-grid,.stroke-box svg.hw,.step-view,.free-canvas,.stroke-sample,.stroke-fallback{position:absolute;inset:0;width:100%;height:100%}.stroke-sample,.stroke-fallback{display:grid;place-items:center;font-family:var(--hz);line-height:1;color:#2b242026;pointer-events:none}.stroke-fallback{color:#2b2420}.free-canvas{touch-action:none;cursor:crosshair}.stroke-box svg.hw{touch-action:none}.grade{display:flex;gap:10px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.grow{flex:1}.world{position:fixed;inset:0;overflow:hidden;background:radial-gradient(130% 80% at 50% 12%,var(--sky1) 0%,var(--sky2) 72%)}.stage{position:absolute;inset:0;z-index:0}.stage-canvas{width:100%;height:100%;display:block;touch-action:manipulation}.stage--static{display:block}.stage-fallback{position:absolute;left:0;right:0;top:60px;bottom:var(--frame-b, var(--dock-h));display:grid;place-content:center;justify-items:center;gap:4px;color:var(--mut);font-size:12px}.agent-static{border:0;background:none;padding:0}.agent-static svg{max-height:max(90px,calc(100dvh - var(--frame-b, var(--dock-h)) - 110px));width:auto}.stage-loading{opacity:.9}.stage-loading .agent-static{animation:hintin .5s ease-out both}.hud{position:absolute;inset:0;z-index:2;pointer-events:none}.hud .notes,.hud .dock,.hud .bsheet{pointer-events:auto}.top-title{position:absolute;top:calc(8px + env(safe-area-inset-top));left:50%;transform:translate(-50%);max-width:calc(100% - 32px);transition:opacity .2s;padding:6px 14px;border-radius:16px;background:var(--glass);border:1px solid var(--glass-bd);text-align:center;line-height:1.25;display:grid;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.top-title b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-title small{color:var(--mut);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-title .steps{flex-wrap:nowrap}.top-title .steps span{padding:2px 8px;font-size:12px;white-space:nowrap}.hud .notes{position:absolute;top:calc(64px + env(safe-area-inset-top));left:12px;right:12px;max-width:640px;margin:0 auto;z-index:3}.note{background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.dock{position:absolute;left:0;right:0;bottom:0;margin:0 auto;width:100%;max-width:780px;display:flex;flex-direction:column;gap:10px;padding:0 12px calc(12px + env(safe-area-inset-bottom));max-height:calc(100dvh - 120px - env(safe-area-inset-top));animation:rise .25s ease-out}.dock--hub{max-width:600px}@keyframes rise{0%{transform:translateY(16px);opacity:0}}.panel,.npc-say,.dock-scroll,.dock--onboard .onboard-nav{background:var(--glass);border:1px solid var(--glass-bd);border-radius:22px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px) saturate(1.15);backdrop-filter:blur(14px) saturate(1.15)}.panel{padding:12px 16px;overflow:auto;min-height:0;flex:0 1 auto}.npc-say{padding:12px 14px;overflow:auto;min-height:0}.npc-name{display:inline-block;font-size:13px;font-weight:800;color:var(--acc);letter-spacing:.02em;margin-bottom:2px}.npc-text{margin:0;font-size:17px;line-height:1.45;cursor:default}.npc-text .ghost{visibility:hidden}.npc-small{margin:8px 0 0;font-size:13px;color:var(--mut)}.choices{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:10px}.choice{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:5px 14px 5px 5px;border-radius:999px;border:1px solid var(--bd);background:var(--card);color:var(--ink);font-size:15px}.choice:hover:not(:disabled){border-color:var(--acc)}.choice:disabled{opacity:.5}.choice-ico{width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--bg2);font-size:15px}.choice--primary{border-color:var(--acc)}.choice--primary .choice-ico{background:var(--acc);color:#fff}.dock-scroll{padding:10px 14px;overflow:auto;min-height:0;flex:0 1 auto;max-height:50dvh}.dock--onboard .onboard-nav{padding:8px;display:flex;justify-content:space-between}.dock--onboard .link{align-self:center;pointer-events:auto}.dock--wardrobe .dock-scroll{max-height:44dvh}.panel .status{margin-bottom:2px}.panel-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:8px}.panel-tools .fav{width:40px;height:40px;font-size:19px;border-radius:12px}.panel .vocab{max-height:30dvh;overflow:auto}.controls{background:var(--glass);border:1px solid var(--glass-bd);border-radius:999px;padding:6px;align-self:center;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.controls .ctl{width:50px;height:50px}.controls .ctl--main{width:64px;height:64px}.ask{margin:0 0 4px;font-size:16px}.ask .npc-name{margin-right:8px}.grade{justify-content:center}.grade .btn--big{max-width:260px}.level-ask{margin-top:10px;font-size:14px}.level-ask summary{cursor:pointer;font-weight:600}.level-list{list-style:none;padding:0;margin:8px 0;display:grid;gap:6px}.level-list li{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;padding:8px 10px;border-radius:12px;background:var(--bg)}.level-list .txt{flex:1 1 200px;display:grid;min-width:0}.level-list .txt b{font:500 18px var(--hz)}.level-list .txt small{color:var(--mut);font-size:13px}.level-list .seg{flex:0 1 auto}.review-picks{margin-top:10px}.stats{display:flex;flex-wrap:wrap;justify-content:space-around;gap:8px;font-size:13px;color:var(--mut);text-align:center;margin-bottom:8px}.stats b{display:block;font-size:20px;color:var(--ink)}.route-listen{--card: #1f1a18;--bd: #382e2a;--mut: #a39588;--ink: #efe6dc;--bg: #120f0e;--bg2: #241d1a;--glass: rgba(20, 16, 15, .86);--glass-bd: rgba(255, 240, 225, .1);color:var(--ink)}.scene{transition:filter .6s ease}.route-listen .scene{filter:brightness(.42) saturate(.75)}.dock--listen{max-width:640px}.listen-now{text-align:center;background:var(--glass);border:1px solid var(--glass-bd);border-radius:22px;padding:14px}.listen-now .status{justify-content:center;margin-top:10px}.hanzi--listen{font-size:clamp(34px,11vw,64px)}.controls--listen{gap:14px}.controls--listen .ctl:not(.ctl--main){width:56px;height:56px}.controls--listen .ctl--huge{width:96px;height:96px;font-size:34px}.warn-drive{color:var(--warn);margin:0}.dock--listen .muted.tiny{margin:0}.book{width:min(1040px,100%);height:min(92dvh,780px);display:flex;flex-direction:column;background:#fbf6ee;color:#2b2420;border-radius:18px 18px 0 0;box-shadow:0 20px 60px #00000059;animation:up .22s ease-out;overflow:hidden;--card: #fffdf8;--bg: #f5ede2;--bg2: #efe4d6;--bd: #e4d5c3;--mut: #7b6e65;--ink: #2b2420}@media(min-width:720px){.book{border-radius:18px;border:10px solid #8b5e3c}}.book-head{display:flex;align-items:center;gap:8px;padding:10px 12px 8px 18px;border-bottom:1px solid var(--bd)}.book-head h2{flex:1;margin:0;font-size:18px}.book-pages{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1.25fr}.page{overflow:auto;padding:14px 18px 24px;overscroll-behavior:contain}.page--toc{background:linear-gradient(to left,rgba(90,60,30,.1),transparent 28px)}.page--detail{background:linear-gradient(to right,rgba(90,60,30,.12),transparent 28px)}.page-cap{margin:0 0 6px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}.page-empty{margin-top:30%;text-align:center}.page .lesson-grid{grid-template-columns:1fr;gap:6px}.lesson{position:relative;overflow:hidden}.lesson-bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--bg2)}.lesson-bar i{display:block;height:100%;background:var(--good)}.lesson-title{font-size:22px;margin:0 0 6px}.cluster-head{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;border:0;border-bottom:1px dashed var(--bd);background:none;padding:10px 2px;color:var(--ink)}.cluster-head span:first-child{display:grid}.cluster-head small{color:var(--mut);font-weight:400;font-size:13px}.list-cluster h4{margin:16px 0 6px}.book-fav{margin-top:10px;width:100%}.m-only{display:none}@media(max-width:759px){.book-pages{grid-template-columns:1fr}.book:not(.book--open) .page--detail,.book--open .page--toc{display:none}.page--detail,.page--toc{background:none}.m-only{display:grid}}.sheet.board{border:8px solid #9a6b47;background:#fbf6ee;color:#2b2420;--card: #fffdf8;--bd: #e4d5c3;--mut: #7b6e65;--ink: #2b2420;--bg: #f5ede2;--bg2: #efe4d6}.sheet.board .sheet-head{border-bottom-color:#e4d5c3}@media(max-width:719px){.sheet.board{border-width:6px 6px 0}}@media(max-height:520px){.dock{max-height:calc(100dvh - 70px)}.npc-text{font-size:15px}.choice{min-height:46px}.controls .ctl{width:42px;height:42px}.controls .ctl--main{width:52px;height:52px}}.skin-strip{display:grid;grid-auto-flow:column;grid-auto-columns:76px;gap:6px;overflow-x:auto;padding:2px 2px 8px;scroll-snap-type:x proximity}.skin-strip .skin-card{scroll-snap-align:start;display:grid;justify-items:center;gap:0;padding:6px 4px;text-align:center;border-width:2px}.skin-emoji{font-size:28px;line-height:1.2}.skin-strip .skin-card b{font-size:13px}.skin-strip .skin-card small{display:block!important;font-size:11px}.skin-blurb{margin:2px 0 0}.swatches--dots{margin-top:8px;gap:10px}.dot-swatch{width:34px;height:34px;border-radius:50%;border:3px solid var(--card);box-shadow:0 0 0 1px var(--bd);padding:0}.dot-swatch.on{box-shadow:0 0 0 2px var(--acc)}.scene{position:absolute;inset:0;z-index:0;pointer-events:none}.scene-art,.scene-layer,.scene-fx{position:absolute;inset:0;width:100%;height:100%}.scene-layer svg{width:100%;height:100%;display:block}.scene-layer{animation:scenein 1.2s ease-out}@keyframes scenein{0%{opacity:0}}.scene-halo{position:absolute;left:50%;top:calc((60px + 100dvh - var(--dock-h)) / 2);width:min(92vw,640px);aspect-ratio:1;transform:translate(-50%,-50%)}.world .stage{z-index:1}.scene-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}.scene-thumb{padding:0;border:2px solid var(--bd);border-radius:12px;overflow:hidden;background:var(--card);text-align:left}.scene-thumb.on{border-color:var(--acc);box-shadow:0 0 0 2px var(--acc)}.scene-thumb .art{display:block;aspect-ratio:16 / 10;background:var(--bg2)}.scene-thumb .art svg{width:100%;height:100%;display:block}.scene-thumb b{display:block;font-size:12px;padding:4px 6px}.range-row{display:flex;align-items:center;gap:10px}.range-row input{flex:1}.agent-hit{position:absolute;border:0;padding:0;background:transparent;border-radius:42%;pointer-events:none}.agent-hit:focus{outline:none}.agent-hit:focus-visible{outline:3px dashed var(--acc);outline-offset:4px}.arc{position:absolute;inset:0;pointer-events:none;z-index:5}.arc-item{position:absolute;transform:translate(-50%,-50%);display:grid;justify-items:center;gap:5px;width:80px;padding:0;border:0;background:none;color:var(--ink);pointer-events:auto;animation:arcin .28s cubic-bezier(.2,.9,.3,1.15) both;animation-delay:var(--d, 0ms);will-change:transform,opacity;-webkit-tap-highlight-color:transparent}.arc-ico{position:relative;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-size:23px;line-height:1;background:var(--glass);border:1px solid var(--glass-bd);box-shadow:0 8px 22px #28140a38;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:transform .15s;font-family:var(--ui)}.arc-item:active .arc-ico{transform:scale(.92)}.arc-item:hover .arc-ico,.arc-item:focus-visible .arc-ico{box-shadow:0 0 0 3px var(--acc),0 8px 22px #28140a38}.arc-item:focus{outline:none}.arc-item--primary .arc-ico{background:var(--acc);color:#fff;border-color:transparent}.arc-item--back .arc-ico{width:46px;height:46px;font-size:26px}.arc-label{font-size:12.5px;font-weight:700;line-height:1.2;padding:3px 9px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-bd);white-space:nowrap;box-shadow:0 2px 8px #28140a1f}.arc-badge{position:absolute;top:-3px;right:-5px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--bad);color:#fff;font:700 11px/20px var(--ui);font-style:normal;box-shadow:0 0 0 2px var(--card)}@keyframes arcin{0%{transform:translate(calc(-50% + var(--ox, 0px)),calc(-50% + var(--oy, 0px))) scale(.35);opacity:0}}.arc--out .arc-item{animation:arcout .16s ease-in both;animation-delay:0ms;pointer-events:none}@keyframes arcout{to{transform:translate(calc(-50% + var(--ox, 0px) * .5),calc(-50% + var(--oy, 0px) * .5)) scale(.5);opacity:0}}.arc-open .screen .dock,.arc-open .top-title{opacity:.45;pointer-events:none;transition:opacity .18s}.screen .dock{transition:opacity .18s}.tap-hint{position:absolute;transform:translate(-50%);padding:7px 14px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-bd);box-shadow:var(--shadow);font-size:14px;font-weight:700;white-space:nowrap;pointer-events:none;animation:hintin .4s ease-out both,bob 1.8s ease-in-out .4s infinite;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.tap-hint:before{content:"👆 "}.tap-hint--side{transform:none}@keyframes hintin{0%{opacity:0}}@keyframes bob{50%{translate:0 -5px}}.dock--learn .panel{cursor:pointer}.dock--learn .panel:focus{outline:none}.dock--learn .panel:focus-visible{box-shadow:0 0 0 3px var(--ring),var(--shadow)}.learn-float{position:absolute;left:0;right:0;bottom:calc(100% + 4px);display:grid;justify-items:center;gap:6px;padding:0 12px;opacity:0;transform:translateY(10px);transition:opacity .18s,transform .18s;pointer-events:none}.learn-float.on{opacity:1;transform:none}.learn-float.on>*{pointer-events:auto}.learn-tools{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;padding:4px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-bd);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.learn-tools .chip{min-height:36px}.fav-chip{font-size:17px;padding:2px 12px}.fav-chip.on{background:#fff4d0;color:#c88a00;border-color:#e8c25a}.bsheet{position:absolute;left:0;right:0;bottom:0;margin:0 auto;width:100%;max-width:720px;max-height:min(52dvh,520px);display:flex;flex-direction:column;z-index:4;background:var(--card);border:1px solid var(--glass-bd);border-bottom:0;border-radius:22px 22px 0 0;box-shadow:0 -12px 40px #28140a38;animation:up .24s ease-out;transition:transform .2s ease}.bsheet:focus{outline:none}.bsheet-grip{height:24px;flex:none;display:grid;place-items:center;touch-action:none;cursor:grab}.bsheet-grip span{width:42px;height:5px;border-radius:3px;background:var(--bd)}.bsheet-head{display:flex;align-items:center;gap:8px;padding:0 14px 6px 18px}.bsheet-head h2{flex:1;margin:0;font-size:17px}.bsheet-body{overflow:auto;min-height:0;padding:2px 16px calc(14px + env(safe-area-inset-bottom));overscroll-behavior:contain}.bsheet-body .field:first-child{margin-top:4px}.btn--sm{min-height:36px;padding:4px 14px;font-size:14px}.sheet-wardrobe .screen,.sheet-scene .screen{visibility:hidden}@media(min-width:900px){.bsheet{max-height:min(44dvh,460px)}}.ico{display:block;flex:none}.ctl-sep{width:1px;align-self:stretch;margin:8px 2px;background:var(--glass-bd)}.controls .ctl--tool{width:42px;height:42px;color:var(--mut)}.controls .ctl--tool.on{color:var(--acc);border-color:var(--acc)}.controls .ctl--tool[aria-label="Yêu thích"].on{color:#d99a00;border-color:#e8c25a;background:#fff8dc}@media(max-width:400px){.controls{gap:6px}.controls .ctl{width:42px;height:42px}.controls .ctl--main{width:54px;height:54px}.controls .ctl--tool{width:38px;height:38px}}.panel-measure{position:absolute;left:12px;right:12px;bottom:0;visibility:hidden;pointer-events:none;display:grid}.panel-measure>*{grid-area:1 / 1}.panel--fixed,.listen-now--fixed{display:flex;flex-direction:column;justify-content:center}.panel--fixed .status{align-self:stretch}.status-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.panel--fixed .status{flex-wrap:nowrap}.bubble{position:absolute;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:calc(10px + env(safe-area-inset-bottom));max-width:520px;margin:0 auto;max-height:calc(var(--frame-b, 180px) - 14px);overflow-y:auto;padding:10px 12px;border-radius:18px;background:var(--glass);border:1px solid var(--glass-bd);box-shadow:var(--shadow);pointer-events:auto;animation:hintin .25s ease-out both;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.bubble p{margin:0;font-size:15px;line-height:1.35;text-wrap:pretty}.bubble .chips{margin-top:8px}.chip--primary{background:var(--acc);color:var(--acc-ink);border-color:transparent;font-weight:700}.chip--ghost{background:transparent;color:var(--mut)}.bubble .chip{min-height:38px}@media(prefers-reduced-motion:reduce){.bubble{animation:none}}.off-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:2px;max-height:300px;overflow-y:auto}.off-list li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 2px;border-bottom:1px solid var(--bd);font-size:14px}.off-list li>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.off-prog{font-variant-numeric:tabular-nums;color:var(--mut);font-size:13px}.steps-list{margin:6px 0;padding-left:20px;display:grid;gap:4px}