:root{--bg:#0d1117;--panel:#0d1117d1;--text:#f0f3f6;--muted:#9aa4b0;--accent:#ffb020;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}#app,#app canvas{width:100%;height:100%;display:block;position:fixed;inset:0}#crosshair,#hitmarker{pointer-events:none;width:0;height:0;position:fixed;top:50%;left:50%}#crosshair{--gap:4px;--len:8px}#crosshair i{background:#ffffffeb;position:absolute;box-shadow:0 0 2px #000000d9}#crosshair i:first-child{width:2px;height:var(--len);left:-1px;bottom:var(--gap)}#crosshair i:nth-child(2){width:2px;height:var(--len);left:-1px;top:var(--gap)}#crosshair i:nth-child(3){height:2px;width:var(--len);top:-1px;right:var(--gap)}#crosshair i:nth-child(4){height:2px;width:var(--len);top:-1px;left:var(--gap)}#hitmarker{opacity:0}#hitmarker.show{opacity:1}#hitmarker i{background:#fff;width:2px;height:9px;position:absolute;top:-4.5px;left:-1px;box-shadow:0 0 2px #000000e6}#hitmarker i:first-child{transform:rotate(45deg)translateY(-11px)}#hitmarker i:nth-child(2){transform:rotate(135deg)translateY(-11px)}#hitmarker i:nth-child(3){transform:rotate(225deg)translateY(-11px)}#hitmarker i:nth-child(4){transform:rotate(315deg)translateY(-11px)}#hitmarker.head i{background:#ffd23f}#hitmarker.kill i{background:#ff4136;height:12px;top:-6px}#damage-layer{pointer-events:none;position:fixed;top:50%;left:50%}.dmg{color:#fff;text-shadow:0 1px 3px #000000e6;font:800 18px ui-sans-serif,system-ui,sans-serif;animation:.7s ease-out forwards dmg-float;position:absolute}.dmg.head{color:#ffd23f;font-size:22px}@keyframes dmg-float{0%{transform:translate(var(--dx), -20px) scale(1.2);opacity:1}to{transform:translate(var(--dx), -70px) scale(.9);opacity:0}}#reload{text-align:center;letter-spacing:.12em;text-transform:uppercase;color:#fff;text-shadow:0 1px 2px #000000e6;pointer-events:none;font:600 12px ui-sans-serif,system-ui,sans-serif;display:none;position:fixed;top:calc(50% + 48px);left:50%;transform:translate(-50%)}#reload.show{display:block}#reload>div{background:#00000073;border-radius:2px;width:90px;height:4px;margin-top:5px;overflow:hidden}#reload-bar{background:var(--accent);transform-origin:0;height:100%;transform:scaleX(0)}#weapon-hud{text-align:right;pointer-events:none;text-shadow:0 1px 3px #000c;position:fixed;bottom:18px;right:20px}#weapon-name{letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font:600 12px ui-sans-serif,system-ui,sans-serif}.ammo-line{font:800 34px/1.1 ui-sans-serif,system-ui,sans-serif}.ammo-line .sep,#reserve{color:var(--muted);font-size:20px;font-weight:600}.ammo-line .sep{margin:0 6px}#ammo.low{color:#ff4d3d}#weapon-hud{transition:opacity .15s}#weapon-hud.dim{opacity:.35}#hotbar{pointer-events:none;align-items:stretch;gap:6px;display:flex;position:fixed;bottom:16px;left:50%;transform:translate(-50%)}#hotbar .slot{width:64px;color:var(--muted);background:#0d11178c;border:2px solid #ffffff14;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:7px 4px 6px;font:600 11px ui-sans-serif,system-ui,sans-serif;transition:transform .1s,border-color .1s;display:flex}#hotbar .slot kbd{margin:0}#hotbar .slot.active{border-color:var(--accent);color:var(--text);background:#0d1117bf;transform:translateY(-4px)}#materials{color:#e9b872;background:#0d11178c;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;margin-left:6px;padding:0 10px;font:800 18px ui-sans-serif,system-ui,sans-serif;display:flex}#materials small{color:var(--muted);font:600 10px ui-sans-serif,system-ui,sans-serif}#mat-count.low{color:#ff4d3d}#build-hint{color:#ff8a80;text-shadow:0 1px 2px #000000e6;opacity:0;pointer-events:none;font:600 12px ui-sans-serif,system-ui,sans-serif;position:fixed;top:calc(50% + 28px);left:50%;transform:translate(-50%)}#build-hint.show{opacity:1}@media (width<=560px){#hotbar .slot{width:48px}#weapon-hud{bottom:86px}}#health{pointer-events:none;text-shadow:0 1px 3px #000c;width:220px;position:fixed;bottom:18px;left:20px}#health .label{letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:4px;font:600 12px ui-sans-serif,system-ui,sans-serif}#health .bar{background:#00000073;border:1px solid #ffffff1f;border-radius:4px;height:14px;overflow:hidden}#health-fill{transform-origin:0;background:#4cd964;height:100%;transition:transform .12s,background-color .2s}#health-num{font:800 14px ui-sans-serif,system-ui,sans-serif;position:absolute;top:0;right:0}#vignette{pointer-events:none;opacity:0;background:radial-gradient(#0000 45%,#c80000bf 100%);position:fixed;inset:0}#damage-dirs{pointer-events:none;position:fixed;top:50%;left:50%}.dmg-dir{transform-origin:60px 150px;width:120px;height:300px;animation:1.1s ease-out forwards dmg-dir-fade;position:absolute;top:-150px;left:-60px}.dmg-dir:before{content:"";filter:drop-shadow(0 0 4px #0009);border-bottom:34px solid #ff3228e6;border-left:22px solid #0000;border-right:22px solid #0000;position:absolute;top:0;left:50%;transform:translate(-50%)}@keyframes dmg-dir-fade{0%{opacity:1}70%{opacity:.8}to{opacity:0}}#killfeed{pointer-events:none;flex-direction:column;align-items:flex-end;gap:4px;display:flex;position:fixed;top:32px;right:14px}.feed{color:#fff;background:#0d111799;border-radius:6px;padding:4px 9px;font:600 13px ui-sans-serif,system-ui,sans-serif;animation:4s ease-out forwards feed-fade}.feed b{color:var(--accent)}.feed.bad b{color:#ff6b5b}@keyframes feed-fade{0%,80%{opacity:1}to{opacity:0}}#death{text-align:center;pointer-events:none;z-index:5;background:#3c000073;flex-direction:column;justify-content:center;align-items:center;display:none;position:fixed;inset:0}#death.show{display:flex}#death h2{letter-spacing:.08em;text-transform:uppercase;color:#ff5a4a;text-shadow:0 2px 12px #000000b3;margin:0;font:900 44px ui-sans-serif,system-ui,sans-serif}#death p{color:#fff;text-shadow:0 1px 3px #000;margin:6px 0 0;font-weight:600}@media (width<=560px){#health{width:140px;bottom:86px}}#stats{color:#fff;text-shadow:0 1px 3px #000c;pointer-events:none;font:600 13px ui-sans-serif,system-ui,sans-serif;position:fixed;top:10px;right:14px}#overlay{z-index:10;background:#00000073;place-items:center;padding:16px;display:grid;position:fixed;inset:0}#overlay.hidden{display:none}.panel{background:var(--panel);text-align:center;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid #ffffff14;border-radius:14px;width:min(380px,100%);padding:28px 32px}.panel h1{letter-spacing:.04em;margin:0;font-size:2rem}.tag{color:var(--muted);margin:4px 0 20px;font-size:.9rem}#play{font:inherit;background:var(--accent);color:#1a1200;cursor:pointer;border:0;border-radius:10px;width:100%;padding:12px 22px;font-weight:600}#play:hover{filter:brightness(1.08)}.keys{color:var(--muted);text-align:left;gap:6px;margin:20px 0 0;padding:0;font-size:.85rem;list-style:none;display:grid}kbd{min-width:1.6em;color:var(--text);text-align:center;background:#ffffff1a;border-radius:5px;margin-right:4px;padding:1px 6px;font:600 .75rem ui-monospace,monospace;display:inline-block}#hud{color:var(--muted);pointer-events:none;font:12px ui-monospace,monospace;position:fixed;top:10px;left:12px}