:root{--bg: #000;--fg: #fff;--border: #444;--dim: #888}*{box-sizing:border-box;margin:0;padding:0}button,input,select{font:inherit}body{font-family:Comic Neue,Comic Sans MS,Comic Sans,Chalkboard SE,cursive;background:var(--bg);color:var(--fg);overflow:hidden;width:100vw;height:100vh}.screen{display:none;position:absolute;top:0;right:0;bottom:0;left:0;flex-direction:column;align-items:center;justify-content:center;gap:16px;z-index:10;background:var(--bg)}.screen.active{display:flex}.screen.menu-screen{background:radial-gradient(ellipse at center,#0000 35%,#00000073);justify-content:flex-start;padding-top:6vh}.menu-screen .menu-card{position:absolute;right:4vw;top:50%;transform:translateY(-40%)}@media(max-aspect-ratio:5/4){.menu-screen .menu-card{right:auto;top:auto;bottom:4vh;transform:none}}.game-title{font-size:72px;font-weight:700;letter-spacing:1px;color:#ffd23a;-webkit-text-stroke:3px #5a3a00;paint-order:stroke fill;text-shadow:0 6px 0 #5a3a00,0 10px 24px rgba(0,0,0,.45)}.menu-card{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px 28px;max-width:min(420px,90vw);background:#0a0e1c9e;border:2px solid rgba(255,255,255,.18);border-radius:18px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);text-align:center}.menu-card h2{font-weight:400;font-size:24px}#btn-solo-lobby{margin-top:4px;padding:10px 24px;font-size:16px;background:#ffd23a;color:#3a2600;border:2px solid #5a3a00;border-radius:12px;cursor:pointer}#btn-solo-lobby:hover{filter:brightness(1.08)}h1{font-weight:400;font-size:32px}#qr-canvas{image-rendering:pixelated;width:240px;height:240px}#lobby-status{font-size:20px}#lobby-url{font-size:12px;color:var(--dim);word-break:break-all;max-width:80%;text-align:center}#controller-status{font-size:16px;color:#ccc}#game-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}#hud{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:12px 24px;z-index:5;pointer-events:none;font-size:24px}#hud-center{font-size:14px;color:var(--dim)}#ability-callout{position:absolute;top:56px;left:0;right:0;z-index:6;text-align:center;font-size:22px;pointer-events:none;opacity:0;transition:opacity .4s ease}#ability-callout.show{opacity:1;transition:none}#smash{position:absolute;top:26%;left:50%;z-index:7;font-size:72px;font-weight:700;letter-spacing:2px;color:#ffd23a;-webkit-text-stroke:3px #5a1a00;paint-order:stroke fill;text-shadow:0 5px 0 #5a1a00,0 0 24px rgba(255,140,0,.7);pointer-events:none;white-space:nowrap;opacity:0;transform:translate(-50%,-50%) rotate(-6deg) scale(.4)}#smash.show{animation:smash-pop .7s cubic-bezier(.2,1.6,.4,1) forwards}@keyframes smash-pop{0%{opacity:1;transform:translate(-50%,-50%) rotate(-6deg) scale(.4)}30%{opacity:1;transform:translate(-50%,-50%) rotate(-6deg) scale(1.15)}70%{opacity:1;transform:translate(-50%,-50%) rotate(-6deg) scale(1)}to{opacity:0;transform:translate(-50%,-60%) rotate(-6deg) scale(1)}}#combo{position:absolute;bottom:56px;left:50%;z-index:6;transform:translate(-50%);font-size:96px;font-weight:800;letter-spacing:4px;color:#fff;text-shadow:0 4px 14px rgba(0,0,0,.7),0 2px 6px rgba(0,0,0,.9);pointer-events:none;white-space:nowrap;opacity:0;transition:opacity .3s ease}#combo.show{opacity:1}#combo-count{display:inline-block;font-size:140px;font-weight:900}#combo.bump #combo-count{animation:combo-bump .25s ease-out}@keyframes combo-bump{0%{transform:scale(1.35)}to{transform:scale(1)}}#combo.on-fire{color:#fff6dc;animation:combo-fire .18s ease-in-out infinite alternate}@keyframes combo-fire{0%{text-shadow:0 0 10px #fff3b0,0 -14px 14px #ffd23a,6px -32px 24px #ff9a1a,-6px -52px 38px rgba(255,90,0,.85),3px -76px 55px rgba(220,40,0,.55),0 6px 15px rgba(0,0,0,.6)}to{text-shadow:0 0 14px #fff3b0,3px -18px 18px #ffd23a,-6px -38px 28px #ff9a1a,6px -62px 45px rgba(255,90,0,.85),-3px -90px 62px rgba(220,40,0,.55),0 6px 15px rgba(0,0,0,.6)}}#power{position:absolute;left:24px;bottom:40px;z-index:6;display:none;padding:0;border:none;background:none;cursor:pointer;outline:none}#power.show{display:block}#power-icon{width:96px;height:96px;display:block;filter:drop-shadow(0 3px 6px rgba(0,0,0,.55));pointer-events:none}#power-icon .power-full *{fill:url(#power-grad);stroke:url(#power-grad)}#power-icon .power-lines *{fill:none;stroke:#ffffffe6;stroke-width:2;stroke-linejoin:round}#overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#0009;pointer-events:none;transition:background .4s ease}#overlay.countdown-mode{background:transparent}#overlay.countdown-mode #overlay-title{font-size:88px;font-weight:800;color:#fff;text-shadow:0 0 25px rgba(255,255,255,.9),0 0 50px rgba(68,136,255,.8);animation:countdown-pop .9s cubic-bezier(.16,1,.3,1)}@keyframes countdown-pop{0%{transform:scale(1.6);opacity:0}25%{transform:scale(1);opacity:1}80%{transform:scale(1);opacity:1}to{transform:scale(.92);opacity:.6}}#overlay.victory-mode{background:radial-gradient(circle at center,#1e140026,#050508ad)}#overlay.victory-mode #overlay-badge{display:inline-block;font-size:15px;font-weight:800;letter-spacing:.32em;text-transform:uppercase;color:#fbbf24;text-shadow:0 0 14px rgba(251,191,36,.8);margin-bottom:8px}#overlay.victory-mode #overlay-title{font-size:78px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;margin:0;background:linear-gradient(180deg,#fff,#fef08a 35%,#f59e0b 85%,#d97706);-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 28px rgba(245,158,11,.85)) drop-shadow(0 4px 10px rgba(0,0,0,.9));animation:victory-pop .8s cubic-bezier(.16,1,.3,1)}#overlay.victory-mode #overlay-subtitle{font-size:22px;font-weight:600;letter-spacing:.16em;color:#fde68a;margin-top:8px;text-shadow:0 0 12px rgba(253,230,138,.6)}#overlay.victory-mode #overlay-score{display:block;font-size:17px;font-weight:700;letter-spacing:.22em;color:#e2e8f0;margin-top:12px;font-family:monospace}#overlay.victory-mode #overlay-btn{margin-top:26px;padding:14px 48px;font-size:18px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:#f59e0b38;border:2px solid #f59e0b;border-radius:8px;cursor:pointer;pointer-events:auto;box-shadow:0 0 25px #f59e0b66,inset 0 0 15px #f59e0b33;transition:all .2s ease}#overlay.victory-mode #overlay-btn:hover{background:#f59e0b;color:#000;box-shadow:0 0 35px #f59e0bd9;transform:translateY(-2px)}#overlay.defeat-mode{background:radial-gradient(circle at center,#0f141e2e,#05070cb8)}#overlay.defeat-mode #overlay-badge{display:inline-block;font-size:14px;font-weight:800;letter-spacing:.32em;text-transform:uppercase;color:#94a3b8;margin-bottom:8px}#overlay.defeat-mode #overlay-title{font-size:74px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;margin:0;background:linear-gradient(180deg,#f8fafc,#cbd5e1 45%,#64748b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 22px rgba(100,116,139,.6)) drop-shadow(0 4px 10px rgba(0,0,0,.9));animation:defeat-fade .8s ease-out}#overlay.defeat-mode #overlay-subtitle{font-size:20px;font-weight:500;letter-spacing:.14em;color:#94a3b8;margin-top:8px}#overlay.defeat-mode #overlay-score{display:block;font-size:17px;font-weight:700;letter-spacing:.22em;color:#64748b;margin-top:12px;font-family:monospace}#overlay.defeat-mode #overlay-btn{margin-top:26px;padding:14px 48px;font-size:18px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#e2e8f0;background:#64748b33;border:2px solid #64748b;border-radius:8px;cursor:pointer;pointer-events:auto;box-shadow:0 0 20px #64748b4d;transition:all .2s ease}#overlay.defeat-mode #overlay-btn:hover{background:#64748b;color:#fff;box-shadow:0 0 30px #94a3b8a6;transform:translateY(-2px)}@keyframes victory-pop{0%{transform:scale(.7);opacity:0}60%{transform:scale(1.06);opacity:1}to{transform:scale(1);opacity:1}}@keyframes defeat-fade{0%{transform:translateY(-16px);opacity:0}to{transform:translateY(0);opacity:1}}#overlay-content{text-align:center}#overlay-title{font-size:48px;font-weight:400}#overlay-subtitle{font-size:20px;color:var(--dim);margin-top:8px}#overlay-btn{margin-top:16px;padding:12px 32px;font-size:18px;border:1px solid var(--border);background:transparent;color:var(--fg);cursor:pointer;pointer-events:auto}#debug-bar{position:absolute;bottom:0;left:0;right:0;padding:8px;background:#000c;z-index:30;font-size:12px;color:var(--dim);text-align:center}.hud-bump{display:inline-block;animation:hud-score-bump .4s cubic-bezier(.18,1.4,.3,1)}@keyframes hud-score-bump{40%{transform:scale(1.4);color:#ffd23a}}#overlay.round-mode{pointer-events:auto;background:#080c188c}.round-card{position:relative;display:flex;flex-direction:column;align-items:center;padding:24px 32px;max-width:min(640px,94vw);width:100%;text-align:center;z-index:25}.round-particles{display:none}.round-kicker{font-size:22px;font-weight:700;letter-spacing:1px;color:#fff;-webkit-text-stroke:1.5px #1a1206;paint-order:stroke fill;text-shadow:0 3px 0 #1a1206}.round-title{margin:4px 0 0;font-size:clamp(52px,7vw,80px);font-weight:700;letter-spacing:1px;line-height:1.05;-webkit-text-stroke:3px #5a3a00;paint-order:stroke fill;text-shadow:0 6px 0 #5a3a00}#overlay.round-win-mode .round-title{color:#ffd23a;animation:round-title-pop .45s cubic-bezier(.18,1.4,.3,1) both}#overlay.round-lose-mode .round-title{color:#cbd5e1;-webkit-text-stroke-color:#1e293b;text-shadow:0 6px 0 #1e293b;animation:round-title-drop .35s ease-out both}@keyframes round-title-pop{0%{transform:scale(.6);opacity:0}}@keyframes round-title-drop{0%{transform:translateY(-14px);opacity:0}}.round-subtitle:empty{display:none}.round-scoreboard{display:flex;align-items:center;justify-content:center;gap:18px;margin:24px 0 16px;width:100%}.round-player-box{position:relative;flex:1;max-width:200px;min-width:140px;padding:14px 18px;border-radius:18px;background:#0a0e1cb8;border:3px solid rgba(255,255,255,.25);box-shadow:0 5px #00000073;display:flex;flex-direction:column;align-items:center;gap:6px;transition:transform .3s cubic-bezier(.18,1.4,.3,1),border-color .2s ease}.round-player-box.scored-point{border-color:#ffd23a;transform:translateY(-4px)}.point-popup{position:absolute;top:-16px;left:50%;transform:translate(-50%) scale(0);background:#ffd23a;color:#3a2600;border:3px solid #5a3a00;border-radius:9999px;padding:2px 14px;font-size:16px;font-weight:700;box-shadow:0 3px #5a3a00;white-space:nowrap;pointer-events:none;opacity:0;z-index:10}.point-popup.show-point{animation:point-pop .4s cubic-bezier(.18,1.4,.3,1) forwards}@keyframes point-pop{0%{opacity:0;transform:translate(-50%) translateY(8px) scale(.5)}to{opacity:1;transform:translate(-50%) translateY(-6px) scale(1)}}.round-player-meta{display:flex;align-items:center;gap:8px}.round-player-name{font-size:18px;font-weight:700;color:#f8fafc}.round-player-tag{font-size:12px;font-weight:700;background:#ffffff24;padding:2px 7px;border-radius:6px;color:#cbd5e1}.round-score-digit{font-size:56px;font-weight:700;line-height:1;color:#fff;-webkit-text-stroke:2px #1a1206;paint-order:stroke fill;text-shadow:0 4px 0 #1a1206}.round-score-digit.score-bump{animation:score-digit-bump .4s cubic-bezier(.18,1.4,.3,1)}@keyframes score-digit-bump{40%{transform:scale(1.3);color:#ffd23a}}.round-pips-row{display:flex;justify-content:center;gap:10px;margin-top:4px}.pip-circle{width:16px;height:16px;border-radius:50%;border:2.5px solid rgba(255,255,255,.4);background:#00000059;box-sizing:border-box}.pip-circle.filled{background:#ffd23a;border-color:#5a3a00}.pip-circle.just-filled{animation:pip-pop .35s cubic-bezier(.18,1.4,.3,1)}@keyframes pip-pop{0%{transform:scale(.3)}}.round-vs-text{font-size:18px;font-weight:700;color:#ffffff80}.round-status-banner{font-size:18px;font-weight:700;color:#fff;-webkit-text-stroke:1px #1a1206;paint-order:stroke fill;text-shadow:0 2px 0 #1a1206}