:root{--white:#f4f7f8;--muted:#92a0a9;--cyan:#57f4da;--amber:#ffc857;--red:#ff466d;--panel:rgba(5,9,12,.78);--line:rgba(210,239,244,.2)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#05070a;color:var(--white);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;touch-action:none;overscroll-behavior:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}button,a{font:inherit;color:inherit}button{cursor:pointer}.game-shell,#game{position:fixed;inset:0}#game canvas{display:block;width:100%;height:100%;outline:0}.hidden{display:none!important}
.topbar{position:absolute;z-index:5;top:max(12px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));height:48px;display:flex;align-items:center;gap:12px;pointer-events:none}.topbar>*{pointer-events:auto}.brand{display:flex;align-items:baseline;gap:6px;font-weight:900;letter-spacing:.08em}.brand strong{font-size:1rem}.brand span{color:var(--cyan);font-size:.64rem}.mission-tag{margin-left:auto;color:var(--muted);font-size:.72rem;font-weight:800;letter-spacing:.1em}.icon-button{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:4px;background:var(--panel);text-decoration:none;font-weight:900;backdrop-filter:blur(12px)}
.hud{position:absolute;z-index:4;top:max(72px,calc(env(safe-area-inset-top) + 64px));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));display:grid;grid-template-columns:minmax(230px,300px) minmax(260px,420px) minmax(230px,300px);justify-content:space-between;gap:14px;pointer-events:none}.vitals,.objective-panel,.combat-info{border:1px solid var(--line);background:linear-gradient(100deg,rgba(5,9,12,.9),rgba(5,9,12,.58));backdrop-filter:blur(12px);box-shadow:0 12px 38px rgba(0,0,0,.24)}.vitals{height:64px;display:grid;grid-template-columns:44px 1fr 42px;align-items:center;gap:9px;padding:8px}.portrait{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(87,244,218,.5);background:rgba(87,244,218,.1);color:var(--cyan);font-weight:950}.bars{display:grid;gap:7px}.bar{height:8px;overflow:hidden;background:rgba(255,255,255,.1);transform:skewX(-14deg)}.bar span{display:block;height:100%;transition:width .15s}.health span{width:100%;background:linear-gradient(90deg,#ff466d,#ff8a68)}.shield span{width:100%;background:linear-gradient(90deg,#61a8ff,#57f4da)}.vitals>strong{font-size:1.05rem;text-align:center}.objective-panel{min-height:64px;padding:9px 14px;text-align:center}.objective-panel span,.combat-info span{display:block;color:var(--cyan);font-size:.61rem;font-weight:900;letter-spacing:.12em}.objective-panel strong{display:block;margin:2px 0;font-size:.94rem}.objective-panel small{color:var(--muted)}.combat-info{height:64px;display:grid;grid-template-columns:repeat(3,1fr);align-items:center}.combat-info div{text-align:center;border-right:1px solid var(--line)}.combat-info div:last-child{border:0}.combat-info strong{display:block;margin-top:3px;font-size:1rem}
.boss-hud{position:absolute;z-index:5;top:148px;left:50%;width:min(560px,calc(100% - 32px));transform:translateX(-50%);pointer-events:none}.boss-hud>div:first-child{display:flex;justify-content:space-between;margin-bottom:6px;color:var(--amber);font-size:.72rem;font-weight:950;letter-spacing:.12em}.boss-hud small{color:var(--muted)}.boss-bar{height:10px;padding:2px;border:1px solid rgba(255,200,87,.45);background:rgba(5,9,12,.7)}.boss-bar span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#ff466d,#ffc857)}
.crosshair{position:absolute;z-index:3;left:50%;top:50%;width:34px;height:34px;transform:translate(-50%,-50%);pointer-events:none}.crosshair i{position:absolute;background:rgba(244,247,248,.9);box-shadow:0 0 8px rgba(87,244,218,.65)}.crosshair i:nth-child(1),.crosshair i:nth-child(2){top:16px;width:9px;height:2px}.crosshair i:nth-child(1){left:0}.crosshair i:nth-child(2){right:0}.crosshair i:nth-child(3),.crosshair i:nth-child(4){left:16px;width:2px;height:9px}.crosshair i:nth-child(3){top:0}.crosshair i:nth-child(4){bottom:0}.hit-marker{position:absolute;z-index:5;left:50%;top:50%;width:24px;height:24px;opacity:0;transform:translate(-50%,-50%) rotate(45deg);border:2px solid var(--white);pointer-events:none}.hit-marker.show{animation:hit .16s ease}.damage-flash{position:absolute;z-index:2;inset:0;opacity:0;pointer-events:none;box-shadow:inset 0 0 120px 30px rgba(255,30,75,.82);transition:opacity .12s}.damage-flash.show{opacity:1}.message{position:absolute;z-index:6;top:27%;left:50%;min-width:260px;max-width:80%;padding:10px 18px;opacity:0;transform:translate(-50%,-10px);border-top:1px solid rgba(87,244,218,.45);border-bottom:1px solid rgba(87,244,218,.45);background:rgba(5,9,12,.72);text-align:center;font-size:.83rem;font-weight:900;letter-spacing:.08em;pointer-events:none;transition:.25s}.message.show{opacity:1;transform:translate(-50%,0)}.interact{position:absolute;z-index:7;left:50%;bottom:23%;display:flex;align-items:center;gap:9px;transform:translateX(-50%);padding:8px 12px;border:1px solid rgba(87,244,218,.45);background:var(--panel);font-size:.75rem;font-weight:900;letter-spacing:.08em}.interact kbd,.ability-bar kbd{padding:4px 7px;border:1px solid var(--line);border-radius:3px;background:rgba(255,255,255,.1);font:800 .68rem inherit}
.ability-bar{position:absolute;z-index:4;right:max(14px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));display:flex;gap:8px;pointer-events:none}.ability-bar>div{min-width:114px;display:grid;grid-template-columns:auto 1fr;gap:1px 8px;align-items:center;padding:8px 10px;border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(10px)}.ability-bar span{font-size:.75rem;font-weight:800}.ability-bar b{grid-column:2;color:var(--cyan);font-size:.6rem;letter-spacing:.08em}.mobile-controls{display:none}
.overlay{position:absolute;z-index:20;inset:0;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 70% 40%,rgba(20,69,80,.17),transparent 38%),linear-gradient(90deg,rgba(3,5,7,.95),rgba(3,5,7,.62) 54%,rgba(3,5,7,.2));backdrop-filter:blur(2px)}.start{place-items:center start}.start-content{width:min(720px,80vw);margin-left:clamp(10px,6vw,90px)}.eyebrow{margin:0 0 10px;color:var(--cyan);font-size:.72rem;font-weight:950;letter-spacing:.18em}.start h1{margin:0;font-size:clamp(3.8rem,9vw,8rem);line-height:.78}.start h1 span{color:transparent;-webkit-text-stroke:1px rgba(244,247,248,.55)}.brief{max-width:610px;margin:25px 0;color:#c5ced4;font-size:1rem;line-height:1.55}.loadout{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:20px 0}.loadout div{min-height:82px;padding:12px;border-left:2px solid var(--cyan);background:rgba(13,21,26,.72)}.loadout span,.results span{display:block;color:var(--muted);font-size:.61rem;font-weight:900;letter-spacing:.1em}.loadout strong{display:block;margin:5px 0 2px;font-size:.83rem}.loadout small{color:var(--muted);font-size:.7rem}.primary{min-width:190px;min-height:50px;padding:0 24px;border:1px solid var(--cyan);border-radius:3px;color:#03110f;background:var(--cyan);font-weight:950;letter-spacing:.08em;box-shadow:0 0 32px rgba(87,244,218,.18)}.primary:hover{filter:brightness(1.1)}.controls-copy{display:flex;flex-wrap:wrap;gap:14px;margin:15px 0 0;color:var(--muted);font-size:.7rem}.upgrade-panel,.end-panel{width:min(880px,100%);padding:26px;border:1px solid var(--line);background:rgba(5,9,12,.94);box-shadow:0 28px 100px rgba(0,0,0,.65)}.upgrade-panel h2,.end-panel h2{margin:0;font-size:clamp(2rem,5vw,4rem)}.upgrade-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}.upgrade-grid button{min-height:190px;padding:18px;border:1px solid var(--line);border-radius:4px;color:var(--white);background:linear-gradient(145deg,rgba(21,34,40,.96),rgba(8,12,15,.96));text-align:left}.upgrade-grid button:hover,.upgrade-grid button:focus-visible{border-color:var(--cyan);transform:translateY(-3px)}.upgrade-grid i{display:grid;width:40px;height:40px;place-items:center;margin-bottom:20px;border:1px solid rgba(87,244,218,.55);color:var(--cyan);font-style:normal;font-weight:900}.upgrade-grid strong{display:block;margin-bottom:8px;font-size:1rem}.upgrade-grid span{color:var(--muted);font-size:.82rem;line-height:1.45}.end-panel{max-width:620px;text-align:center}.end-panel>p:not(.eyebrow){color:var(--muted);line-height:1.55}.results{display:grid;grid-template-columns:repeat(3,1fr);margin:24px 0}.results div{padding:13px;border-right:1px solid var(--line)}.results div:last-child{border:0}.results strong{display:block;margin-top:5px;font-size:1.4rem}
.loading,.webgl-error{position:absolute;z-index:50;inset:0;display:grid;place-content:center;gap:10px;background:#05070a;text-align:center}.loading strong{font-size:clamp(1.7rem,5vw,4rem);letter-spacing:.08em}.loading span,.webgl-error span{color:var(--muted);font-size:.7rem;letter-spacing:.12em}.loading.hide{opacity:0;pointer-events:none;transition:opacity .6s}.webgl-error strong{font-size:1.2rem}@keyframes hit{0%{opacity:1;transform:translate(-50%,-50%) rotate(45deg) scale(1.25)}100%{opacity:0;transform:translate(-50%,-50%) rotate(45deg) scale(.8)}}
@media (hover:none),(pointer:coarse){.topbar{top:max(6px,env(safe-area-inset-top));height:40px}.icon-button{width:38px;height:38px}.mission-tag,.brand span{display:none}.hud{top:max(50px,calc(env(safe-area-inset-top) + 44px));left:max(7px,env(safe-area-inset-left));right:max(7px,env(safe-area-inset-right));grid-template-columns:minmax(145px,210px) 1fr}.combat-info{position:absolute;top:68px;right:0;width:210px}.vitals,.objective-panel,.combat-info{height:54px;min-height:54px}.portrait{width:34px;height:34px}.vitals{grid-template-columns:36px 1fr 32px;padding:6px}.objective-panel{padding:7px}.objective-panel strong{font-size:.75rem}.objective-panel small{font-size:.64rem}.combat-info span{font-size:.5rem}.combat-info strong{font-size:.8rem}.boss-hud{top:116px}.ability-bar{display:none}.mobile-controls{position:absolute;z-index:8;inset:0;display:block;pointer-events:none}.stick-zone{position:absolute;left:max(18px,env(safe-area-inset-left));bottom:max(22px,env(safe-area-inset-bottom));width:142px;height:142px;border:1px solid rgba(218,240,244,.25);border-radius:50%;background:rgba(5,9,12,.34);box-shadow:inset 0 0 38px rgba(87,244,218,.06);pointer-events:auto}.stick-zone.aim{left:auto;right:max(18px,env(safe-area-inset-right));border-color:rgba(255,200,87,.28);box-shadow:inset 0 0 38px rgba(255,200,87,.06)}.stick-zone i{position:absolute;left:45px;top:45px;width:52px;height:52px;border:1px solid rgba(244,247,248,.38);border-radius:50%;background:rgba(218,240,244,.18);box-shadow:0 0 24px rgba(87,244,218,.15)}.stick-label{position:absolute;left:50%;bottom:-18px;transform:translateX(-50%);color:rgba(244,247,248,.45);font-size:.58rem;font-weight:900;white-space:nowrap;letter-spacing:.08em}.action-cluster{position:absolute;right:max(164px,calc(env(safe-area-inset-right) + 154px));bottom:max(34px,calc(env(safe-area-inset-bottom) + 12px));display:grid;gap:10px;pointer-events:auto}.action{width:72px;height:72px;border:1px solid rgba(244,247,248,.3);border-radius:50%;color:var(--white);background:rgba(5,9,12,.64);font-size:.65rem;font-weight:950}.action.pulse{border-color:rgba(87,244,218,.48);color:var(--cyan)}.start-content{width:min(650px,92vw);margin-left:3vw}.controls-copy{display:none}.interact{bottom:36%}.crosshair{opacity:.75}}
@media (max-width:700px) and (orientation:portrait){.hud{grid-template-columns:1fr}.objective-panel{position:absolute;top:61px;left:0;width:100%}.combat-info{top:122px;width:100%}.start{place-items:center}.start-content{width:100%;margin:0;text-align:center}.start h1{font-size:clamp(3.2rem,16vw,6rem)}.brief{font-size:.9rem}.loadout{grid-template-columns:1fr;text-align:left}.loadout div{min-height:58px}.loadout div:nth-child(3),.loadout small{display:none}.stick-zone{width:126px;height:126px}.stick-zone i{left:39px;top:39px;width:48px;height:48px}.action-cluster{right:141px}.action{width:62px;height:62px}.upgrade-grid{grid-template-columns:1fr}.upgrade-grid button{min-height:105px}.upgrade-grid i{float:left;margin:0 12px 0 0}.overlay{padding:16px}.boss-hud{top:180px}}
@media (max-height:500px) and (orientation:landscape){.topbar{top:4px}.hud{top:46px}.vitals,.objective-panel{height:46px;min-height:46px}.combat-info{top:52px;height:42px;min-height:42px}.portrait{width:30px;height:30px}.objective-panel span{display:none}.boss-hud{top:102px}.stick-zone{width:116px;height:116px;bottom:12px}.stick-zone i{left:37px;top:37px;width:42px;height:42px}.action-cluster{right:130px;bottom:18px}.action{width:58px;height:58px}.start-content{width:min(690px,88vw);margin-left:2vw}.start h1{font-size:clamp(2.8rem,10vw,5rem)}.brief{margin:12px 0;font-size:.82rem}.loadout{margin:10px 0}.loadout div{min-height:62px;padding:8px}.upgrade-panel{padding:16px}.upgrade-grid{margin-top:12px}.upgrade-grid button{min-height:125px}.upgrade-grid i{margin-bottom:8px}}
@media (max-width:900px){.ability-bar{display:none}.mobile-controls{position:absolute;z-index:8;inset:0;display:block;pointer-events:none}.stick-zone{position:absolute;left:max(18px,env(safe-area-inset-left));bottom:max(22px,env(safe-area-inset-bottom));width:142px;height:142px;border:1px solid rgba(218,240,244,.25);border-radius:50%;background:rgba(5,9,12,.34);pointer-events:auto}.stick-zone.aim{left:auto;right:max(18px,env(safe-area-inset-right));border-color:rgba(255,200,87,.28)}.stick-zone i{position:absolute;left:45px;top:45px;width:52px;height:52px;border:1px solid rgba(244,247,248,.38);border-radius:50%;background:rgba(218,240,244,.18)}.stick-label{position:absolute;left:50%;bottom:-18px;transform:translateX(-50%);color:rgba(244,247,248,.45);font-size:.58rem;font-weight:900;white-space:nowrap}.action-cluster{position:absolute;right:max(164px,calc(env(safe-area-inset-right) + 154px));bottom:max(34px,calc(env(safe-area-inset-bottom) + 12px));display:grid;gap:10px;pointer-events:auto}.action{width:72px;height:72px;border:1px solid rgba(244,247,248,.3);border-radius:50%;color:var(--white);background:rgba(5,9,12,.64);font-size:.65rem;font-weight:950}.action.pulse{border-color:rgba(87,244,218,.48);color:var(--cyan)}.controls-copy{display:none}}
@media (max-width:700px){.stick-zone{width:126px;height:126px}.stick-zone i{left:39px;top:39px;width:48px;height:48px}.action-cluster{right:141px}.action{width:62px;height:62px}}
@media (max-width:900px) and (max-height:500px){.stick-zone{width:116px;height:116px;bottom:12px}.stick-zone i{left:37px;top:37px;width:42px;height:42px}.action-cluster{right:130px;bottom:18px}.action{width:58px;height:58px}}
