:root{color-scheme:dark;--bg: #0e1116;--bg-elev: #161b22;--bg-elev-2: #1c232d;--border: #2a323d;--text: #e6edf3;--text-dim: #9aa7b4;--text-faint: #5b6672;--accent: #6ce5b1;--accent-dim: #2f6f57;--error: #ff6b6b;--warn: #ffb454;--good: #6ce5b1;--radius: 12px;--radius-sm: 8px;--mono: ui-monospace, "JetBrains Mono", "SF Mono", "Cascadia Code", monospace;--sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--shadow: 0 8px 30px rgba(0, 0, 0, .35);--shadow-pop: 0 6px 18px rgba(0, 0, 0, .45);--on-accent: #07140e;--nav-bg: rgba(14, 17, 22, .7);--veil-bg: rgba(14, 17, 22, .55);--body-glow: #131a22;--ch-untyped: var(--text-faint);--ch-correct: var(--text);--ch-error: #ff6b6b;--ch-error-wash: rgba(255, 107, 107, .12);--ch-error-wash-strong: rgba(255, 107, 107, .28);--ch-caret: #6ce5b1;--ch-caret-wash: rgba(108, 229, 177, .14);--ch-caret-wash-strong: rgba(108, 229, 177, .28);--ch-target: #ffb454}[data-palette=colorblind]{--accent: #74c0fc;--accent-dim: #2b5a86;--good: #74c0fc;--ch-error: #ff922b;--ch-error-wash: rgba(255, 146, 43, .14);--ch-error-wash-strong: rgba(255, 146, 43, .3);--ch-caret: #74c0fc;--ch-caret-wash: rgba(116, 192, 252, .16);--ch-caret-wash-strong: rgba(116, 192, 252, .3);--ch-target: #e9c46a}[data-palette=mono]{--accent: #c9d1d9;--accent-dim: #4d5560;--good: #c9d1d9;--ch-untyped: #4d5560;--ch-correct: #e6edf3;--ch-error: #8b949e;--ch-error-wash: rgba(230, 237, 243, .1);--ch-error-wash-strong: rgba(230, 237, 243, .2);--ch-caret: #e6edf3;--ch-caret-wash: rgba(230, 237, 243, .16);--ch-caret-wash-strong: rgba(230, 237, 243, .28);--ch-target: #8b949e}[data-palette=mono] .typing-surface .ch.incorrect{text-decoration:line-through}[data-palette=amber]{--accent: #ffc879;--accent-dim: #6f5326;--good: #ffc879;--ch-error: #ff6b6b;--ch-error-wash: rgba(255, 107, 107, .14);--ch-error-wash-strong: rgba(255, 107, 107, .28);--ch-caret: #ffc879;--ch-caret-wash: rgba(255, 200, 121, .16);--ch-caret-wash-strong: rgba(255, 200, 121, .3);--ch-target: #8ce99a}[data-palette=violet]{--accent: #b197fc;--accent-dim: #4a3d78;--good: #b197fc;--ch-error: #ff8fab;--ch-error-wash: rgba(255, 143, 171, .14);--ch-error-wash-strong: rgba(255, 143, 171, .28);--ch-caret: #b197fc;--ch-caret-wash: rgba(177, 151, 252, .16);--ch-caret-wash-strong: rgba(177, 151, 252, .3);--ch-target: #63e6be}[data-palette=light]{color-scheme:light;--bg: #f4f6f9;--bg-elev: #ffffff;--bg-elev-2: #eaeef3;--border: #d5dbe1;--text: #1b2430;--text-dim: #57616c;--text-faint: #8a95a1;--accent: #1f9d63;--accent-dim: #bfe6d4;--error: #e5484d;--warn: #b8730a;--good: #1f9d63;--shadow: 0 8px 30px rgba(60, 72, 88, .16);--shadow-pop: 0 6px 18px rgba(60, 72, 88, .18);--on-accent: #ffffff;--nav-bg: rgba(255, 255, 255, .72);--veil-bg: rgba(244, 246, 249, .6);--body-glow: #ffffff;--ch-untyped: #aab4bf;--ch-correct: #1b2430;--ch-error: #e5484d;--ch-error-wash: rgba(229, 72, 77, .12);--ch-error-wash-strong: rgba(229, 72, 77, .24);--ch-caret: #1f9d63;--ch-caret-wash: rgba(31, 157, 99, .14);--ch-caret-wash-strong: rgba(31, 157, 99, .26);--ch-target: #b8730a}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:radial-gradient(1200px 600px at 50% -10%,var(--body-glow) 0%,var(--bg) 60%);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;line-height:1.5}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button{font-family:inherit;cursor:pointer}.app-shell{min-height:100%;display:flex;flex-direction:column}.nav{display:flex;align-items:center;gap:28px;padding:16px 28px;border-bottom:1px solid var(--border);background:var(--nav-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:sticky;top:0;z-index:10}.brand{font-weight:700;letter-spacing:-.02em;font-size:18px;display:flex;gap:8px;align-items:center}.brand .dot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent)}.nav .links{display:flex;gap:4px}.nav .links a{color:var(--text-dim);padding:6px 12px;border-radius:var(--radius-sm);font-size:14px;font-weight:500;display:inline-flex;align-items:center;gap:6px}.nav .links a:hover{color:var(--text);background:var(--bg-elev);text-decoration:none}.nav .links a.active{color:var(--accent);background:var(--bg-elev)}.nav .spacer{flex:1}.nav-layout{display:inline-flex;align-items:center;gap:8px}.nav-layout-label{color:var(--text-faint);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.nav-select{padding:6px 10px;font-size:13px}.tag-new{background:var(--error);color:#2a0707;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;padding:2px 5px;border-radius:4px;line-height:1.2}@media(max-width:760px){.nav{gap:12px;padding:12px 14px}.nav .links{gap:0;flex-wrap:wrap}.nav .links a{padding:6px 8px;font-size:13px}}.container{width:min(960px,92vw);margin:0 auto;padding:36px 0 80px}.container.wide{width:min(1140px,94vw)}.btn{background:var(--accent);color:var(--on-accent);border:none;padding:10px 18px;border-radius:var(--radius-sm);font-weight:600;font-size:14px;transition:transform .04s ease,filter .15s ease}.btn:hover{filter:brightness(1.08)}.btn:active{transform:translateY(1px)}.btn.ghost{background:transparent;color:var(--text-dim);border:1px solid var(--border)}.btn.ghost:hover{color:var(--text);border-color:var(--text-faint)}.btn.danger{background:transparent;color:var(--error);border:1px solid var(--accent-dim)}.btn:disabled{opacity:.5;cursor:not-allowed}.card{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:22px}.card h3{margin:0 0 4px;font-size:15px}.card .sub{color:var(--text-dim);font-size:13px;margin:0 0 16px}.grid{display:grid;gap:18px}.grid.cols-2{grid-template-columns:repeat(2,1fr)}.grid.cols-3{grid-template-columns:repeat(3,1fr)}.grid.cols-4{grid-template-columns:repeat(4,1fr)}.grid.report-lead{grid-template-columns:minmax(0,1fr) 280px}@media(max-width:760px){.grid.cols-2,.grid.cols-3,.grid.cols-4,.grid.report-lead{grid-template-columns:1fr}}.stat{display:flex;flex-direction:column;gap:2px}.stat .value{font-size:34px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.stat .label{color:var(--text-dim);font-size:12px;text-transform:uppercase;letter-spacing:.08em}.stat .unit{font-size:16px;color:var(--text-faint);font-weight:500}.typing-wrap{position:relative}.typing-veil{position:absolute;top:-8px;right:-4px;bottom:-8px;left:-4px;display:grid;place-items:center;border-radius:var(--radius-sm);background:var(--veil-bg);cursor:pointer}.veil-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 20px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-elev-2);box-shadow:var(--shadow);font-size:14px;color:var(--text);text-align:center}.typing-surface{font-family:var(--mono);font-size:28px;line-height:1.7;letter-spacing:.01em;-webkit-user-select:none;user-select:none;outline:none;padding:8px 2px;word-break:normal;overflow-wrap:normal}.typing-surface.windowed{height:6.8em;overflow:hidden;position:relative;padding:0 2px;-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 78%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0,#000 78%,transparent 100%)}.typing-surface.windowed .typing-lines{position:relative;transition:transform .12s ease-out;will-change:transform}.typing-surface .word{display:inline-block;white-space:nowrap}.typing-surface .ch{color:var(--ch-untyped);position:relative;transition:color .06s}.typing-surface .ch.correct{color:var(--ch-correct)}.typing-surface .ch.incorrect{color:var(--ch-error);background:var(--ch-error-wash);border-radius:3px}.typing-surface .ch.incorrect.space{background:var(--ch-error-wash-strong)}.typing-surface .ch.slip{font-weight:700}.typing-surface .ch.current{color:var(--ch-caret);background:var(--ch-caret-wash);border-radius:3px}.typing-surface .ch.current.space{background:var(--ch-caret-wash-strong)}.typing-surface .ch.current{scroll-margin-block:1.7em 3.4em}.typing-surface .ch.target{box-shadow:inset 0 -2px 0 var(--ch-target)}.target-legend{border-bottom:2px solid var(--ch-target)}.typing-surface .ch.current:before{content:"";position:absolute;left:-2px;top:6%;bottom:6%;width:2px;background:var(--ch-caret);border-radius:2px;animation:blink 1.05s steps(1) infinite}@keyframes blink{50%{opacity:0}}.run-meta{display:flex;align-items:center;gap:22px;color:var(--text-dim);font-size:13px;font-variant-numeric:tabular-nums}.run-meta b{color:var(--text);font-weight:600}.run-meta .meta-spacer{flex:1}.link-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:none;padding:0;color:var(--text-faint);font-size:13px;font-family:inherit}.link-btn:hover{color:var(--text-dim)}.keyboard{display:inline-flex;flex-direction:column;gap:6px}.keyboard .krow{display:flex;gap:6px}.keyboard .krow.indent-1{padding-left:18px}.keyboard .krow.indent-2{padding-left:32px}.key{width:42px;height:42px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-elev-2);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:14px;color:var(--text-dim);position:relative}.key .finger-dot{position:absolute;bottom:4px;width:4px;height:4px;border-radius:50%}.key.home{box-shadow:inset 0 -2px 0 var(--accent-dim)}.bar-row{position:relative;display:grid;grid-template-columns:90px 1fr 54px;align-items:center;gap:10px;margin:7px 0;font-size:13px}.bar-row.has-hint{cursor:help}.bar-tip{position:absolute;left:90px;bottom:calc(100% + 2px);transform:translateY(0);padding:4px 9px;background:var(--bg-elev-2);border:1px solid var(--border);border-radius:7px;font-family:var(--mono);font-size:13px;letter-spacing:.14em;color:var(--text);white-space:nowrap;pointer-events:none;box-shadow:var(--shadow-pop);z-index:6}.bar-row .name{color:var(--text-dim);font-family:var(--mono)}.bar-track{height:9px;background:var(--bg-elev-2);border-radius:6px;overflow:hidden}.bar-fill{display:block;height:100%;background:var(--accent);border-radius:6px;transition:width .3s ease}.bar-row .num{text-align:right;color:var(--text-dim);font-variant-numeric:tabular-nums}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border-radius:999px;border:1px solid var(--border);background:var(--bg-elev-2);font-family:var(--mono);font-size:13px}.chip .unit{color:var(--text);font-weight:600}.chip .tag{font-size:11px;padding:1px 7px;border-radius:999px}.chip .tag.inaccurate{background:#ff6b6b29;color:var(--error)}.chip .tag.slow{background:#ffb45429;color:var(--warn)}.chip .tag.mixed{background:#9aa7b429;color:var(--text-dim)}.chip .tag.unpracticed{background:#74c0fc29;color:#74c0fc}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.field label{font-size:13px;color:var(--text-dim)}.input,.select{background:var(--bg-elev-2);border:1px solid var(--border);color:var(--text);padding:10px 12px;border-radius:var(--radius-sm);font-size:14px;font-family:inherit}.input:focus,.select:focus{outline:none;border-color:var(--accent-dim)}.type-mode{display:inline-flex;align-items:center;gap:8px}.type-mode .select{padding:6px 10px;font-size:13px;text-transform:capitalize}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--border)}.toggle-row:last-child{border-bottom:none}.seg{display:inline-flex;border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}.seg button{background:var(--bg-elev-2);color:var(--text-dim);border:none;padding:7px 13px;font-size:13px}.seg button.active{background:var(--accent);color:#07140e;font-weight:600}.center-screen{display:grid;place-items:center;min-height:70vh}.auth-card{width:380px;max-width:92vw}.muted{color:var(--text-dim)}.error-text{color:var(--error);font-size:13px;min-height:18px}.section-title{font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-faint);margin:32px 0 14px}.hint{color:var(--text-faint);font-size:13px}.spinner{width:22px;height:22px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty{text-align:center;color:var(--text-dim);padding:40px}.kbd{font-family:var(--mono);font-size:12px;padding:2px 7px;border:1px solid var(--border);border-bottom-width:2px;border-radius:6px;background:var(--bg-elev-2);color:var(--text)}.axis-tick{fill:var(--text-faint);font-size:8px;font-family:var(--mono)}.scatter-key{font-size:8px;font-family:var(--mono);font-weight:600;pointer-events:none}.axis-labels{display:flex;justify-content:space-between;margin-top:6px}.rhythm-plot{position:relative;cursor:crosshair}.rhythm-tip{position:absolute;top:4px;transform:translate(-50%);display:inline-flex;align-items:center;gap:8px;padding:4px 9px;background:var(--bg-elev-2);border:1px solid var(--border);border-radius:7px;font-size:12px;font-family:var(--mono);white-space:nowrap;pointer-events:none;box-shadow:var(--shadow-pop);z-index:5}.rhythm-tip .rt-pair{color:var(--text)}.rhythm-tip .rt-arrow{color:var(--text-faint)}.rhythm-tip b{color:var(--accent);font-variant-numeric:tabular-nums}.rhythm-tip .rt-slip{color:var(--error);text-transform:uppercase;letter-spacing:.06em;font-size:10px}.near-misses{display:flex;flex-direction:column;gap:8px}.miss-row{display:grid;grid-template-columns:74px 1fr 42px;align-items:center;gap:10px;font-size:13px}.miss-pair{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono)}.miss-pair .want{color:var(--text-dim)}.miss-pair .arrow{color:var(--text-faint)}.miss-pair .got{color:var(--error);font-weight:600}.miss-row .num{text-align:right;color:var(--text-dim);font-variant-numeric:tabular-nums}.mobile-gate{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(1200px 600px at 50% -10%,var(--body-glow) 0%,var(--bg) 60%)}.mobile-gate-card{max-width:400px;text-align:center;background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:32px 24px}.mobile-gate-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 14px var(--accent)}.mobile-gate-card h1{font-size:1.2rem;margin:18px 0 12px}.mobile-gate-card p{color:var(--text-dim);font-size:.95rem;margin:0 0 24px}.mobile-gate-continue{background:transparent;border:1px solid var(--border);color:var(--text-dim);padding:9px 16px;border-radius:var(--radius-sm);font-size:.85rem}.mobile-gate-continue:hover{color:var(--text);border-color:var(--text-faint)}.range{width:100%;accent-color:var(--accent);cursor:pointer;height:22px}.length-slider{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin:2px 0 14px;padding:0 2px}.length-slider label{font-size:13px;color:var(--text-dim);white-space:nowrap}.length-slider .range{width:100%}.len-readout{font-size:13px;color:var(--text-dim);white-space:nowrap}.len-value{color:var(--text);font-weight:700;font-variant-numeric:tabular-nums}@media(max-width:640px){.length-slider{grid-template-columns:1fr;gap:6px}}.palette-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}.palette-card{display:flex;flex-direction:column;gap:6px;text-align:left;padding:12px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-elev-2);color:var(--text);font-size:13px}.palette-card:hover{border-color:var(--text-faint)}.palette-card.active{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent-dim)}.palette-card .hint{line-height:1.4}.palette-swatches{display:flex;gap:5px}.palette-swatches span{width:22px;height:10px;border-radius:3px}.learn-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px}.stage-rail{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}.stage-pip{width:32px;height:32px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-elev-2);color:var(--text-dim);font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums}.stage-pip:hover:not(:disabled){color:var(--text);border-color:var(--text-faint)}.stage-pip.current{background:var(--accent);color:#07140e;font-weight:700;border-color:var(--accent)}.stage-pip.locked{opacity:.32;cursor:not-allowed}.key-legend{display:flex;flex-wrap:wrap;gap:6px}.key-chip{min-width:26px;padding:4px 7px;border-radius:6px;border:1px solid var(--border);background:var(--bg-elev-2);font-family:var(--mono);font-size:13px;color:var(--text-dim);text-align:center}.key-chip.fresh{border-color:var(--accent-dim);color:var(--accent);font-weight:700}.new-keys{font-family:var(--mono);letter-spacing:.1em;color:var(--accent)}.stage-verdict{font-size:14px;margin:18px 0 0}.stage-verdict.pass{color:var(--good)}.stage-verdict.fail{color:var(--text-dim)}.learn-breakdown{margin-top:20px;border-top:1px solid var(--border);padding-top:16px}.learn-breakdown h4{margin:0 0 4px}.drill-weak{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}.race-controls{display:flex;flex-direction:column;gap:14px}.race-field{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.race-label{color:var(--text-dim);font-size:12px;text-transform:uppercase;letter-spacing:.08em;min-width:54px}.race-custom{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.race-custom label{display:inline-flex;align-items:center;gap:6px;color:var(--text-dim);font-size:13px}.race-custom input{width:62px;background:var(--bg-elev-2);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-family:var(--mono);font-size:14px;padding:6px 8px;text-align:center}.race-custom input:focus{outline:none;border-color:var(--accent-dim)}.race-clock{display:flex;flex-direction:column;align-items:center;margin-top:20px}.race-clock-face{font-family:var(--mono);font-size:56px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em;line-height:1;transition:color .2s ease}.race-clock-face.low{color:var(--error)}.race-clock.idle .race-clock-face{color:var(--text-dim)}.race-clock.spent .race-clock-face{color:var(--text-faint)}.race-clock-note{color:var(--text-faint);font-size:11px;text-transform:uppercase;letter-spacing:.1em;margin-top:6px}.next-up{margin-top:18px;border-color:var(--accent-dim)}.next-badge{display:inline-block;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:3px 8px;border-radius:999px}.next-list{margin:0;padding-left:18px;color:var(--text-dim);font-size:14px;line-height:1.6}.next-list li{margin-bottom:14px}.next-list li:last-child{margin-bottom:0}.next-list li::marker{color:var(--accent-dim)}.next-list b{color:var(--text);font-weight:600}.next-list p{margin:2px 0 0}.log{margin-top:34px}.log-entry{padding-bottom:34px;margin-bottom:34px;border-bottom:1px solid var(--border)}.log-entry:last-child{border-bottom:none;margin-bottom:0}.log-entry.featured{background:var(--bg-elev);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--radius);padding:24px 26px}.log-entry.featured .log-body{color:var(--text)}.log-meta{display:flex;align-items:center;gap:10px;margin-bottom:6px}.log-meta time{color:var(--text-faint);font-size:12px;text-transform:uppercase;letter-spacing:.08em}.log-kind{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:2px 7px;border-radius:999px}.log-kind.release{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent)}.log-kind.note{background:color-mix(in srgb,var(--text-dim) 16%,transparent);color:var(--text-dim)}.log-entry h3{font-size:21px;margin:0 0 12px;letter-spacing:-.01em}.log-anchor{color:var(--text)}.log-anchor:hover{color:var(--accent);text-decoration:none}.log-body{color:var(--text-dim);font-size:15px;line-height:1.65}.log-body p{margin:0 0 14px}.log-body p:last-child{margin-bottom:0}.log-body b{color:var(--text);font-weight:600}.log-list{margin:0;padding-left:18px}.log-list li{margin-bottom:12px}.log-list li::marker{color:var(--text-faint)}.log-figure{margin:20px 0}.log-figure img{display:block;max-width:min(340px,100%);height:auto;border:1px solid var(--border);border-radius:var(--radius-sm)}.log-figure figcaption{margin-top:8px;font-size:12px}