@font-face{font-family:JetBrains Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/jetbrains-mono-latin-400-normal-V6pRDFza.woff2)format("woff2"),url(/assets/jetbrains-mono-latin-400-normal-6-qcROiO.woff)format("woff")}@font-face{font-family:JetBrains Mono;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/jetbrains-mono-latin-700-normal-BYuf6tUa.woff2)format("woff2"),url(/assets/jetbrains-mono-latin-700-normal-D3wTyLJW.woff)format("woff")}:root{--code-size:18px;--radius:10px;--gap:16px;--font-ui:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-code:"JetBrains Mono", ui-monospace, "Cascadia Code", Consolas, "DejaVu Sans Mono", monospace;--max-width:980px}:root,[data-theme=light]{--bg:#f7f7f4;--surface:#fff;--surface-2:#eeeee8;--border:#d9d8cf;--text:#1d2230;--muted:#5d6475;--faint:#9399a6;--accent:#2456c9;--accent-contrast:#fff;--focus-ring:#2456c9;--correct:#1d2230;--untyped:#8a90a0;--error:#c2410c;--error-bg:#fde4d3;--caret:#2456c9;--focus-unit:#b45309;--focus-unit-bg:#fdecc8;--ok:#1d6fa5;--warn-bg:#fff4d6;--warn-border:#e8c46a;--tok-keyword:#7c3aed;--tok-string:#0f766e;--tok-number:#b45309;--tok-comment:#8a90a0;--tok-operator:#be185d;--tok-bracket:#1d4ed8;--heat-0:#e8f1fb;--heat-1:#b9d4f2;--heat-2:#f7d79c;--heat-3:#f2a65a;--heat-4:#d9622b;--guide-dim:#1418246b}[data-theme=dark]{--bg:#14171f;--surface:#1b1f2a;--surface-2:#242a38;--border:#343b4d;--text:#e7e9ee;--muted:#a3aabb;--faint:#6c7386;--accent:#7bb0ff;--accent-contrast:#0f1320;--focus-ring:#7bb0ff;--correct:#e7e9ee;--untyped:#6f778b;--error:#ff9f6b;--error-bg:#4a2618;--caret:#7bb0ff;--focus-unit:#ffd166;--focus-unit-bg:#4a3d17;--ok:#7bdff2;--warn-bg:#3a3218;--warn-border:#8a7330;--tok-keyword:#c4a7ff;--tok-string:#7ee0c3;--tok-number:#ffc285;--tok-comment:#6f778b;--tok-operator:#ff9ccf;--tok-bracket:#8fb8ff;--heat-0:#1f2e45;--heat-1:#29507a;--heat-2:#7a6326;--heat-3:#a8622b;--heat-4:#d9622b;--guide-dim:#0009}[data-theme=high-contrast]{--bg:#000;--surface:#000;--surface-2:#111;--border:#fff;--text:#fff;--muted:#e6e6e6;--faint:#bdbdbd;--accent:#ff0;--accent-contrast:#000;--focus-ring:#ff0;--correct:#fff;--untyped:#a6a6a6;--error:#ffb000;--error-bg:#3d2a00;--caret:#0ff;--focus-unit:#0ff;--focus-unit-bg:#003d3d;--ok:#0ff;--warn-bg:#220;--warn-border:#ff0;--tok-keyword:#fff;--tok-string:#fff;--tok-number:#fff;--tok-comment:#bdbdbd;--tok-operator:#fff;--tok-bracket:#fff;--heat-0:#002b5c;--heat-1:#0050a8;--heat-2:#8a7300;--heat-3:#c26a00;--heat-4:#ff6a00;--guide-dim:#000000bf}*,:before,:after{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);font-family:var(--font-ui);margin:0;font-size:16px;line-height:1.5}a{color:var(--accent)}:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;position:absolute!important}.skip-link{background:var(--accent);color:var(--accent-contrast);z-index:100;border-radius:6px;padding:8px 12px;position:absolute;top:8px;left:-9999px}.skip-link:focus{left:8px}.app{flex-direction:column;min-height:100vh;display:flex}.site-header{border-bottom:1px solid var(--border);background:var(--surface);flex-wrap:wrap;align-items:center;gap:12px;padding:10px 20px;display:flex}.brand{color:var(--text);align-items:center;gap:8px;margin-right:8px;font-size:18px;font-weight:800;text-decoration:none;display:flex}.brand img{width:26px;height:26px}.nav{flex-wrap:wrap;gap:4px;margin-left:auto;display:flex}.nav a{color:var(--muted);border-radius:8px;padding:6px 10px;text-decoration:none}.nav a:hover,.nav a[aria-current=page]{color:var(--text);background:var(--surface-2)}main{width:100%;max-width:var(--max-width);flex:1;margin:0 auto;padding:20px 16px 40px}.site-footer{border-top:1px solid var(--border);color:var(--muted);flex-wrap:wrap;justify-content:center;gap:16px;padding:16px 20px;font-size:14px;display:flex}.site-footer a{color:var(--muted)}h1{margin:8px 0 12px;font-size:28px;line-height:1.2}h2{margin:28px 0 10px;font-size:20px}h3{margin:18px 0 8px;font-size:17px}.muted{color:var(--muted)}.small{font-size:14px}.btn{font:inherit;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;border-radius:8px;padding:7px 14px;line-height:1.3}.btn:hover{background:var(--surface-2)}.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-contrast);font-weight:600}.btn-primary:hover{filter:brightness(1.08);background:var(--accent)}.btn-danger{border-color:var(--error);color:var(--error)}.btn-small{padding:3px 10px;font-size:14px}.btn:disabled{opacity:.5;cursor:not-allowed}.segmented{border:1px solid var(--border);background:var(--surface);border-radius:9px;display:inline-flex;overflow:hidden}.segmented button{font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:0;padding:6px 14px}.segmented button[aria-pressed=true],.segmented button[aria-selected=true]{background:var(--accent);color:var(--accent-contrast);font-weight:600}.segmented button+button{border-left:1px solid var(--border)}.field{border-bottom:1px solid var(--border);grid-template-columns:minmax(160px,260px) 1fr;align-items:center;gap:8px 16px;padding:10px 0;display:grid}.field label,.field .label{font-weight:600}.field .hint{color:var(--muted);grid-column:2;font-size:14px}select,input[type=number],input[type=text],textarea{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:6px 10px}textarea{font-family:var(--font-code);width:100%;font-size:14px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.banner{border:1px solid var(--warn-border);background:var(--warn-bg);border-radius:var(--radius);flex-wrap:wrap;align-items:center;gap:12px;margin:0 0 14px;padding:10px 14px;display:flex}.banner p{flex:1;min-width:220px;margin:0}.practice{flex-direction:column;gap:14px;display:flex}.practice-top{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.unit-row{font-family:var(--font-code);flex-wrap:wrap;align-items:center;gap:6px;font-size:15px;display:flex}.unit-row .stage-label{font-family:var(--font-ui);color:var(--muted);margin-right:6px;font-size:14px}.unit{font:inherit;border:1.5px solid var(--border);background:var(--surface);min-width:30px;color:var(--text);text-align:center;white-space:pre;cursor:default;border-radius:6px;padding:2px 7px;position:relative}button.unit{cursor:pointer}.unit.locked{color:var(--faint);background:0 0;border-style:dashed}.unit.mastered{border-color:var(--ok)}.unit.focus{border-color:var(--focus-unit);background:var(--focus-unit-bg);color:var(--text);font-weight:700}.unit .meter{background:var(--faint);transform-origin:0;border-radius:2px;height:2px;position:absolute;bottom:1px;left:3px;right:3px}.unit.mastered .meter{background:var(--ok)}.unit.unit-more{font-family:var(--font-ui);color:var(--muted);background:0 0;border-style:dotted;font-size:13px}@media (max-width:640px){.unit-row{scrollbar-width:thin;flex-wrap:nowrap;padding-bottom:4px;overflow-x:auto}.unit-row>*{flex:none}}.hud{flex-wrap:wrap;align-items:flex-end;gap:28px;display:flex}.hud .stat{flex-direction:column;display:flex}.hud .value{font-variant-numeric:tabular-nums;font-size:26px;font-weight:700;line-height:1.1}.hud .value.code{font-family:var(--font-code);color:var(--focus-unit);white-space:pre}.hud .name{color:var(--muted);font-size:13px}.code-wrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);cursor:text;min-height:180px;padding:18px 20px;position:relative;overflow-x:auto}.code-wrap.focused{border-color:var(--accent)}.code{font-family:var(--font-code);font-size:var(--code-size);white-space:pre;color:var(--untyped);font-variant-ligatures:none;margin:0;line-height:1.75}.code .line{min-height:1.75em;display:block}.code .c{border-radius:2px;position:relative}.code .tok-keyword{--tok:var(--tok-keyword)}.code .tok-string{--tok:var(--tok-string)}.code .tok-number{--tok:var(--tok-number)}.code .tok-comment{--tok:var(--tok-comment)}.code .tok-operator{--tok:var(--tok-operator)}.code .tok-bracket{--tok:var(--tok-bracket)}.code .c.correct,.code .c.corrected{color:var(--tok,var(--correct))}.code .c.untyped{color:var(--untyped)}.code .c.error{color:var(--error);background:var(--error-bg);-webkit-text-decoration:underline wavy var(--error);text-decoration:underline wavy var(--error);text-underline-offset:4px}.code .c.corrected{-webkit-text-decoration:underline dotted var(--error);text-decoration:underline dotted var(--error);text-underline-offset:4px}.code .c.auto{color:var(--faint);opacity:.5}.code .c.current{box-shadow:inset 0 -3px 0 var(--caret);color:var(--text)}.code.idle .c.current{animation:1.1s steps(2,start) infinite blink}.code .c.in-focus{background:var(--focus-unit-bg)}.code .c.in-focus.error{background:var(--error-bg)}.code .ws-nl:after{content:"↵";color:var(--faint);opacity:.8}.code .ws-nl.error:after,.code .ws-nl.current:after{color:inherit}.code.ws-dot .ws-space:before{content:"·";text-align:center;color:var(--faint);position:absolute;left:0;right:0}.code.ws-dot .ws-space.correct:before{opacity:.4}.code .indent-level:before{content:"→";color:var(--faint);position:absolute;left:0}@keyframes blink{to{box-shadow:inset 0 -3px #0000}}@media (prefers-reduced-motion:reduce){.code.idle .c.current{animation:none}}.paused-overlay{background:color-mix(in srgb, var(--surface) 70%, transparent);border-radius:var(--radius);pointer-events:none;justify-content:center;align-items:center;font-weight:600;display:flex;position:absolute;inset:0}.practice-footer{color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:14px;display:flex}kbd{font-family:var(--font-code);border:1px solid var(--border);background:var(--surface);color:var(--text);border-bottom-width:2px;border-radius:5px;padding:0 5px;font-size:.85em}.result{flex-wrap:wrap;align-items:center;gap:24px;display:flex}.result .big{font-variant-numeric:tabular-nums;font-size:34px;font-weight:800}.delta-up{color:var(--ok)}.delta-down{color:var(--error)}.unlock-note{border:1px solid var(--focus-unit);background:var(--focus-unit-bg);border-radius:var(--radius);padding:10px 14px}.unlock-note.animate{animation:.42s ease-out pop}@keyframes pop{0%{opacity:.4;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion:reduce){.unlock-note.animate{animation:none}}.attribution{color:var(--muted);font-size:13px}.lang-picker{flex-wrap:wrap;gap:12px;display:flex}.lang-picker button{font:inherit;border:2px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;border-radius:12px;min-width:160px;padding:16px 26px;font-size:18px;font-weight:700}.lang-picker button:hover,.lang-picker button:focus-visible{border-color:var(--accent)}.lang-picker .kbd-hint{color:var(--muted);font-size:13px;font-weight:400;display:block}.hero{margin-bottom:18px}.hero p{color:var(--muted);margin:0;font-size:18px}.feature-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-top:20px;display:grid}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;display:grid}.tile .value{font-variant-numeric:tabular-nums;font-size:24px;font-weight:700}.tile .name{color:var(--muted);font-size:13px}.keyboard{font-family:var(--font-code);flex-direction:column;gap:5px;padding-bottom:4px;display:flex;overflow-x:auto}.kb-row{gap:5px;display:flex}.kb-key{border:1px solid var(--border);background:var(--surface-2);width:44px;height:44px;color:var(--text);border-radius:7px;flex-direction:column;flex:none;justify-content:center;align-items:center;font-size:13px;line-height:1.1;display:flex}.kb-key .up{color:var(--muted);font-size:11px}.kb-key.h0{background:var(--heat-0)}.kb-key.h1{background:var(--heat-1)}.kb-key.h2{background:var(--heat-2)}.kb-key.h3{background:var(--heat-3)}.kb-key.h4{background:var(--heat-4);color:#fff}.kb-key.h4 .up{color:#fff}.kb-key.wide{width:280px}.legend{color:var(--muted);align-items:center;gap:6px;margin-top:8px;font-size:13px;display:flex}.legend .sw{border-radius:3px;width:18px;height:12px;display:inline-block}.chart{width:100%;height:220px;display:block}table.data{border-collapse:collapse;width:100%;font-size:14px}table.data th,table.data td{text-align:left;border-bottom:1px solid var(--border);font-variant-numeric:tabular-nums;padding:6px 8px}table.data th{color:var(--muted);font-weight:600}table.data code{font-family:var(--font-code)}.snippet-list{gap:12px;display:grid}.snippet-card pre{font-family:var(--font-code);max-height:220px;color:var(--text);margin:8px 0;font-size:13px;line-height:1.5;overflow:auto}.snippet-meta{color:var(--muted);flex-wrap:wrap;align-items:center;gap:10px;font-size:13px;display:flex}.pill{border:1px solid var(--border);border-radius:999px;padding:1px 9px;font-size:12px}dialog{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:14px;max-width:min(640px,94vw);padding:20px 22px}dialog::backdrop{background:#0a0c148c}.dialog-actions{flex-wrap:wrap;justify-content:flex-end;gap:10px;margin-top:16px;display:flex}.toast{background:var(--text);color:var(--bg);z-index:50;border-radius:10px;max-width:90vw;padding:10px 16px;position:fixed;bottom:18px;left:50%;transform:translate(-50%)}.result-card-canvas{border:1px solid var(--border);border-radius:12px;max-width:100%;height:auto}.prose{max-width:720px}.prose code{font-family:var(--font-code);background:var(--surface-2);border-radius:4px;padding:1px 5px;font-size:.92em}.formula{font-family:var(--font-code);background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:10px 14px;overflow-x:auto}@media (max-width:640px){.field{grid-template-columns:1fr}.field .hint{grid-column:1}.hud{gap:16px}}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.stage-picker{flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;display:flex}.stage-picker label{color:var(--muted)}.tips{gap:4px;margin:12px 0 0;padding-left:0;font-size:14px;list-style:none;display:grid}.tips .pill{font-variant-numeric:tabular-nums}.code.caret-block .c.current{box-shadow:none;background:var(--caret);color:var(--surface);border-radius:2px}.code.caret-bar .c.current{box-shadow:inset 2px 0 0 var(--caret)}@keyframes blink-block{to{color:inherit;background:0 0}}.code.caret-block.idle .c.current{animation:1.1s steps(2,start) infinite blink-block}@media (prefers-reduced-motion:reduce){.code.caret-block.idle .c.current{animation:none}}.code.ws-bar .ws-space:before{content:"␣";text-align:center;color:var(--faint);position:absolute;left:0;right:0}.code.ws-bar .ws-space.correct:before{opacity:.4}[data-font=system]{--font-code:ui-monospace, "Cascadia Code", Consolas, "DejaVu Sans Mono", monospace}.practice-keyboard{margin-top:4px}.kb-hint{min-height:1.5em;color:var(--muted);margin:0 0 6px;font-size:14px}.kb-key.kb-mod{font-family:var(--font-ui);color:var(--muted);font-size:12px}.kb-key.w125{width:54px}.kb-key.w15{width:66px}.kb-key.w175{width:77px}.kb-key.w2{width:88px}.kb-key.w225{width:99px}.kb-key.w275{width:121px}.kb-space-row{justify-content:center}.kb-key .alt{color:var(--accent);font-size:10px}.keyboard.fingers .fz-lpinky{--fz:#e9d5ff}.keyboard.fingers .fz-lring{--fz:#bfdbfe}.keyboard.fingers .fz-lmiddle{--fz:#bbf7d0}.keyboard.fingers .fz-lindex{--fz:#fde68a}.keyboard.fingers .fz-rindex{--fz:#fed7aa}.keyboard.fingers .fz-rmiddle{--fz:#a5f3fc}.keyboard.fingers .fz-rring{--fz:#fbcfe8}.keyboard.fingers .fz-rpinky{--fz:#ddd6fe}.keyboard.fingers .fz-rthumb{--fz:#e5e7eb}.keyboard.fingers .kb-key:not(.kb-mod){background:color-mix(in srgb, var(--fz,var(--surface-2)) var(--fz-mix,70%), var(--surface-2))}[data-theme=dark] .keyboard.fingers .kb-key{--fz-mix:22%}[data-theme=high-contrast] .keyboard.fingers .kb-key:not(.kb-mod){background:var(--surface-2)}.kb-key.next{outline:3px solid var(--accent);outline-offset:1px;color:var(--text);font-weight:700;background:var(--focus-unit-bg)!important}.kb-key.next-mod{outline:3px dashed var(--accent);outline-offset:1px;color:var(--text)}.practice-meta{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.daily-goal{color:var(--muted);align-items:center;gap:10px;display:flex}.daily-goal.done{color:var(--ok);font-weight:600}.gauge{background:var(--surface-2);border:1px solid var(--border);border-radius:4px;width:120px;height:8px;display:inline-block;overflow:hidden}.gauge-fill{background:var(--ok);transform-origin:0;height:100%;display:block}.goal-note{color:var(--ok);margin:10px 0 0;font-weight:600}.calendar{gap:3px;padding-bottom:4px;display:flex;overflow-x:auto}.calendar .week{flex-direction:column;gap:3px;display:flex}.calendar .day{background:var(--surface-2);border:1px solid var(--border);border-radius:2px;width:11px;height:11px}.calendar .day.m1{background:var(--heat-1)}.calendar .day.m2{background:var(--heat-2)}.calendar .day.m3{background:var(--heat-3)}.calendar .day.m4{background:var(--heat-4)}.calendar .day.future{visibility:hidden}.milestones{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;padding:0;list-style:none;display:grid}.milestones li{border:1px dashed var(--border);color:var(--muted);border-radius:8px;padding:8px 10px}.milestones li.achieved{color:var(--text);border-style:solid;border-color:var(--ok);font-weight:600}.guide-spotlight,.guide-dim{z-index:60;pointer-events:none;position:fixed}.guide-dim{background:var(--guide-dim,#1418246b);inset:0}.guide-spotlight{border-radius:var(--radius);box-shadow:0 0 0 9999px var(--guide-dim,#1418246b);outline:3px solid var(--focus-ring);transition:top .2s,left .2s,width .2s,height .2s}.guide-card{z-index:61;background:var(--surface);width:min(460px,100vw - 32px);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);gap:8px;padding:16px 18px;display:grid;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 12px 32px #00000047}.guide-card.at-bottom{bottom:calc(16px + env(safe-area-inset-bottom,0px))}.guide-card.at-top{top:calc(16px + env(safe-area-inset-top,0px))}.guide-card h2{text-wrap:balance;margin:0;font-size:1.15rem}.guide-card p{margin:0}.guide-count{color:var(--muted);letter-spacing:.05em;text-transform:uppercase;font-size:.78rem}.guide-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.guide-spacer{flex:1}.guide-keys{color:var(--muted);font-size:.8rem}@media (prefers-reduced-motion:reduce){.guide-spotlight{transition:none}}
