:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100vh;background:#050510;color:#fafafa}.shell{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;gap:2rem}.title{font-size:2.5rem;font-weight:800;letter-spacing:-.03em;text-align:center;background:linear-gradient(135deg,#0ff,#f0f,#ff0);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 20px rgba(0,255,255,.3))}.status{font-size:1.1rem;color:#ffffffb3;text-align:center;min-height:1.6em}.reaction-btn{position:relative;width:260px;height:260px;border-radius:50%;border:3px solid rgba(255,255,255,.08);background:#ffffff08;color:#ffffff80;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .15s ease;outline:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.reaction-btn:hover{border-color:#ffffff26;background:#ffffff0d}.reaction-btn.waiting{border-color:#ff323299;background:#ff323214;color:#ff6b6b;box-shadow:0 0 30px #ff323233,0 0 60px #ff32321a,inset 0 0 30px #ff32320d;animation:pulse-red 1.5s ease-in-out infinite}.reaction-btn.go{border-color:#00ff96cc;background:#00ff961f;color:#00ff96;box-shadow:0 0 40px #00ff9666,0 0 80px #00ff9633,0 0 120px #00ff961a,inset 0 0 40px #00ff9614;animation:pulse-green .4s ease-in-out infinite;transform:scale(1.05)}.reaction-btn.too-early{border-color:#ff6400cc;background:#ff64001f;color:#ff8c00;box-shadow:0 0 30px #ff64004d,inset 0 0 20px #ff640014}.reaction-btn.result{border-color:#00c8ffb3;background:#00c8ff14;color:#00d4ff;box-shadow:0 0 30px #00c8ff40,inset 0 0 20px #00c8ff0d}@keyframes pulse-red{0%,to{box-shadow:0 0 30px #ff323233,0 0 60px #ff32321a,inset 0 0 30px #ff32320d}50%{box-shadow:0 0 50px #ff323259,0 0 100px #ff323226,inset 0 0 40px #ff323214}}@keyframes pulse-green{0%,to{box-shadow:0 0 40px #00ff9666,0 0 80px #00ff9633,inset 0 0 40px #00ff9614}50%{box-shadow:0 0 60px #00ff9699,0 0 120px #00ff964d,inset 0 0 50px #00ff961f}}.result-time{font-size:3.5rem;font-weight:800;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-align:center;background:linear-gradient(135deg,#0ff,#00ff96);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 15px rgba(0,255,200,.4))}.result-time.slow{background:linear-gradient(135deg,#ff8c00,#f44);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 15px rgba(255,100,0,.4))}.stats{display:flex;gap:2.5rem;padding:1.25rem 2rem;border:1px solid rgba(255,255,255,.08);border-radius:1rem;background:#ffffff05}.stat{text-align:center}.stat-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.15em;color:#fff6;margin-bottom:.25rem}.stat-value{font-size:1.5rem;font-weight:700;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#0ff;text-shadow:0 0 10px rgba(0,255,255,.3)}.stat-value.none{color:#fff3;font-size:1.2rem;text-shadow:none}.history{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;max-width:400px}.history-dot{width:36px;height:36px;border-radius:.5rem;display:grid;place-items:center;font-size:.55rem;font-weight:700;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;border:1px solid rgba(255,255,255,.06)}.history-dot.fast{background:#00ff9626;color:#00ff96;border-color:#00ff964d;box-shadow:0 0 8px #00ff9626}.history-dot.medium{background:#00c8ff1f;color:#00d4ff;border-color:#00c8ff40;box-shadow:0 0 8px #00c8ff1f}.history-dot.slow{background:#ff64001f;color:#ff8c00;border-color:#ff640040;box-shadow:0 0 8px #ff64001f}.history-dot.miss{background:#ff32321f;color:#ff6b6b;border-color:#ff323240}.reset-btn{background:none;border:1px solid rgba(255,255,255,.1);color:#fff6;padding:.5rem 1.25rem;border-radius:.5rem;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .15s}.reset-btn:hover{border-color:#fff3;color:#ffffffb3;background:#ffffff08}.bg-glow{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(0,255,255,.04) 0%,transparent 70%);pointer-events:none;z-index:-1;transition:all .5s ease}.bg-glow.active{background:radial-gradient(circle,rgba(0,255,150,.1) 0%,transparent 70%);width:800px;height:800px}