:root{--mag:#ff2bd6;--cy:#22f0ff;--yel:#ffe53b;--bg:#0b0118;--org:#ff9a1f}
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);font-family:'Orbitron',sans-serif;color:#fff;touch-action:none;user-select:none;-webkit-user-select:none}
#scene-container{position:fixed;inset:0}
#scanlines{position:fixed;inset:0;pointer-events:none;z-index:50;background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px);mix-blend-mode:multiply}
#scanlines.off{display:none}
.hidden{display:none!important}
.panel{position:fixed;background:rgba(20,0,40,.55);backdrop-filter:blur(6px);border:2px solid var(--mag);box-shadow:0 0 14px var(--mag),inset 0 0 10px rgba(255,43,214,.3);border-radius:8px;padding:8px 12px;z-index:10}
#scorePanel{top:10px;left:10px;min-width:170px}
#hiPanel{top:10px;right:10px;border-color:var(--cy);box-shadow:0 0 14px var(--cy)}
.lbl{font-family:'Press Start 2P';font-size:9px;color:var(--cy);letter-spacing:2px}
.led{font-family:'Press Start 2P';font-size:20px;color:var(--org);text-shadow:0 0 6px var(--org),0 0 16px #ff5500;margin:4px 0}
.led.small{font-size:12px}.led.big{font-size:32px;margin:14px 0}
.row{display:flex;justify-content:space-between;font-family:'Press Start 2P';font-size:9px;color:var(--yel);gap:10px;align-items:center}
#balls span{display:inline-block;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#fff,#889 60%,#223);margin-left:3px;box-shadow:0 0 4px #fff}
#combo{font-family:'Press Start 2P';font-size:10px;color:var(--mag);margin-top:4px;min-height:12px;text-shadow:0 0 8px var(--mag)}
#powerups{position:fixed;right:10px;top:70px;display:flex;flex-direction:column;gap:6px;z-index:10}
.pu{display:flex;align-items:center;gap:6px;font-family:'Press Start 2P';font-size:8px;background:rgba(0,0,0,.5);padding:4px 8px;border-radius:20px;border:1px solid currentColor}
.pu i{width:18px;height:18px;border-radius:50%;display:inline-block}
#plunger{position:fixed;right:14px;bottom:60px;width:18px;height:130px;border:2px solid var(--yel);border-radius:9px;overflow:hidden;z-index:10;background:rgba(0,0,0,.5);box-shadow:0 0 10px var(--yel)}
#plunger span{position:absolute;bottom:-18px;left:-6px;font-size:7px;font-family:'Press Start 2P';color:var(--yel)}
#plungerFill{position:absolute;bottom:0;width:100%;height:0;background:linear-gradient(0deg,var(--cy),var(--mag),var(--yel))}
#flash{position:fixed;top:38%;left:0;right:0;text-align:center;font-family:'Press Start 2P';font-size:clamp(18px,4vw,40px);color:var(--yel);text-shadow:0 0 10px var(--mag),0 0 30px var(--mag);pointer-events:none;z-index:20;opacity:0;transition:opacity .2s}
#flash.show{opacity:1;animation:zoom .5s ease-out}
#flash small{display:block;font-size:.4em;color:var(--cy);margin-top:14px;text-shadow:0 0 8px var(--cy)}
@keyframes zoom{from{transform:scale(2.2)}to{transform:scale(1)}}
#popups{position:fixed;inset:0;pointer-events:none;z-index:15}
.pop{position:absolute;font-family:'Press Start 2P';font-size:12px;transform:translate(-50%,-50%);animation:rise .9s ease-out forwards;text-shadow:0 0 6px currentColor;white-space:nowrap}
@keyframes rise{from{opacity:1;margin-top:0}to{opacity:0;margin-top:-60px}}
.screen{position:fixed;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:radial-gradient(ellipse at center,rgba(40,0,70,.55),rgba(5,0,15,.85));text-align:center;padding:20px}
h1{font-family:'Press Start 2P';font-size:clamp(26px,6vw,62px);line-height:1.3;color:var(--cy);text-shadow:0 0 8px var(--cy),0 0 30px var(--cy),4px 4px 0 var(--mag)}
h1 span{color:var(--mag);text-shadow:0 0 8px var(--mag),0 0 30px var(--mag),4px 4px 0 var(--cy)}
h2{font-family:'Press Start 2P';font-size:clamp(22px,5vw,40px);color:var(--mag);text-shadow:0 0 14px var(--mag)}
h3{font-family:'Press Start 2P';font-size:10px;color:var(--cy);margin-bottom:6px}
.tag{font-weight:400;font-size:13px;color:#d9c8ff;letter-spacing:1px}
button{font-family:'Press Start 2P';font-size:12px;padding:12px 18px;background:rgba(0,0,0,.4);color:var(--yel);border:2px solid var(--yel);border-radius:6px;cursor:pointer;box-shadow:0 0 10px rgba(255,229,59,.5)}
button:hover{background:var(--yel);color:#000}
.pulse{animation:pulse 1.1s infinite}
@keyframes pulse{50%{box-shadow:0 0 30px var(--yel);transform:scale(1.05)}}
.toggles{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.toggles button{font-size:9px;padding:8px 10px;color:var(--cy);border-color:var(--cy);box-shadow:0 0 8px rgba(34,240,255,.4)}
.controls{font-size:11px;color:#bba;line-height:1.9}
.controls b{color:var(--yel);font-family:'Press Start 2P';font-size:9px}
.auth{font-size:10px;color:#a9f}
.auth a{color:var(--cy)}
#entry{display:flex;gap:8px}
#initials{font-family:'Press Start 2P';font-size:20px;width:110px;text-align:center;background:#000;color:var(--org);border:2px solid var(--org);border-radius:6px;padding:8px;text-transform:uppercase}
.boards{display:flex;gap:30px;font-family:'Press Start 2P';font-size:9px;text-align:left}
.boards ol{padding-left:22px;line-height:1.9;color:#eee;min-width:130px}
#touchHint{position:fixed;inset:0;display:flex;z-index:5;pointer-events:none}
#touchHint div{flex:1;display:flex;align-items:flex-end;justify-content:center;padding-bottom:20vh;font-family:'Press Start 2P';font-size:12px;color:rgba(255,255,255,.35);border:2px dashed rgba(34,240,255,.2);text-align:center;line-height:1.8}
#mobileCtl{position:fixed;left:0;right:0;bottom:0;height:0;z-index:40;pointer-events:none}
.tbtn{position:fixed;pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent;font-size:10px;line-height:1.6;background:rgba(20,0,40,.45);backdrop-filter:blur(4px)}
.tbtn:hover{background:rgba(20,0,40,.45);color:var(--yel)}
.tbtn.on{background:var(--mag)!important;color:#fff!important;box-shadow:0 0 24px var(--mag)}
.tbtn.flip{bottom:24px;width:28vw;max-width:150px;height:90px;border-color:var(--mag);color:var(--mag);box-shadow:0 0 12px rgba(255,43,214,.5)}
#tLeft{left:10px}#tRight{right:10px}
.tbtn.launch{bottom:24px;left:50%;transform:translateX(-50%);width:80px;height:90px;font-size:8px;border-color:var(--cy);color:var(--cy)}
.tbtn.launch.ready{animation:pulse 1s infinite;color:var(--yel);border-color:var(--yel)}
.tbtn.small{top:auto;bottom:124px;font-size:8px;padding:8px 10px;color:var(--cy);border-color:var(--cy)}
#tPause{left:10px}#tNudge{right:10px}
body.touch #plunger{bottom:150px}position:fixed;bottom:6px;left:8px;z-index:60;font-size:10px;color:rgba(255,255,255,.5);text-decoration:none;font-family:'Orbitron'}
#remix:hover{color:var(--cy)}
#remix{bottom:4px;left:50%;transform:translateX(-50%)}
@media (max-width:600px){.led{font-size:14px}#scorePanel{min-width:120px;padding:6px 8px}.boards{gap:12px}}