:root{font-family:PingFang SC,Microsoft YaHei,system-ui,sans-serif;color:#e9f4e9;background:#07120f;font-synthesis:none;--signal: #84edbd;--warning: #f1bd4b;--danger: #ef5b48}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{-webkit-user-select:none;user-select:none}body,button{-webkit-tap-highlight-color:transparent}#game-canvas{display:block;width:100%;height:100%;outline:none;touch-action:none}.hud{position:fixed;inset:0;pointer-events:none;font-family:Arial Narrow,DIN Condensed,PingFang SC,sans-serif;letter-spacing:.04em}.hud__vignette{position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,9,7,.32),transparent 18%,transparent 72%,rgba(3,8,6,.6)),radial-gradient(circle,transparent 52%,rgba(2,8,6,.38) 100%)}.hud__damage{position:absolute;inset:0;opacity:0;background:radial-gradient(circle,transparent 46%,rgba(155,24,20,.34) 100%),linear-gradient(180deg,rgba(155,24,20,.18),transparent 34%,rgba(155,24,20,.18));transition:opacity .14s ease}.hud__damage.is-visible{opacity:1}.hud__mission{position:absolute;top:28px;left:32px;display:grid;gap:2px;padding:13px 20px 14px 18px;min-width:310px;border-left:3px solid var(--signal);background:linear-gradient(90deg,#05120ed6,#05120e14);text-shadow:0 2px 8px #000}.hud__eyebrow{color:var(--signal);font-size:12px;text-transform:uppercase}.hud__mission strong{font-size:22px;text-transform:uppercase}.hud__mission small{color:#b9c7bd;font-family:PingFang SC,Microsoft YaHei,sans-serif;letter-spacing:0}.hud__stats{position:absolute;left:30px;bottom:36px;display:grid;width:260px;gap:8px}.stat{position:relative;display:grid;grid-template-columns:52px 1fr;align-items:center;height:28px;overflow:hidden;background:#05100dc2;border:1px solid rgba(226,242,229,.17)}.stat span,.stat b{z-index:1;padding-left:9px}.stat b{justify-self:end;padding:0 9px;font-size:18px}.stat i{position:absolute;inset:0;width:var(--value);background:#6ddc9d66}.stat--armor i{background:#50a3da66}.hud__ammo{position:absolute;right:32px;bottom:34px;display:grid;min-width:220px;text-align:right;text-shadow:0 2px 8px #000}.hud__ammo>span{color:#9bad9f;font-size:12px}.hud__ammo>span.is-reloading{color:var(--warning)}.hud__ammo>strong{color:#f4f0df;font-size:24px;text-transform:uppercase}.hud__ammo div{display:flex;align-items:baseline;justify-content:flex-end;gap:8px}.hud__ammo div b{color:var(--warning);font-size:48px;line-height:.95}.hud__ammo em{color:#9bad9f;font-size:12px;font-style:normal}.hud__inventory{position:absolute;right:32px;bottom:125px;display:flex;gap:14px;color:#b8c7ba;font-size:13px}.hud__inventory b{color:#fff;font-size:16px}.crosshair{position:absolute;top:50%;left:50%;width:28px;height:28px;transform:translate(-50%,-50%);filter:drop-shadow(0 1px 1px #000)}.crosshair i{position:absolute;display:block;background:#eafaede0}.crosshair i:nth-child(1),.crosshair i:nth-child(2){left:13px;width:2px;height:7px}.crosshair i:nth-child(1){top:0}.crosshair i:nth-child(2){bottom:0}.crosshair i:nth-child(3),.crosshair i:nth-child(4){top:13px;width:7px;height:2px}.crosshair i:nth-child(3){left:0}.crosshair i:nth-child(4){right:0}.crosshair span{position:absolute;top:13px;left:7px;display:block;width:14px;height:2px;opacity:0;background:#fff;transform:rotate(45deg)}.crosshair span:last-child{transform:rotate(-45deg)}.crosshair.is-hit span{animation:hitmarker .16s ease-out}.crosshair.is-kill span{background:var(--danger);animation:hitmarker .3s ease-out}@keyframes hitmarker{0%{opacity:1;transform:scale(1.5) rotate(45deg)}to{opacity:0;transform:scale(.8) rotate(45deg)}}.crosshair.is-hit span:last-child,.crosshair.is-kill span:last-child{animation-name:hitmarker-alt}@keyframes hitmarker-alt{0%{opacity:1;transform:scale(1.5) rotate(-45deg)}to{opacity:0;transform:scale(.8) rotate(-45deg)}}.hud__combat{position:absolute;top:74px;right:28px;display:flex;align-items:baseline;gap:8px;color:#97a99e;font-size:12px}.hud__combat b{color:var(--danger);font-size:24px}.hud__network{position:absolute;top:108px;right:28px;color:#9fcab5;font-size:12px;text-shadow:0 2px 8px #000}.hud__toast,.hud__combat-toast{position:absolute;left:50%;opacity:0;transform:translate(-50%,8px);transition:opacity .16s ease,transform .16s ease;text-shadow:0 2px 7px #000}.hud__toast{bottom:24%;padding:9px 18px;color:var(--signal);background:#04100ccc;border:1px solid rgba(132,237,189,.35);font-size:16px}.hud__combat-toast{top:57%;color:#f5d98c;font-size:18px}.hud__toast.is-visible,.hud__combat-toast.is-visible{opacity:1;transform:translate(-50%)}.hud__hint{position:absolute;bottom:12px;left:50%;transform:translate(-50%);color:#e7f2e8b3;font-family:PingFang SC,Microsoft YaHei,sans-serif;font-size:12px;letter-spacing:0}.hud__perf{position:absolute;top:24px;right:28px;display:flex;gap:12px;padding:7px 10px;color:#a9bbb0;background:#030c098f;border:1px solid rgba(151,213,177,.14);font-size:12px}.touch-controls{position:absolute;inset:0;display:none;pointer-events:none;touch-action:none}.touch-controls.is-visible{display:block}.touch-joystick{position:absolute;left:max(22px,env(safe-area-inset-left));bottom:max(22px,env(safe-area-inset-bottom));width:148px;height:148px;border:1px solid rgba(132,237,189,.38);border-radius:50%;background:radial-gradient(circle,#84edbd2e,#05120e2e 62%,#05120e8a);pointer-events:auto}.touch-joystick i{position:absolute;top:50%;left:50%;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;background:#84edbd94;box-shadow:0 0 20px #84edbd3d}.touch-buttons{position:absolute;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(3,62px);grid-template-rows:repeat(3,54px);gap:10px;align-items:center;pointer-events:auto}.touch-button{width:62px;height:54px;color:#eaf7ee;background:#06120e94;border:1px solid rgba(132,237,189,.34);border-radius:8px;font:700 14px PingFang SC,Microsoft YaHei,sans-serif;letter-spacing:0;text-shadow:0 1px 4px #000;touch-action:none}.touch-button:active{color:#06110d;background:var(--signal)}.touch-button--fire{grid-column:3;grid-row:1 / span 2;height:118px;border-color:#ef5b488c;background:#5e16129e}.pause{position:absolute;inset:0;display:grid;place-items:center;opacity:0;visibility:hidden;pointer-events:auto;background:linear-gradient(90deg,#030b08eb,#030b0899),repeating-linear-gradient(120deg,transparent 0 34px,rgba(119,205,156,.025) 34px 35px);transition:opacity .18s ease,visibility .18s ease}.pause.is-visible{opacity:1;visibility:visible}.pause__panel{width:min(560px,calc(100vw - 40px));padding:38px 42px 32px;border:1px solid rgba(147,222,179,.25);border-left:4px solid var(--signal);background:#07140fd1;box-shadow:0 26px 90px #0000007a}.pause__kicker{color:var(--signal);font-size:13px;text-transform:uppercase}.pause h1{margin:4px 0 8px;color:#f1f4e9;font-size:clamp(56px,8vw,88px);line-height:.9;text-transform:uppercase}.pause p{margin:20px 0 28px;max-width:440px;color:#b9c7bd;font-family:Noto Sans SC,sans-serif;line-height:1.75;letter-spacing:0}.pause button{width:100%;padding:14px 22px;color:#07130e;background:var(--signal);border:0;font:700 20px Arial Narrow,DIN Condensed,PingFang SC,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:transform .12s ease,background .12s ease}.pause button:hover{transform:translateY(-2px);background:#a0f5cd}.pause button:focus-visible{outline:3px solid #fff;outline-offset:3px}.pause [data-resume]{display:none}.pause.has-started [data-resume]{display:block}.pause.has-started .difficulty-picker{display:none}.difficulty-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:24px 0 8px}.difficulty-picker button{padding:13px 8px;color:#eaf7ee;background:#0e271ee6;border:1px solid rgba(132,237,189,.34);font-size:19px}.difficulty-picker button:hover{color:#06110d;background:var(--warning);border-color:var(--warning)}.pause__controls{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 20px;margin:22px 0;color:#b9c7bd;font-family:PingFang SC,Microsoft YaHei,sans-serif;font-size:13px;letter-spacing:0}kbd{display:inline-block;min-width:55px;margin-right:8px;padding:3px 7px;color:#edf5ec;text-align:center;background:#162a21;border:1px solid #3e5a4c;border-radius:3px;box-shadow:inset 0 -2px #0000004d}.pause small{color:#708078;font-family:PingFang SC,Microsoft YaHei,sans-serif;letter-spacing:0}@media(max-width:700px){.hud__mission{left:16px;right:16px;min-width:0}.hud__stats{left:16px;width:200px}.hud__ammo,.hud__inventory{right:16px}.hud__perf,.hud__hint{display:none}.pause__panel{padding:28px 24px}}@media(pointer:coarse)and (orientation:landscape){.hud{letter-spacing:.02em}.hud__mission{top:max(12px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));min-width:260px;padding:9px 14px 10px 13px}.hud__mission strong{font-size:18px}.hud__mission small,.hud__hint,.pause__controls{display:none}.hud__stats{left:max(14px,env(safe-area-inset-left));bottom:calc(max(18px,env(safe-area-inset-bottom)) + 154px);width:180px}.stat{height:24px;grid-template-columns:42px 1fr}.hud__ammo{right:calc(max(18px,env(safe-area-inset-right)) + 224px);bottom:max(20px,env(safe-area-inset-bottom));min-width:138px}.hud__ammo>strong{font-size:18px}.hud__ammo div b{font-size:36px}.hud__inventory{right:calc(max(18px,env(safe-area-inset-right)) + 224px);bottom:calc(max(20px,env(safe-area-inset-bottom)) + 78px);font-size:12px}.hud__combat{top:max(12px,env(safe-area-inset-top));right:max(18px,env(safe-area-inset-right))}.hud__network{top:calc(max(12px,env(safe-area-inset-top)) + 34px);right:max(18px,env(safe-area-inset-right))}.hud__perf{display:none}.pause__panel{width:min(760px,calc(100vw - 44px));max-height:calc(100vh - 28px);overflow:auto;padding:22px 28px 20px}.pause h1{font-size:clamp(42px,9vh,66px)}.pause p{margin:12px 0 16px;max-width:620px;line-height:1.55}.difficulty-picker{grid-template-columns:repeat(6,1fr);gap:8px;margin:14px 0 4px}.difficulty-picker button{padding:11px 4px;font-size:16px}}@media(pointer:coarse)and (orientation:portrait){.hud:after{content:"请横屏游玩";position:fixed;inset:0;z-index:20;display:grid;place-items:center;color:#eaf7ee;background:#030b08eb;font:700 30px PingFang SC,Microsoft YaHei,sans-serif;letter-spacing:0}}