html,body{margin:0;height:100%;background:#0e1116;overflow:hidden}#app{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%}canvas{image-rendering:pixelated;outline:none}#stage{position:absolute;--ui-scale: 1;pointer-events:none;--font-display: "Barlow Condensed", "Arial Narrow", sans-serif;--font-text: Figtree, system-ui, sans-serif;--ink: #e8eaee;--muted: #98a2b1;--panel: rgba(13, 16, 21, .86);--line: rgba(255, 255, 255, .1);--raise: rgba(255, 255, 255, .06);--accent: #e5a63d;--accent-ink: #1b1305;--focus: #ffd98a;font-family:var(--font-text);color:var(--ink);overflow:hidden}.hud{position:absolute;inset:0 0 auto;display:flex;align-items:flex-start;gap:calc(var(--ui-scale) * 4px);padding:calc(var(--ui-scale) * 4px);box-sizing:border-box}.hud-cards{display:flex;gap:calc(var(--ui-scale) * 4px)}.hud-card{box-sizing:border-box;width:calc(var(--ui-scale) * 116px);padding:calc(var(--ui-scale) * 3px) calc(var(--ui-scale) * 5px) calc(var(--ui-scale) * 4px);border-top:calc(var(--ui-scale) * 2px) solid var(--player, #fff);background:var(--panel);border-radius:calc(var(--ui-scale) * 3px);font-size:calc(var(--ui-scale) * 8px);line-height:1.25;white-space:nowrap;font-variant-numeric:tabular-nums}.hud-top{display:flex;align-items:baseline;justify-content:space-between;gap:calc(var(--ui-scale) * 4px)}.hud-name{overflow:hidden;text-overflow:ellipsis;font-family:var(--font-display);font-weight:700;font-size:calc(var(--ui-scale) * 11px);letter-spacing:.03em}.hud-money{color:var(--accent);font-weight:700}.hud-hp{position:relative;height:calc(var(--ui-scale) * 9px);margin:calc(var(--ui-scale) * 2px) 0 calc(var(--ui-scale) * 3px);border-radius:calc(var(--ui-scale) * 2px);background:#ffffff1a;overflow:hidden}.hud-hp-fill{position:absolute;inset:0 auto 0 0}.hud-hp-num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:700;text-shadow:0 0 calc(var(--ui-scale) * 2px) rgba(0,0,0,.9)}.hud-weapon{display:flex;align-items:center;gap:calc(var(--ui-scale) * 3px);color:var(--muted)}.hud-icon{flex:none;width:calc(var(--ui-scale) * 12px);height:calc(var(--ui-scale) * 12px)}.hud-ammo{overflow:hidden;text-overflow:ellipsis}.hud-round,.hud-wind{text-shadow:0 0 calc(var(--ui-scale) * 3px) rgba(10,12,16,.95);font-family:var(--font-display);font-size:calc(var(--ui-scale) * 12px);letter-spacing:.05em;white-space:nowrap}.hud-round{flex:1;text-align:center}.hud-wind{display:flex;align-items:center;gap:calc(var(--ui-scale) * 3px)}.hud-wind-label{text-shadow:0 0 calc(var(--ui-scale) * 2px) rgba(10,12,16,.9)}.wind-track{position:relative;width:calc(var(--ui-scale) * 36px);height:calc(var(--ui-scale) * 8px);box-sizing:border-box;border:calc(var(--ui-scale) * 1px) solid rgba(255,255,255,.28);border-radius:calc(var(--ui-scale) * 2px);overflow:hidden;background:#0d1015bf;box-shadow:0 calc(var(--ui-scale) * 1px) calc(var(--ui-scale) * 2px) #0a0c1080}.wind-fill{position:absolute;top:0;bottom:0;overflow:hidden}.wind-fill-inner{position:absolute;top:0;bottom:0}.wind-mark{position:absolute;top:0;bottom:0;left:50%;width:calc(var(--ui-scale) * 1px);margin-left:calc(var(--ui-scale) * -.5px);background:#ffffffb3}#overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:#05070a80;pointer-events:auto}#overlay.open{display:flex}.overlay-panel{box-sizing:border-box;width:min(calc(var(--ui-scale) * 480px),92%);max-height:92%;overflow:auto;padding:calc(var(--ui-scale) * 16px);background:var(--panel);border:1px solid var(--line);border-radius:calc(var(--ui-scale) * 10px);box-shadow:0 calc(var(--ui-scale) * 12px) calc(var(--ui-scale) * 40px) #0000008c;-webkit-backdrop-filter:blur(calc(var(--ui-scale) * 8px));backdrop-filter:blur(calc(var(--ui-scale) * 8px));font-size:calc(var(--ui-scale) * 10px);line-height:1.45}.overlay-panel:has(.shop-list){width:min(calc(var(--ui-scale) * 600px),94%)}.overlay-actions{display:flex;justify-content:flex-end;gap:calc(var(--ui-scale) * 8px);margin-top:calc(var(--ui-scale) * 12px)}.overlay-actions button{padding:calc(var(--ui-scale) * 5px) calc(var(--ui-scale) * 12px);border:1px solid var(--line);border-radius:calc(var(--ui-scale) * 5px);background:var(--raise);color:inherit;font:inherit;font-weight:500;cursor:pointer}.overlay-actions button:hover:not(:disabled),.seg button:hover:not(:disabled),.step button:hover:not(:disabled){background:#ffffff21}.overlay-actions button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:700}.overlay-actions button.primary:hover:not(:disabled){background:#f0b751}.overlay-actions button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.ov-title{margin:0;font-family:var(--font-display);font-size:calc(var(--ui-scale) * 34px);font-weight:700;letter-spacing:.04em;text-align:center}.ov-sub{margin:0 0 calc(var(--ui-scale) * 6px);text-align:center;color:var(--muted)}.ov-h{margin:0 0 calc(var(--ui-scale) * 8px);font-family:var(--font-display);font-size:calc(var(--ui-scale) * 20px);font-weight:700;letter-spacing:.03em}.ov-hint{color:var(--accent);text-align:right;margin:calc(var(--ui-scale) * 4px) 0 0}.ov-note{color:var(--muted);margin:calc(var(--ui-scale) * 4px) 0 calc(var(--ui-scale) * 8px)}.ov-row{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--ui-scale) * 8px);padding:calc(var(--ui-scale) * 3px) 0}.seg{display:inline-flex}.seg button,.step button{padding:calc(var(--ui-scale) * 2px) calc(var(--ui-scale) * 7px);border:1px solid var(--line);background:var(--raise);color:inherit;font:inherit;cursor:pointer}.seg button+button{margin-left:-1px}.seg button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:700}.seg button:first-child,.step button:first-child{border-radius:calc(var(--ui-scale) * 5px) 0 0 calc(var(--ui-scale) * 5px)}.seg button:last-child,.step button:last-child{border-radius:0 calc(var(--ui-scale) * 5px) calc(var(--ui-scale) * 5px) 0}.step{display:inline-flex;align-items:center}.step output{min-width:calc(var(--ui-scale) * 22px);text-align:center;font-variant-numeric:tabular-nums}.seg button:disabled,.step button:disabled,.overlay-actions button:disabled{opacity:.35;cursor:default}.seg button:focus-visible,.step button:focus-visible{outline:2px solid var(--focus);outline-offset:1px}.ov-table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}.ov-table th,.ov-table td{padding:calc(var(--ui-scale) * 2px) calc(var(--ui-scale) * 4px);text-align:right}.ov-table th:first-child,.ov-table td:first-child{text-align:left}.ov-table thead th{color:var(--muted);font-weight:500;border-bottom:1px solid var(--line)}.ov-stats{margin-top:calc(var(--ui-scale) * 10px);font-size:calc(var(--ui-scale) * 8px)}.ov-stats th,.ov-stats td{padding:calc(var(--ui-scale) * 1px) calc(var(--ui-scale) * 3px)}.ov-ammo{width:calc(var(--ui-scale) * 12px);height:calc(var(--ui-scale) * 12px);vertical-align:middle}.ov-highlights{margin:calc(var(--ui-scale) * 6px) 0 0;padding:0;list-style:none;color:var(--accent)}.ov-dot{display:inline-block;width:calc(var(--ui-scale) * 6px);height:calc(var(--ui-scale) * 6px);margin-right:calc(var(--ui-scale) * 4px);border-radius:50%;background:var(--player, #fff)}.ov-total{display:flex;justify-content:space-between;margin-top:calc(var(--ui-scale) * 6px);padding-top:calc(var(--ui-scale) * 4px);border-top:1px solid var(--line)}.ov-medal{display:inline-block;min-width:calc(var(--ui-scale) * 16px)}.hud-card.off{display:none}.hud-card.me{box-shadow:0 0 0 1px #ffd98ab3}.net-status{position:absolute;top:calc(var(--ui-scale) * 36px);left:50%;transform:translate(-50%);z-index:5;display:none;max-width:90%;padding:calc(var(--ui-scale) * 3px) calc(var(--ui-scale) * 10px);border:1px solid #5c4a2a;border-radius:calc(var(--ui-scale) * 6px);background:#281e0eeb;color:#f0c27a;font-size:calc(var(--ui-scale) * 9px);text-align:center;pointer-events:none}.net-status.on{display:block}.net-rtt{position:absolute;right:calc(var(--ui-scale) * 6px);bottom:calc(var(--ui-scale) * 4px);z-index:5;display:none;color:var(--muted);font-size:calc(var(--ui-scale) * 8px);font-variant-numeric:tabular-nums;pointer-events:none}.net-rtt.on{display:block}.lobby-slot{display:flex;align-items:center;gap:calc(var(--ui-scale) * 6px);padding:calc(var(--ui-scale) * 3px) 0;border-bottom:1px solid var(--line)}.lobby-slot .name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lobby-slot .name.dim{color:var(--muted)}.lobby-badge{padding:0 calc(var(--ui-scale) * 5px);border:1px solid var(--line);border-radius:calc(var(--ui-scale) * 8px);color:var(--muted);font-size:calc(var(--ui-scale) * 8px);white-space:nowrap}.lobby-badge.warn{border-color:#5c4a2a;color:#f0c27a}.lobby-h{margin:calc(var(--ui-scale) * 8px) 0 calc(var(--ui-scale) * 2px);color:var(--muted);font-size:calc(var(--ui-scale) * 8px);font-weight:700}.lobby-link,.ov-input{box-sizing:border-box;width:100%;padding:calc(var(--ui-scale) * 4px) calc(var(--ui-scale) * 6px);border:1px solid var(--line);border-radius:calc(var(--ui-scale) * 5px);background:#0b0e13;color:inherit;font:inherit}.lobby-link{color:var(--muted)}.ov-input:focus-visible,.lobby-link:focus-visible{outline:2px solid var(--focus);outline-offset:1px}.ov-label{display:block;margin-bottom:calc(var(--ui-scale) * 3px);color:var(--muted)}.ov-error{color:#f08a7a}.fs-btn{position:absolute;left:calc(var(--ui-scale) * 4px);bottom:calc(var(--ui-scale) * 4px);z-index:6;width:calc(var(--ui-scale) * 16px);height:calc(var(--ui-scale) * 16px);padding:0;border:1px solid var(--line);border-radius:calc(var(--ui-scale) * 4px);background:var(--panel);color:var(--muted);font-size:calc(var(--ui-scale) * 10px);line-height:1;cursor:pointer;pointer-events:auto}#overlay.open~.fs-btn{display:none}.fs-btn:hover,.fs-btn:focus-visible{color:#e6e9ee;outline:none;border-color:var(--focus)}#backdrop{position:absolute;inset:0;overflow:hidden;pointer-events:none}.shop-list{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--ui-scale) * 4px) calc(var(--ui-scale) * 6px)}.shop-row{display:grid;grid-template-columns:calc(var(--ui-scale) * 17px) minmax(0,1fr) auto;grid-template-areas:"icon name step" "icon meta step";align-items:center;column-gap:calc(var(--ui-scale) * 6px);padding:calc(var(--ui-scale) * 3px) calc(var(--ui-scale) * 6px);border:1px solid transparent;border-radius:calc(var(--ui-scale) * 6px);background:var(--raise);font-variant-numeric:tabular-nums}.shop-row.picked{border-color:var(--accent)}.shop-icon{grid-area:icon;width:calc(var(--ui-scale) * 17px);height:calc(var(--ui-scale) * 17px)}.shop-name{grid-area:name;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.shop-price,.shop-stock{font-size:calc(var(--ui-scale) * 8px)}.shop-price{grid-area:meta;justify-self:start;color:var(--accent)}.shop-stock{grid-area:meta;justify-self:end;margin-right:calc(var(--ui-scale) * 4px);color:var(--muted)}.shop-stock:before{content:"×";margin-right:.15em}.shop-row .step{grid-area:step}.shop-sum{display:flex;justify-content:space-between;margin-top:calc(var(--ui-scale) * 8px);padding-top:calc(var(--ui-scale) * 6px);border-top:1px solid var(--line)}.shop-sum div{display:flex;flex-direction:column}.shop-sum div+div{align-items:flex-end}.shop-sum small{color:var(--muted)}.shop-sum b{font-family:var(--font-display);font-size:calc(var(--ui-scale) * 18px);letter-spacing:.02em}
