:root{
  --panel:rgba(16,22,18,.94);--panel2:rgba(27,35,29,.94);--line:rgba(194,211,187,.18);
  --text:#e8eee7;--muted:#9eaea0;--accent:#d6b45b;--blue:#5ba8d8;--red:#d76057;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#0c110e;color:var(--text);touch-action:none}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:2;background:radial-gradient(circle at 50% 44%,transparent 22%,rgba(0,0,0,.42) 100%)}
button,input,select{font:inherit}
button{border:1px solid var(--line);background:linear-gradient(180deg,#2b352d,#1a211c);color:var(--text);font-weight:800;letter-spacing:.08em;padding:14px 18px;border-radius:10px;cursor:pointer;box-shadow:0 8px 26px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.06)}
button:active{transform:translateY(1px);filter:brightness(.9)}
button.primary{background:linear-gradient(180deg,#d9bd6e,#a98536);color:#17160f;border-color:#e6cf8e;text-shadow:0 1px rgba(255,255,255,.25)}
button.secondary{background:rgba(17,23,19,.7)}
#gameCanvas{position:fixed;inset:0;width:100%;height:100%;display:block;background:#151c17;z-index:0}
#weatherLayer{position:fixed;inset:0;pointer-events:none;z-index:3;mix-blend-mode:screen;opacity:.26}
#menuRoot{position:fixed;inset:0;z-index:10;background:
 linear-gradient(120deg,rgba(4,8,6,.96),rgba(13,22,16,.72)),
 repeating-linear-gradient(90deg,transparent 0 79px,rgba(255,255,255,.015) 80px),
 url('assets/container_green.png') center/cover;}
.screen{position:absolute;inset:0;display:none;place-items:center;padding:24px;overflow:auto}.screen.active{display:grid}
.menu-shell{position:relative;width:min(440px,94vw);padding:34px;background:linear-gradient(150deg,var(--panel2),var(--panel));border:1px solid rgba(214,180,91,.28);border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.55),inset 0 1px rgba(255,255,255,.05);backdrop-filter:blur(10px)}
.menu-shell:after{content:"";position:absolute;inset:8px;border:1px solid rgba(255,255,255,.035);border-radius:12px;pointer-events:none}
.hero-shell{text-align:center}.wide-shell{width:min(620px,94vw)}
.eyebrow{color:var(--accent);font-size:12px;font-weight:900;letter-spacing:.24em;margin-bottom:8px}.eyebrow.danger{color:#e36f66}
h1,h2{margin:0;line-height:.95;letter-spacing:.045em}h1{font-size:clamp(54px,10vw,86px);text-shadow:0 5px 0 #1e251f,0 18px 45px rgba(0,0,0,.5)}h2{font-size:34px;margin-bottom:26px}
.subtitle{font-weight:900;letter-spacing:.33em;color:#b8c3b9;margin:8px 0 18px}.lead{color:var(--muted);margin:0 auto 26px;max-width:330px;line-height:1.5}
.menu-actions{display:grid;gap:11px}.feature-strip{display:flex;justify-content:center;gap:13px;flex-wrap:wrap;margin-top:25px;color:#748378;font-size:9px;font-weight:800;letter-spacing:.12em}
label{display:grid;gap:8px;margin:16px 0;color:#aeb9b0;font-size:11px;font-weight:900;letter-spacing:.14em}
input,select{width:100%;padding:13px 14px;border-radius:9px;border:1px solid rgba(255,255,255,.13);background:#111713;color:#eef2ed;outline:none;text-transform:uppercase;font-weight:750}
input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(214,180,91,.12)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.fineprint,.status-line{font-size:12px;color:var(--muted);line-height:1.45}.code-input{text-align:center;font-size:28px;letter-spacing:.3em;padding-left:.5em}.back-button{position:absolute;z-index:2;left:18px;top:18px;width:44px;height:40px;padding:0}
.lobby-code-wrap{text-align:center;margin:5px 0 24px;padding:16px;border:1px solid var(--line);border-radius:12px;background:#0e1410}.lobby-code-wrap span{display:block;font-size:10px;letter-spacing:.2em;color:var(--muted)}.lobby-code-wrap strong{font-size:38px;letter-spacing:.28em;color:var(--accent);padding-left:.28em}
.player-list{display:grid;gap:7px;margin-bottom:18px}.player-entry{display:flex;align-items:center;justify-content:space-between;padding:11px 13px;background:rgba(255,255,255,.035);border-radius:8px}.player-entry i{width:10px;height:10px;border-radius:50%;margin-right:9px;display:inline-block}.player-entry .blue-dot{background:var(--blue)}.player-entry .red-dot{background:var(--red)}
.waiting{text-align:center;color:var(--accent);font-weight:900;letter-spacing:.12em;padding:15px}.hidden{display:none!important}

#hud{position:fixed;inset:0;z-index:5;pointer-events:none;padding:calc(10px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left))}
#scoreBar{position:absolute;left:50%;top:calc(8px + env(safe-area-inset-top));transform:translateX(-50%);display:grid;grid-template-columns:120px 100px 120px;height:46px;border:1px solid rgba(255,255,255,.15);border-radius:8px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.team-score{display:flex;align-items:center;justify-content:space-around;font-size:11px;font-weight:900;letter-spacing:.1em}.team-score strong{font-size:26px}.team-score.blue{background:linear-gradient(90deg,rgba(20,67,95,.92),rgba(35,105,146,.92))}.team-score.red{background:linear-gradient(90deg,rgba(145,54,48,.92),rgba(91,33,30,.92))}#scoreLimitHud{display:grid;place-items:center;background:rgba(9,12,10,.94);font-size:9px;color:#aab4ac;letter-spacing:.08em;text-align:center}
#combatHud{position:absolute;left:calc(13px + env(safe-area-inset-left));top:calc(13px + env(safe-area-inset-top));display:flex;gap:8px}.status-card,.streak-card{background:rgba(12,17,14,.88);border:1px solid rgba(255,255,255,.13);border-radius:9px;box-shadow:0 10px 30px rgba(0,0,0,.3)}.status-card{padding:9px 11px;width:210px}.health-row{display:grid;grid-template-columns:24px 1fr 30px;gap:7px;align-items:center;font-size:10px;font-weight:900}.bar{height:8px;background:#321d1b;border-radius:99px;overflow:hidden}.bar i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#d9b04f,#72bd67);transition:width .1s}.ammo-row{display:flex;justify-content:space-between;margin-top:7px;font-size:10px;letter-spacing:.08em}.ammo-row strong{font-size:15px}.streak-card{width:70px;text-align:center;padding:8px}.streak-card span{display:block;font-size:8px;color:#9dab9f;letter-spacing:.12em}.streak-card strong{font-size:25px;color:var(--accent)}#reloadText{height:10px;color:#e7bd56;font-size:9px;letter-spacing:.12em;margin-top:2px}
#killFeed{position:absolute;right:calc(12px + env(safe-area-inset-right));top:calc(65px + env(safe-area-inset-top));width:min(310px,38vw);display:grid;gap:4px;text-align:right}.kill-item{font-size:11px;font-weight:800;text-shadow:0 2px 3px #000;animation:feedIn .2s ease-out}.kill-item b{color:var(--accent)}@keyframes feedIn{from{opacity:0;transform:translateX(20px)}}
#centerMessage{position:absolute;left:50%;top:28%;transform:translate(-50%,-50%);font-weight:1000;font-size:clamp(20px,5vw,46px);letter-spacing:.08em;text-align:center;text-shadow:0 4px 18px #000;white-space:pre-line}
#airstrikeHudBtn{pointer-events:auto;position:absolute;right:calc(18px + env(safe-area-inset-right));top:calc(120px + env(safe-area-inset-top));width:152px;padding:9px 12px;background:linear-gradient(180deg,#4d4430,#272319);border-color:#d2ad50;color:#f4d67e;font-size:11px}#airstrikeHudBtn img{width:31px;vertical-align:middle;margin-right:6px}

#touchControls{position:fixed;inset:0;z-index:7;pointer-events:none}.stick{position:absolute;bottom:calc(24px + env(safe-area-inset-bottom));width:142px;height:142px;border-radius:50%;pointer-events:auto;touch-action:none}.move-stick{left:calc(25px + env(safe-area-inset-left))}.aim-stick{right:calc(25px + env(safe-area-inset-right))}.stick-ring{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(232,238,231,.28);background:radial-gradient(circle,rgba(255,255,255,.09),rgba(0,0,0,.16));box-shadow:inset 0 0 25px rgba(0,0,0,.38),0 8px 24px rgba(0,0,0,.2)}.aim-stick .stick-ring{border-color:rgba(255,192,94,.38)}.stick-knob{position:absolute;left:42px;top:42px;width:58px;height:58px;border-radius:50%;background:linear-gradient(145deg,rgba(230,236,229,.86),rgba(92,106,95,.86));box-shadow:0 5px 18px rgba(0,0,0,.4),inset 0 1px rgba(255,255,255,.7)}.aim-stick .stick-knob{background:linear-gradient(145deg,rgba(242,190,105,.9),rgba(133,73,40,.9))}.stick-label{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);font-size:8px;font-weight:900;letter-spacing:.18em;color:rgba(232,238,231,.58);pointer-events:none}
.combat-button{position:absolute;border-radius:50%;pointer-events:auto;padding:0;display:grid;place-items:center;user-select:none;-webkit-user-select:none;touch-action:none}.fire-button{bottom:calc(181px + env(safe-area-inset-bottom));width:68px;height:68px;border:2px solid rgba(255,192,94,.7);background:radial-gradient(circle at 40% 30%,rgba(226,146,65,.94),rgba(114,48,28,.92));text-shadow:0 2px #37160d}.fire-left{left:calc(62px + env(safe-area-inset-left))}.fire-right{right:calc(62px + env(safe-area-inset-right))}.fire-button span{font-size:13px;letter-spacing:.08em}.fire-button.pressed{filter:brightness(1.35);box-shadow:0 0 32px rgba(255,138,63,.5);transform:scale(.96)}.grenade-button{right:calc(176px + env(safe-area-inset-right));bottom:calc(70px + env(safe-area-inset-bottom));width:66px;height:66px;background:rgba(25,34,27,.92)}.grenade-button img{width:41px}.grenade-button span{position:absolute;right:3px;bottom:1px;background:#d7b557;color:#15140f;border-radius:50%;width:22px;height:22px;display:grid;place-items:center;font-size:11px}
#airstrikeMode{position:fixed;z-index:9;left:50%;top:calc(68px + env(safe-area-inset-top));transform:translateX(-50%);display:flex;align-items:center;gap:14px;padding:11px 14px;border-radius:10px;background:rgba(12,15,13,.95);border:1px solid #d6b45b;box-shadow:0 12px 30px rgba(0,0,0,.45);font-size:11px;letter-spacing:.08em}#airstrikeMode span{color:var(--accent);font-size:17px}#airstrikeMode button{padding:8px 10px;font-size:9px}
#rotateNotice{display:none;position:fixed;inset:0;z-index:30;place-items:center;background:#0b100d;text-align:center;font-size:24px;font-weight:900;letter-spacing:.08em}#rotateNotice small{font-size:12px;color:#9aa79c}
@media (orientation:portrait) and (max-width:700px){#rotateNotice{display:grid}}
@media (max-height:520px){.menu-shell{padding:22px}.hero-shell h1{font-size:49px}.lead{margin-bottom:15px}.feature-strip{display:none}.status-card{width:180px}#combatHud{transform:scale(.88);transform-origin:top left}#scoreBar{transform:translateX(-50%) scale(.85);transform-origin:top center}.stick{width:120px;height:120px;bottom:calc(16px + env(safe-area-inset-bottom))}.move-stick{left:calc(20px + env(safe-area-inset-left))}.aim-stick{right:calc(20px + env(safe-area-inset-right))}.stick-knob{left:36px;top:36px;width:48px;height:48px}.fire-button{width:60px;height:60px;bottom:calc(145px + env(safe-area-inset-bottom))}.fire-left{left:calc(50px + env(safe-area-inset-left))}.fire-right{right:calc(50px + env(safe-area-inset-right))}.grenade-button{right:calc(148px + env(safe-area-inset-right));bottom:calc(48px + env(safe-area-inset-bottom));width:58px;height:58px}.grenade-button img{width:36px}#airstrikeHudBtn{top:calc(106px + env(safe-area-inset-top));transform:scale(.88);transform-origin:top right}}