:root{--bg: #0a0e12;--fg: #e8eef2;--accent: #ff5a36;--safe-t: env(safe-area-inset-top, 0px);--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px);--safe-r: env(safe-area-inset-right, 0px)}*{margin:0;padding:0;box-sizing:border-box}html,body,#app{width:100%;height:100%;overflow:hidden}body{background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;touch-action:none;overscroll-behavior:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}#game{display:block;width:100%;height:100%;touch-action:none}#boot{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;text-align:center;padding:1.5rem;background:radial-gradient(circle at 50% 40%,#ff5a361f,#05070ad9);transition:opacity .6s ease;z-index:30;pointer-events:none}#boot.hidden{opacity:0;pointer-events:none}#boot h1{font-size:clamp(2rem,8vw,5rem);letter-spacing:.3em;font-weight:800;text-shadow:0 0 30px rgba(255,90,54,.5)}#boot p{opacity:.7;letter-spacing:.08em;max-width:32ch}.perf-overlay{position:fixed;top:calc(8px + var(--safe-t));left:calc(8px + var(--safe-l));padding:6px 9px;font:12px/1.35 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre;color:#b8ffd0;background:#05080b8c;border:1px solid rgba(184,255,208,.18);border-radius:6px;pointer-events:none;z-index:20}#hud{position:fixed;inset:0;pointer-events:none;z-index:10}.crosshair{position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#e8eef2d9;box-shadow:0 0 4px #0009}.doom{position:absolute;top:calc(14px + var(--safe-t));left:50%;transform:translate(-50%);text-align:center;width:min(70vw,360px)}.doom-time{font:700 26px/1 ui-monospace,monospace;letter-spacing:.12em;text-shadow:0 0 12px rgba(255,90,54,.45)}.doom-bar{margin:6px auto 4px;width:100%;height:4px;background:#ffffff24;border-radius:3px;overflow:hidden}.doom-fill{height:100%;width:0%;background:linear-gradient(90deg,#ffb347,var(--accent));transition:width .3s linear}.doom-label{font-size:12px;letter-spacing:.06em;opacity:.72}.stamina{position:absolute;left:calc(18px + var(--safe-l));bottom:calc(18px + var(--safe-b));width:min(34vw,220px);height:8px;background:#ffffff1f;border-radius:5px;overflow:hidden}.stamina-fill{height:100%;width:100%;background:linear-gradient(90deg,#6fe3a0,#34c977);transition:width .12s linear,background .3s}.stamina-fill.low{background:linear-gradient(90deg,#ff7a4d,var(--accent))}.hint{position:absolute;bottom:calc(16px + var(--safe-b));left:50%;transform:translate(-50%);font-size:12px;letter-spacing:.05em;opacity:.5;text-align:center}#touch{position:fixed;inset:0;pointer-events:none;z-index:15}#touch[data-enabled=false]{display:none}.touch-look{position:absolute;inset:0;pointer-events:auto;touch-action:none}.touch-stick{position:absolute;left:calc(26px + var(--safe-l));bottom:calc(26px + var(--safe-b));width:130px;height:130px;border-radius:50%;background:#ffffff0f;border:1px solid rgba(255,255,255,.18);pointer-events:auto;touch-action:none;z-index:2}.touch-knob{position:absolute;left:50%;top:50%;width:56px;height:56px;border-radius:50%;background:#ffffff38;transform:translate(-50%,-50%)}.touch-btn{position:absolute;display:flex;align-items:center;justify-content:center;width:84px;height:84px;border-radius:50%;font:700 12px/1 system-ui,sans-serif;letter-spacing:.08em;color:var(--fg);background:#ff5a3629;border:1px solid rgba(255,90,54,.45);pointer-events:auto;touch-action:none;z-index:2}.touch-btn:active{background:#ff5a3666}.touch-btn.sprint{right:calc(24px + var(--safe-r));bottom:calc(206px + var(--safe-b))}.touch-btn.crouch{right:calc(116px + var(--safe-r));bottom:calc(168px + var(--safe-b))}.touch-btn.scan{right:calc(24px + var(--safe-r));bottom:calc(112px + var(--safe-b));background:#2fe6ff29;border-color:#2fe6ff80}.touch-btn.scan:active{background:#2fe6ff6b}.touch-btn.use{right:calc(116px + var(--safe-r));bottom:calc(74px + var(--safe-b))}.touch-btn.codex{right:calc(24px + var(--safe-r));bottom:calc(22px + var(--safe-b));width:60px;height:60px;font-size:10px;background:#ffffff14;border-color:#ffffff47}.vignette{position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 50%,transparent 38%,rgba(150,12,6,.55) 100%);transition:opacity .25s ease;z-index:1}.reticle{position:absolute;left:50%;top:50%;width:60px;height:60px;transform:translate(-50%,-50%);z-index:3}.scan-svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}.scan-track{fill:none;stroke:#ffffff1f;stroke-width:2}.scan-ring{fill:none;stroke:var(--scan, #2fe6ff);stroke-width:3;stroke-linecap:round;transition:stroke-dashoffset .05s linear;filter:drop-shadow(0 0 4px rgba(47,230,255,.7))}.scan-label{position:absolute;top:64px;left:50%;transform:translate(-50%);white-space:nowrap;font:600 11px/1.2 ui-monospace,monospace;letter-spacing:.06em;color:#e8eef28c;text-shadow:0 1px 3px rgba(0,0,0,.8)}.scan-label.active{color:#2fe6ff}.scan-label.logged{color:#6fe3a0}.threat{position:absolute;top:calc(86px + var(--safe-t));left:50%;transform:translate(-50%);font:700 15px/1 system-ui,sans-serif;letter-spacing:.14em;text-align:center;z-index:4;text-shadow:0 0 14px rgba(0,0,0,.8)}.threat.suspect{color:#ffd24a}.threat.search{color:#ff9a3c}.threat.hunting{color:#ff3b1e;animation:threatPulse .5s ease-in-out infinite}@keyframes threatPulse{0%,to{transform:translate(-50%) scale(1);opacity:1}50%{transform:translate(-50%) scale(1.12);opacity:.7}}.objective{position:absolute;top:calc(14px + var(--safe-t));right:calc(14px + var(--safe-r));width:min(46vw,280px);text-align:right;z-index:4}.obj-kicker{font:700 10px/1 system-ui,sans-serif;letter-spacing:.22em;color:var(--accent);opacity:.85}.obj-title{font:600 14px/1.25 system-ui,sans-serif;margin-top:3px;text-shadow:0 1px 4px rgba(0,0,0,.7)}.obj-detail{font-size:11px;line-height:1.3;margin-top:2px;opacity:.62}.obj-bar{display:none;margin:6px 0 0 auto;width:100%;height:4px;background:#ffffff24;border-radius:3px;overflow:hidden}.obj-fill{height:100%;width:0%;background:linear-gradient(90deg,#2fe6ff,#6fe3a0);transition:width .1s linear}.waypoint{position:absolute;width:0;height:0;transform:translate(-50%,-50%);z-index:3;pointer-events:none}.waypoint-dot{position:absolute;left:0;top:0;width:14px;height:14px;margin:-7px 0 0 -7px;border:2px solid #2fe6ff;border-radius:50%;box-shadow:0 0 8px #2fe6ffcc;background:#2fe6ff26}.waypoint.offscreen .waypoint-dot{width:10px;height:10px;margin:-5px 0 0 -5px}.waypoint-arrow{position:absolute;left:0;top:0;width:0;height:0;margin:-7px 0 0 4px;border-left:12px solid #2fe6ff;border-top:7px solid transparent;border-bottom:7px solid transparent;filter:drop-shadow(0 0 4px rgba(47,230,255,.7))}.prompt{position:absolute;left:50%;top:58%;transform:translate(-50%);padding:6px 14px;font:600 13px/1 system-ui,sans-serif;letter-spacing:.05em;color:#e8eef2;background:#080c1099;border:1px solid rgba(47,230,255,.4);border-radius:6px;opacity:0;transition:opacity .15s ease;z-index:4}.prompt.show{opacity:1}.codex-tally{position:absolute;right:calc(18px + var(--safe-r));bottom:calc(18px + var(--safe-b));font:600 12px/1 ui-monospace,monospace;letter-spacing:.08em;color:#6fe3a0d9;z-index:4}#codex{position:fixed;top:0;right:0;width:min(92vw,420px);height:100%;padding:calc(20px + var(--safe-t)) 20px calc(20px + var(--safe-b));background:linear-gradient(180deg,#080c10f5,#080c10e6);border-left:1px solid rgba(47,230,255,.25);backdrop-filter:blur(8px);transform:translate(100%);transition:transform .3s ease;z-index:25;display:flex;flex-direction:column;gap:12px;overflow:hidden}#codex.open{transform:translate(0)}.codex-header{display:flex;justify-content:space-between;align-items:baseline;font:800 16px/1 system-ui,sans-serif;letter-spacing:.22em;color:#2fe6ff}.codex-count{font-size:11px;letter-spacing:.1em;color:#6fe3a0d9}.codex-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:10px}.codex-card{padding:12px 14px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-left:3px solid #2fe6ff;border-radius:6px}.codex-card.creature{border-left-color:#ff7a4d}.codex-card.part{border-left-color:#2fe6ff}.codex-card.capsule{border-left-color:#6fe3a0}.codex-tag{font:700 9px/1 system-ui,sans-serif;letter-spacing:.18em;opacity:.55}.codex-card h3{font:600 14px/1.2 system-ui,sans-serif;font-style:italic;margin:4px 0 6px}.codex-card p{font-size:12px;line-height:1.45;opacity:.78}.codex-hint{font-size:10px;letter-spacing:.06em;opacity:.4;text-align:center}#narrative{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at 50% 35%,#280a068c,#030508eb);z-index:40;transition:opacity .5s ease}#narrative.hidden{opacity:0;pointer-events:none}.narrative-panel{width:min(92vw,580px);max-height:88vh;overflow-y:auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}.narrative-kicker{font:700 11px/1 ui-monospace,monospace;letter-spacing:.32em;color:var(--accent)}.narrative-title{font:800 clamp(1.7rem,6vw,2.8rem) / 1.05 system-ui,sans-serif;letter-spacing:.02em;text-shadow:0 0 28px rgba(255,90,54,.4)}.narrative-body{font-size:clamp(.92rem,2.4vw,1.08rem);line-height:1.6;opacity:.82;max-width:46ch}.narrative-objective,.narrative-stats{margin-top:6px;padding:14px 16px;width:100%;max-width:44ch;text-align:left;background:#ffffff0a;border:1px solid rgba(47,230,255,.22);border-radius:8px;display:flex;flex-direction:column;gap:6px}.narrative-stats{text-align:center;align-items:center;border-color:#6fe3a04d}.narrative-obj-line{font-size:13px;line-height:1.4;opacity:.85}.narrative-controls{margin-top:4px;font:600 11px/1.5 ui-monospace,monospace;letter-spacing:.04em;opacity:.55;max-width:44ch}.narrative-btn{margin-top:10px;padding:13px 38px;font:800 15px/1 system-ui,sans-serif;letter-spacing:.2em;color:#06121a;background:linear-gradient(90deg,#2fe6ff,#6fe3a0);border:none;border-radius:8px;cursor:pointer;box-shadow:0 6px 24px #2fe6ff59;transition:transform .12s ease,box-shadow .12s ease}.narrative-btn:hover{transform:translateY(-2px);box-shadow:0 10px 30px #2fe6ff80}.narrative-btn:active{transform:translateY(0)}.narrative-panel.ending.bad .narrative-btn{background:linear-gradient(90deg,#ff7a4d,var(--accent));color:#fff;box-shadow:0 6px 24px #ff5a3666}.narrative-panel.ending.bad .narrative-title{color:#ff6a4a}.narrative-dots{margin-top:12px;display:flex;gap:8px}.narrative-dots span{width:7px;height:7px;border-radius:50%;background:#ffffff38}.narrative-dots span.on{background:var(--accent)}