html,body{background:#0d1a12;height:100%;margin:0;font-family:system-ui,sans-serif;overflow:hidden}#app{position:fixed;inset:0}#app canvas{display:block}.click-overlay{color:#fff;letter-spacing:.05em;cursor:pointer;text-shadow:0 2px #000;background:#00000059;justify-content:center;align-items:center;font-size:28px;font-weight:800;display:flex;position:fixed;inset:0}:root{--hud-font:"Trebuchet MS", "Segoe UI", system-ui, sans-serif;--hud-panel:#121812b8;--hud-border:#f4f1e6;--hud-green:#8ed35a;--hud-yellow:#ffd23e;--hud-red:#ff4a3a}.hud{pointer-events:none;font-family:var(--hud-font);color:#fff;-webkit-user-select:none;user-select:none;text-shadow:0 2px #0009;position:fixed;inset:0}.hud.hidden,.hud.cinematic>:not(.hud-banner){display:none}.hud-vignette,.hud-dmg{opacity:0;transition:opacity .2s;position:absolute;inset:0}.hud-vignette{background:radial-gradient(#0000 45%,#a0140abf 100%)}.hud-dmg{background:radial-gradient(#0000 55%,#ff3c28cc 100%);transition:none}.hud-top-left{grid-template-rows:auto auto;grid-template-columns:64px auto;align-items:center;gap:4px 10px;display:grid;position:absolute;top:16px;left:16px}.hud-portrait{border:3px solid var(--hud-border);width:64px;height:64px;image-rendering:pixelated;background:#2a3a20;border-radius:8px;grid-row:span 2}.hud-health{background:var(--hud-panel);border:3px solid var(--hud-border);border-radius:6px;width:220px;height:20px;position:relative;overflow:hidden}.hud-health-fill{background:linear-gradient(#9fe36b,#5ea83a);height:100%;transition:width .15s}.hud-health-fill.mid{background:linear-gradient(#ffe066,#e0a020)}.hud-health-fill.low{background:linear-gradient(#ff7a5a,#d02a1a);animation:.6s infinite alternate hud-pulse}.hud-health span{text-align:center;font-size:13px;font-weight:800;line-height:20px;position:absolute;inset:0}.hud-stance{letter-spacing:.12em;color:#cfe8b0;min-height:16px;font-size:12px;font-weight:800}.hud-stance.hidden-state{color:var(--hud-green)}.hud-objective{background:var(--hud-panel);border-left:4px solid var(--hud-yellow);white-space:nowrap;text-overflow:ellipsis;border-radius:4px;max-width:60vw;padding:8px 16px;font-size:15px;font-weight:700;position:absolute;top:18px;left:50%;overflow:hidden;transform:translate(-50%)}.hud-objective:empty{display:none}.hud-alert{background:var(--hud-panel);border:3px solid var(--hud-border);border-radius:8px;min-width:180px;padding:6px 10px 8px;position:absolute;top:16px;right:16px}.hud-alert-label{letter-spacing:.15em;text-align:center;color:#cde0c0;font-size:16px;font-weight:900}.hud-alert-bar{grid-template-columns:repeat(10,1fr);gap:3px;margin-top:4px;display:grid}.hud-alert-bar i{background:#ffffff26;border-radius:2px;height:10px}.hud-alert.calm i.lit{background:var(--hud-green)}.hud-alert.suspicious i.lit,.hud-alert.searching i.lit{background:var(--hud-yellow)}.hud-alert.suspicious .hud-alert-label,.hud-alert.searching .hud-alert-label{color:var(--hud-yellow)}.hud-alert.alerted i.lit{background:var(--hud-red)}.hud-alert.alerted .hud-alert-label{color:var(--hud-red);animation:.4s infinite alternate hud-pulse}.hud-crosshair{--spread:6px;width:0;height:0;position:absolute;top:50%;left:50%}.hud-crosshair i{background:#fff;transition:transform 50ms;position:absolute;box-shadow:0 0 0 1px #0000008c}.hud-crosshair .ch-t,.hud-crosshair .ch-b{width:3px;height:11px;left:-1.5px}.hud-crosshair .ch-l,.hud-crosshair .ch-r{width:11px;height:3px;top:-1.5px}.hud-crosshair .ch-t{bottom:var(--spread)}.hud-crosshair .ch-b{top:var(--spread)}.hud-crosshair .ch-l{right:var(--spread)}.hud-crosshair .ch-r{left:var(--spread)}.hud-crosshair .ch-dot{border-radius:50%;width:3px;height:3px;top:-1.5px;left:-1.5px}.hud-crosshair.friendly i{background:var(--hud-green)}.hud-crosshair.rocks .ch-t,.hud-crosshair.rocks .ch-b,.hud-crosshair.rocks .ch-l,.hud-crosshair.rocks .ch-r{display:none}.hud-crosshair.rocks .ch-dot{background:0 0;border:2px solid #fff;width:10px;height:10px;top:-5px;left:-5px}.hud-hitmarker{opacity:0;position:absolute;top:0;left:0}.hud-hitmarker.on{opacity:1}.hud-hitmarker i{background:#fff;width:11px;height:3px;position:absolute;box-shadow:0 0 2px #000}.hud-hitmarker i:first-child{top:5px;left:5px;transform:rotate(45deg)}.hud-hitmarker i:nth-child(2){top:5px;left:-16px;transform:rotate(-45deg)}.hud-hitmarker i:nth-child(3){top:-8px;left:5px;transform:rotate(-45deg)}.hud-hitmarker i:nth-child(4){top:-8px;left:-16px;transform:rotate(45deg)}.hud-hitmarker.head i{background:var(--hud-yellow)}.hud-hitmarker.kill i{background:var(--hud-red);width:15px}.hud-reload{opacity:0;width:40px;height:40px;position:absolute;top:-20px;left:-20px;transform:rotate(-90deg)}.hud-reload.on{opacity:1}.hud-reload circle{fill:none;stroke:var(--hud-yellow);stroke-width:3px;stroke-dasharray:100.5;stroke-dashoffset:calc(100.5 - 100.5 * var(--p,0))}.hud-friendly{color:var(--hud-green);letter-spacing:.08em;opacity:0;font-size:13px;font-weight:800;position:absolute;top:calc(50% + 26px);left:50%;transform:translate(-50%)}.hud-friendly.on{opacity:1}.hud-interact{background:var(--hud-panel);border-radius:6px;align-items:center;gap:8px;padding:8px 14px 14px;font-size:15px;font-weight:800;display:none;position:absolute;top:calc(50% + 60px);left:50%;transform:translate(-50%)}.hud-interact.on{display:flex}.hud-interact-bar{background:#fff3;border-radius:2px;height:4px;position:absolute;bottom:5px;left:10px;right:10px}.hud-interact-bar div{background:var(--hud-yellow);border-radius:2px;height:100%}.key{text-align:center;min-width:18px;text-shadow:none;background:#0006;border:2px solid #fff;border-radius:4px;padding:1px 5px;font-size:12px;font-weight:900;display:inline-block}.hud-hotbar{gap:8px;display:flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.hud-slot{background:var(--hud-panel);border:3px solid #ffffff59;border-radius:8px;justify-content:center;align-items:center;width:104px;height:58px;display:flex;position:relative}.hud-slot.active{border-color:var(--hud-yellow);background:#3c3414cc;transform:translateY(-4px)}.hud-slot img{object-fit:contain;width:92px;height:46px;image-rendering:pixelated}.hud-slot .key{position:absolute;top:-10px;left:-8px}.hud-slot .count{font-size:13px;font-weight:900;position:absolute;bottom:2px;right:6px}.hud-ammo{text-align:right;font-weight:900;position:absolute;bottom:96px;right:24px}.hud-ammo .mag{font-size:44px}.hud-ammo .sep{opacity:.6;margin:0 4px;font-size:26px}.hud-ammo .reserve{opacity:.85;font-size:24px}.hud-ammo.rocks .sep{display:none}.hud-ammo.rocks .reserve{letter-spacing:.1em;font-size:16px}.hud-ammo.low .mag{color:var(--hud-red)}.hud-ammo-label{letter-spacing:.14em;color:var(--hud-yellow);min-height:15px;font-size:12px}.hud-rescued{background:var(--hud-panel);border:3px solid var(--hud-border);border-radius:8px;align-items:center;gap:4px;padding:6px 12px 6px 6px;display:flex;position:absolute;bottom:16px;right:16px}.hud-rescued span{gap:4px;display:flex}.hud-rescued img{filter:grayscale()brightness(.55);width:38px;height:38px;image-rendering:pixelated;border-radius:4px}.hud-rescued img.freed{filter:none;outline:2px solid var(--hud-green)}.hud-rescued .label{letter-spacing:.15em;margin-left:6px;font-size:11px;font-weight:900}.hud-rescued .value{margin-left:6px;font-size:24px;font-weight:900}.hud-hint{background:var(--hud-panel);border-left:4px solid var(--hud-green);opacity:0;border-radius:4px;max-width:340px;padding:10px 14px;font-size:14px;line-height:1.4;transition:opacity .4s,transform .4s;position:absolute;bottom:96px;left:16px;transform:translate(-12px)}.hud-hint.on{opacity:1;transform:none}.hud-toast{border:2px solid var(--hud-green);opacity:0;background:#141e0ed9;border-radius:6px;padding:8px 18px;font-size:16px;font-weight:800;transition:opacity .3s,transform .3s;position:absolute;top:72px;left:50%;transform:translate(-50%)translateY(-8px)}.hud-toast.on{opacity:1;transform:translate(-50%)}.hud-banner{text-align:center;opacity:0;position:absolute;top:22%;left:0;right:0}.hud-banner.on{animation:4.5s forwards hud-banner}.hud-banner .t1{letter-spacing:.4em;color:var(--hud-yellow);font-size:18px;font-weight:800}.hud-banner .t2{letter-spacing:.06em;text-shadow:0 4px #0009;font-size:56px;font-weight:900}@keyframes hud-pulse{0%{opacity:1}to{opacity:.55}}@keyframes hud-banner{0%{opacity:0;transform:scale(1.08)}12%{opacity:1;transform:scale(1)}80%{opacity:1}to{opacity:0}}@media (max-width:900px){.hud-health{width:140px}.hud-slot{width:80px}.hud-alert{min-width:130px}.hud-banner .t2{font-size:36px}}.hud-waypoint{width:60px;color:var(--hud-yellow);flex-direction:column;align-items:center;margin:-12px 0 0 -30px;font-size:12px;font-weight:900;display:none;position:absolute;top:0;left:0}.hud-waypoint.on{display:flex}.hud-waypoint i{background:var(--hud-yellow);border:2px solid #3a2a08;width:14px;height:14px;transform:rotate(45deg);box-shadow:0 0 6px #ffd23ecc}.hud-waypoint span{margin-top:4px}.hud-waypoint.edge{opacity:.8}.menus{font-family:var(--hud-font,"Trebuchet MS", system-ui, sans-serif);color:#fff;z-index:20;display:none;position:fixed;inset:0}.menus.on{display:block}.menus .screen{display:none}.menus .screen.on{display:flex}.menus .panel{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0a120ab8;flex-direction:column;justify-content:center;align-items:center;gap:10px;position:absolute;inset:0}.menus h2{letter-spacing:.06em;text-shadow:0 4px #00000080;margin:0 0 10px;font-size:44px;font-weight:900}.menus button{color:#fff;min-width:260px;font:inherit;letter-spacing:.06em;cursor:pointer;background:#1e2816e6;border:3px solid #f4f1e6;border-radius:8px;padding:11px 22px;font-size:17px;font-weight:800;transition:transform 80ms,background .15s}.menus button:hover{background:#4c6a2a;transform:translateY(-2px)}.menus button.primary{color:#1a1408;background:#e0a020;border-color:#fff3c8}.menus button.primary:hover{background:#ffc23a}.menus .title{justify-content:flex-start;align-items:center;position:absolute;inset:0}.title-bg{filter:saturate(1.05);background-color:#2c4a22;background-position:50%;background-size:cover;position:absolute;inset:0}.title-bg:after{content:"";background:linear-gradient(90deg,#081008d9 0%,#08100866 45%,#0000 75%);position:absolute;inset:0}.title-panel{flex-direction:column;align-items:flex-start;gap:10px;max-width:420px;margin-left:6vw;display:flex;position:relative}.title-panel .logo{filter:drop-shadow(0 6px #0006);width:min(420px,80vw);margin-bottom:4px}.logo-text{letter-spacing:.04em;color:#ffd23e;text-shadow:0 5px #6a3a10,0 9px #0006;margin:0;font-size:72px;font-weight:900;line-height:.95}.tagline{text-shadow:0 2px #000;margin:0 0 12px;font-size:18px;font-weight:700}.small{opacity:.75;margin-top:8px;font-size:13px}.controls{border-collapse:collapse;background:#00000059;border-radius:8px;margin-bottom:12px;font-size:16px}.controls td{padding:6px 14px}.controls td:first-child{text-align:right}.settings{background:#00000059;border-radius:8px;flex-direction:column;gap:12px;margin-bottom:14px;padding:16px 22px;font-size:16px;font-weight:700;display:flex}.settings label{justify-content:space-between;align-items:center;gap:18px;display:flex}.settings label.check{justify-content:flex-start}.settings input[type=range]{accent-color:#e0a020;width:200px}.end .sub{text-align:center;max-width:520px;margin:0 0 8px;font-size:17px}.end.won h2{color:#ffd23e}.end.lost h2{color:#ff6a4a}.stats{background:#0006;border-radius:8px;grid-template-columns:1fr;gap:4px;min-width:320px;margin-bottom:12px;padding:12px 18px;display:grid}.stats div{justify-content:space-between;gap:24px;font-size:16px;display:flex}.stats b{color:#ffd23e}@media (max-width:700px){.logo-text{font-size:48px}.menus button{min-width:200px}}