@font-face{font-family:Orbit Pixel;src:url("assets/orbit-pixel.woff") format("woff");font-display:swap}
:root{color-scheme:dark;font:16px/1.48 "Orbit Pixel",sans-serif;color:#f1dec0;background:#201823;--ink:#211923;--paper:#f1dec0;--muted:#bd9f8a;--mint:#86e0cb;--rust:#e97e66}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;overflow:hidden}main{position:relative;height:100dvh;height:100vh;overflow:hidden}canvas{display:block;width:100%;height:100%;image-rendering:auto}
#menu{position:absolute;inset:0;display:flex;align-items:center;overflow:auto;padding:clamp(16px,6vw,100px)}
.panel{width:min(448px,100%);margin:auto 0;padding:clamp(16px,2.5vw,34px);background:#281e29;border:2px solid #96745e;box-shadow:8px 8px #120e18}
h1{font-weight:400;font-size:clamp(25px,4.2vw,54px);line-height:1.01;margin:10px 0 15px}
p{margin:0 0 13px}.overline{color:#d6a685}.panel details{margin-top:15px;color:var(--muted)}summary{cursor:pointer;color:var(--paper);width:max-content}.panel details p{margin:8px 0 0}
button,input,select{font:inherit;color:var(--paper);background:#45313b;border:2px solid #96745e;padding:5px 9px;margin:3px 0;min-width:0}button,select{cursor:pointer}button.primary{background:var(--paper);border-color:var(--paper);color:var(--ink)}button:hover,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--mint);outline-offset:2px}#pilotName{display:block;width:100%;max-width:225px}#joinForm{display:flex;gap:7px;margin-top:5px}#joinCode{width:112px;text-transform:uppercase}#notice{color:#f0a284;margin-top:8px}#notice:empty{display:none}.party-code{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.party-code strong{color:var(--mint);font-weight:400;font-size:24px}#roster{padding-left:20px;margin:6px 0;color:var(--muted)}#partyStatus{margin:6px 0}#hostActions select{max-width:100%}
#hud{position:absolute;inset:0;pointer-events:none;text-shadow:2px 2px #1b141e}.match-score{position:absolute;top:17px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;background:#291f2c;border:2px solid #755c53;padding:4px 11px}.match-score b{font-weight:400}.match-score span:first-child{color:var(--mint)}.match-score span:last-child{color:var(--rust)}#location{position:absolute;top:57px;left:50%;transform:translateX(-50%);white-space:nowrap;color:var(--muted)}#crosshair,#respawn{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}#crosshair{font-size:25px}#crosshair.hit{color:var(--mint)}#respawn{margin-top:36px;white-space:nowrap}.vitals,.weapon{position:absolute;bottom:19px;display:grid;line-height:1.03;gap:5px}.vitals{left:20px}.weapon{right:20px;text-align:right}.vitals strong,.weapon strong{font-size:38px;font-weight:400}.vitals span,.weapon span{color:var(--muted)}progress{border:2px solid #211923;background:#45313b;width:122px;height:12px;border-radius:0;appearance:none}progress::-webkit-progress-bar{background:#45313b}progress::-webkit-progress-value{background:var(--mint)}#damage{position:absolute;inset:0;border:8px solid #d75340;opacity:0}

@font-face{font-family:Wars Condensed;src:url("assets/wars-condensed.woff") format("woff");font-display:swap}
:root{font:17px/1.38 "Wars Condensed",sans-serif;--paper:#e2f0f2;--ink:#13212a;--muted:#9fbec8}
.panel{background:#13212aee;border:1px solid #719fac;border-left:4px solid #88d9e1;box-shadow:8px 8px #0b141bbd;clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.overline{color:#8ecdd6}h1{font-size:clamp(38px,5.6vw,72px);color:#effbfc;letter-spacing:.015em}
button,input,select{background:#1c303d;border:1px solid #6d9da8}
#hud{color:#d9edf2}.match-score{background:#172830d9;border:1px solid #6d9da8;box-shadow:0 0 12px #84c8d630}
.match-score small{position:absolute;left:0;top:100%;width:100%;text-align:center;color:#afc9d0}
#location{top:74px}.vitals{top:20px;bottom:auto;left:20px}
.vitals strong,.weapon strong{font-size:36px}.weapon svg{margin-left:auto;color:#a8d4dc}
#segments{display:flex;gap:3px}#segments i{width:10px;height:7px;background:#263e4b;border:1px solid #5d8593}#segments i.filled{background:#86dbe1}
#segments.low i.filled{background:#f17d61;animation:integrity .52s steps(2) infinite alternate}@keyframes integrity{to{opacity:.46}}
.tracker{position:absolute;left:20px;bottom:18px;display:grid;gap:4px;color:#a9c8ce}
#radar{width:116px;height:116px;border:1px solid #89bdc8;border-radius:50%}.tracker progress{width:116px;height:8px}
#killFeed{position:absolute;right:18px;top:16px;list-style:none;margin:0;padding:0;text-align:right;color:#a9d1db}
#crosshair{width:2px;height:2px;background:#e3fbff;font-size:0}
#crosshair::before,#crosshair::after{content:"";position:absolute;top:0;width:7px;height:1px;background:#e3fbff}
#crosshair::before{right:var(--spread,5px)}#crosshair::after{left:var(--spread,5px)}
#crosshair.hit{background:none;font-size:22px;width:auto;height:auto;color:#e6fbff}
#crosshair.hit::before,#crosshair.hit::after{display:none}
#hitDirection{position:absolute;top:50%;left:50%;width:94px;height:94px;border-top:3px solid #f78167;border-left:3px solid transparent;border-right:3px solid transparent;border-bottom:3px solid transparent;border-radius:50%}
#metrics{position:absolute;right:16px;bottom:16px;z-index:3;padding:4px 8px;background:#14222beb;border:1px solid #6a939e;color:#daf4f6;pointer-events:none}
#debugPanel{position:absolute;z-index:6;top:8px;right:8px;max-width:360px;padding:8px;background:#15212ae8;border:1px solid #719fac;font:12px/1.35 monospace;color:#e2f0f2}#debugPanel pre{white-space:pre-wrap;margin:0}
#settingsFields{display:grid;gap:4px;margin:8px 0}#settingsFields label{display:flex;align-items:center;gap:6px}#bindings{display:flex;gap:3px;flex-wrap:wrap}#bindings button{font-size:13px}#trainingHint{position:absolute;top:23%;left:50%;transform:translateX(-50%);text-align:center;background:#172830d9;padding:8px 15px}#loading{position:absolute;z-index:8;inset:0;display:grid;place-items:center;background:#13212a}.vitals,.tracker,.weapon{zoom:var(--hud-scale,1)}
#scope{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden}
.scope-ring{position:absolute;width:min(83vh,88vw);aspect-ratio:1;border-radius:50%;border:3px solid #6d9199;box-shadow:0 0 0 100vmax #071015e8,inset 0 0 22px #10232d}
.scope-ring::before,.scope-ring::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#a4c4b9bb}
.scope-ring::before{width:42%;height:1px}.scope-ring::after{height:42%;width:1px}
#scope i{width:4px;height:4px;background:#f1e9d6;z-index:1}
#scope.hit i{background:#f59a78;width:8px;height:8px;transform:rotate(45deg)}

.scope-ring,#scope i{position:absolute;left:var(--aim-x,50%);top:var(--aim-y,50%);translate:-50% -50%}
.scope-rifle{position:absolute;width:min(47vh,53vw);height:auto;left:var(--aim-x,50%);top:var(--aim-y,50%);transform:translateX(-50%);z-index:1;filter:drop-shadow(0 4px 4px #081014a0)}
.scope-rifle path{stroke:#111e24;stroke-width:2}
#scope i{z-index:2}
