:root{--hud-bg:#121822b8;--hud-edge:#ffffff29;--hud-text:#f4f8ff;--hud-dim:#f4f8ff9e;--health-high:#57d16c;--health-medium:#ffc23d;--health-low:#ff5b5b;--stamina:#6ec6ff;--accent:#ffb43d;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}*{box-sizing:border-box}html,body{height:100%;color:var(--hud-text);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;background:#8fd3ff;margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}#app{position:fixed;inset:0}#game-canvas{touch-action:none;width:100%;height:100%;display:block}#ui-root{pointer-events:none;position:absolute;inset:0}#ui-root .overlay,#ui-root .btn,#ui-root .setup-select,#ui-root .setup-range,#ui-root .touch-buttons,#ui-root .touch-btn{pointer-events:auto}#ui-root .hud,#ui-root .hud *{pointer-events:none}#boot-screen{z-index:100;background:linear-gradient(160deg,#8fd3ff 0%,#d5f0ff 55%,#ffe9b8 100%);place-items:center;transition:opacity .45s;display:grid;position:absolute;inset:0}#boot-screen.is-hidden{opacity:0;pointer-events:none}.boot-card{text-align:center;color:#123;padding:2rem}.boot-logo{font-size:5rem;line-height:1;animation:1.4s ease-in-out infinite boot-bounce}@keyframes boot-bounce{0%,to{transform:translateY(0)rotate(-4deg)}50%{transform:translateY(-14px)rotate(4deg)}}@media (prefers-reduced-motion:reduce){.boot-logo{animation:none}}.boot-card h1{letter-spacing:-.02em;margin:.4rem 0 .2rem;font-size:2.6rem}#boot-status{color:#2b3d4f;margin:0 0 1rem;font-size:1rem}.boot-bar{background:#00000024;border-radius:999px;width:min(320px,70vw);height:10px;overflow:hidden}.boot-bar-fill{background:linear-gradient(90deg,#ffb43d,#ff7b6b);border-radius:999px;width:0%;height:100%;transition:width .3s}.hud{pointer-events:none;font-variant-numeric:tabular-nums;position:absolute;inset:0}.hud-top{top:calc(.75rem + var(--safe-top));align-items:center;gap:.5rem;display:flex;position:absolute;left:50%;transform:translate(-50%)}.hud-pill{background:var(--hud-bg);border:1px solid var(--hud-edge);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:999px;align-items:center;gap:.35rem;padding:.4rem .85rem;font-size:.95rem;font-weight:600;display:flex}.hud-fps{color:var(--hud-dim);font-size:.75rem;font-weight:500}.hud-crosshair{width:22px;height:22px;margin:-11px 0 0 -11px;position:absolute;top:50%;left:50%}.hud-crosshair:before,.hud-crosshair:after{content:"";background:#ffffffe6;position:absolute;box-shadow:0 0 0 1px #0000008c}.hud-crosshair:before{width:2px;height:100%;margin-left:-1px;top:0;left:50%}.hud-crosshair:after{width:100%;height:2px;margin-top:-1px;top:50%;left:0}.hud-feed{top:calc(4rem + var(--safe-top));right:calc(1rem + var(--safe-right));flex-direction:column;align-items:flex-end;gap:.3rem;max-width:min(360px,46vw);display:flex;position:absolute}.hud-feed-line{background:var(--hud-bg);border:1px solid var(--hud-edge);border-radius:8px;padding:.35rem .7rem;font-size:.85rem;transition:opacity 1s}.hud-feed-line.is-fading{opacity:0}.hud-prompt{background:var(--hud-bg);border:1px solid var(--accent);border-radius:10px;padding:.5rem 1rem;font-size:1rem;font-weight:600;position:absolute;top:58%;left:50%;transform:translate(-50%)}.hud-bottom{bottom:calc(1rem + var(--safe-bottom));left:calc(1rem + var(--safe-left));right:calc(1rem + var(--safe-right));justify-content:space-between;align-items:flex-end;gap:1rem;display:flex;position:absolute}.hud-vitals{flex-direction:column;gap:.35rem;width:min(300px,45vw);display:flex}.hud-bar{background:var(--hud-bg);border:1px solid var(--hud-edge);border-radius:8px;height:26px;transition:opacity .3s;position:relative;overflow:hidden}.hud-bar.is-hidden{opacity:0}.hud-stamina{height:8px}.hud-bar-fill{width:100%;height:100%;transition:width .12s linear}.hud-health .hud-bar-fill{background:var(--health-high)}.hud-health .hud-bar-fill[data-level=medium]{background:var(--health-medium)}.hud-health .hud-bar-fill[data-level=low]{background:var(--health-low)}.hud-stamina .hud-bar-fill{background:var(--stamina)}.hud-bar-text{text-shadow:0 1px 3px #000c;place-items:center;font-size:.9rem;font-weight:700;display:grid;position:absolute;inset:0}.hud-weapon{text-align:right}.hud-weapon-name{color:var(--hud-dim);font-size:1rem;font-weight:600}.hud-ammo{text-shadow:0 2px 6px #000000b3;font-size:2rem;font-weight:800;line-height:1.1}.hud-ammo.is-empty strong{color:var(--health-low)}.hud-ammo-reserve{color:var(--hud-dim);font-size:1.1rem;font-weight:600}.hud-reload{color:var(--accent);font-size:.9rem;font-weight:700}.hud-slots{bottom:calc(4.5rem + var(--safe-bottom));gap:.4rem;display:flex;position:absolute;left:50%;transform:translate(-50%)}.hud-slot{background:var(--hud-bg);border:1px solid var(--hud-edge);border-radius:8px;flex-direction:column;justify-content:space-between;width:68px;height:46px;padding:.25rem;font-size:.65rem;display:flex;position:relative}.hud-slot.is-active{border-color:var(--accent);box-shadow:0 0 0 2px #ffb43d59}.hud-slot.is-empty .hud-slot-name{color:#f4f8ff4d}.hud-slot-number{color:var(--hud-dim);font-weight:700}.hud-slot-name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:50;background:#0a1018b8;place-items:center;display:grid;position:absolute;inset:0}.overlay-card{border:1px solid var(--hud-edge);text-align:center;background:#1a2332;border-radius:16px;max-width:min(440px,88vw);padding:1.75rem 2rem;box-shadow:0 20px 60px #00000073}.overlay-card h2{margin:0 0 .5rem;font-size:1.8rem}.overlay-card p{color:var(--hud-dim);margin:0 0 1.25rem;line-height:1.5}.overlay-actions{flex-wrap:wrap;justify-content:center;gap:.6rem;display:flex}.btn{appearance:none;border:1px solid var(--hud-edge);color:var(--hud-text);font:inherit;cursor:pointer;background:#2a3648;border-radius:10px;min-height:48px;padding:0 1.25rem;font-weight:700;transition:transform .1s,background .15s}.btn:hover{background:#35435a}.btn:active{transform:scale(.97)}.btn-primary{background:var(--accent);color:#1a1206;border-color:#0000}.btn-primary:hover{background:#ffc45e}@media (prefers-reduced-motion:reduce){.btn:active{transform:none}}.touch-controls{pointer-events:none;display:none;position:absolute;inset:0}.touch-controls.is-active{display:block}.touch-stick{opacity:0;background:#ffffff1a;border:2px solid #ffffff59;border-radius:50%;width:120px;height:120px;margin:-60px 0 0 -60px;transition:opacity .15s;position:absolute}.touch-stick.is-visible{opacity:1}.touch-stick-nub{background:#ffffff8c;border-radius:50%;width:52px;height:52px;margin:-26px 0 0 -26px;position:absolute;top:50%;left:50%}.touch-buttons{right:calc(1rem + var(--safe-right));bottom:calc(7rem + var(--safe-bottom));pointer-events:auto;grid-template-columns:repeat(2,72px);gap:.6rem;display:grid;position:absolute}.touch-btn{width:72px;height:72px;color:var(--hud-text);cursor:pointer;background:#141c2899;border:2px solid #ffffff4d;border-radius:50%;place-items:center;font-size:.8rem;font-weight:700;display:grid}.touch-btn:active{background:#ffb43d80}.touch-btn-attack{background:#ff7b6b8c;grid-column:span 2;justify-self:center;width:92px;height:92px}.setup-row{text-align:left;flex-direction:column;gap:.35rem;margin-bottom:1rem;display:flex}.setup-row label{color:var(--hud-dim);font-size:.9rem;font-weight:600}.setup-select{appearance:none;border:1px solid var(--hud-edge);width:100%;min-height:48px;color:var(--hud-text);font:inherit;background:#2a3648;border-radius:10px;padding:0 .85rem;font-weight:600}.setup-range{width:100%;height:40px;accent-color:var(--accent)}.lobby-card{min-width:min(460px,90vw)}.lobby-roster{text-align:left;border:1px solid var(--hud-edge);background:#0003;border-radius:10px;max-height:34vh;margin:.75rem 0 1rem;padding:.6rem .75rem;overflow-y:auto}.lobby-count{color:var(--hud-dim);text-transform:uppercase;letter-spacing:.04em;margin-bottom:.4rem;font-size:.8rem;font-weight:700}.lobby-member{align-items:center;gap:.4rem;padding:.2rem 0;font-weight:600;display:flex}.lobby-member.is-bot .lobby-name{color:var(--hud-dim);font-weight:500}.lobby-badge{text-transform:uppercase;letter-spacing:.05em;color:var(--accent);background:#ffb43d38;border-radius:999px;padding:.1rem .4rem;font-size:.62rem;font-weight:700}.lobby-wait{text-align:left;background:#6ec6ff1f;border:1px solid #6ec6ff4d;border-radius:10px;margin:0 0 1rem;padding:.6rem .75rem;font-size:.9rem;line-height:1.45}.lobby-bots{border-top:1px solid var(--hud-edge);margin-top:1rem;padding-top:1rem}.lobby-dialog{z-index:60}.btn:disabled{opacity:.45;cursor:not-allowed}