:root{--bg-void:#05070c;--bg-base:#0a0e17;--bg-surface:#10151f;--bg-surface-raised:#161d2b;--border-dim:#1f2937;--border-glow:rgba(0, 212, 255, 0.35);--accent-cyan:#00d4ff;--accent-cyan-dim:rgba(0, 212, 255, 0.14);--accent-magenta:#ff2e88;--accent-magenta-dim:rgba(255, 46, 136, 0.14);--accent-amber:#ffb020;--text-primary:#e8f2ff;--text-muted:#8b9bb4;--text-faint:#55627a;--font-display:'Orbitron', sans-serif;--font-body:'DM Sans', sans-serif;--font-mono:'JetBrains Mono', monospace;--radius-sm:6px;--radius-md:12px;--radius-lg:20px;--max-width:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg-void);background-image:radial-gradient(circle at 15% 10%,rgb(0 212 255 / .06),transparent 40%),radial-gradient(circle at 85% 90%,rgb(255 46 136 / .05),transparent 45%),linear-gradient(180deg,var(--bg-base),var(--bg-void) 60%);color:var(--text-primary);font-family:var(--font-body);line-height:1.6;min-height:100vh}img{max-width:100%;display:block}a{color:var(--accent-cyan);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;letter-spacing:.02em;margin:0 0 .6em;color:var(--text-primary)}.container{max-width:var(--max-width);margin:0 auto;padding:0 24px}.mono{font-family:var(--font-mono)}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:3px}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.001ms!important;animation-iteration-count:1!important;transition-duration:0.001ms!important;scroll-behavior:auto!important}}.site-header{border-bottom:1px solid var(--border-dim);background:rgb(10 14 23 / .85);backdrop-filter:blur(10px);position:sticky;top:0;z-index:100}.site-header-inner{display:flex;align-items:center;justify-content:space-between;padding:16px 24px}.site-logo{font-family:var(--font-display);font-size:1.25rem;color:var(--text-primary);display:flex;align-items:center;gap:10px}.site-logo .spark{width:10px;height:10px;border-radius:50%;background:var(--accent-cyan);box-shadow:0 0 12px 2px var(--accent-cyan)}.site-logo span.accent{color:var(--accent-cyan)}.primary-nav ul{list-style:none;display:flex;gap:28px;margin:0;padding:0}.primary-nav a{color:var(--text-muted);font-size:.92rem;font-weight:500}.primary-nav a:hover{color:var(--accent-cyan);text-decoration:none}.header-actions{display:flex;align-items:center;gap:10px}.icon-btn{background:#fff0;border:1px solid var(--border-dim);color:var(--text-muted);border-radius:var(--radius-sm);width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.15s ease}.icon-btn:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}.icon-btn svg{width:18px;height:18px}.nav-toggle{display:none}@media (max-width:780px){.primary-nav{display:none}.nav-toggle{display:block;background:none;border:1px solid var(--border-dim);color:var(--text-primary);border-radius:var(--radius-sm);padding:8px 12px;font-family:var(--font-mono)}}.app-shell{display:flex;min-height:100vh}.tool-sidebar{width:240px;flex-shrink:0;background:var(--bg-base);border-right:1px solid var(--border-dim);padding:18px 10px 30px;position:sticky;top:0;align-self:flex-start;height:100vh;overflow-y:auto}.tool-sidebar .sidebar-brand{display:flex;align-items:center;gap:8px;font-family:var(--font-display);font-size:1rem;padding:0 10px 16px;border-bottom:1px solid var(--border-dim);margin-bottom:12px}.tool-nav{list-style:none;margin:0;padding:0}.tool-nav-group{margin-bottom:6px}.tool-nav-label{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--radius-sm);color:var(--text-muted);font-size:.86rem;cursor:pointer;transition:background 0.15s ease,color 0.15s ease}.tool-nav-label:hover{background:var(--bg-surface);color:var(--text-primary)}.tool-nav-label.is-active{background:var(--accent-cyan-dim);color:var(--accent-cyan)}.tool-nav-label svg{width:16px;height:16px;flex-shrink:0;opacity:.8}.tool-nav-label .chev{margin-left:auto;opacity:.5;transition:transform 0.15s ease;width:10px;height:10px}.tool-nav-group.open .chev{transform:rotate(180deg)}.tool-subnav{list-style:none;margin:2px 0 6px 30px;padding:0;display:none}.tool-nav-group.open .tool-subnav{display:block}.tool-subnav a{display:block;padding:6px 8px;font-size:.78rem;color:var(--text-faint);border-radius:var(--radius-sm)}.tool-subnav a:hover{color:var(--accent-cyan);background:var(--bg-surface);text-decoration:none}.sidebar-toggle-mobile{display:none}.main-content{flex:1;min-width:0}@media (max-width:900px){.tool-sidebar{position:fixed;left:-260px;top:0;z-index:300;background:var(--bg-base);transition:left 0.2s ease;box-shadow:20px 0 40px rgb(0 0 0 / .5)}.tool-sidebar.open{left:0}.sidebar-scrim{display:none;position:fixed;inset:0;background:rgb(0 0 0 / .6);z-index:250}.sidebar-scrim.open{display:block}}.history-overlay{position:fixed;inset:0;background:rgb(5 7 12 / .82);backdrop-filter:blur(4px);display:none;align-items:flex-start;justify-content:center;z-index:400;padding:60px 20px 20px}.history-overlay.open{display:flex}.history-panel{background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:var(--radius-lg);padding:22px;max-width:780px;width:100%;max-height:80vh;overflow-y:auto}.history-panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.history-panel-head h2{font-size:1.05rem;margin:0}.history-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}@media (max-width:640px){.history-grid{grid-template-columns:1fr}}.history-col h3{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-cyan);margin-bottom:10px}.history-list{list-style:none;margin:0;padding:0}.history-list li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--border-dim);font-size:.85rem}.history-list li a{color:var(--text-primary)}.history-list .h-meta{color:var(--text-faint);font-family:var(--font-mono);font-size:.72rem;white-space:nowrap}.history-empty{color:var(--text-faint);font-family:var(--font-mono);font-size:.82rem}.history-clear{margin-top:14px}.tools-grid-section{padding:10px 24px 50px}.tools-grid-section h2{text-align:center;font-size:1.2rem;margin-bottom:24px}.tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px;max-width:var(--max-width);margin:0 auto}.tool-card{background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:var(--radius-md);padding:18px 10px;text-align:center;transition:border-color 0.15s ease,transform 0.15s ease}.tool-card:hover{border-color:var(--accent-cyan);transform:translateY(-2px);text-decoration:none}.tool-card .tool-icon{width:34px;height:34px;margin:0 auto 10px;color:var(--accent-cyan)}.tool-card .tool-name{font-size:.76rem;color:var(--text-muted)}.tool-card:hover .tool-name{color:var(--text-primary)}.arena-section{padding:48px 24px 24px}.arena-heading{text-align:center;max-width:720px;margin:0 auto 32px}.arena-heading .eyebrow{font-family:var(--font-mono);color:var(--accent-cyan);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;display:block;margin-bottom:10px}.arena-heading h1{font-size:clamp(1.8rem, 4vw, 2.6rem);margin-bottom:10px}.arena-heading p{color:var(--text-muted);font-size:1rem}.stat-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:620px;margin:0 auto 20px}.stat-card{background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:var(--radius-md);padding:16px 10px;text-align:center;transition:border-color 0.2s ease,box-shadow 0.2s ease}.stat-card.is-live{border-color:var(--border-glow);box-shadow:0 0 20px -6px var(--accent-cyan)}.stat-label{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);margin-bottom:6px}.stat-value{font-family:var(--font-mono);font-size:1.9rem;font-weight:700;color:var(--text-primary)}.stat-card.is-live .stat-value{color:var(--accent-cyan)}.time-pills{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:620px;margin:0 auto 28px}.time-pill{font-family:var(--font-mono);font-size:.85rem;background:#fff0;color:var(--text-muted);border:1px solid var(--border-dim);border-radius:999px;padding:7px 16px;cursor:pointer;transition:all 0.15s ease}.time-pill:hover{border-color:var(--accent-cyan);color:var(--text-primary)}.time-pill.active{background:var(--accent-cyan-dim);border-color:var(--accent-cyan);color:var(--accent-cyan)}.pad-wrap{display:flex;justify-content:center;margin-bottom:16px}.click-pad{--pad-size:min(360px, 78vw);width:var(--pad-size);height:var(--pad-size);border-radius:50%;position:relative;background:radial-gradient(circle at 50% 42%,rgb(0 212 255 / .16),transparent 65%),var(--bg-surface-raised);border:2px solid var(--border-glow);box-shadow:0 0 0 1px rgb(0 212 255 / .08),0 0 40px -10px var(--accent-cyan),inset 0 0 60px -20px rgb(0 212 255 / .3);display:flex;align-items:center;justify-content:center;cursor:pointer;user-select:none;-webkit-tap-highlight-color:#fff0;transition:transform 0.05s ease,box-shadow 0.15s ease}.click-pad:active{transform:scale(.97);box-shadow:0 0 0 1px rgb(0 212 255 / .16),0 0 60px -6px var(--accent-cyan),inset 0 0 80px -10px rgb(0 212 255 / .45)}.click-pad .pad-ring{position:absolute;inset:14px;border-radius:50%;border:1px dashed rgb(0 212 255 / .25);animation:spin 18s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.click-pad .pad-label{font-family:var(--font-display);font-size:clamp(1rem, 2.4vw, 1.3rem);color:var(--text-primary);text-align:center;padding:0 30px;z-index:2}.click-pad .pad-sub{display:block;font-family:var(--font-mono);font-size:.7rem;color:var(--accent-cyan);margin-top:8px;letter-spacing:.08em}.click-pad.is-running .pad-label{opacity:.35}.ripple{position:absolute;border-radius:50%;background:rgb(0 212 255 / .35);transform:scale(0);animation:ripple-out 0.5s ease-out forwards;pointer-events:none}@keyframes ripple-out{to{transform:scale(1);opacity:0}}.arena-actions{display:flex;justify-content:center;gap:12px;margin-bottom:8px}.btn{font-family:var(--font-mono);font-size:.85rem;padding:10px 22px;border-radius:var(--radius-sm);border:1px solid var(--border-dim);background:#fff0;color:var(--text-muted);cursor:pointer;transition:all 0.15s ease}.btn:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}.btn.btn-primary{background:var(--accent-cyan);border-color:var(--accent-cyan);color:#001018;font-weight:700}.btn.btn-primary:hover{box-shadow:0 0 20px -4px var(--accent-cyan)}.modal-overlay{position:fixed;inset:0;background:rgb(5 7 12 / .82);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;z-index:200;padding:20px}.modal-overlay.open{display:flex}.result-modal{background:var(--bg-surface);border:1px solid var(--border-glow);border-radius:var(--radius-lg);padding:32px;max-width:420px;width:100%;text-align:center;box-shadow:0 0 60px -10px rgb(0 212 255 / .4)}.result-modal .eyebrow{font-family:var(--font-mono);color:var(--accent-magenta);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase}.result-modal .cps-big{font-family:var(--font-mono);font-size:3.4rem;color:var(--accent-cyan);margin:10px 0 0;line-height:1}.result-modal .cps-big span{font-size:1.1rem;color:var(--text-muted)}.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}.result-grid div{background:var(--bg-surface-raised);border-radius:var(--radius-sm);padding:10px 4px}.result-grid .r-label{font-family:var(--font-mono);font-size:.62rem;color:var(--text-faint);text-transform:uppercase}.result-grid .r-value{font-family:var(--font-mono);font-size:1.1rem;color:var(--text-primary);margin-top:4px}.rank-line{font-family:var(--font-mono);font-size:.85rem;color:var(--accent-amber);margin-bottom:18px}.modal-actions{display:flex;gap:10px;justify-content:center}.name-prompt{display:flex;gap:8px;margin:14px 0 0}.name-prompt input{flex:1;background:var(--bg-base);border:1px solid var(--border-dim);color:var(--text-primary);font-family:var(--font-mono);border-radius:var(--radius-sm);padding:8px 10px}.name-prompt input:focus{outline:none;border-color:var(--accent-cyan)}.leaderboard-section{padding:40px 24px 60px}.panel{background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:var(--radius-lg);padding:26px;max-width:620px;margin:0 auto}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.panel-head h2{font-size:1.1rem;margin:0}.panel-head .live-dot{font-family:var(--font-mono);font-size:.68rem;color:var(--accent-cyan);display:flex;align-items:center;gap:6px}.panel-head .live-dot::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--accent-cyan);box-shadow:0 0 8px 1px var(--accent-cyan)}.leaderboard-list{list-style:none;margin:0;padding:0}.leaderboard-list li{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:12px;padding:10px 8px;border-bottom:1px solid var(--border-dim);font-family:var(--font-mono);font-size:.9rem}.leaderboard-list li:last-child{border-bottom:none}.leaderboard-list .rank{color:var(--text-faint)}.leaderboard-list li:nth-child(1) .rank{color:var(--accent-amber)}.leaderboard-list li:nth-child(2) .rank{color:#c9d3e0}.leaderboard-list li:nth-child(3) .rank{color:#c98a4a}.leaderboard-list .lb-name{color:var(--text-primary)}.leaderboard-list .lb-score{color:var(--accent-cyan)}.leaderboard-empty{color:var(--text-faint);font-family:var(--font-mono);font-size:.85rem;text-align:center;padding:20px 0}.content-section{padding:20px 24px 60px;max-width:820px;margin:0 auto}.content-section h2{font-size:1.3rem;border-left:3px solid var(--accent-cyan);padding-left:12px;margin-top:2.2em}.content-section p{color:var(--text-muted)}.contact-form{display:flex;flex-direction:column;gap:16px;margin-bottom:10px}.contact-field{display:flex;flex-direction:column;gap:6px;font-size:.85rem;color:var(--text-muted)}.contact-field input,.contact-field textarea{background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:var(--radius-sm);padding:11px 13px;color:var(--text-primary);font-family:var(--font-body,inherit);font-size:.95rem;resize:vertical}.contact-field input:focus,.contact-field textarea:focus{outline:none;border-color:var(--accent-cyan)}.contact-form .btn.btn-primary{align-self:flex-start}.contact-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.contact-notice{border-radius:var(--radius-sm);padding:12px 16px;margin-bottom:20px;font-size:.9rem;border:1px solid var(--border-dim)}.contact-notice-success{border-color:var(--accent-cyan);color:var(--accent-cyan);background:var(--accent-cyan-dim)}.contact-notice-error{border-color:#ff5c73;color:#ff8a97;background:rgb(255 92 115 / .1)}.site-footer{border-top:1px solid var(--border-dim);padding:30px 24px;text-align:center;color:var(--text-faint);font-family:var(--font-mono);font-size:.8rem}.site-footer a{color:var(--text-muted)}@media (max-width:480px){.stat-value{font-size:1.4rem}.result-modal{padding:24px 18px}}.tool-icon-badge{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:14px;background:var(--accent-cyan-dim);border:1px solid var(--border-glow);color:var(--accent-cyan);margin-bottom:10px}.tool-icon-badge .tool-icon{display:block}.tool-nav-label .tool-icon,.tool-grid-item .tool-icon{width:16px;height:16px;flex-shrink:0}.faq-list{display:flex;flex-direction:column;gap:10px;margin-top:16px}.faq-item{background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:10px;padding:4px 18px}.faq-item summary{cursor:pointer;list-style:none;padding:14px 0;font-weight:600;color:var(--text-primary);display:flex;justify-content:space-between;align-items:center}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary::after{content:'+';color:var(--accent-cyan);font-size:1.2rem;margin-left:12px;flex-shrink:0}.faq-item[open] summary::after{content:'−'}.faq-item p{color:var(--text-muted);padding-bottom:14px;margin:0}.ad-slot{margin:22px auto;max-width:728px;min-height:90px;display:flex;align-items:center;justify-content:center;overflow:hidden}.ad-slot-sidebar{max-width:none;margin:16px 12px}.lang-switcher{position:relative}.lang-switcher-btn{display:flex;align-items:center;gap:4px}.lang-switcher-code{font-family:var(--font-mono);font-size:.7rem;color:var(--text-muted)}.lang-switcher-menu{display:none;position:absolute;right:0;top:calc(100% + 8px);background:var(--bg-surface-raised);border:1px solid var(--border-dim);border-radius:10px;padding:6px;min-width:170px;z-index:50;list-style:none;box-shadow:0 12px 30px rgb(0 0 0 / .4)}.lang-switcher-menu.open{display:block}.lang-switcher-menu li{padding:9px 12px;border-radius:6px;cursor:pointer;color:var(--text-muted);font-size:.88rem}.lang-switcher-menu li:hover{background:var(--accent-cyan-dim);color:var(--text-primary)}.typing-root{max-width:720px;margin:0 auto}.typing-passage{font-family:var(--font-mono);font-size:1.05rem;line-height:1.9;color:var(--text-faint);background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:12px;padding:20px;margin-bottom:14px;max-height:160px;overflow-y:auto}.typing-passage .ty-ok{color:var(--accent-cyan)}.typing-passage .ty-bad{color:var(--accent-magenta);text-decoration:underline}.typing-passage .ty-cursor{background:var(--accent-cyan-dim);border-radius:2px}.typing-input{width:100%;resize:none;background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:12px;color:var(--text-primary);font-family:var(--font-mono);font-size:1rem;padding:14px}.typing-input:focus{outline:2px solid var(--accent-cyan)}.reaction-pad.is-waiting{background:var(--accent-magenta-dim);border-color:var(--accent-magenta)}.reaction-pad.is-armed{background:rgb(50 220 120 / .18);border-color:#32dc78}.reaction-pad.is-early{background:var(--accent-magenta-dim);border-color:var(--accent-magenta)}.reaction-times-list{margin-top:10px;padding-left:18px;color:var(--text-muted)}.aim-field{position:relative;max-width:720px;height:360px;margin:0 auto;background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:14px;overflow:hidden;cursor:crosshair}.aim-target{position:absolute;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--accent-cyan),var(--accent-magenta));box-shadow:0 0 18px var(--accent-cyan);cursor:pointer}.aim-start-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.calc-box{max-width:560px;margin:0 auto;background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:14px;padding:22px}.calc-row{display:flex;flex-wrap:wrap;gap:14px;align-items:end;margin-bottom:12px}.calc-row label{display:flex;flex-direction:column;gap:6px;font-size:.82rem;color:var(--text-muted);flex:1 1 160px}.calc-row input{background:var(--bg-void);border:1px solid var(--border-dim);border-radius:8px;padding:10px 12px;color:var(--text-primary);font-family:var(--font-mono)}.calc-result{color:var(--accent-cyan);font-family:var(--font-mono);min-height:1.2em}.calc-box hr{border:none;border-top:1px solid var(--border-dim);margin:18px 0}.kbtest-root{max-width:900px;margin:0 auto;user-select:none}.kb-row{display:flex;gap:5px;margin-bottom:5px;justify-content:center}.kb-key{background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:6px;color:var(--text-muted);font-family:var(--font-mono);font-size:.72rem;display:flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 6px;transition:background 0.08s,color 0.08s}.kb-key.kb-Space{min-width:220px}.kb-key.kb-Backspace,.kb-key.kb-Enter,.kb-key.kb-Tab,.kb-key.kb-CapsLock{min-width:60px}.kb-key.kb-ShiftLeft,.kb-key.kb-ShiftRight{min-width:70px}.kb-key.is-pressed{background:var(--accent-cyan);color:var(--bg-void);border-color:var(--accent-cyan)}.kbtest-hint{text-align:center;color:var(--text-faint);margin-top:14px;font-size:.85rem}.result-inline{max-width:520px;margin:16px auto 0;text-align:center;background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:10px;padding:14px 18px;color:var(--text-primary)}@media (max-width:700px){.kb-key{min-width:24px;height:28px;font-size:.62rem}.kb-key.kb-Space{min-width:120px}.aim-field{height:280px}}.tool-subnav li a{display:flex;align-items:center;gap:8px}