.mascot{display:block;overflow:visible}.mascot .body{animation:3.2s ease-in-out infinite zm-float;animation-delay:var(--d,0s)}@keyframes zm-float{50%{transform:translateY(-2px)}}.mascot .act{transform-box:fill-box;transform-origin:50% 100%}.mascot .eye{transform-box:view-box;animation:4.4s infinite zm-blink;animation-delay:var(--b,0s)}@keyframes zm-blink{0%,95%,to{transform:scaleY(1)}97%{transform:scaleY(.08)}}.mascot .pupil{transition:transform .14s ease-out}.mascot .torso,.mascot .leg,.mascot .brow,.mascot .blush,.mascot .lid-happy{transform-box:view-box}.mascot .tail{animation:2.4s ease-in-out infinite zm-swish}.mascot .tail.wag{animation:.45s ease-in-out infinite zm-wag}@keyframes zm-swish{50%{transform:rotate(9deg)}}@keyframes zm-wag{50%{transform:rotate(-14deg)}}.mascot .ear-l{animation:5s ease-in-out infinite zm-twitch;animation-delay:var(--e,0s)}@keyframes zm-twitch{0%,88%,to{transform:rotate(0)}92%{transform:rotate(-9deg)}96%{transform:rotate(3deg)}}.mascot .antenna{animation:1.8s ease-in-out infinite zm-wobble}@keyframes zm-wobble{50%{transform:rotate(9deg)}}.mascot .wave{animation:3.6s ease-in-out infinite zm-wave;animation-delay:var(--e,0s)}@keyframes zm-wave{0%,55%,to{transform:rotate(0)}64%{transform:rotate(-16deg)}72%{transform:rotate(6deg)}80%{transform:rotate(-14deg)}88%{transform:rotate(2deg)}}.mascot .mane{animation:2.6s ease-in-out infinite zm-sway}@keyframes zm-sway{50%{transform:rotate(3deg)}}.mascot .spin{animation:7s linear infinite zm-spin}@keyframes zm-spin{to{transform:rotate(360deg)}}.mascot .spin-soft{animation:3.2s ease-in-out infinite zm-rock}@keyframes zm-rock{50%{transform:rotate(5deg)}}.mascot .squish{animation:2.2s ease-in-out infinite zm-squish}@keyframes zm-squish{50%{transform:scale(1.04,.96)}}@media (prefers-reduced-motion:reduce){.mascot .body,.mascot .tail,.mascot .ear-l,.mascot .antenna,.mascot .wave,.mascot .mane,.mascot .spin,.mascot .spin-soft,.mascot .squish{animation:none}}:root[data-reduced=true] .mascot .body,:root[data-reduced=true] .mascot .tail,:root[data-reduced=true] .mascot .ear-l,:root[data-reduced=true] .mascot .antenna,:root[data-reduced=true] .mascot .wave,:root[data-reduced=true] .mascot .mane,:root[data-reduced=true] .mascot .spin,:root[data-reduced=true] .mascot .spin-soft,:root[data-reduced=true] .mascot .squish{animation:none}@font-face{font-family:Manrope;font-style:normal;font-weight:200 800;font-display:swap;src:url(./manrope-cyrillic-DJ9PYDpy.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Manrope;font-style:normal;font-weight:200 800;font-display:swap;src:url(./manrope-latin-C46ZzDBF.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--c-indigo-300:#9aa4ff;--c-indigo-500:#4b5cf6;--c-indigo-600:#3f4fe4;--c-indigo-700:#3340c9;--c-graphite-900:#1f2235;--c-graphite-600:#5b5f78;--c-graphite-400:#8085a3;--c-lime-50:#f4fde3;--c-lime-400:#c5f36b;--c-lime-500:#b2e055;--c-lime-600:#8dba2e;--c-coral-50:#fff1f1;--c-coral-400:#ff7a7a;--c-orange-200:#ffd2b0;--c-lavender-50:#f3f4ff;--c-lavender-100:#e6e8ff;--c-lavender-200:#d6daff;--c-cream-50:#f7f6f0;--c-sun-400:#ffc94a;--c-sun-600:#e9a92b;--c-white:#fff;--scrim:#1f223566;--shadow-float:0 8px 24px #1f223524;--shadow-dialog:0 30px 80px #1f22354d;--fs-12:12px;--fs-14:14px;--fs-16:16px;--fs-18:18px;--fs-20:20px;--fs-24:24px;--fs-28:28px;--fs-32:32px;--fs-40:40px;--fs-48:48px;--fs-64:64px;--fs-88:88px;--ease-out:cubic-bezier(.22, 1, .36, 1);--ease-spring:cubic-bezier(.3, 1.55, .55, 1);--r-btn:16px;--r-card:22px;--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--gutter:16px;--fs-instruction:20px;--hud-btn:44px;--speaker:48px;--mascot-base:96px;--lesson-mascot:var(--mascot-base);--stage-max:640px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}html,body{background:var(--c-cream-50);color:var(--c-graphite-900);overscroll-behavior:none;margin:0;font-family:Manrope,system-ui,-apple-system,Segoe UI,sans-serif;font-weight:500}body{overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}.app{width:100%;height:var(--app-h,100dvh);background:var(--c-cream-50);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.fx-layer{pointer-events:none;z-index:900;width:100%;height:100%;position:fixed;inset:0}.btn3d,.choice-card,.key,.icon-btn{--depth:5px;--radius:var(--r-btn);--face:var(--c-white);--face-down:var(--c-lavender-50);--edge:var(--c-lavender-200);border-radius:var(--radius);background-color:var(--face);box-shadow:0 var(--depth) 0 var(--edge);transition:translate .22s var(--ease-spring), box-shadow .22s var(--ease-spring), background-color .12s ease, border-color .12s ease, opacity .15s ease;position:relative}:is(.btn3d,.choice-card,.key,.icon-btn):is(:active,.is-pressed):not(:disabled){translate:0 var(--depth);box-shadow:0 0 0 var(--edge);background-color:var(--face-down);transition-duration:60ms;transition-timing-function:ease-out}@media (hover:hover) and (pointer:fine){:is(.btn3d,.choice-card,.key,.icon-btn):hover:not(:disabled,:active,.is-pressed){box-shadow:0 calc(var(--depth) + 2px) 0 var(--edge);translate:0 -2px}}:is(.btn3d,.choice-card,.key,.icon-btn):disabled{cursor:default}button:focus-visible{outline:3px solid var(--c-indigo-500);outline-offset:3px}:is(.btn3d,.choice-card,.key,.icon-btn):focus-visible{outline:none}:is(.btn3d,.choice-card,.key,.icon-btn):after{content:"";inset:-6px -6px calc(-6px - var(--depth));border:3px solid var(--c-indigo-500);border-radius:calc(var(--radius) + 6px);opacity:0;pointer-events:none;position:absolute}:is(.btn3d,.choice-card,.key,.icon-btn):focus-visible:after{opacity:1}.btn3d{font-weight:800;font-size:var(--fs-18);color:var(--c-graphite-900);padding:14px 22px}.btn3d.primary{--face:var(--c-indigo-500);--face-down:var(--c-indigo-600);--edge:var(--c-indigo-700);color:var(--c-white)}.btn3d.big{width:100%;font-size:var(--fs-24);letter-spacing:.5px;padding:18px}.btn3d.wide{width:100%;margin-top:12px}.btn3d.primary.is-busy{translate:0 var(--depth);box-shadow:0 0 0 var(--edge);cursor:progress;animation:.9s ease-in-out infinite busy}@keyframes busy{50%{opacity:.72}}.icon{vertical-align:middle;flex:none;display:inline-block;overflow:visible}.icon-btn{--depth:3px;--radius:12px;width:var(--hud-btn);height:var(--hud-btn);color:var(--c-graphite-600);flex:none;place-items:center;display:grid}@media (hover:hover) and (pointer:fine){.icon-btn:hover{color:var(--c-graphite-900)}}.icon-btn .icon{width:58%;height:58%}.icon-btn:before,.speaker:before{content:"";position:absolute;inset:min(0px,50% - 24px)}.segmented{background:var(--c-lavender-100);border-radius:14px;gap:2px;padding:4px;display:inline-flex}.segmented button{min-height:48px;font-weight:700;font-size:var(--fs-16);color:var(--c-graphite-600);transition:background-color .12s ease, color .12s ease, box-shadow .15s ease, scale .2s var(--ease-spring);border-radius:11px;padding:10px 16px}.segmented button:active:not(.is-active){transition-duration:60ms;scale:.95}@media (hover:hover) and (pointer:fine){.segmented button:hover:not(.is-active){color:var(--c-graphite-900);background:#ffffff8c}}.segmented button.is-active{background:var(--c-white);color:var(--c-indigo-500);box-shadow:inset 0 0 0 2px var(--c-indigo-500), 0 2px 6px #4b5cf62e}.home{height:100%;padding:calc(24px + var(--safe-top)) calc(24px + var(--safe-right)) calc(24px + var(--safe-bottom)) calc(24px + var(--safe-left));text-align:center;flex-direction:column;justify-content:safe center;align-items:center;gap:14px;display:flex;overflow-y:auto}.home-main{display:contents}.home .hello{order:-1}.home-mascot .mascot{width:clamp(140px,26dvh,240px);height:auto}.home .btn3d.big{max-width:420px}.settings-btn{top:calc(16px + var(--safe-top));right:calc(16px + var(--safe-right));z-index:5;position:absolute}.hello{color:var(--c-graphite-600);margin:0;font-weight:700}.wordmark{font-size:var(--fs-64);letter-spacing:-3px;margin:0;font-weight:800;line-height:1}.wordmark .spark{width:.42em;height:.42em;color:var(--c-lime-600);vertical-align:top;margin:.02em 0 0 .02em}.tagline{font-size:var(--fs-16);color:var(--c-graphite-600);margin:0 0 8px;font-weight:700}.mode-desc{min-height:2.6em;font-size:var(--fs-16);color:var(--c-graphite-600);text-wrap:balance;max-width:300px;margin:0 0 10px;line-height:1.3}.proto-note{font-size:var(--fs-12);color:var(--c-graphite-600);margin:6px 0 0}.lesson{height:100%;padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);grid-template:"hud""stage"minmax(0,1fr)"mascot"/minmax(0,1fr);display:grid}.lesson-top{grid-area:hud;justify-self:center;align-items:center;gap:10px;width:100%;max-width:1180px;padding:12px 14px 6px;display:flex}.progress{flex:1;gap:4px;display:flex}.progress-seg{background:var(--c-lavender-100);border-radius:5px;flex:1;height:10px;transition:background .3s}.progress-seg.is-done{background:var(--c-lime-400)}.progress-seg.is-current{background:var(--c-indigo-300)}.combo{background:var(--c-white);color:var(--c-graphite-900);font-weight:800;font-size:var(--fs-16);box-shadow:0 3px 0 var(--c-orange-200);border-radius:999px;align-items:center;gap:2px;padding:4px 10px 4px 6px;display:flex}.hud-stars{background:var(--c-white);box-shadow:0 3px 0 var(--c-lavender-200);border-radius:999px;align-items:center;gap:4px;padding:5px 10px;font-weight:800;display:flex}.combo .icon{width:18px;height:18px}.hud-stars span:first-child{display:grid}.hud-stars .icon{width:22px;height:22px}.lesson-stage{min-height:0;padding:4px var(--gutter) 0;grid-area:stage;justify-content:center;display:flex}.lesson-mascot{min-height:calc(var(--lesson-mascot) * 1.117 + 12px);padding:4px 10px 8px var(--gutter);pointer-events:none;z-index:20;transform-origin:100% 100%;transition:opacity .2s ease 60ms, scale .26s var(--ease-spring) 60ms;grid-area:mascot;justify-content:flex-end;align-items:flex-end;gap:8px;display:flex;position:relative}.lesson[inert] .lesson-mascot{opacity:0;transition:opacity .12s,scale .16s ease-in;scale:.9}:root[data-blur=on] .lesson{transition:filter .16s ease-out}:root[data-blur=on] .lesson[inert]{filter:blur(3px)}.lesson-mascot .mascot{width:var(--lesson-mascot);flex:none;height:auto}.lesson-mascot .mascot,.home-mascot .mascot{pointer-events:auto;cursor:pointer;-webkit-tap-highlight-color:transparent}.bubble{max-width:min(300px,100%);margin-bottom:calc(var(--lesson-mascot) * .34);background:var(--c-white);box-shadow:var(--shadow-float);font-size:var(--fs-16);transform-origin:100% 100%;border-radius:16px;padding:10px 14px;font-weight:700;line-height:1.3;animation:.26s cubic-bezier(.34,1.56,.64,1) bubble-in;position:relative}.bubble:after{content:"";background:inherit;border-radius:3px;width:14px;height:14px;position:absolute;bottom:12px;right:-6px;transform:rotate(45deg)}@keyframes bubble-in{0%{opacity:0;transform:scale(.6)translateY(10px)}}.task{width:100%;max-width:var(--stage-max);flex-direction:column;height:100%;display:flex;position:relative}.task-head,.task-body{z-index:1;position:relative}.task-head{flex:none;justify-content:center;align-items:flex-start;gap:10px;margin:6px 0 14px;display:flex}.task-body{flex:1;min-height:0;container:body/size}.speaker{width:var(--speaker);height:var(--speaker);background:var(--c-lavender-100);color:var(--c-indigo-500);transition:background-color .12s ease, scale .22s var(--ease-spring);border-radius:50%;flex:none;place-items:center;display:grid;position:relative}.speaker:is(:active,.is-pressed){background:var(--c-lavender-200);transition-duration:60ms;scale:.9}@media (hover:hover) and (pointer:fine){.speaker:hover{background:var(--c-lavender-200)}}.speaker .icon{width:60%;height:60%}.instruction{max-width:36em;padding-top:max(0px, calc((var(--speaker) - 1.3em) / 2));font-size:var(--fs-instruction);text-wrap:pretty;margin:0;font-weight:800;line-height:1.3}.fx-glow{pointer-events:none;z-index:0;background:radial-gradient(closest-side,#c5f36bd9,#c5f36b00);border-radius:50%;height:90%;position:absolute;top:5%;left:-10%;right:-10%}.fx-star{z-index:1000;pointer-events:none;font-size:30px;position:fixed;top:0;left:0}.board-fit{place-items:center;width:100%;height:100%;display:grid}.board{touch-action:none;flex:none;position:relative}.board-static,.board-item,.board-zone{place-items:center;display:grid;position:absolute}.board-pool{pointer-events:none;background:#1f22350b;border-radius:28px;position:absolute}.board-item{cursor:grab;will-change:transform;touch-action:none;z-index:10;filter:drop-shadow(0 4px #1f22351f);transition:filter .15s}.board-item.is-lifted{cursor:grabbing;filter:drop-shadow(0 14px 12px #1f223538)}.board-item.is-wrong{filter:drop-shadow(0 0 10px #ff7a7af2)}.board-zone.is-slot{border:3px dashed var(--c-indigo-300);background:#e6e8ff8c;border-radius:26px;transition:background .12s,border-color .12s}.board-zone.is-bucket{border:2px solid var(--c-lavender-200);background:var(--c-white);box-shadow:0 5px 0 var(--c-lavender-100);border-radius:24px;align-items:start;transition:border-color .12s,background .12s}.board-zone.is-hover{border-color:var(--c-lime-600);background:#c5f36b47}.bucket-title{font-weight:800;font-size:var(--fs-18);white-space:nowrap;align-items:center;gap:6px;padding-top:10px;display:flex}.board-zone.is-bucket.is-coloured{border:3px solid var(--zone-band);box-shadow:0 5px 0 var(--zone-edge);overflow:hidden}.board-zone.is-bucket.is-coloured.is-hover{border-color:var(--c-lime-600)}.bucket-title.is-band{justify-content:center;position:absolute;inset:0 0 auto}.bucket-title.on-dark .visual{filter:brightness(0)invert()}.bucket-title.is-left{flex-direction:column;justify-content:center;gap:2px;padding:0 4px;line-height:1.1;position:absolute;inset:0 auto 0 0}.visual{pointer-events:none;place-items:center;line-height:1;transition:filter .45s,opacity .45s;display:inline-grid}.visual.is-silhouette{filter:brightness(0);opacity:.78}.choice-fit{place-items:center;height:100%;min-height:0;display:grid;container:fit/size}.choice-grid{--gap:14px;--card:max(56px, min(calc((100cqw - (var(--c) - 1) * var(--gap)) / var(--c)), calc((100cqh - (var(--r) - 1) * var(--gap) - 6px) / var(--r)), var(--card-max,200px)));--card-visual:calc(var(--card) * .44);--card-art:calc(var(--card) * .74);width:calc(var(--c) * var(--card) + (var(--c) - 1) * var(--gap));justify-content:center;gap:var(--gap);flex-wrap:wrap;display:flex}.choice-card{--depth:6px;--radius:var(--r-card);width:var(--card);height:var(--card);border:3px solid #0000;flex:none;place-items:center;gap:6px;display:grid}.choice-card:after{inset:-9px -9px calc(-9px - var(--depth));border-radius:calc(var(--radius) + 9px)}.choice-card.is-selected{border-color:var(--c-indigo-500)}.choice-card.is-wrong{--face:var(--c-coral-50);border-color:var(--c-coral-400)}.choice-card.is-revealed{--face:var(--c-lime-50);border-color:var(--c-lime-600)}.choice-card.is-dimmed{opacity:.35;filter:grayscale(.4);box-shadow:0 0 0 var(--edge);pointer-events:none;transition:opacity .45s,filter .45s,box-shadow .45s}.choice-text{font-weight:800;font-size:clamp(16px, calc(var(--card) * .16), 24px)}.numeric,.compare{--fs-expr:clamp(30px, 12cqmin, 56px);flex-direction:column;justify-content:center;gap:clamp(10px,4cqh,22px);height:100%;display:flex}.expression{font-size:var(--fs-expr);font-variant-numeric:tabular-nums;justify-content:center;align-items:center;gap:clamp(8px,.2em,16px);padding:clamp(6px,3cqh,18px) 0;font-weight:800;display:flex;container-type:inline-size}.expression>*{font-size:max(20px, min(1em, calc((100cqw - var(--fixed,0px) - var(--gaps,0) * clamp(8px, .2em, 16px)) / var(--em,1))))}.expr-slot{background:var(--c-white);border:3px solid var(--c-lavender-200);height:1.3em;color:var(--c-indigo-500);border-radius:16px;justify-content:center;align-items:center;padding:0 12px .06em;line-height:1;display:inline-flex}.expr-slot.is-active{border-color:var(--c-indigo-500);box-shadow:0 0 0 4px #4b5cf626}.caret{background:var(--c-indigo-500);border-radius:2px;width:3px;height:.8em;animation:1s steps(2,end) infinite blink}@keyframes blink{50%{opacity:0}}.keypad{--key-h:clamp(48px, calc((100cqh - var(--fs-expr) * 1.3 - 80px) / 4 - 8px), var(--key-max,62px));grid-template-columns:repeat(3,1fr);align-self:center;gap:8px;width:min(100%,380px);display:grid}.key{--depth:4px;height:var(--key-h);font-size:var(--fs-28);font-weight:800}.key-ok{--face:var(--c-lime-400);--face-down:var(--c-lime-500);--edge:var(--c-lime-600);color:var(--c-graphite-900)}.key-ok:not(.is-ready){opacity:.45}.key-ok.is-ready{animation:key-ready .26s var(--ease-spring)}@keyframes key-ready{0%{scale:.9}}.key .icon{width:1.1em;height:1.1em}.sign-row{justify-content:center;gap:14px;display:flex}.compare{--fs-expr:clamp(36px, min(17cqw, 26cqh), 96px)}.sign-btn{width:clamp(64px,min(26cqw,34cqh),116px);height:clamp(64px,min(26cqw,34cqh),116px);font-size:clamp(32px,min(13cqw,17cqh),56px);line-height:1}@container body (aspect-ratio>=5/4){.numeric{flex-direction:row;align-items:center;gap:clamp(16px,5cqw,40px)}.numeric .expression{flex:1;font-size:clamp(30px,20cqh,64px)}.numeric .keypad{--key-h:clamp(48px, calc((100cqh - 3 * 8px - 8px) / 4), var(--key-max,62px));width:min(48cqw, calc(var(--key-h) * 3.9 + 16px))}}@container body (height<=224px){.numeric .keypad{--key-h:max(48px, calc((100cqh - 2 * 8px - 8px) / 3));grid-template-columns:repeat(4,1fr);width:min(100%,max(46cqw,240px))}.numeric .key{order:var(--o4)}}@container body (height<=170px){.numeric.is-answer-only{gap:12px}.numeric.is-answer-only .keypad{--key-h:max(48px, calc((100cqh - 8px - 8px) / 2));grid-template-columns:repeat(6,1fr);width:clamp(328px,100cqw - 150px,400px)}}@container body (height<=290px) and (aspect-ratio>=2){.numeric:not(.is-answer-only){--kh:max(48px, min(56px, calc((100cqh - 80px) / 2)));flex-direction:column;align-items:stretch;gap:8px}.numeric:not(.is-answer-only) .expression{min-height:0;font-size:clamp(28px, calc((100cqh - 2 * var(--kh) - 24px) / 1.3), 64px);flex:1;padding:0}.numeric:not(.is-answer-only) .keypad{--key-h:var(--kh);grid-template-columns:repeat(6,1fr);width:min(100%,472px)}.numeric:not(.is-answer-only) .key{order:var(--o4)}}.sequence{flex-direction:column;justify-content:center;gap:clamp(14px,6cqh,40px);height:100%;display:flex}.sequence-row{--cell:clamp(40px, min(calc((100cqw - (var(--n) - 1) * 8px) / var(--n)), 24cqh), 104px);--cell-visual:calc(var(--cell) * .72);flex:none;justify-content:center;gap:8px;padding-top:4px;display:flex}.sequence .choice-fit{height:auto;max-height:calc(min((100cqw - (var(--opts) - 1) * 14px) / var(--opts), var(--card-max,200px)) + 10px);flex:auto}.seq-cell{width:var(--cell);height:var(--cell);border-radius:calc(var(--cell) * .24);background:var(--c-white);box-shadow:0 4px 0 var(--c-lavender-200);font-weight:800;line-height:1;font-size:calc(var(--cell) * .42);color:var(--c-indigo-500);place-items:center;display:grid}.seq-cell.is-gap{border:3px dashed var(--c-indigo-300);box-shadow:none;background:0 0}.result{height:100%;padding:calc(28px + var(--safe-top)) calc(24px + var(--safe-right)) calc(24px + var(--safe-bottom)) calc(24px + var(--safe-left));text-align:center;flex-direction:column;justify-content:safe center;align-items:center;gap:10px;display:flex;overflow-y:auto}.result-hero,.result-info{flex-direction:column;align-items:center;gap:10px;width:100%;max-width:420px;display:flex}.result-mascot .mascot{width:clamp(96px,17dvh,160px);height:auto}@media (orientation:portrait){.result.is-exam .result-mascot .mascot{width:clamp(88px,14dvh,150px)}}.result h1{font-size:var(--fs-32);margin:0;font-weight:800}.big-stars{gap:8px;display:flex}.big-star{font-size:72px;line-height:1;display:block}.big-star .icon{width:1em;height:1em;display:block}.score{flex-direction:column;align-items:center;gap:4px;display:flex}.earned{font-size:var(--fs-28);align-items:center;gap:4px;margin:0;font-weight:800;display:flex}.earned .icon{width:1.05em;height:1.05em}.accuracy{color:var(--c-graphite-600);margin:0;font-weight:700}.skills{text-align:left;grid-template-columns:1fr 1fr;gap:12px;width:100%;margin:4px 0;display:grid}.skills>div{background:var(--c-white);border-radius:18px;padding:12px}.skills h4{align-items:center;gap:6px;margin:0 0 6px;display:flex}.skills h4 .icon{width:1.2em;height:1.2em}.skills p{font-size:var(--fs-14);margin:4px 0}.result-actions{gap:12px;width:100%;margin-top:12px;display:flex}.result-actions .btn3d{flex:1}.sheet-backdrop,.dialog-backdrop{z-index:950;position:fixed;inset:0}.sheet-backdrop:before,.dialog-backdrop:before{content:"";z-index:-1;background:var(--scrim);animation:.16s ease-out fade-in;position:fixed;inset:0}:root[data-blur=on] .dialog-backdrop:before{background:#1f223557}.sheet-backdrop{padding-top:calc(12px + var(--safe-top));justify-content:center;align-items:flex-end;display:flex}.sheet{width:100%;max-width:480px;padding:20px calc(20px + var(--safe-right)) calc(20px + var(--safe-bottom)) calc(20px + var(--safe-left));overscroll-behavior:contain;background:var(--c-white);max-height:100%;animation:sheet-in .26s var(--ease-out);border-radius:28px 28px 0 0;overflow-y:auto}.sheet:focus{outline:none}@keyframes sheet-in{0%{transform:translateY(100%)}}@keyframes sheet-out{to{transform:translateY(100%)}}@keyframes dialog-in{0%{opacity:0;transform:scale(.92)}40%{opacity:1}}@keyframes dialog-out{to{opacity:0;transform:scale(.94)}}@keyframes fade-out{to{opacity:0}}.sheet-backdrop.is-closing,.dialog-backdrop.is-closing{pointer-events:none}.sheet-backdrop.is-closing:before,.dialog-backdrop.is-closing:before{animation:.15s ease-in forwards fade-out}.sheet-backdrop.is-closing .sheet{animation:.15s ease-in forwards sheet-out}.dialog-backdrop.is-closing .confirm{animation:.15s ease-in forwards dialog-out}.sheet h3{font-size:var(--fs-20);margin:0 0 8px;font-weight:800}.toggle-row{border-bottom:1px solid var(--c-lavender-100);cursor:pointer;justify-content:space-between;align-items:center;gap:12px;min-height:52px;padding:4px 0;font-weight:700;display:flex}.toggle-row input{appearance:none;background:var(--c-graphite-400);cursor:pointer;border-radius:999px;flex:none;width:50px;height:30px;margin:0;transition:background .15s;position:relative}.toggle-row input:before{content:"";background:var(--c-white);width:24px;height:24px;transition:transform .18s var(--ease-out), width .12s ease;border-radius:12px;position:absolute;top:3px;left:3px;box-shadow:0 2px 4px #1f223538}.toggle-row input:checked{background:var(--c-indigo-500)}.toggle-row input:checked:before{transform:translate(20px)}.toggle-row:active input:before{width:30px}.toggle-row:active input:checked:before{transform:translate(14px)}.toggle-row input:focus-visible,.choice-row input:focus-visible{outline:3px solid var(--c-indigo-500);outline-offset:3px}.choice-group{border:0;border-bottom:1px solid var(--c-lavender-100);margin:0;padding:12px 0}.choice-group legend{float:left;width:100%;margin:0 0 6px;padding:0;font-weight:700}.choice-row{clear:both;min-height:48px;color:var(--c-graphite-600);cursor:pointer;border-radius:12px;align-items:center;gap:12px;padding:8px 12px;font-weight:700;display:flex}.choice-row+.choice-row{margin-top:4px}.choice-row.is-active{background:var(--c-lavender-100);color:var(--c-indigo-700)}@media (hover:hover) and (pointer:fine){.choice-row:not(.is-active):hover{background:var(--c-lavender-50);color:var(--c-graphite-900)}}.choice-row input{appearance:none;border:2px solid var(--c-graphite-400);background:var(--c-white);cursor:pointer;border-radius:50%;flex:none;width:22px;height:22px;margin:0;transition:border-color .12s,box-shadow .12s}.choice-row input:checked{border:2px solid var(--c-indigo-500);box-shadow:inset 0 0 0 4px var(--c-white), inset 0 0 0 11px var(--c-indigo-500)}.dialog-backdrop{padding:calc(16px + var(--safe-top)) calc(16px + var(--safe-right)) calc(16px + var(--safe-bottom)) calc(16px + var(--safe-left));place-items:center;display:grid}@keyframes fade-in{0%{opacity:0}}.confirm{background:var(--c-white);width:min(340px,100%);max-height:100%;box-shadow:var(--shadow-dialog);text-align:center;animation:dialog-in .22s var(--ease-out);border-radius:28px;flex-direction:column;align-items:center;padding:18px 20px 20px;display:flex;overflow-y:auto}.confirm-mascot .mascot{pointer-events:none;width:clamp(88px,15dvh,128px);height:auto;display:block}.confirm h2{font-size:var(--fs-24);text-wrap:balance;margin:6px 0 4px;font-weight:800;line-height:1.2}.confirm p{font-size:var(--fs-16);color:var(--c-graphite-600);margin:0 0 18px;font-weight:700}.confirm-actions{flex-direction:column;gap:12px;width:100%;display:flex}.confirm-actions .btn3d.primary{font-size:var(--fs-20);padding:16px}.confirm-actions .btn3d.secondary{--face:var(--c-lavender-100);--face-down:var(--c-lavender-200)}@media (width>=700px) and (height>=700px){:root{--fs-instruction:24px;--hud-btn:48px;--mascot-base:128px;--gutter:28px;--card-max:260px}.bubble{font-size:var(--fs-18)}.progress-seg{height:12px}.wordmark{font-size:var(--fs-88);letter-spacing:-4px}.tagline{font-size:var(--fs-20)}.segmented button{font-size:var(--fs-18);padding:12px 18px}.mode-desc{font-size:var(--fs-18);max-width:360px}.home .btn3d.big{font-size:var(--fs-28);padding:20px}.result h1{font-size:var(--fs-40)}.big-star{font-size:88px}.keypad{--key-max:72px}}@media (width>=1200px) and (height>=800px){:root{--fs-instruction:var(--fs-32);--speaker:56px;--card-max:280px}.keypad{--key-max:88px}.key{font-size:var(--fs-32)}}@media (orientation:portrait){:root{--lesson-mascot:clamp(var(--mascot-base), calc(var(--mascot-base) + (var(--app-h,100dvh) - 185vw) / 2), calc(var(--mascot-base) * 1.45))}.result:not(.is-exam) .result-mascot .mascot{width:clamp(120px,24dvh,220px)}}@media (height<=700px){.result{padding-top:calc(16px + var(--safe-top));padding-bottom:calc(16px + var(--safe-bottom))}.result,.result-hero,.result-info{gap:8px}.result h1{font-size:var(--fs-28)}.big-star{font-size:60px}.skills{gap:8px}.skills>div{padding:10px}.skills h4{font-size:var(--fs-14)}.skills p{font-size:var(--fs-14);margin:2px 0;line-height:1.3}.result-mascot .mascot{width:clamp(80px,15dvh,140px)}}@media (height<=560px){:root{--fs-instruction:var(--fs-18);--hud-btn:40px;--speaker:40px}.lesson-top{padding:8px 14px 4px}.task-head{margin:2px 0 8px}.home{padding-top:calc(16px + var(--safe-top));padding-bottom:calc(16px + var(--safe-bottom));gap:8px}.wordmark{font-size:var(--fs-48)}.tagline,.mode-desc{margin-bottom:4px}.btn3d.big{font-size:var(--fs-20);padding:14px}.result{padding-top:calc(16px + var(--safe-top));padding-bottom:calc(16px + var(--safe-bottom));gap:8px}.result h1{font-size:var(--fs-28)}.big-star{font-size:56px}.earned{font-size:var(--fs-24)}.sheet h3{margin-bottom:4px}}@media (height<=420px){.sheet{padding-top:14px;padding-bottom:14px}.toggle-row{min-height:48px}.bubble{padding:8px 12px}}@media (height<=360px){.home{padding-top:calc(12px + var(--safe-top));padding-bottom:calc(12px + var(--safe-bottom));gap:6px}.wordmark{font-size:var(--fs-40);letter-spacing:-2px}.tagline,.mode-desc{font-size:var(--fs-14);margin:0}.home .btn3d.big{padding:12px}.result{padding-top:calc(12px + var(--safe-top));padding-bottom:calc(12px + var(--safe-bottom))}}@media (orientation:landscape){:root{--side-w:clamp(124px, 21vw, 280px);--lesson-mascot:clamp(84px, min(calc(var(--side-w) - 28px), 32dvh), 200px);--stage-max:980px}.home{flex-direction:row;align-items:safe center;gap:clamp(16px,6vw,96px)}.home-main{flex-direction:column;align-items:center;gap:clamp(6px,2.4dvh,12px);width:min(440px,56%);display:flex}.home .hello{order:0}.home-mascot .mascot{width:clamp(140px,min(36vw,60dvh),400px)}.lesson{grid-template:"hud mascot" auto "stage mascot" minmax(0, 1fr) / minmax(0, 1fr) var(--side-w)}.lesson-stage{padding-bottom:10px;padding-right:4px}.lesson-mascot{transform-origin:50% 100%;flex-direction:column;justify-content:flex-end;align-items:center;min-height:0;padding:10px 10px 10px 4px}.bubble{transform-origin:50% 100%;max-width:100%;margin:0 0 12px}.bubble:after{bottom:-6px;left:calc(50% - 7px);right:auto}.result{flex-direction:row;justify-content:center;align-items:safe center;gap:clamp(20px,5vw,80px)}.result-hero{flex:0 34%;width:auto}.result-info{flex:0 60%;max-width:520px}.result-mascot .mascot{width:clamp(72px,26dvh,180px)}.result.is-exam .result-hero{flex:none}.result.is-exam .result-info{flex:auto;max-width:560px;max-height:100%}.result.is-exam .skills{flex:0 auto;grid-template-rows:minmax(0,1fr);min-height:0}.result.is-exam .skills>div{overscroll-behavior:contain;min-height:0;overflow-y:auto}.result.is-exam .score{flex-direction:row;justify-content:center;align-items:baseline;gap:14px}.result:not(.is-exam){grid-template-columns:auto minmax(0,420px);grid-template-areas:"mascot title""mascot stars""mascot score""mascot actions";place-content:safe center center;gap:10px clamp(24px,7vw,120px);display:grid}.result:not(.is-exam) .result-hero,.result:not(.is-exam) .result-info{display:contents}.result:not(.is-exam) .result-mascot{grid-area:mascot;align-self:center}.result:not(.is-exam) .result-mascot .mascot{width:clamp(120px,min(30vw,58dvh),320px)}.result:not(.is-exam) h1{grid-area:title}.result:not(.is-exam) .big-stars{grid-area:stars;justify-self:center}.result:not(.is-exam) .score{grid-area:score}.result:not(.is-exam) .result-actions{grid-area:actions;margin-top:6px}.sheet{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"title done""toggles voice";align-items:start;gap:6px 28px;max-width:760px;display:grid}.sheet h3{grid-area:title;align-self:center;margin:0}.sheet .btn3d.wide{grid-area:done;justify-self:end;width:auto;min-width:140px;min-height:48px;margin:0;padding:11px 26px}.sheet .settings-toggles{grid-area:toggles}.sheet .choice-group{border-bottom:0;grid-area:voice;padding-top:8px}.sheet .toggle-row:last-child{border-bottom:0}.confirm{text-align:left;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"mascot title""mascot text""mascot actions";align-content:center;column-gap:20px;width:min(520px,100%);padding:20px 24px 22px 16px;display:grid}.confirm-mascot{grid-area:mascot;align-self:center}.confirm-mascot .mascot{width:clamp(84px,30dvh,136px)}.confirm h2{grid-area:title;margin-top:0}.confirm p{grid-area:text;margin-bottom:14px}.confirm-actions{flex-direction:row-reverse;grid-area:actions}.confirm-actions .btn3d{font-size:var(--fs-18);flex:1;padding:14px 12px}.confirm-actions .btn3d.primary{flex:1.4;padding:14px 12px}}@media (orientation:landscape),(width>=700px){.sheet-backdrop{padding:calc(12px + var(--safe-top)) calc(16px + var(--safe-right)) calc(12px + var(--safe-bottom)) calc(16px + var(--safe-left));align-items:center}.sheet{border-radius:28px;padding:20px 24px;animation:.22s cubic-bezier(.22,1,.36,1) dialog-in;box-shadow:0 30px 80px #1f22354d}.sheet-backdrop.is-closing .sheet{animation:.15s ease-in forwards dialog-out}}@media (orientation:landscape) and (height<=420px){.result.is-exam .big-star{font-size:44px}.result.is-exam .result-info{gap:6px}.result.is-exam .result-actions{margin-top:6px}.sheet{row-gap:4px}.sheet .btn3d.wide{padding-top:9px;padding-bottom:9px}.sheet{padding-top:14px;padding-bottom:14px}.sheet .choice-group{padding:0}.choice-group legend{margin-bottom:2px}}@media (orientation:landscape) and (height<=440px){:root[data-fullscreen=true] .home{padding-top:calc(8px + var(--safe-top));padding-bottom:calc(8px + var(--safe-bottom))}:root[data-fullscreen=true] .home-main{gap:6px}:root[data-fullscreen=true] .wordmark{font-size:var(--fs-40);letter-spacing:-2px}:root[data-fullscreen=true] .home .btn3d.big{padding:12px}}@media (orientation:landscape) and (height<=300px){:root{--speaker:36px}.home .tagline{display:none}.lesson-top{padding:6px 14px 4px}.task-head{margin:2px 0 6px}.lesson-stage{padding-bottom:6px}.sheet{padding-top:10px;padding-bottom:10px}.sheet-backdrop{padding-top:calc(2px + var(--safe-top));padding-bottom:calc(2px + var(--safe-bottom))}}@media (prefers-reduced-motion:reduce){.bubble,.sheet,.confirm,.sheet-backdrop:before,.dialog-backdrop:before,.btn3d.primary.is-busy,.key-ok.is-ready{animation:none}:is(.btn3d,.choice-card,.key,.icon-btn,.speaker,.segmented button){transition-duration:80ms;transition-timing-function:ease-out}.lesson-mascot,.lesson[inert] .lesson-mascot{transition:none;scale:none}}:root[data-reduced=true] :is(.bubble,.sheet,.confirm,.btn3d.primary.is-busy,.key-ok.is-ready){animation:none}:root[data-reduced=true] :is(.btn3d,.choice-card,.key,.icon-btn,.speaker,.segmented button){transition-duration:80ms;transition-timing-function:ease-out}:root[data-reduced=true] :is(.lesson-mascot,.lesson[inert] .lesson-mascot){transition:none;scale:none}
