*,:before,:after{box-sizing:border-box}:root{--font-ui:"Outfit", system-ui, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, "Cascadia Code", monospace;--radius:14px;--ease-out:cubic-bezier(.2, .8, .2, 1);--ease-spring:cubic-bezier(.2, .9, .3, 1.4)}html,body{min-height:100%;margin:0}body{min-height:100dvh;font-family:var(--font-ui);color:var(--text);background:radial-gradient(ellipse at 50% -20%, var(--bg-2), var(--bg) 70%) fixed, var(--bg);transition:color .3s;overflow-x:hidden}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}:focus-visible{outline:2px solid var(--accent-2);outline-offset:3px;border-radius:6px}kbd{font-family:var(--font-mono);background:var(--surface-strong);border:1px solid var(--border);border-bottom-width:2px;border-radius:5px;padding:.15em .45em;font-size:.75em}[hidden]{display:none!important}#bg,#fx{pointer-events:none;width:100%;height:100%;position:fixed;inset:0}#bg{z-index:0;opacity:.7}#fx{z-index:50}.fx-layer{z-index:60;pointer-events:none;position:fixed;inset:0;overflow:hidden}.aurora{z-index:0;pointer-events:none;background:radial-gradient(circle at 20% 30%, var(--aurora-1), transparent 40%), radial-gradient(circle at 80% 70%, var(--aurora-2), transparent 40%);filter:blur(40px);position:fixed;inset:-20%}.app{z-index:1;grid-template-rows:auto 1fr auto;gap:16px;max-width:1100px;min-height:100dvh;margin:0 auto;padding:20px 16px 16px;display:grid;position:relative}main{flex-direction:column;justify-content:center;gap:28px;min-width:0;display:flex}.topbar{justify-content:space-between;align-items:center;gap:12px;display:flex}.logo{letter-spacing:-.03em;color:var(--text);align-items:baseline;gap:2px;font-size:clamp(1.5rem,4vw,2rem);font-weight:900;text-decoration:none;display:flex}.logo-bolt{margin-right:4px;display:inline-block}.logo-rush{background:linear-gradient(90deg, var(--accent), var(--accent-2), var(--accent-3), var(--accent));color:#0000;background-size:300% 100%;-webkit-background-clip:text;background-clip:text}.actions{align-items:center;gap:6px;display:flex}.icon-btn{width:40px;height:40px;color:var(--sub);transition:color .2s, background .2s, transform .2s var(--ease-spring);border-radius:12px;place-items:center;display:grid}.icon-btn:hover{color:var(--text);background:var(--surface-strong);transform:translateY(-2px)}.icon-btn svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.icon-btn circle{fill:currentColor;stroke:none}#sound-btn .off,#sound-btn[aria-pressed=false] .on{display:none}#sound-btn[aria-pressed=false] .off{display:block}.sound-ctl{align-items:center;display:flex}#volume{opacity:0;width:0;accent-color:var(--accent);transition:width .3s var(--ease-out), opacity .3s}.sound-ctl:hover #volume,#volume:focus-visible{opacity:1;width:80px}.popover-wrap{position:relative}.popover{z-index:30;border-radius:var(--radius);background:var(--bg);border:1px solid var(--border);gap:6px;min-width:210px;padding:8px;display:grid;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 20px 50px #0006}.theme-swatch{text-align:left;background:var(--bg);color:var(--text);border:1px solid var(--border);transition:transform .2s var(--ease-spring);border-radius:10px;align-items:center;gap:10px;padding:10px 12px;font-weight:600;display:flex}.theme-swatch:hover{transform:scale(1.03)}.theme-swatch[aria-checked=true]{outline:2px solid var(--accent)}.swatch-dots{gap:3px;display:flex}.swatch-dots i{background:var(--accent);border-radius:50%;width:10px;height:10px}.swatch-dots i:nth-child(2){background:var(--accent-2)}.swatch-dots i:nth-child(3){background:var(--accent-3)}.mode-bar{background:var(--surface);border:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);max-width:100%;transition:opacity .4s, transform .4s var(--ease-out);border-radius:999px;flex-wrap:wrap;justify-content:center;align-self:center;align-items:center;gap:4px 6px;padding:6px 10px;font-size:.9rem;display:flex}.mode-bar .group{gap:2px;display:flex}.mode-bar button{color:var(--sub);border-radius:999px;padding:6px 10px;font-weight:600;transition:color .2s,background .2s}.mode-bar button:hover{color:var(--text)}.mode-bar button[aria-pressed=true]{color:var(--accent);background:var(--surface-strong)}.mode-bar .sym{font-family:var(--font-mono)}.divider{background:var(--border);border-radius:2px;width:2px;height:18px}.mode-bar .opts{display:none}.mode-bar[data-mode=time] .opts-time,.mode-bar[data-mode=words] .opts-words,.mode-bar[data-mode=quote] .opts-quote{display:flex}body.is-typing .mode-bar,body.is-typing .topbar .actions,body.is-typing .footer{opacity:0;pointer-events:none}body.is-typing .mode-bar{transform:translateY(-8px)}.topbar .actions,.footer{transition:opacity .4s}.test{flex-direction:column;gap:18px;display:flex}.hud{align-items:center;gap:22px;min-height:64px;display:flex}.ring{flex:none;width:60px;height:60px;position:relative}.ring svg{width:100%;height:100%;transform:rotate(-90deg)}.ring circle{fill:none;stroke-width:5px}.ring-track{stroke:var(--surface-strong)}.ring-progress{stroke:var(--accent);stroke-linecap:round;filter:drop-shadow(0 0 6px var(--accent));transition:stroke .3s}.ring-progress.danger{stroke:var(--error);filter:drop-shadow(0 0 8px var(--error))}.ring-label{font-family:var(--font-mono);color:var(--accent);place-items:center;font-size:.95rem;font-weight:800;display:grid;position:absolute;inset:0}.live-wpm{opacity:.35;align-items:baseline;gap:6px;transition:opacity .3s;display:flex}.hud.live .live-wpm{opacity:1}.live-wpm-value{font-family:var(--font-mono);text-align:right;font-variant-numeric:tabular-nums;min-width:2.2ch;font-size:2rem;font-weight:800}.live-wpm small{color:var(--sub);font-weight:600}.combo{grid-template-columns:auto auto;align-items:baseline;gap:4px 8px;margin-left:auto;display:grid}.combo-label{color:var(--sub);text-transform:uppercase;letter-spacing:.1em;font-size:.8rem;font-weight:600}.combo-count{font-family:var(--font-mono);text-align:right;min-width:3.5ch;font-size:1.4rem;font-weight:800;transition:color .3s,text-shadow .3s;display:inline-block}.combo-bar{background:var(--surface-strong);border-radius:6px;grid-column:1/-1;width:140px;height:6px;overflow:hidden}.combo-fill{background:var(--accent-2);transform-origin:0;height:100%;transition:transform .25s var(--ease-out), background .3s;display:block;transform:scaleX(0)}.combo[data-tier="1"] .combo-count{color:var(--accent-2)}.combo[data-tier="2"] .combo-count{color:var(--accent-3);text-shadow:0 0 12px var(--accent-3)}.combo[data-tier="3"] .combo-count{color:var(--accent);text-shadow:0 0 16px var(--accent)}.combo[data-tier="4"] .combo-count{background:linear-gradient(90deg, var(--accent), var(--accent-2), var(--accent-3), var(--accent));color:#0000;background-size:300% 100%;-webkit-background-clip:text;background-clip:text}.combo[data-tier="2"] .combo-fill{background:var(--accent-3)}.combo[data-tier="3"] .combo-fill,.combo[data-tier="4"] .combo-fill{background:linear-gradient(90deg, var(--accent), var(--accent-2), var(--accent-3))}.words{--line:2.1em;font-family:var(--font-mono);height:calc(var(--line) * 3);cursor:text;-webkit-user-select:none;user-select:none;font-size:clamp(1.15rem,2.6vw,1.7rem);position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(#000 70%,#0000);mask-image:linear-gradient(#000 70%,#0000)}.words-inner{transition:transform .28s var(--ease-out), filter .3s, opacity .3s;flex-wrap:wrap;display:flex;position:relative}.word{height:1.5em;margin:0 .32em calc(var(--line) - 1.5em) 0;color:var(--sub);border-bottom:2px solid #0000;line-height:1.5em;transition:border-color .2s;display:flex;position:relative}.word.error{border-bottom-color:var(--error)}.letter{transition:color 80ms;display:inline-block}.letter.correct{color:var(--text)}.letter.incorrect{color:var(--error)}.letter.extra{color:var(--error-extra)}.word.done .letter.correct{color:var(--text)}.caret{z-index:2;background:var(--accent);width:3px;height:1.5em;box-shadow:0 0 10px var(--accent);transition:transform .1s var(--ease-out), box-shadow .3s, width .3s;pointer-events:none;border-radius:3px;margin-left:-1px;position:absolute;top:0;left:0}.caret.no-anim{transition:none}.focus-hint{font-family:var(--font-ui);color:var(--text);opacity:0;pointer-events:none;place-items:center;font-size:1rem;font-weight:600;transition:opacity .3s;display:grid;position:absolute;inset:0}.words.blurred .words-inner{filter:blur(5px);opacity:.4}.words.blurred .focus-hint{opacity:1}.hidden-input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.quote-source{text-align:right;color:var(--sub);font-style:italic}.under{justify-content:center;display:flex}.restart{width:48px;height:48px;color:var(--sub);transition:color .2s, background .2s, transform .5s var(--ease-spring);border-radius:50%;place-items:center;display:grid}.restart:hover{color:var(--text);background:var(--surface-strong);transform:rotate(-200deg)}.restart svg{fill:none;stroke:currentColor;stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px}.results{border-radius:calc(var(--radius) * 1.5);background:var(--surface);border:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);flex-direction:column;gap:20px;padding:clamp(16px,3vw,28px);display:flex}.pb-banner{letter-spacing:.12em;color:var(--bg);background:linear-gradient(90deg, var(--accent), var(--accent-3), var(--accent-2), var(--accent));background-size:300% 100%;border-radius:999px;flex-direction:column;align-self:center;align-items:center;padding:8px 22px;font-weight:900;display:flex}.pb-banner .pb-previous{letter-spacing:.02em;opacity:.8;font-size:.75rem;font-weight:600}.pb-banner .pb-star{display:none}.res-top{grid-template-columns:auto auto 1fr;align-items:center;gap:24px;display:grid}.grade{border:4px solid;border-radius:50%;place-items:center;width:96px;height:96px;font-size:3.5rem;font-weight:900;display:grid;box-shadow:0 0 30px -4px,inset 0 0 20px -6px}.grade[data-grade=S]{color:var(--accent-3)}.grade[data-grade=A]{color:var(--accent)}.grade[data-grade=B]{color:var(--accent-2)}.grade[data-grade=C]{color:var(--text)}.grade[data-grade=D]{color:var(--sub)}.res-main{flex-direction:column;gap:4px;display:flex}.big-stat{flex-direction:column;line-height:1;display:flex}.label{color:var(--sub);font-size:.85rem;font-weight:600}.big-stat .value{font-family:var(--font-mono);color:var(--accent);font-variant-numeric:tabular-nums;font-size:clamp(2.6rem,6vw,3.6rem);font-weight:800}.chart{min-width:0}.chart-svg{width:100%;height:auto;overflow:visible}.chart .grid{stroke:var(--border);stroke-width:1px}.chart .axis{fill:var(--sub);font-size:11px;font-family:var(--font-mono)}.chart .line{fill:none;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.chart .wpm{stroke:var(--accent);filter:drop-shadow(0 0 6px var(--accent))}.chart .raw{stroke:var(--sub);stroke-width:2px}.chart .fill-stop-top{stop-color:var(--accent);stop-opacity:.35}.chart .fill-stop-bottom{stop-color:var(--accent);stop-opacity:0}.chart .err path{stroke:var(--error);stroke-width:2.4px;stroke-linecap:round}.res-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;display:grid}.res-grid>div{border-radius:var(--radius);background:var(--surface);flex-direction:column;gap:2px;padding:12px 14px;display:flex}.res-grid>div>span:last-child{font-family:var(--font-mono);font-size:1.3rem;font-weight:800}.res-actions{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.btn{background:var(--surface-strong);border:1px solid var(--border);transition:transform .2s var(--ease-spring), box-shadow .2s, background .2s;border-radius:999px;align-items:center;gap:10px;padding:12px 22px;font-weight:800;display:inline-flex}.btn:hover{transform:translateY(-2px)scale(1.03)}.btn.primary{color:var(--bg);background:var(--accent);box-shadow:0 8px 30px -8px var(--accent);border-color:#0000}.btn.primary kbd{color:inherit;background:#00000026;border-color:#0003}.btn.danger{color:var(--error)}.history{border-radius:calc(var(--radius) * 1.5);border:1px solid var(--border);background:var(--bg);width:min(560px,100vw - 32px);max-height:calc(100dvh - 48px);color:var(--text);font-family:var(--font-ui);padding:22px}.history::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0000008c}.history-head{justify-content:space-between;align-items:center;display:flex}.history h2{margin:0;font-weight:900}.history h3{color:var(--sub);text-transform:uppercase;letter-spacing:.1em;margin:18px 0 8px;font-size:.85rem}.pb-list{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.pb-list li{background:var(--surface);border-radius:10px;flex-direction:column;padding:10px 12px;display:flex}.pb-list strong{font-family:var(--font-mono);color:var(--accent);font-size:1.4rem}.pb-mode{color:var(--sub);font-size:.8rem}.sparkline svg{width:100%;height:50px;overflow:visible}.sparkline path{fill:none;stroke:var(--accent);stroke-width:2.5px;vector-effect:non-scaling-stroke}.history table{border-collapse:collapse;width:100%;font-size:.9rem}.history th{text-align:left;color:var(--sub);padding:4px 6px;font-weight:600}.history td{border-top:1px solid var(--border);padding:6px}.history td strong{color:var(--accent);font-family:var(--font-mono)}.empty{color:var(--sub)}#clear-history{margin-top:18px;padding:8px 16px;font-size:.85rem}.popup{white-space:nowrap;letter-spacing:.02em;color:var(--accent-3);text-shadow:0 0 18px var(--accent-3), 0 2px 0 #0000004d;font-size:1.5rem;font-weight:900;position:absolute;transform:translate(-50%)}.popup.combo-pop.tier-3,.popup.combo-pop.tier-4{color:var(--accent);text-shadow:0 0 24px var(--accent);font-size:2.2rem}.popup.lost-pop{color:var(--error);text-shadow:none;font-size:1rem}.popup.wpm-pop{color:var(--accent-2);text-shadow:0 0 18px var(--accent-2)}.flash{mix-blend-mode:screen;position:absolute;inset:0}.footer{color:var(--sub);flex-wrap:wrap;justify-content:center;gap:8px 20px;font-size:.85rem;display:flex}@media (width<=720px){.res-top{grid-template-columns:auto 1fr}.chart{grid-column:1/-1}.grade{width:76px;height:76px;font-size:2.6rem}}@media (width<=520px){.hud{gap:14px}.combo-bar{width:90px}.divider{display:none}.mode-bar{border-radius:var(--radius)}.footer{display:none}}:root,[data-theme=neon]{--bg:#0b0716;--bg-2:#1a0f33;--surface:#ffffff0d;--surface-strong:#ffffff17;--border:#ffffff1a;--text:#f4f0ff;--sub:#6d6390;--accent:#ff2bd6;--accent-2:#2de2ff;--accent-3:#ffe45c;--error:#ff4d6d;--error-extra:#a8324a;--star:#c9b8ff;--aurora-1:#ff2bd62e;--aurora-2:#2de2ff24;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=retro]{--bg:#050a05;--bg-2:#0b170c;--surface:#50ff780d;--surface-strong:#50ff781a;--border:#50ff7829;--text:#b6ffb0;--sub:#3c6b3a;--accent:#39ff6a;--accent-2:#c8ff3a;--accent-3:#ffb000;--error:#ff5a3c;--error-extra:#8a2d1c;--star:#39ff6a;--aurora-1:#39ff6a1a;--aurora-2:#c8ff3a0f;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=sunset]{--bg:#1a0b1e;--bg-2:#3a1230;--surface:#ffb4780f;--surface-strong:#ffb4781c;--border:#ffb47824;--text:#ffe9d6;--sub:#8a5a6e;--accent:#ff7a45;--accent-2:#ff3d7f;--accent-3:#ffd166;--error:#ff2e4d;--error-extra:#9a2338;--star:#ffc49a;--aurora-1:#ff7a4533;--aurora-2:#ff3d7f24;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=ocean]{--bg:#04121f;--bg-2:#062a3f;--surface:#78dcff0d;--surface-strong:#78dcff1a;--border:#78dcff24;--text:#def6ff;--sub:#3f6b85;--accent:#00d4ff;--accent-2:#3dffc5;--accent-3:#8a7dff;--error:#ff6b81;--error-extra:#9c3a4a;--star:#9eeaff;--aurora-1:#00d4ff24;--aurora-2:#3dffc51a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=candy]{--bg:#2b1838;--bg-2:#4a2160;--surface:#ffffff12;--surface-strong:#ffffff1f;--border:#ffffff24;--text:#fff3fb;--sub:#a07bb6;--accent:#ff8fd8;--accent-2:#8ff0ff;--accent-3:#c6ff8f;--error:#ff5c7a;--error-extra:#a63a50;--star:#ffd6f3;--aurora-1:#ff8fd833;--aurora-2:#8ff0ff24;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=light]{--bg:#f6f3ee;--bg-2:#ebe5da;--surface:#281e140a;--surface-strong:#281e1414;--border:#281e141f;--text:#2a2622;--sub:#a59d92;--accent:#e2572b;--accent-2:#2b7de2;--accent-3:#e2a72b;--error:#d42a3c;--error-extra:#f0a3ab;--star:#c9bfb2;--aurora-1:#e2572b14;--aurora-2:#2b7de20f;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}.logo-rush,.pb-banner,.combo[data-tier="4"] .combo-count{animation:4s linear infinite gradient-slide}@keyframes gradient-slide{to{background-position:300% 0}}.logo-bolt{animation:3.5s ease-in-out infinite bolt}@keyframes bolt{0%,88%,to{transform:rotate(0)scale(1)}91%{transform:rotate(-14deg)scale(1.25)}94%{transform:rotate(10deg)scale(1.1)}}.aurora{animation:22s ease-in-out infinite alternate aurora}@keyframes aurora{0%{transform:translate(0)rotate(0)}50%{transform:translate(4%,-3%)rotate(8deg)}to{transform:translate(-4%,3%)rotate(-6deg)}}.caret:not(.typing){animation:1s step-end infinite caret-blink}@keyframes caret-blink{50%{opacity:0}}body[data-combo-tier="1"] .caret{background:var(--accent-2);box-shadow:0 0 14px var(--accent-2)}body[data-combo-tier="2"] .caret{background:var(--accent-3);width:4px;box-shadow:0 0 18px var(--accent-3), 0 0 4px #fff}body[data-combo-tier="3"] .caret,body[data-combo-tier="4"] .caret{background:linear-gradient(var(--accent), var(--accent-2), var(--accent-3));width:4px;animation:.6s ease-in-out infinite alternate caret-fire}@keyframes caret-fire{0%{box-shadow:0 0 16px var(--accent), 0 0 30px var(--accent-2)}to{box-shadow:0 0 24px var(--accent-3), 0 0 46px var(--accent)}}body[data-combo-tier="4"] .word.done .letter{color:var(--text);text-shadow:0 0 10px var(--accent)}.word.done{animation:.35s ease-out word-done}@keyframes word-done{0%{text-shadow:0 0 14px var(--accent-2)}to{text-shadow:none}}.ring-progress.danger{animation:.5s ease-in-out infinite alternate danger-pulse}@keyframes danger-pulse{to{stroke-width:7px}}.results.enter{animation:rise .6s var(--ease-out) both}.results.enter .grade{animation:stamp .7s var(--ease-spring) .5s both}.results.enter .pb-banner{animation:banner-in .7s var(--ease-spring) .2s both, gradient-slide 3s linear infinite}.results.enter .res-grid>div{animation:rise .5s var(--ease-out) both}.results.enter .res-grid>div:first-child{animation-delay:.25s}.results.enter .res-grid>div:nth-child(2){animation-delay:.3s}.results.enter .res-grid>div:nth-child(3){animation-delay:.35s}.results.enter .res-grid>div:nth-child(4){animation-delay:.4s}.results.enter .res-grid>div:nth-child(5){animation-delay:.45s}.results.enter .res-grid>div:nth-child(6){animation-delay:.5s}.results.enter .res-actions{animation:rise .5s var(--ease-out) .6s both}.chart .err{animation:err-pop .3s var(--ease-spring) both}@keyframes rise{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes stamp{0%{opacity:0;transform:scale(3)rotate(-25deg)}60%{opacity:1;transform:scale(.9)rotate(4deg)}to{transform:scale(1)rotate(0)}}@keyframes banner-in{0%{opacity:0;transform:scale(.4)translateY(-20px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes err-pop{0%{opacity:0;transform:scale(0)}}.popover:not([hidden]){animation:pop-in .22s var(--ease-spring);transform-origin:100% 0}.history[open]{animation:pop-in .3s var(--ease-spring)}@keyframes pop-in{0%{opacity:0;transform:scale(.92)translateY(-6px)}}::view-transition-old(root){animation-duration:.45s}::view-transition-new(root){animation-duration:.45s}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.caret:not(.typing){animation:none}}