:root{--bg:#111;--surface:#181818;--surface-hover:#202020;--nav-hover:#1c1c1c;--border:#2a2a2a;--text:#ddd;--muted:#777;--muted-light:#888;--accent:#f2c94c;--accent-hover:#ffd95a;--error:#ff5c5c;--auth-error:#ff6b6b}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:Inter,system-ui,Arial,sans-serif}.typing-page,.dashboard{max-width:1000px;margin:0 auto;padding:48px 24px}.typing-page{cursor:text;min-height:100dvh}.top-bar{justify-content:space-between;align-items:center;margin-bottom:48px;display:flex}h1{color:var(--accent);margin:0;font-size:32px}button{color:var(--text);cursor:pointer;background:#222;border:1px solid #444;border-radius:8px;padding:10px 16px}button:hover{background:#333}.nav{align-items:center;gap:16px;max-width:1000px;margin:0 auto;padding:24px;display:flex}.nav-logo{color:var(--muted-light);border-radius:8px;padding:8px 12px;font-size:18px;font-weight:700;text-decoration:none}.nav-logo:hover{color:var(--accent);background:var(--nav-hover)}.nav-links{align-items:center;gap:16px;margin-left:auto;display:flex}.nav-links a{color:var(--muted-light);border-radius:8px;padding:8px 12px;font-size:15px;text-decoration:none;transition:all .2s}.nav-links a:hover{color:var(--accent);background:var(--nav-hover)}.nav-links button{margin-left:auto}.hamburger-button{display:none}.stats{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:48px;display:grid}.stats div{background:var(--surface);border-radius:12px;padding:16px}.stats span{color:var(--muted);margin-bottom:6px;font-size:14px;display:block}.stats strong{color:var(--accent);font-size:24px}.typing-box{position:relative}.words-window{--typing-line-height:2.8rem;height:calc(3 * var(--typing-line-height));overflow:hidden}.words{line-height:var(--typing-line-height);color:#555;-webkit-user-select:none;user-select:none;font-size:28px;transition:transform .12s}.char.correct{color:var(--text)}.char.incorrect{color:var(--error)}.char.current{border-left:2px solid var(--accent);animation:1s infinite blink}.hidden-input{opacity:0;color:#0000;caret-color:#0000;background:0 0;border:none;outline:none;width:1px;height:1px;position:fixed;top:0;left:0}.result-card{background:var(--surface);border-radius:16px;margin-top:48px;padding:24px}.result-card h2{color:var(--accent)}.auth-form{background:var(--surface);border:1px solid var(--border);border-radius:18px;width:min(420px,100%);margin:80px auto;padding:32px;box-shadow:0 20px 60px #00000059}.auth-form h1{color:var(--accent);text-align:center;margin-bottom:24px;font-size:32px}.auth-form input{background:var(--bg);width:100%;color:var(--text);border:1px solid #333;border-radius:10px;outline:none;margin-bottom:16px;padding:14px 16px;font-size:16px;display:block}.auth-form input::placeholder{color:#666}.auth-form input:focus{border-color:var(--accent)}.auth-form button{background:var(--accent);width:100%;color:var(--bg);border:none;border-radius:10px;margin-top:8px;padding:14px 16px;font-size:16px;font-weight:700}.auth-form button:hover{background:var(--accent-hover)}.auth-form p{color:var(--auth-error);text-align:center;margin-top:16px;font-size:14px}.dashboard h1{color:var(--accent);margin-bottom:32px;font-size:36px}.dashboard h2{color:var(--text);margin-top:48px;margin-bottom:18px;font-size:24px}.dashboard .stats{gap:18px;margin-bottom:32px}.dashboard .stats div{border:1px solid var(--border);border-radius:16px;padding:22px}.dashboard .stats span{margin-bottom:10px}.dashboard .stats strong{font-size:34px}.recommendation-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;margin-top:32px;padding:24px}.recommendation-card h2{color:var(--accent);margin-top:0;margin-bottom:12px}.recommendation-card p{color:#bbb;margin:0;line-height:1.6}.recommendation-card strong{color:var(--accent);margin-top:16px;font-size:15px;display:block}.recommendation-card a{color:inherit;text-underline-offset:3px;text-decoration:underline}.dashboard table{border-collapse:collapse;background:var(--surface);border:1px solid var(--border);border-radius:16px;width:100%;overflow:hidden}.dashboard thead{background:var(--surface-hover)}.dashboard th,.dashboard td{text-align:left;border-bottom:1px solid var(--border);padding:16px}.dashboard th{color:var(--muted);font-size:14px;font-weight:500}.dashboard td{color:var(--text);font-size:15px}.dashboard tbody tr:hover{background:var(--surface-hover)}.dashboard tbody tr:last-child td{border-bottom:none}.dashboard>p{background:var(--surface);border:1px solid var(--border);color:#aaa;border-radius:16px;padding:24px}.insights-grid{grid-template-columns:repeat(2,1fr);gap:18px;margin-top:32px;display:grid}.insight-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px}.insight-card h2{color:var(--text);margin-top:0;margin-bottom:18px}.insight-card p{color:var(--muted)}.insight-row{border-bottom:1px solid var(--border);justify-content:space-between;gap:16px;padding:12px 0;display:flex}.insight-row:last-child{border-bottom:none}.insight-row span{color:var(--text)}.insight-row strong{color:var(--accent);font-size:14px}.dashboard-graphs{grid-template-columns:180px 1fr;align-items:start;gap:1rem;display:grid}.graph-buttons{flex-direction:column;gap:.75rem;display:flex}.graph-buttons button{cursor:pointer;text-align:left;background:0 0;border:1px solid #ddd;border-radius:8px;padding:.75rem 1rem}.graph-buttons button.active{border-color:currentColor;font-weight:700}.graph-card{border:1px solid #ddd;border-radius:12px;padding:1rem}.recent-tests-scroll{--recent-test-row-height:44px;--recent-test-header-height:44px;max-height:calc(var(--recent-test-header-height) + (var(--recent-test-row-height) * 10));border-radius:12px;overflow:auto}.recent-tests-scroll table{border-collapse:separate;border-spacing:0;width:100%}.recent-tests-scroll th,.recent-tests-scroll td{height:var(--recent-test-row-height);padding:0 1rem}.recent-tests-scroll thead th{height:var(--recent-test-header-height);z-index:2;background:var(--bg);position:sticky;top:0}.leaderboard{width:min(1100px,100%);margin:0 auto;padding:2rem}.leaderboard-header{justify-content:space-between;align-items:center;gap:1.5rem;margin-bottom:1.5rem;display:flex}.leaderboard-header h1{margin:0}.leaderboard-header p{opacity:.75;margin:.4rem 0 0}.leaderboard-rank{color:#fff;text-align:right;background:#111827;border-radius:16px;min-width:160px;padding:1rem 1.25rem}.leaderboard-rank span{opacity:.75;text-transform:uppercase;letter-spacing:.04em;font-size:.8rem;display:block}.leaderboard-rank strong{margin-top:.25rem;font-size:1.5rem;display:block}.leaderboard-toggle{gap:.75rem;margin-bottom:1rem;display:flex}.leaderboard-toggle button{color:inherit;cursor:pointer;background:0 0;border:1px solid #d1d5db;border-radius:999px;padding:.65rem 1rem;font-weight:600}.leaderboard-toggle button.active{color:#fff;background:#111827;border-color:#111827}.leaderboard-table-card{border:1px solid #e5e7eb;border-radius:16px;overflow-x:auto}.leaderboard-table{border-collapse:collapse;background:0 0;width:100%}.leaderboard-table th,.leaderboard-table td{text-align:left;border-bottom:1px solid #e5e7eb;padding:1rem}.leaderboard-table th{text-transform:uppercase;letter-spacing:.04em;opacity:.7;font-size:.8rem}.leaderboard-table tbody tr:last-child td{border-bottom:none}.leaderboard-table tbody tr:hover{background:#00000008}.current-user-row{background:#1118270f;font-weight:700}.rank-number{font-weight:700}.rank-gold{color:#d4af37}.rank-silver{color:#9ca3af}.rank-bronze{color:#cd7f32}@keyframes blink{0%,50%{border-color:var(--accent)}51%,to{border-color:#0000}}@media (width<=700px){.nav{flex-wrap:wrap;padding:12px 16px}.hamburger-button{color:var(--muted-light);cursor:pointer;background:0 0;border:none;margin-left:auto;padding:6px 10px;font-size:24px;display:block}.nav-links{flex-direction:column;align-items:stretch;gap:8px;width:100%;margin-left:0;padding-top:8px;display:none}.nav-links.open{display:flex}.nav-links a,.nav-links button{text-align:left;width:100%;padding:10px 12px}.nav-links button{margin-left:0}.typing-page{padding:24px 18px}.top-bar{margin-bottom:28px}.stats{grid-template-columns:repeat(3,1fr);margin-bottom:28px}.words-window{--typing-line-height:2.5rem}.words{font-size:22px}.dashboard .stats,.insights-grid,.dashboard-graphs{grid-template-columns:1fr}.graph-buttons{flex-direction:row;overflow-x:auto}.graph-buttons button{white-space:nowrap}.leaderboard-header{flex-direction:column;align-items:stretch}.leaderboard-rank{text-align:left}.leaderboard-toggle{flex-direction:column}.leaderboard-toggle button{width:100%}}