:root{--fs-1:13px;--fs-2:15px;--sp-1:8px;--sp-2:16px;--sp-3:32px;--ink:#f4f1ea;--ink-dim:#f4f1eaa6;--panel:#080c168c;--accent:#ffb347;color:var(--ink);font-family:system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body{background:#04060c;height:100%;margin:0;overflow:hidden}body{-webkit-user-select:none;user-select:none;touch-action:none}canvas{display:block}#loading,#crash{padding:var(--sp-3);font-size:var(--fs-2);color:var(--ink-dim);text-align:center;z-index:10;background:#04060c;place-items:center;margin:0;display:grid;position:fixed;inset:0}#fps{left:var(--sp-2);top:var(--sp-2);font:var(--fs-1) ui-monospace, monospace;color:var(--ink-dim);margin:0;position:fixed}#labels{pointer-events:none;position:fixed;inset:0}.label{margin:calc(-1 * var(--sp-3)) 0 0 0;font-size:var(--fs-1);white-space:nowrap;text-shadow:0 1px 3px #000;position:absolute;top:0;left:0;translate:-50%}#hud{left:var(--sp-2);top:calc(var(--sp-2) + env(safe-area-inset-top));align-items:center;gap:var(--sp-1);pointer-events:none;display:flex;position:fixed}.who{padding:var(--sp-1) var(--sp-2);background:var(--panel);border-radius:var(--sp-1);font-size:var(--fs-2);flex-direction:column;display:flex}#count{font-size:var(--fs-1);color:var(--ink-dim)}#invite{pointer-events:auto;min-height:48px;padding:0 var(--sp-2);border-radius:var(--sp-1);background:var(--panel);color:var(--ink);font:inherit;font-size:var(--fs-2);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;border:0}#top{top:calc(var(--sp-2) + env(safe-area-inset-top));align-items:center;gap:var(--sp-1);pointer-events:none;flex-direction:column;display:flex;position:fixed;left:50%;translate:-50%}#job{padding:var(--sp-1) var(--sp-2);background:var(--panel);border-radius:var(--sp-1);border-top:2px solid var(--accent);flex-direction:column;align-items:center;display:flex}#job[hidden]{display:none}#job-country{font-size:var(--fs-1);color:var(--ink-dim);text-transform:uppercase;letter-spacing:.08em}#job-city{font-size:var(--fs-2)}#job-meta{font-size:var(--fs-1);color:var(--ink-dim)}#wind{left:calc(50% - 66px - var(--sp-2) - 72px);bottom:calc(var(--sp-2) + 30px + env(safe-area-inset-bottom));pointer-events:none;justify-items:center;gap:4px;width:72px;display:grid;position:fixed}#wind svg{width:56px;height:56px;overflow:visible}#wind .face{fill:var(--panel)}#wind-arrow{fill:none;stroke:#7fd3ff;stroke-linecap:round;stroke-linejoin:round}#wind-text{font-size:var(--fs-1);color:var(--ink-dim);text-align:center;line-height:1.2}#briefing{z-index:1;padding:var(--sp-2);pointer-events:none;place-items:center;display:grid;position:fixed;inset:0}#briefing[hidden]{display:none}#briefing-card{gap:var(--sp-1);width:min(640px,100%);padding:var(--sp-2);background:var(--panel);border-radius:var(--sp-1);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:grid}#briefing-card h2{font-size:var(--fs-2);justify-content:space-between;margin:0;display:flex}#briefing-card h2 strong{color:var(--accent);font-variant-numeric:tabular-nums}#briefing-map{aspect-ratio:16/9;border-radius:4px;width:100%}#briefing-legend{gap:var(--sp-2);font-size:var(--fs-1);color:var(--ink-dim);margin:0;display:flex}#briefing-legend span:before{content:"";background:var(--ink);border-radius:50%;width:8px;height:8px;margin-right:6px;display:inline-block}#briefing-legend :is(.me,.rival):before{clip-path:polygon(0 0,100% 50%,0 100%,30% 50%);border-radius:0;width:11px;height:10px}#briefing-legend .rival:before{background:var(--ink-dim)}#briefing-legend .parcel:before{background:#6ff2d0;border-radius:1px}body.lobby :is(#hud,#top,#board,#compass,#wind,#throttle,#gauges,#minimap,#touch,#labels,#settings-panel){display:none}#lobby{padding:var(--sp-3);pointer-events:none;align-items:center;display:flex;position:fixed;inset:0}#lobby[hidden]{display:none}#lobby-card{gap:var(--sp-2);width:min(430px,100%);max-height:100%;padding:var(--sp-3);background:var(--panel);border-radius:var(--sp-1);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:auto;display:grid;overflow-y:auto}#lobby-card h1{letter-spacing:-.01em;margin:0;font-size:34px}#lobby-card>p{font-size:var(--fs-2);color:var(--ink-dim);margin:0}#lobby-card .field{font-size:var(--fs-1);color:var(--ink-dim);gap:4px;display:grid}#lobby-card .field input{min-height:48px;padding:0 var(--sp-2);border-radius:var(--sp-1);color:var(--ink);font:inherit;font-size:var(--fs-2);background:#00000040;border:1px solid #f4f1ea33}#lobby-colour{border:0;margin:0;padding:0}#lobby-colour legend{font-size:var(--fs-1);color:var(--ink-dim);margin-bottom:4px;padding:0}#lobby-colours{flex-wrap:wrap;display:flex}.swatch{cursor:pointer;touch-action:manipulation;background:0 0;border:0;place-items:center;width:40px;height:40px;padding:0;display:grid}.swatch:before{content:"";background:var(--c);border-radius:50%;width:28px;height:28px}.swatch[aria-pressed=true]:before{box-shadow:0 0 0 2px var(--panel), 0 0 0 4px var(--ink)}#lobby-planes{gap:var(--sp-1);border:0;margin:0;padding:0;display:grid}#lobby-planes legend{font-size:var(--fs-1);color:var(--ink-dim);margin-bottom:4px;padding:0}.plane-option{padding:var(--sp-1) var(--sp-2);border-radius:var(--sp-1);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;border:1px solid #f4f1ea26;gap:4px;display:grid}.plane-option:has(input:checked){border-color:var(--accent);background:#ffb3471a}.plane-option input{opacity:0;pointer-events:none;position:absolute}.plane-option strong{font-size:var(--fs-2)}.plane-option .note{font-size:var(--fs-1);color:var(--ink-dim)}.plane-option .bars{gap:4px var(--sp-2);font-size:var(--fs-1);color:var(--ink-dim);flex-wrap:wrap;display:flex}.plane-option .bar{align-items:center;gap:6px;display:flex}.plane-option .bar i{gap:2px;display:inline-flex}.plane-option .bar b{background:#f4f1ea33;border-radius:1px;width:6px;height:6px}.plane-option .bar b.on{background:var(--ink)}#play{border-radius:var(--sp-1);background:var(--accent);color:#1b1408;min-height:56px;font:inherit;font-size:var(--fs-2);cursor:pointer;touch-action:manipulation;border:0;font-weight:700;position:sticky;bottom:0}@media (height<=820px){#lobby{padding:var(--sp-2)}#lobby-card{gap:var(--sp-1);padding:var(--sp-2) var(--sp-3)}#lobby-planes{gap:4px}}@media (width<=700px){#lobby{padding:var(--sp-2);padding-bottom:calc(var(--sp-2) + env(safe-area-inset-bottom));align-items:flex-end}#lobby-card>p{display:none}#lobby-card{width:100%;padding:var(--sp-2);gap:var(--sp-1)}#lobby-card h1{font-size:26px}}#splat{pointer-events:none;position:fixed;inset:0;overflow:hidden}#splat i{opacity:0;animation:2.6s ease-out forwards splat;position:absolute;translate:-50% -50%}@keyframes splat{0%{opacity:.95;scale:.4}8%{opacity:.95;scale:1}45%{opacity:.85;translate:-50% -50%;scale:1}to{opacity:0;translate:-50% -20%;scale:1.05}}#gauges{left:50%;bottom:calc(var(--sp-2) + 132px + var(--sp-1) + env(safe-area-inset-bottom));pointer-events:none;justify-items:center;gap:6px;display:grid;position:fixed;translate:-50%}#ammo,#cargo,#armor{align-items:end;gap:6px;display:flex}#armor:empty{display:none}#armor i{clip-path:polygon(50% 0,100% 18%,92% 62%,50% 100%,8% 62%,0 18%);background:var(--ink);width:14px;height:16px}#armor i.shield{background:#6fe3ff}#armor i.dented{background:#f4f1ea40}.label.shielded:before{content:"";clip-path:polygon(50% 0,100% 18%,92% 62%,50% 100%,8% 62%,0 18%);background:#6fe3ff;width:9px;height:10px;margin-right:4px;display:inline-block}#throttle{left:calc(50% + 66px + var(--sp-2));bottom:calc(var(--sp-2) + 30px + env(safe-area-inset-bottom));pointer-events:none;justify-items:center;gap:4px;width:72px;display:grid;position:fixed}#throttle .lever{border:1.5px solid var(--ink-dim);background:var(--panel);border-radius:4px;width:16px;height:56px;position:relative;overflow:hidden}#throttle .fill{height:var(--set,0%);background:var(--accent);position:absolute;inset:auto 0 0}#throttle .limit{height:var(--cut,0%);background:repeating-linear-gradient(45deg,#f4f1ea40 0 3px,#0000 3px 6px);position:absolute;inset:0 0 auto}#throttle.boosting .fill{background:#7fd3ff;height:100%}#throttle-text{font-size:var(--fs-1);color:var(--ink-dim);font-variant-numeric:tabular-nums}#cargo i{border:1.5px solid var(--ink-dim);border-radius:2px;width:14px;height:14px;position:relative}#cargo i:after{content:"";height:var(--fill,0%);background:#c8955a;position:absolute;inset:auto 0 0}#cargo i.golden:after{background:#ffd34d}#cargo i.full{border-color:var(--ink)}#ammo i{border:1.5px solid var(--ink-dim);border-radius:50%;width:8px;height:8px}#ammo i.full{background:var(--ink);border-color:var(--ink)}#compass{left:50%;bottom:calc(var(--sp-2) + env(safe-area-inset-bottom));pointer-events:none;width:132px;height:132px;position:fixed;translate:-50%}#compass svg{width:100%;height:100%;overflow:visible}#compass .face{fill:var(--panel)}#compass line{stroke:var(--ink-dim);stroke-width:1px}#compass line.major{stroke:var(--ink);stroke-width:2px}#compass text{fill:var(--ink);text-anchor:middle;dominant-baseline:central;font-size:11px;font-weight:600}#compass text.north,#compass-target{fill:var(--accent)}#compass .lubber{fill:var(--ink)}#compass-speed{fill:none;stroke:var(--accent);stroke-width:3px;stroke-linecap:round;opacity:.8}#compass-boost{fill:none;stroke:#7fd3ff;stroke-width:3px;stroke-linecap:round;opacity:.6}#compass-boost.active{opacity:1}#compass-boost.charging{animation:1.2s ease-in-out infinite charging}@keyframes charging{50%{opacity:1;stroke-width:4.5px}}#heading{font-size:var(--fs-1);font-variant-numeric:tabular-nums;color:var(--ink-dim);flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}#speed{color:var(--ink);font-weight:600}#speed.ahead{color:var(--accent)}#compass-speed.drafting{stroke:#fff;opacity:1}#compass-sun{stroke:#ffd36b;stroke-width:2.5px;stroke-linecap:round}#settings{pointer-events:auto;border-radius:var(--sp-1);background:var(--panel);width:48px;min-height:48px;color:var(--ink);cursor:pointer;touch-action:manipulation;border:0;place-items:center;padding:0;display:grid}#settings svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;width:20px;height:20px}#settings-panel{left:var(--sp-2);top:calc(var(--sp-2) + 48px + var(--sp-1) + env(safe-area-inset-top));padding:var(--sp-1) var(--sp-2);background:var(--panel);border-radius:var(--sp-1);font-size:var(--fs-2);position:fixed}#settings-panel[hidden]{display:none}@media (width<=1100px) and (pointer:fine){#hud{grid-template-columns:auto auto;justify-content:start;display:grid}.who{grid-column:1/-1}#settings-panel{top:calc(var(--sp-2) + 48px + var(--sp-1) + 48px + var(--sp-1) + env(safe-area-inset-top))}}#settings-panel label{align-items:center;gap:var(--sp-1);cursor:pointer;min-height:48px;display:flex}#settings-panel label.range{justify-content:space-between;gap:var(--sp-2)}#settings-panel label.range input{width:140px;accent-color:var(--accent)}#minimap{right:var(--sp-2);bottom:calc(var(--sp-2) + env(safe-area-inset-bottom));pointer-events:none;border-radius:50%;width:168px;height:168px;position:fixed}#hint,#toast{padding:var(--sp-1) var(--sp-2);background:var(--panel);border-radius:var(--sp-1);font-size:var(--fs-1);color:var(--ink-dim);margin:0;transition:opacity .6s}#hint.hidden{opacity:0}#version{left:var(--sp-1);bottom:calc(4px + env(safe-area-inset-bottom));font-size:var(--fs-1);color:var(--ink-dim);opacity:.6;pointer-events:none;margin:0;position:fixed}#toast{opacity:0}#toast.shown{opacity:1}#toast.mine{color:var(--accent);font-weight:600}#board{top:calc(var(--sp-2) + env(safe-area-inset-top));right:var(--sp-2);min-width:160px;padding:var(--sp-1) var(--sp-2);background:var(--panel);border-radius:var(--sp-1);font-size:var(--fs-1);pointer-events:none;position:fixed}#round{color:var(--ink-dim);font-variant-numeric:tabular-nums;margin:0}#round:empty{display:none}#board:has(#round:empty):has(#scores:empty){display:none}#round.rush{color:var(--accent);font-weight:600}#scores{margin:0;padding:0;list-style:none}#round:not(:empty)+#scores:not(:empty){margin-top:var(--sp-1)}#scores li{justify-content:space-between;gap:var(--sp-2);color:var(--ink-dim);display:flex}#scores li.me{color:var(--ink)}#scores li.leader strong,.label.leader{color:#ffd34d}#results{min-width:240px;padding:var(--sp-2) var(--sp-3);background:var(--panel);border-radius:var(--sp-1);pointer-events:none;border-top:2px solid #ffd34d;position:fixed;top:50%;left:50%;translate:-50% -50%}#results[hidden]{display:none}#results h2{margin:0 0 var(--sp-1);font-size:var(--fs-2)}#results ol{font-size:var(--fs-1);margin:0;padding:0;list-style:none}#results li{justify-content:space-between;gap:var(--sp-2);color:var(--ink-dim);display:flex}#results li:first-child{color:#ffd34d;font-weight:600}#results li.me{color:var(--ink)}#name{color:var(--ink);font:inherit;text-align:left;cursor:text;pointer-events:auto;background:0 0;border:0;padding:0;font-weight:600}#name-input{border:0;border-bottom:1px solid var(--accent);width:16ch;color:var(--ink);font:inherit;pointer-events:auto;background:0 0;outline:none;padding:0;font-weight:600}#touch{display:none}@media (pointer:coarse){#touch{left:var(--sp-2);right:var(--sp-2);bottom:calc(var(--sp-2) + env(safe-area-inset-bottom));justify-content:space-between;display:flex;position:fixed}.pad{gap:var(--sp-1);display:flex}.pad.stacked{flex-direction:column;align-items:flex-end}.pad.stacked.left{align-items:flex-start}.pad button.small{width:56px;height:48px}.pad button.boost{border-radius:50%;width:56px;height:56px}.pad button.boost.held{background:#7fd3ff66}.pad button.boost.drop{width:72px;height:72px}.pad button{border-radius:var(--sp-2);background:var(--panel);width:72px;height:72px;color:var(--ink);touch-action:manipulation;-webkit-tap-highlight-color:transparent;border:0;place-items:center;padding:0;display:grid}.pad button.held{background:#ffb34759}.pad svg{fill:none;stroke:currentColor;stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round;width:32px;height:32px}#hud{right:var(--sp-2);justify-content:space-between}#top{top:calc(var(--sp-2) + 48px + var(--sp-2) + env(safe-area-inset-top));width:calc(100% - 2 * var(--sp-2))}#minimap{display:none}#compass{width:96px;height:96px;bottom:calc(var(--sp-2) + 72px + var(--sp-2) + env(safe-area-inset-bottom))}#wind{left:var(--sp-2);bottom:calc(var(--sp-2) + 48px + var(--sp-1) + 72px + var(--sp-2) + env(safe-area-inset-bottom))}#throttle{left:auto;right:var(--sp-2);bottom:calc(var(--sp-2) + 56px + var(--sp-1) + 72px + var(--sp-2) + env(safe-area-inset-bottom))}#gauges{bottom:calc(var(--sp-2) + 72px + var(--sp-2) + 96px + var(--sp-1) + env(safe-area-inset-bottom))}#job{max-width:100%}#hint,#version{display:none}#board{min-width:0;top:50%;translate:0 -50%}#scores li:nth-child(n+4){display:none}}