:root{--page: #000000;--hair: #1f1f1f;--panel-line: #242424;--panel-line-active: #555555;--ink: #e8e4dc;--ink-emphasis: #ffffff;--ink-dim: #8a8a8a;--ink-label: #666666;--ink-faint: #555555;--canvas: #ffffff;--canvas-grid: #e6e6e6;--ref-bg: #141414;--ref-svg-bg: #1b1b1b;--ref-grid: #242424;--ref-pixel: #909090;--ref-opacity: .75;--spec-0: #ff2d55;--spec-1: #ff9500;--spec-2: #ffe000;--spec-3: #34c759;--spec-4: #00c7be;--spec-5: #0a84ff;--spec-6: #bf5af2;--wrong: #ff2d55;--highlight: #ffe000;--pass: #34c759;--warn: #ffe000;--empty: #333333;--font-display: "Press Start 2P", ui-monospace, monospace;--font-body: "Pixelify Sans", ui-sans-serif, sans-serif;--btn-shadow: #4a4a4a;--btn-edge: 4px;--go: #34c759;--go-shadow: #1a6b2e;--go-ink: #06340f;--streak: #ff9500;--ink-paint: #472a5e;--band-top: #191919;--band-bottom: #0e0e0e;--surface: #161616;--border-default: #2c2c2c}*{box-sizing:border-box}html,body{margin:0}body{background:var(--page);color:var(--ink);font-family:var(--font-body);line-height:1.55;-webkit-font-smoothing:antialiased;padding:16px 16px 36px;min-height:100vh}.wrap{max-width:1240px;margin:0 auto}h1,h2,h3,h4{font-weight:500;margin:0}#screen-frame{position:relative;overflow:hidden}#flash{position:absolute;inset:0;pointer-events:none;background:var(--ink);opacity:0;z-index:60}[data-icon]{display:inline-flex;vertical-align:middle}[data-icon] svg{width:18px;height:18px;display:block}.iconbtn,.tool{background:var(--ink-emphasis);border:0;border-radius:0;width:38px;height:38px;cursor:pointer;color:var(--page);display:grid;place-items:center;box-shadow:var(--btn-edge) var(--btn-edge) 0 0 var(--btn-shadow)}.iconbtn:active,.tool:active{transform:translate(var(--btn-edge),var(--btn-edge));box-shadow:none}.topbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:22px;padding:12px 18px;background:linear-gradient(180deg,var(--band-top) 0 50%,var(--band-bottom) 50% 100%);border:2px solid var(--panel-line)}.logo{font-family:var(--font-display);font-size:14px;color:var(--ink-dim)}.logo .dot{color:#3a3a3a}.tabs{display:flex;gap:9px;margin-left:8px}.keycap{font-family:var(--font-display);font-size:14px;letter-spacing:.5px;padding:9px 13px;border:2px solid var(--border-default);border-radius:0;background:#1c1c1c;color:var(--ink-label);cursor:pointer;line-height:1;box-shadow:3px 3px 0 var(--page);transition:border-color .12s ease,color .12s ease}.keycap:hover{border-color:var(--panel-line-active);color:#cbc7bf}.keycap[aria-current=true]{color:var(--ink);border-color:var(--panel-line-active);transform:translate(3px,3px);box-shadow:none}.keycap.is-stub{color:var(--ink-faint);opacity:.7}.topbar-right{margin-left:auto;display:flex;align-items:center;gap:14px;flex-wrap:wrap}.hud{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.hud.is-hidden{display:none}.stat{display:flex;align-items:center;gap:6px;font-size:16px;color:var(--ink-dim)}.stat .stat-val{color:var(--ink)}#stat-level i{color:var(--ink-label)}.stat-streak,.stat-streak .stat-val,.stat-streak i{color:var(--streak)}.xpbar{display:flex;gap:2px;align-items:center}.xpbar i{width:7px;height:14px;border-radius:0;background:var(--empty);transition:background .3s}.xpbar i.on{background:var(--go)}.shellbtn{width:34px;height:34px;background:transparent;border:2px solid var(--border-default);border-radius:0;color:var(--ink-dim);cursor:pointer;display:grid;place-items:center;box-shadow:2px 2px 0 var(--page);padding:0;transition:border-color .12s ease,color .12s ease}.shellbtn:hover{border-color:var(--panel-line-active);color:var(--ink)}.shellbtn svg{width:18px;height:18px}.shell-avatar{font-family:var(--font-display);font-size:14px;color:var(--ink-dim)}.shellbtn.is-stub{opacity:.85}.view{display:none}.view.is-active{display:block}:root{--grid-line: var(--canvas-grid, #e6e6e6)}.pr-cta{display:flex;align-items:baseline;gap:12px;margin:0 0 6px}.pr-cta-mark{font-family:var(--font-display);font-size:14px;color:var(--ink-faint);flex-shrink:0}.pr-cta-text{font-family:var(--font-display);font-size:clamp(27px,4.5vw,34px);line-height:1.35;color:var(--ink-emphasis);margin:0}.pr-objective{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-family:var(--font-body);font-size:15px;color:var(--ink-dim)}.pr-objective[hidden]{display:none}.pr-objective svg{width:14px;height:14px}.pr-obj-key{color:var(--ink-label)}.pr-studio{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:20px;align-items:start}.pr-studio.solo{grid-template-columns:auto minmax(0,1fr)}.pr-studio.solo .pr-sidebar{display:none}@media(max-width:900px){.pr-studio,.pr-studio.solo{grid-template-columns:1fr}.pr-sidebar,.pr-grade{justify-self:stretch!important}}.pr-sidebar{display:flex;flex-direction:column;gap:14px;min-width:0;width:220px;justify-self:end}.pr-panel-head{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;font-family:var(--font-body);font-size:14px;min-height:32px}.pr-head-left{display:inline-flex;align-items:center;gap:8px}.pr-ref{background:var(--ref-bg);border:2px solid var(--panel-line);border-radius:0;display:flex;flex-direction:column}.pr-ref[hidden]{display:none}.pr-ref.is-rest{opacity:var(--ref-opacity)}.pr-ref.is-playing{opacity:1}.pr-ref .pr-panel-head{color:var(--ink-faint)}.pr-ref-head-right{display:inline-flex;align-items:center;gap:10px}.pr-lookonly{display:inline-flex;align-items:center;gap:6px;color:var(--ink-faint)}.pr-lookonly[hidden]{display:none}.pr-lookonly svg{width:14px;height:14px}.pr-ref-collapse{background:transparent;border:0;border-radius:0;color:var(--ink-faint);cursor:pointer;display:inline-flex;padding:0}.pr-ref-collapse svg{width:14px;height:14px}.pr-ref-body{padding:10px;display:grid;place-items:center}.pr-ref.collapsed .pr-ref-body{display:none}.pr-ref-svg{width:100%;height:auto;aspect-ratio:1 / 1;display:block;image-rendering:pixelated}.pr-replay{font-size:14px;padding:4px 8px;gap:4px}.pr-replay[hidden]{display:none}.pr-canvas{background:var(--page);border:3px solid var(--panel-line-active);border-radius:0;display:flex;flex-direction:column;width:clamp(280px,calc(100dvh - 416px),460px);max-width:100%}.pr-canvas .pr-panel-head{color:var(--ink);font-size:16px}.pr-canvas-toggles{display:inline-flex;align-items:center;gap:8px}.pr-canvas-size{font-family:var(--font-body);font-size:14px;color:var(--ink-faint)}.pr-canvas-body{padding:10px;display:grid;place-items:center;background:var(--page)}.pr-stage-wrap{position:relative;line-height:0;display:block;width:max-content;max-width:100%;margin:0 auto}canvas.board{touch-action:none;-webkit-touch-callout:none;user-select:none;cursor:crosshair;image-rendering:pixelated;background:var(--canvas);max-width:100%;display:block;border-radius:0}canvas.trace,canvas.highlight{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;image-rendering:pixelated}canvas.trace{opacity:.35}.pr-cellhi{position:absolute;left:0;top:0;display:none;pointer-events:none;z-index:3;box-shadow:inset 0 0 0 3px #472a5ed9}.pr-canvas-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px}.pr-tools{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.pr-sep{width:2px;height:22px;background:var(--panel-line);margin:0 2px;align-self:center}.pr-preview{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--ink-faint);font-family:var(--font-body)}.pr-preview canvas{image-rendering:pixelated;width:40px;height:40px;border:2px solid var(--panel-line);background:var(--canvas)}.pr-tool,.pr-toggle{background:transparent;border:2px solid var(--panel-line);border-radius:0;color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;box-shadow:2px 2px 0 var(--page)}.pr-tool{width:36px;height:36px}.pr-toggle{height:34px;padding:0 10px;gap:6px;font-family:var(--font-body);font-size:14px}.pr-tool:active,.pr-toggle:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--page)}.pr-tool[aria-pressed=true],.pr-toggle[aria-pressed=true]{background:var(--ink);color:var(--page);border-color:var(--ink)}.pr-tool[hidden],.pr-toggle[hidden]{display:none}.pr-tool svg,.pr-toggle svg{width:16px;height:16px}.pr-swatch-row{margin-top:14px}.pr-swatches{display:grid;grid-template-columns:repeat(9,28px);gap:4px;width:fit-content}.pr-sw{width:28px;height:28px;border:2px solid transparent;border-radius:0;cursor:pointer;padding:0;box-shadow:2px 2px 0 var(--page)}.pr-sw[aria-pressed=true]{border-color:var(--ink)}.pr-etq{display:flex;flex-direction:column;gap:6px}.pr-etq[hidden]{display:none}.pr-erule{font-family:var(--font-body);font-size:16px;color:var(--ink-label);border-left:3px solid var(--panel-line);padding-left:9px}.pr-rainbow{display:flex;gap:2px;height:8px;margin-top:16px}.pr-seg{flex:1;height:100%;transform:scaleY(0);transform-origin:bottom}.pr-stars{display:flex;gap:8px}.pr-star{display:inline-flex}.pr-star svg{width:22px;height:22px}.pr-stamp{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:5;font-family:var(--font-display)}.pr-gesture-chip{position:absolute;top:10px;left:50%;z-index:6;transform:translate(-50%);pointer-events:none;font-family:var(--font-display);font-size:14px;letter-spacing:.04em;text-transform:lowercase;color:var(--ink);background:var(--page);border:2px solid var(--panel-line);border-radius:0;padding:4px 10px;box-shadow:2px 2px #00000080;opacity:0}.pr-gesture-chip.is-in{animation:pr-chip-in .65s cubic-bezier(.34,1.56,.64,1) both}@keyframes pr-chip-in{0%{opacity:0;transform:translate(-50%) translateY(-6px)}16%{opacity:1;transform:translate(-50%) translateY(0)}70%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-4px)}}@media(prefers-reduced-motion:reduce){.pr-gesture-chip.is-in{animation:none;opacity:1}}.pr-grade{justify-self:start;align-self:center;display:flex;flex-direction:column;align-items:flex-start;gap:14px}.pr-save{background:transparent;color:var(--ink-dim);border:2px solid var(--panel-line);border-radius:0;font-family:var(--font-body);font-size:14px;padding:8px 12px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;box-shadow:2px 2px 0 var(--page)}.pr-save:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--page)}.pr-save svg{width:14px;height:14px}.pr-status{font-family:var(--font-body);font-size:16px;color:var(--warn);min-height:22px}.pr-status[hidden]{display:block;visibility:hidden}.pr-check{background:var(--go);color:var(--go-ink);border:0;border-radius:0;box-shadow:6px 6px 0 var(--go-shadow);font-family:var(--font-display);font-size:14px;line-height:1;padding:16px 26px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}.pr-check:active{transform:translate(6px,6px);box-shadow:0 0 0 var(--go-shadow)}.pr-check svg{width:14px;height:14px}.pr-check-label{letter-spacing:1px}.pr-lesson-replay{display:inline-flex;align-items:center;gap:6px;background:transparent;border:2px solid var(--panel-line);border-radius:0;color:var(--ink-dim);cursor:pointer;font-family:var(--font-body);font-size:15px;padding:8px 12px}.pr-lesson-replay:hover{border-color:var(--panel-line-active);color:var(--ink)}.pr-lesson-replay svg{width:14px;height:14px}.pr-redo{position:fixed;inset:0;z-index:90;display:grid;place-items:center;background:#0000009e}.pr-redo[hidden]{display:none}.pr-redo-card{background:var(--page);border:2px solid var(--panel-line-active);border-radius:0;padding:22px 24px;max-width:420px;margin:0 16px;text-align:center}.pr-redo-title{font-family:var(--font-body);font-size:18px;color:var(--ink);margin:0 0 18px;line-height:1.4}.pr-redo-actions{display:flex;align-items:center;justify-content:center;gap:14px}.pr-redo-next{padding:13px 16px}@media(min-width:901px){[data-hand=left] .pr-studio>.pr-grade{grid-row:1;grid-column:1;justify-self:end}[data-hand=left] .pr-studio>.pr-canvas{grid-row:1;grid-column:2}[data-hand=left] .pr-studio>.pr-sidebar{grid-row:1;grid-column:3;justify-self:start}[data-hand=left] .pr-studio.solo>.pr-grade{grid-row:1;grid-column:1;justify-self:start}[data-hand=left] .pr-studio.solo>.pr-canvas{grid-row:1;grid-column:2}[data-hand=left] .pr-canvas-foot{flex-direction:row-reverse}[data-hand=left] .pr-swatch-row{display:flex;justify-content:flex-end}}.settings-panel{position:fixed;inset:0;z-index:95;display:grid;place-items:center;background:#000000b8}.settings-panel[hidden]{display:none}.settings-card{background:var(--surface);border:3px solid var(--panel-line-active);border-radius:0;width:min(460px,calc(100vw - 48px));padding:22px 24px}.settings-head{display:flex;align-items:center;gap:10px;margin-bottom:4px}.settings-title{font-family:var(--font-display);font-size:15px;color:var(--ink-emphasis)}.settings-head .shellbtn{margin-left:auto}.settings-note{font-family:var(--font-body);font-size:14px;color:var(--ink-faint);margin:0 0 16px}.settings-label{display:block;font-family:var(--font-body);font-size:18px;color:var(--ink);margin-bottom:10px}.seg{display:flex;gap:12px}.seg-opt{flex:1;display:flex;flex-direction:column;align-items:center;gap:7px;padding:15px 12px;cursor:pointer;border-radius:0;background:transparent;border:2px solid var(--border-default);box-shadow:3px 3px 0 var(--page);color:var(--ink-dim);font-family:var(--font-body);transition:transform .1s ease,box-shadow .1s ease}.seg-opt:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--page)}.seg-opt[aria-checked=true]{background:#1c1c1c;border-color:var(--panel-line-active);color:var(--ink);transform:translate(3px,3px);box-shadow:none}.seg-glyph{width:26px;height:26px;color:inherit}.seg-glyph svg{width:26px;height:26px}.seg-glyph-flip{transform:scaleX(-1)}.seg-opt-label{font-size:18px}.seg-opt-hint{font-size:14px;color:var(--ink-faint);text-align:center}.settings-help{font-family:var(--font-body);font-size:14px;color:var(--ink-faint);margin:12px 0 0}.pr-welcome{position:fixed;inset:0;z-index:92;display:grid;place-items:center;background:var(--page);padding:24px}.pr-welcome[hidden]{display:none}.pr-welcome-inner{display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center;max-width:640px}.pr-welcome-eyebrow{font-family:var(--font-display);font-size:11px;letter-spacing:1px;color:var(--ink-dim)}.pr-welcome-mascot{line-height:0}.pr-welcome-title{font-family:var(--font-display);font-size:21px;line-height:1.55;color:var(--ink-emphasis);margin:0;font-weight:400}.pr-welcome-sub{font-family:var(--font-body);font-size:20px;line-height:1.45;color:var(--ink-dim);margin:0}.pr-welcome-cta{font-size:14px;padding:16px 24px}.pr-stage-wrap.pr-ghost canvas.trace{opacity:.08}.pr-nudge{position:absolute;left:12px;right:12px;bottom:12px;z-index:4;border:2px solid var(--panel-line);border-radius:0;padding:10px 12px;background:#141414}.pr-nudge[hidden]{display:none}.pr-nudge-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.pr-nudge-list li{color:var(--ink-dim);font-size:14px;line-height:1.5;padding-left:12px;border-left:2px solid var(--panel-line)}.pr-nudge-actions{margin-top:12px}#view-practice :focus-visible{outline:3px solid var(--ink);outline-offset:2px;border-radius:0}.journey{max-width:560px;margin:0 auto}.journey-head{margin-bottom:20px}.journey-title{font-family:var(--font-display);font-size:18px;color:var(--ink)}.journey-sub{font-size:18px;color:var(--ink-dim);margin:8px 0 0}.jzone{border:2px solid;border-radius:0;padding:22px 22px 28px;margin-bottom:14px;display:flex;flex-direction:column;align-items:center}.jzone-head{width:100%;display:flex;align-items:center;gap:12px;margin-bottom:18px}.jzone-unit{font-family:var(--font-display);font-size:14px}.jzone-name{font-size:20px;color:var(--ink)}.jzone-count{margin-left:auto;font-size:16px;color:var(--ink-dim)}.jconn{display:flex;flex-direction:column;align-items:center;gap:5px;padding:9px 0}.jconn span{width:6px;height:6px}.jrow{width:100%;display:flex;justify-content:center}.jnode,.jnode-current{cursor:pointer;padding:0;outline:3px solid transparent;outline-offset:3px;transition:outline-color .12s ease}.jnode:hover,.jnode-current:hover{outline-color:var(--ink-faint)}.jnode{width:62px;height:62px;display:grid;place-items:center;border:0}.jnode svg{width:26px;height:26px}.jnode-done{background:var(--go);color:var(--go-ink);box-shadow:5px 5px 0 var(--go-shadow)}.jnode-locked{background:var(--surface);border:3px solid var(--border-default);color:#444;cursor:default;outline:none}.jnode-locked svg{width:24px;height:24px}.jnode-current{position:relative;background:transparent;border:0}.jnode-face{width:78px;height:78px;display:grid;place-items:center;background:var(--canvas);border:5px solid var(--go);box-shadow:6px 6px 0 var(--go-shadow);color:var(--go)}.jnode-face svg{width:34px;height:34px}.jpulse{position:absolute;inset:-6px;border:3px solid;pointer-events:none;animation:jpulsering 1.1s steps(4,jump-none) infinite}.jstart{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:10px;background:var(--ink);color:var(--page);font-family:var(--font-display);font-size:14px;padding:8px 11px;box-shadow:4px 4px 0 var(--btn-shadow);white-space:nowrap}.bob{animation:jbob 1.05s steps(2,jump-none) infinite}@keyframes jbob{0%,to{transform:translate(var(--dx, 0)) translateY(0)}50%{transform:translate(var(--dx, 0)) translateY(-7px)}}@keyframes jpulsering{0%{transform:scale(1);opacity:.6}to{transform:scale(1.7);opacity:0}}@media(prefers-reduced-motion:reduce){.bob,.jpulse{animation:none}}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.gitem{background:var(--page);border:2px solid var(--panel-line);border-radius:0;padding:10px;text-align:center}.gitem canvas{image-rendering:pixelated;border-radius:0;width:100%;border:1px solid var(--panel-line);background:var(--canvas)}.gitem .gm{font-size:14px;color:var(--ink-dim);margin-top:6px;display:flex;justify-content:space-between;align-items:center}.gitem .sc{font-family:var(--font-display);font-size:14px;color:var(--ink)}.gitem .del{background:none;border:none;color:var(--ink-dim);cursor:pointer;display:grid;place-items:center}.gitem .del:hover{color:var(--ink)}.empty{color:var(--ink-dim);font-size:14px;padding:30px 0;text-align:center}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%) translateY(20px);background:var(--page);border:2px solid var(--panel-line);color:var(--ink);padding:11px 18px;border-radius:0;font-family:var(--font-display);font-size:14px;opacity:0;transition:.3s;z-index:50;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}.foot{margin-top:24px;font-size:14px;color:var(--ink-faint);text-align:center}.foot button{background:none;border:none;color:var(--ink-faint);text-decoration:underline;cursor:pointer;font-size:14px}.foot button:hover{color:var(--ink)}body.is-practice .foot{display:none}body.is-practice{padding-bottom:12px}.sr-live,.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:0}.conf{position:fixed;width:9px;height:9px;pointer-events:none;z-index:40;border-radius:0}@media(prefers-reduced-motion:reduce){.conf,.mx-shake,.mx-flash,.mx-stamp-pop,.mx-star-pop,.mx-bar-pop,.mx-confetti,.mx-unlock-pop,.mx-tool-drop{animation:none!important;transition:none!important}}:root{--mx-spring: cubic-bezier(.34, 1.56, .64, 1)}[data-capture] *,[data-capture] *:before,[data-capture] *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.mx-shake{animation:mx-shake .28s steps(5,end) both}@keyframes mx-shake{0%{transform:translate(0)}20%{transform:translate(-5px,3px)}40%{transform:translate(4px,-4px)}60%{transform:translate(-3px,5px)}80%{transform:translate(5px,-2px)}to{transform:translate(0)}}.mx-flash{background:#fff;pointer-events:none;animation:mx-flash .22s steps(3,end) both}@keyframes mx-flash{0%{opacity:.85;visibility:visible}to{opacity:0;visibility:visible}}.mx-stamp{display:inline-block;font-family:"Press Start 2P",ui-monospace,monospace;font-size:27px;letter-spacing:2px}.mx-stamp-small{font-size:16px;letter-spacing:1px}.mx-stamp-tool{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 16px;background:var(--page);border:3px solid currentColor;text-align:center}.mx-tool-kicker{font-family:"Press Start 2P",ui-monospace,monospace;font-size:14px;letter-spacing:2px;color:var(--ink-emphasis)}.mx-tool-name{font-family:"Press Start 2P",ui-monospace,monospace;font-size:22px;letter-spacing:2px}.mx-stamp-pop{animation:mx-stamp-pop .42s var(--mx-spring) both}@keyframes mx-stamp-pop{0%{transform:scale(.2)}to{transform:scale(1)}}.mx-star-pop{animation:mx-star-pop .26s var(--mx-spring) both}@keyframes mx-star-pop{0%{transform:scale(1)}45%{transform:scale(1.7)}to{transform:scale(1)}}.mx-bar-pop{visibility:visible;transform-origin:50% 100%;animation:mx-bar-pop .24s var(--mx-spring) both}@keyframes mx-bar-pop{0%{transform:scaleY(0)}to{transform:scaleY(1)}}.mx-confetti{position:fixed;border-radius:0;pointer-events:none;z-index:9999;animation:mx-confetti-fly .7s steps(8,end) forwards}@keyframes mx-confetti-fly{0%{transform:translate(0);opacity:1}to{transform:translate(var(--mx-dx, 0px),var(--mx-dy, -80px));opacity:0}}.mx-unlock-pop{animation:mx-unlock-pop .38s var(--mx-spring) both}@keyframes mx-unlock-pop{0%{transform:scale(.4);box-shadow:0 0 0 3px var(--mx-unlock-color, var(--spec-2))}60%{transform:scale(1.15);box-shadow:0 0 0 3px var(--mx-unlock-color, var(--spec-2))}to{transform:scale(1);box-shadow:0 0 0 0 transparent}}.mx-tool-drop{position:relative;z-index:3;animation:mx-tool-drop .52s var(--mx-spring) both}@keyframes mx-tool-drop{0%{transform:scale(.2);box-shadow:0 0 0 4px var(--mx-unlock-color, var(--spec-2))}55%{transform:scale(1.4);box-shadow:0 0 0 4px var(--mx-unlock-color, var(--spec-2))}to{transform:scale(1);box-shadow:0 0 0 0 transparent}}:root{--lx-spring: cubic-bezier(.34, 1.56, .64, 1)}.lesson{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:32px}.lesson-svg{display:block;width:min(42vw,380px);max-height:min(56vh,380px);height:auto;flex-shrink:0}.lesson--compact{flex-direction:column;gap:8px}.lesson--compact .lesson-svg{width:min(100%,220px);max-height:none}.lesson-cell{visibility:hidden;transform-box:fill-box;transform-origin:50% 50%}.lesson-cell.is-placed{visibility:visible;animation:lx-place .17s var(--lx-spring) both}@keyframes lx-place{0%{transform:scale(1.6)}to{transform:scale(1)}}.lesson-err{visibility:hidden;transform-box:fill-box;transform-origin:50% 50%}.lesson-err.is-error-in{visibility:visible;stroke:var(--wrong);stroke-width:2;animation:lx-error-in .22s var(--lx-spring) both}@keyframes lx-error-in{0%{transform:scale(1.9)}to{transform:scale(1)}}.lesson-err.is-erasing{animation:lx-erase .26s steps(4,end) both}@keyframes lx-erase{0%{transform:scale(1)}to{transform:scale(0)}}.lesson-err.is-gone{visibility:hidden}.lesson-captions{display:flex;flex-direction:column;align-items:flex-start;gap:6px;flex:1;min-width:0;font-family:var(--font-body);font-size:18px;line-height:1.35;color:var(--ink);text-align:left}.lesson--compact .lesson-captions{flex:initial;align-items:center;text-align:center;font-size:16px;gap:4px}.lesson-caption{margin:0;visibility:hidden}.lesson-caption.is-in{visibility:visible;animation:lx-caption-pop .26s var(--lx-spring) both}@keyframes lx-caption-pop{0%{transform:translateY(7px) scale(.75,.55)}60%{transform:translateY(-2px) scale(1.04,1.1)}to{transform:translateY(0) scale(1)}}.lesson-vocab{font-weight:700;color:var(--highlight)}.lesson-wrong{font-weight:700;color:var(--wrong)}.lesson--static .lesson-cell.is-placed,.lesson--static .lesson-caption.is-in{animation:none}
