:root{--bg:#05070f;--ink:#eaf8ff;--muted:#8ba6b8;--dim:#5b7385;--cyan:#1de5ff;--cyan-strong:#7af4ff;--orange:#ff6a2a;--orange-soft:#ffb07a;--red:#f35;--panel:#070d17b8;--line:#81dcff29;--font-display:"Bahnschrift", "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;--font-body:"Microsoft JhengHei UI", "Microsoft JhengHei", "Microsoft YaHei UI", "Microsoft YaHei", "Noto Sans TC", "PingFang TC", "Segoe UI", system-ui, sans-serif;--font-mono:"Cascadia Mono", "SFMono-Regular", Consolas, "Courier New", monospace}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;margin:0;overflow:hidden}body{-webkit-user-select:none;user-select:none}#app{background:radial-gradient(circle at 50% 35%, #1de5ff0f, transparent 45%), var(--bg);position:fixed;inset:0;overflow:hidden}#canvas-host,#canvas-host canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.hidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important}.hud{z-index:10;pointer-events:none;font-family:var(--font-mono);padding:clamp(1rem,2.6vw,2.5rem);transition:opacity .3s,visibility .3s;position:absolute;inset:0}.hud-top{justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.hud-brand{align-items:center;gap:.75rem;display:flex}.brand-mark{clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:linear-gradient(135deg,#1de5ff38,#0000 55%),#050c16d9;border:1px solid #1de5ff80;width:2.35rem;height:2.35rem;position:relative;box-shadow:0 0 18px #1de5ff33}.brand-mark:after{content:"";background:var(--orange);clip-path:polygon(50% 0,100% 100%,0 100%);position:absolute;inset:.72rem;box-shadow:0 0 14px #ff6a2aa6}.brand-copy{flex-direction:column;gap:.12rem;display:flex}.brand-copy b{font-family:var(--font-display);letter-spacing:.22em;font-size:.95rem;font-weight:700}.brand-copy small{color:var(--muted);letter-spacing:.18em;font-size:.54rem}.hud-center,.hud-score{border:1px solid var(--line);background:linear-gradient(#091422cc,#050a1273);flex-direction:column;align-items:center;gap:.15rem;min-width:5.4rem;padding:.55rem .85rem;display:flex;box-shadow:inset 0 0 24px #1de5ff09}.hud-score{align-items:flex-end}.hud-label{color:var(--muted);letter-spacing:.22em;font-size:.54rem}.hud-center strong,.hud-score strong{font-family:var(--font-display);letter-spacing:.1em;color:var(--cyan-strong);text-shadow:0 0 16px #1de5ff59;font-size:1.35rem}.hud-score strong{color:var(--ink)}.hud-health{border:1px solid var(--line);border-left:2px solid var(--cyan);background:linear-gradient(90deg,#08121ee0,#070d176b);width:min(20rem,31vw);padding:.8rem .9rem .65rem;position:absolute;bottom:clamp(1rem,2.6vw,2.5rem);left:clamp(1rem,2.6vw,2.5rem);box-shadow:0 0 28px #00000040,inset 0 0 22px #1de5ff08}.hud-meta{color:var(--muted);letter-spacing:.2em;justify-content:space-between;align-items:baseline;gap:1rem;font-size:.58rem;display:flex}.hud-meta b{color:var(--ink);font-family:var(--font-display);letter-spacing:.04em;font-size:1.15rem}.health-track,.ammo-track{background:#02080ed9;border:1px solid #81dcff24;height:.42rem;margin-top:.5rem;position:relative;overflow:hidden}.health-track:after,.ammo-track:after{content:"";background:repeating-linear-gradient(90deg,#0000 0 11px,#02080ed9 11px 13px);position:absolute;inset:0}#health-fill{background:linear-gradient(90deg, #0fb7d6, var(--cyan-strong));width:100%;height:100%;transition:width .18s,background .2s;box-shadow:0 0 16px #1de5ff8c}#health-fill.low{background:linear-gradient(90deg,#ff244d,#ff7a48);box-shadow:0 0 18px #ff3355a6}.hud-sub{color:var(--dim);letter-spacing:.16em;justify-content:space-between;gap:.75rem;margin-top:.45rem;font-size:.5rem;display:flex}.hud-ammo{border:1px solid var(--line);border-right:2px solid var(--orange);text-align:right;background:linear-gradient(270deg,#190c08cc,#070d176b);width:min(13rem,23vw);padding:.8rem .9rem .65rem;position:absolute;bottom:clamp(1rem,2.6vw,2.5rem);right:clamp(1rem,2.6vw,2.5rem)}#reload-indicator{color:var(--muted)}#reload-indicator.warn{color:var(--orange);animation:.9s ease-in-out infinite soft-pulse}.ammo-count{justify-content:flex-end;align-items:baseline;gap:.4rem;margin-top:.1rem;display:flex}.ammo-count strong{font-family:var(--font-display);letter-spacing:-.02em;color:#fff4e8;text-shadow:0 0 22px #ff6a2a4d;font-size:clamp(2.4rem,5vw,3.6rem);line-height:.9}.ammo-count span{color:var(--muted);font-size:.75rem}#ammo-fill{background:linear-gradient(90deg, var(--orange), var(--orange-soft));width:100%;height:100%;transition:width .12s linear;box-shadow:0 0 14px #ff6a2a73}.crosshair{opacity:.9;width:2.1rem;height:2.1rem;transition:opacity .2s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ch-line{background:#e1fcffeb;transition:transform 80ms,background 80ms,box-shadow 80ms;position:absolute;box-shadow:0 0 8px #1de5ffcc}.ch-top,.ch-bottom{width:1.5px;height:.45rem;left:50%;transform:translate(-50%)}.ch-top{top:0}.ch-bottom{bottom:0}.ch-left,.ch-right{width:.45rem;height:1.5px;top:50%;transform:translateY(-50%)}.ch-left{left:0}.ch-right{right:0}.ch-dot{background:var(--cyan-strong);width:3px;height:3px;box-shadow:0 0 8px var(--cyan);border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.crosshair.shoot .ch-top{transform:translate(-50%,-3px)}.crosshair.shoot .ch-bottom{transform:translate(-50%,3px)}.crosshair.shoot .ch-left{transform:translate(-3px,-50%)}.crosshair.shoot .ch-right{transform:translate(3px,-50%)}.crosshair.hit .ch-line,.crosshair.hit .ch-dot{box-shadow:0 0 12px var(--red);background:#fff}.hitmarker{opacity:0;width:2.4rem;height:2.4rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.hitmarker.show{animation:.2s ease-out hitmark}.hitmarker span{width:.7rem;height:2px;box-shadow:0 0 10px var(--red);background:#fff;position:absolute;top:50%;left:50%}.hitmarker span:first-child{transform:translate(-50%,-50%)rotate(45deg)translate(-.7rem)}.hitmarker span:nth-child(2){transform:translate(-50%,-50%)rotate(135deg)translate(-.7rem)}.hitmarker span:nth-child(3){transform:translate(-50%,-50%)rotate(225deg)translate(-.7rem)}.hitmarker span:nth-child(4){transform:translate(-50%,-50%)rotate(315deg)translate(-.7rem)}@keyframes hitmark{0%{opacity:1;transform:translate(-50%,-50%)scale(.7)}to{opacity:0;transform:translate(-50%,-50%)scale(1.15)}}.damage-flash{opacity:0;background:radial-gradient(#0000 36%,#ff244d8f 100%),linear-gradient(90deg,#ff244d1f,#0000 30% 70%,#ff244d1f);transition:opacity 90ms;position:absolute;inset:0}.damage-flash.active{opacity:1}.wave-banner{font-family:var(--font-display);letter-spacing:.32em;color:var(--cyan-strong);text-shadow:0 0 26px #1de5ff99;opacity:0;white-space:nowrap;font-size:clamp(1.5rem,4vw,3rem);font-weight:700;position:absolute;top:17%;left:50%;transform:translate(-50%,-8px)}.wave-banner.show{animation:1.8s cubic-bezier(.2,.8,.2,1) forwards banner-in}@keyframes banner-in{0%{opacity:0;filter:blur(4px);transform:translate(-50%,8px)scale(.96)}18%{opacity:1;filter:blur();transform:translate(-50%)scale(1)}78%{opacity:1}to{opacity:0;transform:translate(-50%,-10px)}}.scanlines{opacity:.2;mix-blend-mode:overlay;background:repeating-linear-gradient(0deg,#ffffff09 0 1px,#0000 1px 4px);position:absolute;inset:0}.hud-vignette{position:absolute;inset:0;box-shadow:inset 0 0 180px #000000b8}@keyframes soft-pulse{0%,to{opacity:.55}50%{opacity:1}}.screen{z-index:20;-webkit-backdrop-filter:blur(13px);backdrop-filter:blur(13px);background:radial-gradient(circle at 50% 18%,#1de5ff17,#0000 38%),radial-gradient(circle at 82% 82%,#ff6a2a14,#0000 44%),#04070ee0;place-items:center;padding:clamp(1.25rem,4vw,4rem);transition:opacity .35s,visibility .35s;display:grid;position:absolute;inset:0;overflow:hidden}.screen-grid{opacity:.55;background-image:linear-gradient(#1de5ff1a 1px,#0000 1px),linear-gradient(90deg,#1de5ff1a 1px,#0000 1px);background-size:64px 64px;position:absolute;inset:-25%;transform:perspective(700px)rotateX(57deg)translateY(20%);-webkit-mask-image:radial-gradient(#000 10%,#0000 66%);mask-image:radial-gradient(#000 10%,#0000 66%)}.screen-glow{filter:blur(20px);background:radial-gradient(circle,#ff6a2a1f,#0000 62%);border-radius:50%;width:min(44rem,90vw);height:min(44rem,90vw);position:absolute;transform:translateY(8%)}.screen-content{z-index:2;text-align:center;width:min(60rem,100%);animation:.55s cubic-bezier(.2,.8,.2,1) both screen-in;position:relative}.screen-content.compact{width:min(38rem,100%)}@keyframes screen-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.eyebrow{color:var(--muted);font-family:var(--font-mono);letter-spacing:.26em;margin-bottom:clamp(1rem,2vw,1.6rem);font-size:clamp(.58rem,.9vw,.72rem);display:inline-block}h1,h2{font-family:var(--font-display);text-transform:uppercase;color:#0000;background:linear-gradient(#fff 0%,#d6fbff 42%,#4fd8ff 100%);filter:drop-shadow(0 0 30px #1de5ff2e);-webkit-background-clip:text;background-clip:text;margin:0;font-weight:700}h1{letter-spacing:-.045em;font-size:clamp(4.2rem,13vw,9.5rem);line-height:.8}h1 span,h2 span{background:linear-gradient(#ffd6b6 0%,#ff8a4a 48%,#ff4e22 100%);color:#0000;filter:drop-shadow(0 0 26px #ff6a2a38);-webkit-background-clip:text;background-clip:text}h2{letter-spacing:-.035em;margin-bottom:1.4rem;font-size:clamp(3.4rem,9vw,6.8rem);line-height:.84}.tagline{color:#a9c1cf;max-width:34rem;margin:clamp(1.2rem,2.2vw,1.8rem) auto 0;font-size:clamp(.92rem,1.2vw,1.05rem);line-height:1.75}.controls{border:1px solid var(--line);text-align:left;background:linear-gradient(#09121eb8,#050a126b);grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;max-width:44rem;margin:clamp(1.6rem,3vw,2.4rem) auto 0;padding:.75rem;display:grid;box-shadow:inset 0 0 30px #1de5ff06}.control{color:var(--muted);font-family:var(--font-mono);letter-spacing:.04em;align-items:center;gap:.55rem;padding:.45rem .55rem;font-size:.68rem;display:flex}.keys{flex-shrink:0;gap:.2rem;display:inline-flex}kbd{color:#dffbff;min-width:1.35rem;height:1.35rem;font-family:var(--font-mono);letter-spacing:.04em;background:#091624e6;border:1px solid #81dcff38;border-bottom-color:#81dcff66;border-radius:3px;justify-content:center;align-items:center;padding:0 .3rem;font-size:.6rem;display:inline-flex;box-shadow:inset 0 -2px #00000059}.primary-button{color:#effeff;min-width:min(19rem,82vw);font-family:var(--font-display);letter-spacing:.2em;text-transform:uppercase;cursor:pointer;background:linear-gradient(90deg,#1de5ff33,#1de5ff0f),#050e18cc;border:1px solid #1de5ffb3;border-radius:2px;justify-content:center;align-items:center;gap:1rem;margin-top:clamp(1.6rem,3vw,2.5rem);padding:1rem 1.5rem;font-size:clamp(.8rem,1.1vw,.95rem);font-weight:600;transition:transform .18s,background .18s,box-shadow .18s;display:inline-flex;position:relative;box-shadow:0 0 30px #1de5ff1f,inset 0 0 20px #1de5ff0a}.primary-button:before{content:"";background:linear-gradient(110deg,#0000 20%,#ffffff24 48%,#0000 72%);transition:transform .5s;position:absolute;inset:0;transform:translate(-120%)}.primary-button:hover{background:linear-gradient(90deg,#1de5ff4d,#1de5ff1a),#050e18e6;transform:translateY(-1px);box-shadow:0 0 44px #1de5ff33,inset 0 0 24px #1de5ff14}.primary-button:hover:before{transform:translate(120%)}.primary-button:active{transform:translateY(0)}.primary-button:disabled{opacity:.5;cursor:wait;transform:none;box-shadow:0 0 18px #1de5ff0f,inset 0 0 14px #1de5ff05}.primary-button:disabled:before{display:none}.primary-button:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}.primary-button em{color:var(--cyan-strong);font-size:1.2em;font-style:normal}.fineprint{color:#6f8a9c;font-family:var(--font-mono);letter-spacing:.08em;margin:1.1rem auto 0;font-size:.66rem}.result-grid{border:1px solid var(--line);background:#070e18b3;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;max-width:22rem;margin:1.8rem auto 0;padding:.6rem;display:grid}.result-grid div{background:#040910b3;border:1px solid #81dcff1a;flex-direction:column;gap:.15rem;padding:.7rem;display:flex}.result-grid span{color:var(--muted);font-family:var(--font-mono);letter-spacing:.2em;font-size:.55rem}.result-grid strong{color:#fff3e8;font-family:var(--font-display);font-size:2rem;line-height:1}.corner{opacity:.45;pointer-events:none;width:3rem;height:3rem;position:absolute}.corner-tl{border-left:1px solid var(--cyan);border-top:1px solid var(--cyan);top:1.4rem;left:1.4rem}.corner-tr{border-right:1px solid var(--cyan);border-top:1px solid var(--cyan);top:1.4rem;right:1.4rem}.corner-bl{border-left:1px solid var(--cyan);border-bottom:1px solid var(--cyan);bottom:1.4rem;left:1.4rem}.corner-br{border-right:1px solid var(--cyan);border-bottom:1px solid var(--cyan);bottom:1.4rem;right:1.4rem}.boot-error{z-index:50;color:#ffd8df;max-width:min(46rem,92vw);font-family:var(--font-mono);background:#1c040aeb;border:1px solid #f359;padding:.8rem 1rem;font-size:.72rem;line-height:1.5;position:fixed;top:1rem;left:50%;transform:translate(-50%);box-shadow:0 0 30px #ff33552e}@media (width<=760px){.controls{grid-template-columns:repeat(2,minmax(0,1fr))}.hud-health{width:min(16rem,46vw)}.hud-ammo{width:min(10rem,34vw)}.brand-copy small,.hud-sub span:last-child{display:none}.hud-center,.hud-score{min-width:4.4rem;padding:.45rem .6rem}}@media (width<=480px){.hud{padding:.8rem}.hud-health{width:46vw;padding:.55rem .6rem;bottom:.8rem;left:.8rem}.hud-ammo{width:34vw;padding:.55rem .6rem;bottom:.8rem;right:.8rem}.ammo-count strong{font-size:2rem}.brand-copy b{letter-spacing:.12em;font-size:.72rem}.brand-mark{width:1.8rem;height:1.8rem}.brand-mark:after{inset:.55rem}h1{font-size:clamp(3.4rem,18vw,5rem)}.controls{gap:.35rem;padding:.5rem}.control{padding:.35rem;font-size:.58rem}kbd{min-width:1.1rem;height:1.1rem;font-size:.52rem}.primary-button{min-width:min(17rem,88vw);padding:.9rem 1rem;font-size:.72rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.mode-link{width:fit-content;color:var(--muted);font-family:var(--font-mono);letter-spacing:.16em;border-bottom:1px solid #81dcff40;margin:1.2rem auto 0;padding-bottom:.2rem;font-size:.7rem;text-decoration:none;transition:color .2s,border-color .2s;display:block}.mode-link:hover{color:var(--cyan-strong);border-color:var(--cyan)}.mode-link.inline{font-size:inherit;letter-spacing:inherit;border-bottom:1px solid #81dcff40;margin:0;padding-bottom:0;display:inline}