:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--hud-fg:#f5f6fa;--hud-fg-dim:#b5bbc7;--red:#e74c3c;--blue:#3498db;--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--hud-fg);overscroll-behavior:contain;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:#0a1a10;margin:0;padding:0;overflow:hidden}#game-root{touch-action:none;width:100vw;height:100vh;position:relative}#game-canvas{touch-action:none;outline:none;width:100%;height:100%;display:block}#hud{pointer-events:none;padding:calc(16px + var(--safe-top)) calc(24px + var(--safe-right)) calc(16px + var(--safe-bottom)) calc(24px + var(--safe-left));font-variant-numeric:tabular-nums;flex-direction:column;justify-content:space-between;display:flex;position:absolute;inset:0}#hud-scoreboard{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);letter-spacing:.5px;-webkit-user-select:none;user-select:none;background:#0000008c;border-radius:12px;align-self:center;align-items:center;gap:20px;padding:10px 22px;font-size:20px;font-weight:600;display:inline-flex}.team{align-items:center;gap:10px;display:inline-flex}.team-label{text-transform:uppercase;color:var(--hud-fg-dim);letter-spacing:1px;font-size:14px}.team-red .team-score{color:var(--red)}.team-blue .team-score{color:var(--blue)}.team-score{text-align:center;min-width:24px;font-size:28px}.hud-time{color:var(--hud-fg);border-left:1px solid #ffffff26;border-right:1px solid #ffffff26;padding:0 8px;font-size:22px}#hud-bottom{justify-content:space-between;align-items:center;gap:12px;display:flex}#hud-mute{pointer-events:auto;appearance:none;color:var(--hud-fg);cursor:pointer;background:#0000008c;border:none;border-radius:999px;justify-content:center;align-items:center;width:40px;height:40px;padding:0;font-size:20px;line-height:1;transition:background-color .12s,transform .12s;display:inline-flex}#hud-mute:hover{background:#000000bf}#hud-mute:active{transform:scale(.94)}#hud-mute[data-muted=true]{color:var(--hud-fg-dim)}#hud-audio-hint{pointer-events:none;color:var(--hud-fg-dim);letter-spacing:.3px;background:#0006;border-radius:999px;padding:6px 12px;font-size:13px;animation:2.4s ease-in-out infinite hud-hint-pulse}@keyframes hud-hint-pulse{0%,to{opacity:.55}50%{opacity:1}}#hud-connection{color:var(--hud-fg-dim);letter-spacing:.3px;background:#0006;border-radius:999px;padding:6px 12px;font-size:13px}#hud-connection[data-status=connected]{color:#2ecc71}#hud-connection[data-status=disconnected]{color:#e67e22}#hud-connection[data-status=error]{color:var(--red)}#touch-controls{pointer-events:none;z-index:20;position:fixed;inset:0}.tc-dpad{left:calc(20px + var(--safe-left));bottom:calc(20px + var(--safe-bottom));pointer-events:auto;touch-action:none;grid-template-rows:1fr 1fr 1fr;grid-template-columns:1fr 1fr 1fr;gap:4px;display:grid;position:absolute}.tc-dpad-btn{color:#ffffffd9;-webkit-user-select:none;user-select:none;pointer-events:auto;background:#0006;border:2px solid #ffffff40;border-radius:10px;justify-content:center;align-items:center;font-size:22px;line-height:1;display:flex}.tc-dpad-btn--pressed{color:#fff;background:#2ecc718c;border-color:#ffffff8c}.tc-dpad-up{grid-area:1/2/2/3}.tc-dpad-left{grid-area:2/1/3/2}.tc-dpad-right{grid-area:2/3/3/4}.tc-dpad-down{grid-area:3/2/4/3}.tc-kick{right:calc(28px + var(--safe-right));bottom:calc(28px + var(--safe-bottom));color:#fff;letter-spacing:1px;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;background:#e74c3c99;border:2px solid #ffffff59;border-radius:999px;justify-content:center;align-items:center;font-size:15px;font-weight:700;transition:transform 80ms,background-color 80ms;display:flex;position:absolute}.tc-kick--pressed{background:#e74c3cd9;transform:scale(.9)}.tc-kick-ring{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;transform:rotate(-90deg)}.tc-kick-ring-track{fill:none;stroke:#ffffff1a;stroke-width:6px}.tc-kick-ring-fill{fill:none;stroke:#30e830;stroke-width:6px;stroke-linecap:round;stroke-dasharray:0 100;transition:stroke 60ms linear}.tc-kick-label{z-index:1;position:relative}#rotate-overlay{z-index:100;color:var(--hud-fg);text-align:center;background:#0a1a10f5;justify-content:center;align-items:center;padding:24px;display:none;position:fixed;inset:0}#rotate-overlay[data-visible=true]{display:flex}.rotate-inner{max-width:300px}.rotate-icon{border:3px solid var(--hud-fg);border-radius:8px;width:96px;height:60px;margin:0 auto 18px;animation:1.6s ease-in-out infinite rotate-hint;position:relative}.rotate-icon:after{content:"";background:var(--hud-fg);border-radius:2px;width:3px;height:12px;position:absolute;top:50%;right:-6px;transform:translateY(-50%)}@keyframes rotate-hint{0%,20%{transform:rotate(-90deg)}60%,to{transform:rotate(0)}}.rotate-text{margin-bottom:6px;font-size:20px;font-weight:600}.rotate-sub{color:var(--hud-fg-dim);font-size:13px}#pause-overlay{z-index:90;color:var(--hud-fg);letter-spacing:1px;background:#0009;justify-content:center;align-items:center;font-size:18px;display:none;position:fixed;inset:0}#pause-overlay[data-visible=true]{display:flex}