:root{--bg:#000000;--fg:#ffffff;--panel:#1a2e0a;--panel-light:#8fb432;--line:#c5e644;--accent:#e6ff00;--accent2:#9dd633;--danger:#ff0066;--orange:#ff9900;--ui-font: "Orbitron", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;--display-font: "Michroma", "Orbitron", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;--left:#6cc3ff;--down:#ff7b7b;--up:#9bff83;--right:#ffd96e;--ghost: rgba(255,255,255,.2);--extreme-green:#8fb432;--extreme-yellow:#e6ff00;--extreme-dark:#0a1005}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;color:var(--fg);font-family:var(--ui-font);font-weight:700;letter-spacing:.3px;background:linear-gradient(135deg,#1a2e0a,#0a1005,#000);background-attachment:fixed}a{color:inherit;text-decoration:none}button{background:linear-gradient(180deg,#c5e644,#8fb432);border:2px solid #e6ff00;color:#000;padding:.8rem 1.2rem;border-radius:0;cursor:pointer;box-shadow:0 4px #4a5d1f,0 6px 12px #00000080;font-weight:800;text-transform:uppercase;letter-spacing:1px;font-family:var(--ui-font)}button:active{transform:translateY(2px);box-shadow:0 2px #4a5d1f,0 3px 6px #00000080}.container{max-width:980px;margin:0 auto;padding:1rem 1rem 5.5rem}.row{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}.card{background:linear-gradient(135deg,#2d4a14,#1a2e0a);border:3px solid #c5e644;border-radius:0;padding:1rem;position:relative;overflow:hidden;font-family:var(--ui-font)}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#e6ff00,#c5e644,#e6ff00)}.list{display:grid;gap:1rem}.song{display:flex;align-items:center;gap:1rem;background:linear-gradient(135deg,#1a2e0a,#0a1005);border:2px solid #8fb432;border-left:8px solid #e6ff00;transition:all .2s}.song:hover{background:linear-gradient(135deg,#2d4a14,#1a2e0a);border-color:#c5e644;transform:translate(4px)}.song .meta{flex:1;text-shadow:2px 2px 0 #000;font-family:var(--ui-font)}.song .title{font-family:var(--display-font);font-weight:700;letter-spacing:1.2px;color:#e6ff00;font-size:1.1rem;text-transform:uppercase}.song .artist{color:#c5e644;font-size:.9rem;font-weight:700}.badge{background:linear-gradient(135deg,#f90,#f60);border:2px solid #fff;border-radius:0;padding:.3rem .8rem;color:#fff;font-weight:800;text-shadow:1px 1px 0 #000;box-shadow:0 2px 4px #00000080;font-family:var(--ui-font)}h1,h2,h3,h4,h5,h6{font-family:var(--display-font);font-weight:700;letter-spacing:1.5px}h2{color:#e6ff00;text-transform:uppercase;font-size:2rem;text-shadow:3px 3px 0 #000,0 0 20px rgba(230,255,0,.5);margin:1rem 0}input[type=file]{display:none}input[type=text],input[type=number]{background:#0a1005;color:#e6ff00;border:2px solid #8fb432;border-radius:0;padding:.5rem .7rem;font-weight:700;font-family:var(--ui-font)}.playfield{position:relative}.playfield canvas{display:block}canvas{width:100%;height:62vh;border-radius:0;background:linear-gradient(180deg,#000,#0a1005);border:3px solid #c5e644;box-shadow:0 0 20px #e6ff004d,inset 0 0 30px #000c}.lifebar{position:relative;height:24px;border-radius:0;overflow:hidden;border:3px solid #e6ff00;background:linear-gradient(90deg,#000,#1a0000);box-shadow:0 0 10px #e6ff0080,inset 0 2px 8px #000c;margin-bottom:12px}.lifebar .fill{position:absolute;left:0;top:0;bottom:0;width:30%;background:linear-gradient(90deg,#0f0,#6f0,#9f0);box-shadow:0 0 20px #0f0c}.lifebar .ticks{position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.3) 0 2px,transparent 2px 20px);mix-blend-mode:overlay}.hud{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;margin-bottom:8px;background:linear-gradient(90deg,rgba(143,180,50,.2),transparent);border-left:4px solid #e6ff00;font-family:var(--ui-font)}.hud .info{font-weight:800;color:#c5e644;text-shadow:2px 2px 0 #000}.hud .score{font-weight:900;letter-spacing:2px;color:#e6ff00;font-size:1.2rem;text-shadow:2px 2px 0 #000}.hud .judge{font-family:var(--display-font);font-weight:900;font-size:32px;text-shadow:0 0 10px currentColor,2px 2px 0 #000,0 0 30px currentColor}.touchOverlay{position:absolute;left:0;right:0;bottom:10px;height:180px;pointer-events:none}.pad{position:absolute;left:50%;top:50%;width:240px;height:240px;transform:translate(-50%,-50%)}.pad .btn{position:absolute;width:90px;height:90px;border-radius:0;background:linear-gradient(135deg,#8fb432,#c5e644);border:3px solid #e6ff00;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 8px #0009,0 0 15px #e6ff0066;opacity:.95;pointer-events:auto;font-family:var(--ui-font)}.pad .btn:active{transform:scale(.95);background:linear-gradient(135deg,#e6ff00,#ff6);box-shadow:0 0 25px #e6ff00cc}.pad .btn svg{width:58px;height:58px;filter:drop-shadow(2px 2px 2px rgba(0,0,0,.8))}.btn-left{left:0;top:50%;transform:translate(-10%,-50%)}.btn-right{right:0;top:50%;transform:translate(10%,-50%)}.btn-up{left:50%;top:0;transform:translate(-50%,-10%)}.btn-down{left:50%;bottom:0;transform:translate(-50%,10%)}.results{max-width:760px;margin:1rem auto;padding:1.5rem;border:3px solid #c5e644;border-radius:0;background:linear-gradient(135deg,#1a2e0a,#0a1005);box-shadow:0 0 30px #e6ff004d;font-family:var(--ui-font)}.results h3{margin:.5rem 0 1.5rem;color:#e6ff00;text-transform:uppercase;text-shadow:3px 3px 0 #000;font-size:1.8rem;font-family:var(--display-font)}.results .grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.results .card{background:linear-gradient(135deg,#2d4a14,#1a2e0a);border:2px solid #8fb432;border-radius:0;padding:1rem;color:#c5e644;text-shadow:1px 1px 0 #000;font-family:var(--ui-font)}.results .card div{margin:.4rem 0;font-weight:700}.bottomnav{position:fixed;left:0;right:0;bottom:0;background:linear-gradient(180deg,#2d4a14,#1a2e0a);border-top:3px solid #e6ff00;display:flex;justify-content:space-around;align-items:center;padding:.8rem;z-index:50;box-shadow:0 -4px 20px #00000080;font-family:var(--ui-font)}.navbtn{display:flex;flex-direction:column;align-items:center;gap:.3rem;font-size:.85rem;color:#c5e644;font-weight:900;text-transform:uppercase;text-shadow:1px 1px 0 #000;letter-spacing:.8px}.navbtn:hover{color:#e6ff00}.admin-section{background:linear-gradient(135deg,#2d4a14,#1a2e0a);border:2px solid #8fb432;padding:1.5rem;margin:1rem 0;font-family:var(--ui-font)}.admin-section h3{color:#e6ff00;text-transform:uppercase;margin-bottom:1rem;text-shadow:2px 2px 0 #000;font-family:var(--display-font)}.settings-item{background:linear-gradient(135deg,#1a2e0a,#0a1005);border:2px solid #8fb432;padding:1rem;margin:.5rem 0;font-family:var(--ui-font)}.settings-item label{color:#c5e644;font-weight:700;text-transform:uppercase;letter-spacing:.8px}@media (min-width:920px){.container{padding-bottom:1rem}}
