body,html{background-color:#000;width:100%;height:100%;margin:0;padding:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow:hidden}canvas{width:100vw;height:100vh;display:block}#main-menu{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:50;background:#0f172a99;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .3s;display:flex;position:absolute;top:0;left:0}#main-menu h1{color:#fff;text-shadow:0 4px 20px #38bdf880;margin-bottom:40px;font-size:48px}.menu-buttons{flex-wrap:wrap;justify-content:center;gap:20px;max-width:600px;display:flex}button{color:#38bdf8;cursor:pointer;background:#38bdf81a;border:1px solid #38bdf866;border-radius:12px;padding:15px 30px;font-family:Inter,sans-serif;font-size:20px;font-weight:700;transition:all .2s;box-shadow:0 8px 32px #0006}button:hover{background:#38bdf833;transform:translateY(-2px);box-shadow:0 12px 40px #38bdf84d}#lobby-menu{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:50;background:#0f172acc;flex-direction:column;justify-content:center;align-items:center;gap:20px;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}#lobby-menu h2{color:#fff;text-shadow:0 4px 20px #38bdf880;font-size:36px}#player-name{color:#fff;background:#0f172a99;border:1px solid #38bdf866;border-radius:8px;outline:none;padding:12px 20px;font-family:Inter,sans-serif;font-size:18px}#player-list{color:#38bdf8;text-align:center;min-height:50px;font-size:20px}#restart-btn{z-index:20;color:#ef4444;background:#ef44441a;border-color:#ef444466;display:none;position:absolute;top:30px;right:30px}#restart-btn:hover{background:#ef444433;box-shadow:0 12px 40px #ef44444d}#menu-btn{z-index:20;color:#e2e8f0;background:#94a3b81a;border-color:#94a3b866;position:absolute;top:30px;left:30px}#menu-btn:hover{background:#94a3b833;box-shadow:0 12px 40px #94a3b84d}#indicators-container{pointer-events:none;z-index:15;width:100%;height:100%;position:absolute;top:0;left:0}#hud{pointer-events:none;z-index:10;flex-direction:column;align-items:flex-end;gap:15px;display:flex;position:absolute;bottom:30px;right:30px}#speedometer{color:#38bdf8;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f172ad9;border:1px solid #38bdf866;border-radius:12px;padding:15px 25px;font-size:24px;font-weight:700;box-shadow:0 8px 32px #0006}#health-container{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f172abf;border:1px solid #ffffff1a;border-radius:12px;flex-direction:column;gap:8px;width:250px;padding:12px 20px;display:flex}.health-bar-wrapper{flex-direction:column;gap:4px;display:flex}.health-label{color:#e2e8f0;text-transform:uppercase;font-size:12px;font-weight:700}.health-bar{background:#00000080;border-radius:5px;width:100%;height:10px;overflow:hidden}.health-fill{width:100%;height:100%;transition:width .2s,background-color .2s}.p1-fill{background-color:#ef4444}.p2-fill{background-color:#3b82f6}#controls-hint{color:#94a3b8;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0f172ab3;border:1px solid #ffffff1a;border-radius:8px;padding:8px 16px;font-size:14px}#ball-scoreboard{z-index:20;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f172ad9;border:1px solid #38bdf84d;border-radius:14px;min-width:220px;padding:16px 20px;position:absolute;top:90px;left:30px;box-shadow:0 8px 32px #00000080}#possession-timer{color:#e2e8f0;text-align:center;background:#0000004d;border-radius:8px;margin-bottom:12px;padding:8px 12px;font-size:16px;font-weight:700}#possession-table{border-collapse:collapse;width:100%}#possession-table td{color:#e2e8f0;border-bottom:1px solid #ffffff0f;padding:6px 10px;font-size:14px;font-weight:600}#possession-table tr:last-child td{border-bottom:none}#possession-table .rank{color:#94a3b8;text-align:center;width:24px}#possession-table .player-dot{text-align:center;width:20px;font-size:12px}#possession-table .time-col{text-align:right;font-variant-numeric:tabular-nums;color:#38bdf8}#game-over-screen{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:60;background:#0f172ad9;flex-direction:column;justify-content:center;align-items:center;gap:20px;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}#game-over-title{text-shadow:0 4px 24px #00000080;margin:0;font-size:52px;font-weight:700}#game-over-title.win{color:#4ade80;text-shadow:0 4px 24px #4ade8066}#game-over-title.lose{color:#f87171;text-shadow:0 4px 24px #f8717166}#final-table{border-collapse:collapse;background:#0000004d;border-radius:12px;min-width:320px;overflow:hidden}#final-table td{color:#e2e8f0;border-bottom:1px solid #ffffff14;padding:10px 16px;font-size:18px;font-weight:600}#final-table tr:first-child td{color:#fbbf24;font-size:20px}#final-table tr:last-child td{border-bottom:none}#final-table .rank{color:#94a3b8;text-align:center;width:30px}#final-table .player-dot{text-align:center;width:24px}#final-table .time-col{text-align:right;font-variant-numeric:tabular-nums;color:#38bdf8}#football-score-ui{z-index:20;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f172ad9;border:1px solid #ffffff1a;border-radius:16px;flex-direction:column;align-items:center;padding:10px 30px;display:flex;position:absolute;top:20px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #00000080}.score-container{font-variant-numeric:tabular-nums;align-items:center;gap:20px;font-size:48px;font-weight:700;display:flex}#score-blue{color:#3b82f6;text-shadow:0 0 15px #3b82f699}#score-red{color:#ef4444;text-shadow:0 0 15px #ef444499}.score-dash{color:#e2e8f0}.score-target{color:#94a3b8;text-transform:uppercase;letter-spacing:2px;margin-top:5px;font-size:14px;font-weight:700}#semaphore{justify-content:center;gap:15px;margin-top:15px;display:flex}.light{background:#000000b3;border:3px solid #fff3;border-radius:50%;width:30px;height:30px;transition:background .1s}.light.red{background:#ef4444;border-color:#ef4444;box-shadow:0 0 20px #ef4444}.light.green{background:#22c55e;border-color:#22c55e;box-shadow:0 0 20px #22c55e}#goal-announcer{color:#fff;text-transform:uppercase;text-shadow:0 0 15px #fffc;text-align:center;margin-top:15px;font-size:28px;font-weight:800;animation:1s infinite alternate pulse}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.1)}}#setup-menu,#room-list-menu{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:50;background:#0f172acc;flex-direction:column;justify-content:center;align-items:center;gap:20px;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}#setup-menu h2,#room-list-menu h2{color:#fff;text-shadow:0 4px 20px #38bdf880;font-size:36px}#room-list{flex-direction:column;gap:10px;width:80%;max-width:600px;max-height:400px;display:flex;overflow-y:auto}.room-item{color:#fff;cursor:pointer;background:#38bdf81a;border:1px solid #38bdf866;border-radius:8px;justify-content:space-between;padding:15px 20px;font-weight:600;transition:all .2s;display:flex}.room-item:hover{background:#38bdf84d;transform:translateY(-2px)}#snackbar{visibility:hidden;color:#fff;text-align:center;z-index:1000;background-color:#ef4444e6;border-radius:8px;min-width:250px;margin-left:-125px;padding:16px;font-size:17px;font-weight:600;position:fixed;bottom:30px;left:50%;box-shadow:0 4px 12px #00000080}#snackbar.show{visibility:visible;animation:.5s fadein,.5s 2.5s fadeout}@keyframes fadein{0%{opacity:0;bottom:0}to{opacity:1;bottom:30px}}@keyframes fadeout{0%{opacity:1;bottom:30px}to{opacity:0;bottom:0}}#powerup-hud{z-index:10;flex-direction:column;align-items:center;gap:8px;display:flex;position:absolute;bottom:30px;left:30px}#powerup-timer{color:#fbbf24;text-shadow:0 0 10px #fbbf2480;font-variant-numeric:tabular-nums;font-size:24px;font-weight:800}#powerup-slot{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f172acc;border:2px solid #38bdf8;border-radius:16px;justify-content:center;align-items:center;width:80px;height:80px;display:flex;box-shadow:0 0 20px #38bdf866}#powerup-icon{font-size:40px}.powerup-hint{color:#94a3b8;background:#0f172a99;border-radius:8px;padding:4px 12px;font-size:14px;font-weight:700}