:root{--neon-cyan: #00ffff;--neon-magenta: #ff00ff;--neon-yellow: #ffff00;--bg-dark: #0a0a1a;--bg-darker: #000008;--text-primary: #ffffff;--text-secondary: #aaaacc;--glow-cyan: 0 0 10px rgba(0, 255, 255, .6), 0 0 20px rgba(0, 255, 255, .3);--glow-magenta: 0 0 10px rgba(255, 0, 255, .6), 0 0 20px rgba(255, 0, 255, .3)}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--bg-darker);color:var(--text-primary);font-family:Courier New,Lucida Console,monospace;overflow:hidden;width:100vw;height:100vh}#root{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.game-container{display:flex;flex-direction:column;align-items:center;gap:12px}.start-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;text-align:center}.start-screen h1{font-size:4rem;color:var(--neon-cyan);text-shadow:var(--glow-cyan);letter-spacing:.3em;animation:titlePulse 2s ease-in-out infinite}@keyframes titlePulse{0%,to{opacity:1;text-shadow:var(--glow-cyan)}50%{opacity:.8;text-shadow:0 0 20px rgba(0,255,255,.8),0 0 40px rgba(0,255,255,.4)}}.start-screen .controls-info{color:var(--text-secondary);font-size:.9rem;line-height:1.8}.start-screen .controls-info span{color:var(--neon-cyan)}.start-screen .controls-info .p2{color:var(--neon-magenta)}.start-button,.settings-button{background:transparent;border:2px solid var(--neon-cyan);color:var(--neon-cyan);font-family:inherit;font-size:1.4rem;padding:12px 40px;cursor:pointer;text-transform:uppercase;letter-spacing:.2em;transition:all .2s ease;text-shadow:var(--glow-cyan);box-shadow:var(--glow-cyan)}.start-button:hover,.settings-button:hover{background:#00ffff1a;box-shadow:0 0 20px #0ff9,0 0 40px #00ffff4d}.settings-button{font-size:1rem;padding:10px 28px}.settings-screen{width:min(760px,calc(100vw - 24px));padding:28px;border:1px solid rgba(0,255,255,.25);background:linear-gradient(180deg,#00ffff14,#ff00ff0a),#050a19f0;box-shadow:0 0 30px #00ffff1f}.settings-screen h1{font-size:2.4rem;color:var(--neon-cyan);text-shadow:var(--glow-cyan);margin-bottom:8px}.settings-intro{color:var(--text-secondary);margin-bottom:20px}.settings-grid{display:grid;gap:14px}.settings-field,.settings-toggle{display:grid;gap:6px;padding:14px;border:1px solid rgba(255,255,255,.08);background:#ffffff08}.settings-field span,.settings-toggle span{color:var(--text-primary);font-size:1rem;letter-spacing:.08em}.settings-field small,.settings-toggle small{color:var(--text-secondary);line-height:1.5;margin-top:4px}.settings-field select{margin-top:4px;padding:10px 12px;background:#00000059;color:var(--text-primary);border:1px solid rgba(0,255,255,.3);font-family:inherit}.settings-toggle{grid-template-columns:1fr auto;align-items:center;gap:12px}.settings-toggle input{width:18px;height:18px;accent-color:var(--neon-cyan)}.settings-actions{display:flex;justify-content:space-between;gap:12px;margin-top:22px}.settings-button.secondary{border-color:#fff6;color:var(--text-primary);box-shadow:none;text-shadow:none}.settings-button.primary{border-color:var(--neon-yellow);color:var(--neon-yellow);box-shadow:0 0 12px #ff03;text-shadow:0 0 10px rgba(255,255,0,.35)}.settings-button.primary:hover{background:#ffff0014;box-shadow:0 0 20px #ffff0059}.settings-button.secondary:hover{background:#ffffff14;box-shadow:none}.hud-shell{width:100%;max-width:600px;display:grid;gap:10px}.announcement-banner{min-height:3.5rem;padding:14px 18px;text-align:center;font-size:1.8rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;border:1px solid rgba(255,255,255,.18);background:#ffffff0f;opacity:1;transition:opacity .5s ease}.announcement-banner.hit{color:var(--neon-magenta);border-color:#ff00ff59;box-shadow:var(--glow-magenta)}.announcement-banner.power-up{color:var(--neon-yellow);border-color:#ffff0059;box-shadow:0 0 10px #ffff0059}.announcement-banner.is-fading{opacity:.35}.hud{display:flex;justify-content:space-between;width:100%;padding:0 10px}.score{font-size:1.2rem;font-weight:700;letter-spacing:.1em}.score.player1{color:var(--neon-cyan);text-shadow:var(--glow-cyan)}.score.player2{color:var(--neon-magenta);text-shadow:var(--glow-magenta)}.status-bar{display:flex;justify-content:space-between;gap:12px;width:100%;padding:0 10px}.status{min-height:1.2rem;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase}.status.player1{color:#00ffffd9}.status.player2{color:#ff00ffd9;text-align:right}.game-over-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;text-align:center}.game-over-screen h1{font-size:3rem;color:#f33;text-shadow:0 0 10px rgba(255,50,50,.6),0 0 20px rgba(255,50,50,.3);animation:titlePulse 1.5s ease-in-out infinite}.game-over-screen .scores{display:flex;gap:60px;font-size:1.3rem}.game-over-screen .final-score.player1{color:var(--neon-cyan);text-shadow:var(--glow-cyan)}.game-over-screen .final-score.player2{color:var(--neon-magenta);text-shadow:var(--glow-magenta)}.restart-button{background:transparent;border:2px solid var(--neon-yellow);color:var(--neon-yellow);font-family:inherit;font-size:1.1rem;padding:10px 30px;cursor:pointer;text-transform:uppercase;letter-spacing:.2em;transition:all .2s ease}.restart-button:hover{background:#ffff001a;box-shadow:0 0 20px #ff09}canvas{border:1px solid rgba(0,255,255,.2);box-shadow:0 0 15px #00ffff26;max-width:calc(100vw - 16px);max-height:70vh;aspect-ratio:1;touch-action:none}@media(max-width:640px){.start-screen h1{font-size:2.5rem}body:has(.settings-screen){overflow:auto}body:has(.settings-screen) #root{align-items:flex-start}.settings-screen{padding:24px 18px 100px;max-height:none;overflow:visible}.settings-screen h1{font-size:1.8rem}.settings-intro{font-size:.85rem;margin-bottom:14px}.settings-grid{gap:10px}.settings-field,.settings-toggle{padding:10px}.settings-field small,.settings-toggle small{font-size:.75rem}.settings-toggle input{width:28px;height:28px}.settings-actions{position:fixed;bottom:0;left:0;right:0;flex-direction:row;padding:14px 18px;margin-top:0;background:#050a19f5;border-top:1px solid rgba(0,255,255,.25);box-shadow:0 -4px 20px #00000080;z-index:10}.settings-actions .settings-button{flex:1;padding:14px 12px;font-size:1rem}.status-bar{flex-direction:column}.status.player2{text-align:left}.hud{max-width:calc(100vw - 16px)}}
