/* In-flight HUD: DOM port of the game's Simplified HUD (crates/aura_flight_hud). hud.js builds every node and writes
   positions, sizes and colours; this file only holds the static look: the game font, the text halo, layer anchors and
   the art of the flight computer and the points unit (assets/ui/flight_v2, assets/ui/points_unit).

   Layers (game):
     .hud-centre   window-pixel layer at the screen centre (ladder, flight path marker, tangos, lock, missile box)
     .hud-fixed    centre layer scaled by layout_scale (tapes, readouts, warnings), transform written by hud.js
     .hud-lock     juice lock sight anchored on the aim pointer
     .hud-computer bottom-right flight computer (design 540 x 296, scaled by hud.js)
     .hud-points   top-left points unit (design 340 x 478, scaled by hud.js)
     .hud-fly      full-window layer of the points fly-in numbers */

/* Russo One: the game's UI font (assets/fonts/fonts.json "default"). */
@font-face { font-family: 'JCS HUD'; src: url('assets/fonts/RussoOne-Regular.ttf') format('truetype'); font-display: block; }

.hud { position: fixed; inset: 0; z-index: 5; pointer-events: none; overflow: hidden; contain: strict;
  font-family: 'JCS HUD', 'Russo One', sans-serif; font-weight: 400; color: #fff; }
.hud * { box-sizing: border-box; }
.hud .p { position: absolute; left: 0; top: 0; transform-origin: 50% 50%; will-change: transform; }
/* Text node: Bevy text starts at the top of its node; line height 1.2 em; hud_text halo 1.5 px, black 0.75. */
.hud .t { position: absolute; left: 0; top: 0; white-space: nowrap; line-height: 1.2; overflow: visible;
  text-shadow: 1.5px 1.5px 0 rgba(0, 0, 0, 0.75); }
.hud .t.l { text-align: left; } .hud .t.c { text-align: center; } .hud .t.r { text-align: right; }

.hud-centre, .hud-fixed, .hud-lock { position: absolute; left: 50%; top: 50%; width: 0; height: 0; }
.hud-fixed { transform-origin: 0 0; z-index: 11; }
.hud-centre { z-index: 12; }
.hud-lock { z-index: 28; }
.hud-throttle { position: absolute; left: 50%; top: 50%; width: 0; height: 0; transform-origin: 0 0; z-index: 11; }
.hud-ladder { position: absolute; left: 0; top: 0; width: 0; height: 0; transform-origin: 0 0; will-change: transform; }

/* Lock sight (juice.rs spawn_juice_layer): 300 px square, 2 px border. */
.hud-lock .frame { border: 2px solid transparent; }
.hud-lock .prompt { text-shadow: 3px 3px 0 rgba(0, 0, 0, 0.85); }
.hud-lock .chev { text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.8); }

/* Flight computer (computer/mod.rs): stretched frame art, 9-slice glass insets, v16 key caps. */
.hud-computer { position: absolute; left: 0; top: 0; width: 540px; height: 296px; transform-origin: 0 0; z-index: 32; }
.hud-computer .art { position: absolute; background-size: 100% 100%; background-repeat: no-repeat; }
.hud-computer .frame { background-image: url('assets/ui/flight_v2/computer_frame.png'); }
.hud-computer .inset { border-style: solid; border-color: transparent; border-image: url('assets/ui/flight_v2/screen_inset.png') 44 fill / var(--slice) stretch; }
.hud-computer .cap { background-image: url('assets/ui/flight_v2/key_cap_v16.png'); }
.hud-computer .cap.lit { background-image: url('assets/ui/flight_v2/key_cap_v16_lit.png'); }
.hud-computer .icon { -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
.hud-computer .icon.flare { -webkit-mask-image: url('assets/ui/flight_v2/icon_flare.png'); mask-image: url('assets/ui/flight_v2/icon_flare.png'); }
.hud-computer .icon.look { -webkit-mask-image: url('assets/ui/flight_v2/icon_look.png'); mask-image: url('assets/ui/flight_v2/icon_look.png'); }
.hud-computer .icon.mode { -webkit-mask-image: url('assets/ui/flight_v2/icon_mode.png'); mask-image: url('assets/ui/flight_v2/icon_mode.png'); }
.hud-computer .icon.info { -webkit-mask-image: url('assets/ui/flight_v2/icon_info.png'); mask-image: url('assets/ui/flight_v2/icon_info.png'); }
.hud-computer .pill { border-style: solid; }
.hud-computer .track { overflow: hidden; }
.hud-computer .fill { position: absolute; left: 0; top: 0; height: 100%; transform-origin: 0 50%; }
.hud-computer canvas.radar { position: absolute; }

/* Points unit (points_unit/mod.rs): housing, 9-slice screen and key caps, bezel. */
.hud-points { position: absolute; left: 0; top: 0; width: 340px; height: 478px; transform-origin: 0 0; z-index: 24; }
.hud-points .art { position: absolute; background-size: 100% 100%; background-repeat: no-repeat; }
.hud-points .housing { background-image: url('assets/ui/points_unit/housing.png'); }
.hud-points .bezel { background-image: url('assets/ui/points_unit/bezel.png'); }
.hud-points .screen { border-style: solid; border-color: transparent; border-image: url('assets/ui/points_unit/screen.png') 44 fill / 44px stretch; border-width: 44px; }
.hud-points .cap { border-style: solid; border-color: transparent; border-width: 27px 23px 25px 23px; border-image: url('assets/ui/points_unit/key_cap.png') 27 23 25 23 fill / 27px 23px 25px 23px stretch; }
.hud-points .glass, .hud-points .ring { position: absolute; border-radius: 50%; }
.hud-points .seg { position: absolute; left: 0; top: 0; transform-origin: 50% 50%; }
.hud-fly { position: absolute; inset: 0; z-index: 40; }
.hud-fly .t { text-shadow: none; }
.hud-fly .land { position: absolute; left: 0; top: 0; border-radius: 50%; border-style: solid; }
.hud.hidden { display: none; }
