:root{color-scheme:dark;--accent:#6be4ce;--text:#ecf4f5}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#101827;color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif}
.game-frame{position:fixed;inset:0;width:100%;height:100vh;height:100dvh;overflow:hidden;background:#151f2b;user-select:none}
canvas{display:block;width:100%;height:100%}
.vignette,.overlay{position:absolute;inset:0;pointer-events:none}
.vignette{background:radial-gradient(ellipse at center,transparent 44%,#03070d83 100%)}
.damage-indicator{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 55%,#b22932a8 100%);opacity:0;transition:opacity .2s}.damage-indicator.active{opacity:1;transition:none}
.hud{position:absolute;left:0;right:0;top:0;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:25px 30px;background:linear-gradient(#07101aaa,transparent);pointer-events:none}
.hud-left,.hud-right{display:flex;flex-direction:column;gap:3px;min-width:100px}.hud-right{text-align:right}
.hud-label{color:var(--accent);font-size:10px;letter-spacing:.25em;font-weight:700}.hud strong{font-size:26px;font-variant-numeric:tabular-nums;letter-spacing:.05em}
.hud-center{align-self:flex-start;color:#c3d5d9;font-size:11px;letter-spacing:.11em;text-align:center;text-transform:uppercase;padding-top:11px}
.hud-center{display:flex;flex-direction:column;align-items:center;gap:4px;padding-top:0;min-width:190px}.hud-center strong{font-size:22px}.hud-center #message{margin-top:5px;font-size:10px;line-height:1.3}.health-bar{width:150px;max-width:100%;height:6px;background:#122633;border:1px solid #66818a;overflow:hidden}.health-bar i{display:block;width:100%;height:100%;background:#6be4ce;transition:width .18s}.health-bar.enemy i{background:#e36b5d}.hud-left .health-bar{margin-top:3px}
.crosshair{position:absolute;left:50%;top:50%;width:4px;height:4px;transform:translate(-50%,-50%);background:var(--accent);border-radius:50%;pointer-events:none;opacity:.9}
.crosshair.scoped{opacity:0}
.hit-marker{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:37px;color:#ffca92;opacity:0;pointer-events:none}.hit-marker.active{opacity:1}
.weapon-hud{position:absolute;left:30px;bottom:26px;padding:12px 16px;min-width:170px;background:linear-gradient(90deg,#07131dc9,#07131d55);border-left:3px solid var(--accent);pointer-events:none;text-shadow:0 2px 5px #000}.weapon-hud .hud-label{display:block}.ammo-count{display:flex;align-items:baseline;gap:8px;margin:3px 0 1px;font-variant-numeric:tabular-nums}.ammo-count strong{font-size:35px;line-height:1}.ammo-count span{color:#bdd2d8;font-size:16px}.weapon-hud small{color:#9cb5bf;font-size:9px;letter-spacing:.13em}
.ammo-count[hidden]{display:none}
.result-cue{position:absolute;left:50%;top:46%;z-index:4;display:flex;flex-direction:column;align-items:center;gap:7px;min-width:min(440px,88vw);padding:23px 30px;transform:translate(-50%,-50%) scale(.94);background:#081624d9;border:1px solid currentColor;box-shadow:0 16px 55px #0009;color:var(--accent);text-align:center;text-shadow:0 2px 15px #000;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .16s,transform .16s,visibility .16s}.result-cue.active{opacity:1;visibility:visible;transform:translate(-50%,-50%) scale(1)}.result-cue.lost{color:#ff7776}.result-cue strong{font-size:clamp(32px,7vw,68px);line-height:1;letter-spacing:.14em}.result-cue span{font-size:12px;font-weight:800;letter-spacing:.25em}
.buy-hint{position:absolute;right:30px;bottom:27px;padding:9px 12px;background:#091924b8;color:#b8d3d4;font-size:10px;letter-spacing:.08em;pointer-events:none}
.buy-menu{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;padding:20px;background:#07101ee8;backdrop-filter:blur(6px);overflow-y:auto}.buy-menu.hidden{display:none}
.buy-panel{width:min(890px,100%);max-height:100%;margin:auto;padding:28px;background:#142433;border:1px solid #58747d;box-shadow:0 25px 70px #000a;overflow-y:auto}
.buy-header,.buy-footer{display:flex;justify-content:space-between;align-items:center;gap:18px}.buy-header h2{margin:7px 0 0;font-size:clamp(23px,4vw,36px);letter-spacing:-.04em}.buy-header strong{color:var(--accent);font-size:23px;font-variant-numeric:tabular-nums;white-space:nowrap}.buy-panel>p{margin:17px 0 22px;color:#b4c7cb;font-size:13px;line-height:1.5}
.buy-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.buy-card{padding:18px;background:linear-gradient(135deg,#1c3440,#11212e);border:1px solid #48616a;border-left:4px solid var(--weapon-color)}.buy-card.owned{background:linear-gradient(135deg,#25453f,#12252d)}.buy-card-top{display:flex;justify-content:space-between;gap:8px;color:#a8bdc2;font-size:10px;letter-spacing:.1em}.buy-card-top strong{color:var(--weapon-color);white-space:nowrap}.buy-card h3{margin:17px 0 9px;font-size:18px}.buy-card p{min-height:30px;margin:0 0 17px;color:#a8bdc2;font-size:11px;line-height:1.4}.buy-card button,.buy-footer button{border:0;padding:11px 15px;background:var(--accent);color:#0a202a;font-weight:800;letter-spacing:.08em;cursor:pointer}.buy-card button{width:100%}.buy-card button:hover:not(:disabled),.buy-footer button:hover{background:#b2fff0}.buy-card button:disabled{background:#4b6065;color:#b2bec0;cursor:default}.buy-footer{margin-top:20px;padding-top:18px;border-top:1px solid #425964;color:#bfd3d4;font-size:12px}
.overlay{display:flex;align-items:center;justify-content:center;overflow-y:auto;padding:16px;background:#06101dcc;backdrop-filter:blur(4px);pointer-events:auto}.overlay.hidden{display:none}
.panel{width:min(530px,100%);margin:auto;padding:40px 42px 33px;background:linear-gradient(140deg,#1c3040f2,#101d2df5);border:1px solid #4c6976;box-shadow:0 20px 60px #0009;text-align:center}
.eyebrow{color:var(--accent);font-size:10px;letter-spacing:.3em;font-weight:800}.panel h1{font-size:clamp(28px,4vw,45px);letter-spacing:-.05em;line-height:1.05;margin:15px 0 13px}.panel p{line-height:1.6;color:#b8cad0;font-size:14px;margin:0 auto 27px;max-width:380px}
.panel button{appearance:none;border:0;background:var(--accent);color:#09202a;padding:15px 23px;font-weight:900;letter-spacing:.12em;cursor:pointer;box-shadow:0 5px 25px #4fe6d14d}.panel button:hover,.panel button:focus-visible{background:#a0ffe8;outline:2px solid #fff;outline-offset:3px}.panel button span{margin-left:24px;font-size:18px}
.sensitivity-setting{margin:0 auto 25px;max-width:380px;text-align:left}.sensitivity-heading,.sensitivity-limits{display:flex;align-items:center;justify-content:space-between;gap:12px}.sensitivity-heading label{color:var(--accent);font-size:10px;letter-spacing:.16em;font-weight:800}.sensitivity-heading input{width:82px;padding:7px 8px;background:#0e1b29;border:1px solid #52727d;border-radius:3px;color:#e7fbf7;text-align:right;font:700 13px Inter,Segoe UI,Arial,sans-serif}.sensitivity-heading input:focus-visible,.sensitivity-setting input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.sensitivity-setting input[type=range]{display:block;width:100%;margin:13px 0 4px;accent-color:var(--accent);cursor:pointer}.sensitivity-limits{color:#829daa;font-size:10px;font-variant-numeric:tabular-nums}.sensitivity-setting small{display:block;margin-top:12px;color:#9db5c0;font-size:10px;line-height:1.45}
.panel .sensitivity-setting{margin-bottom:16px}.panel .sensitivity-setting input[type=range]{margin:8px 0 2px}.panel .sensitivity-setting small{margin-top:6px}.panel .controls{margin-top:20px;padding-top:15px}
.controls{display:flex;justify-content:center;flex-wrap:wrap;gap:10px 16px;margin-top:31px;padding-top:21px;border-top:1px solid #3b5664;color:#9db5c0;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.controls span{white-space:nowrap}
kbd{display:inline-block;background:#263a49;border:1px solid #4f6874;border-radius:3px;color:#e5f7f4;padding:3px 5px;margin-right:3px;font:inherit;font-weight:700;letter-spacing:0}
@media(max-width:700px){.hud{padding:12px;gap:8px}.hud-center{min-width:0;padding-top:0}.hud-center #message{display:none}.hud strong{font-size:16px}.hud-label{font-size:8px}.health-bar{width:85px}.panel{padding:25px 19px}.panel p{font-size:12px}.controls{gap:8px}.weapon-hud{left:12px;bottom:12px;min-width:130px;padding:8px 10px}.ammo-count strong{font-size:26px}.buy-hint{right:12px;bottom:12px;max-width:53%;line-height:1.7}.buy-panel{padding:18px}.buy-footer{align-items:stretch;flex-direction:column}}