/* ============================================================================
   ORBITAL RADAR — LAUNCH HQ REVAMP  (preview stylesheet)
   Token-driven design system. The whole page is themed by [data-state] on
   #lh-app, so the live state machine drives the accent colour everywhere.
   This file is intentionally readable (preview). Production port keeps the
   tokens; proprietary logic stays server-side.
   ============================================================================ */

/* ── DESIGN TOKENS ───────────────────────────────────────────────────────── */
:root {
  /* Brand */
  --or-gold:        #ffe060;
  --or-orange:      #ff8c42;
  --or-orange-lo:   #ffb878;
  --or-go:          #39ff14;
  --or-go-soft:     #4cff8e;
  --or-info:        #60eafe;
  --or-hold:        #ff9d3c;   /* amber — recoverable pause */
  --or-scrub:       #ff5a52;   /* red   — stood down */
  --or-danger:      #ff3b30;
  --or-purple:      #be6cff;

  /* Surfaces */
  --or-bg-0:  #05070f;
  --or-bg-1:  #070a18;
  --or-bg-2:  #0a0e22;
  --or-surface:    rgba(13,18,40,.66);
  --or-surface-2:  rgba(20,27,56,.55);
  --or-surface-3:  rgba(255,255,255,.03);
  --or-line:        rgba(255,255,255,.08);
  --or-line-strong: rgba(255,255,255,.16);

  /* Text */
  --or-text:       #eaf0ff;
  --or-text-dim:   rgba(234,240,255,.64);
  --or-text-faint: rgba(234,240,255,.40);

  /* Type */
  --or-font-display: 'Orbitron', monospace;
  --or-font-mono: 'JetBrains Mono','Fira Mono','Consolas',monospace;

  /* Geometry */
  --or-r-sm: 10px; --or-r-md: 16px; --or-r-lg: 22px; --or-r-xl: 28px; --or-r-pill: 999px;
  --or-gap: 18px;
  --or-maxw: 1180px;
  --shadow-card: 0 22px 60px -26px rgba(0,0,0,.85);
  --ease: cubic-bezier(.4,0,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);

  /* Live status colour — overridden per state below */
  --status: var(--or-orange);
  --status-soft: rgba(255,140,66,.14);
}

/* The page's accent follows the launch state. One source of truth. */
#lh-app[data-state="scheduled"]{ --status: var(--or-info);   --status-soft: rgba(96,234,254,.14); }
#lh-app[data-state="go"]       { --status: var(--or-go);     --status-soft: rgba(57,255,20,.13); }
#lh-app[data-state="hold"]     { --status: var(--or-hold);   --status-soft: rgba(255,157,60,.16); }
#lh-app[data-state="awaiting"] { --status: var(--or-orange); --status-soft: rgba(255,140,66,.16); }
#lh-app[data-state="liftoff"],
#lh-app[data-state="ascent"]   { --status: var(--or-orange); --status-soft: rgba(255,140,66,.18); }
#lh-app[data-state="orbit"],
#lh-app[data-state="success"]  { --status: var(--or-go-soft);--status-soft: rgba(76,255,142,.14); }
#lh-app[data-state="failure"]  { --status: var(--or-danger); --status-soft: rgba(255,59,48,.16); }
#lh-app[data-state="scrubbed"] { --status: var(--or-scrub);  --status-soft: rgba(255,90,82,.15); }
#lh-app[data-state="replay"]   { --status: var(--or-purple); --status-soft: rgba(190,108,255,.14); }

/* ── RESET / BASE ────────────────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
[hidden]{ display:none!important; }   /* the hidden attr must win over component display rules */

/* themed scrollbars */
*{ scrollbar-width:thin; scrollbar-color:rgba(255,140,66,.55) rgba(7,10,24,.4); }
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-track{ background:rgba(7,10,24,.5); }
::-webkit-scrollbar-thumb{ background:linear-gradient(180deg,var(--or-orange),var(--or-gold)); border-radius:7px; border:2px solid rgba(7,10,24,.65); }
::-webkit-scrollbar-thumb:hover{ background:linear-gradient(180deg,var(--or-orange-lo),var(--or-orange)); }
::-webkit-scrollbar-corner{ background:transparent; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--or-bg-1); color:var(--or-text);
  font-family:var(--or-font-mono); font-size:15px; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){ *{ animation-duration:.001ms!important; transition-duration:.001ms!important; } html{scroll-behavior:auto;} }
a{ color:var(--or-info); text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
h1,h2,h3{ font-family:var(--or-font-display); }
canvas{ display:block; }
/* inline SVG icon system — replaces emoji; inherits text colour via currentColor */
.lh-ico{ width:1.15em; height:1.15em; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; vertical-align:-.15em; flex-shrink:0; }
.lh-hero-h1{ font-family:var(--or-font-display); font-weight:900; font-size:clamp(20px,3.4vw,30px); color:#fff; letter-spacing:1px; margin:0 0 8px; line-height:1.15; text-shadow:0 0 34px rgba(96,234,254,.18); }
.lh-panel-h .lh-ico{ width:18px; height:18px; }

.or-skip-link{ position:absolute; left:-999px; top:0; background:var(--or-orange); color:#06080f; padding:10px 16px; border-radius:0 0 10px 0; z-index:1000; font-weight:700; }
.or-skip-link:focus{ left:0; }

/* ── COSMIC BACKDROP ─────────────────────────────────────────────────────── */
.or-lib-bg{ position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(ellipse at 18% 12%, rgba(96,234,254,.05) 0%, transparent 52%),
    radial-gradient(ellipse at 82% 78%, rgba(255,140,66,.05) 0%, transparent 52%),
    radial-gradient(1300px 850px at 50% 14%, #0a0e22 0%, #070a18 58%, #04060e 100%);
}
.or-lib-stars{ position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.9;
  background:
    radial-gradient(1px 1px at 10% 15%, rgba(255,255,255,.5) 50%, transparent),
    radial-gradient(1px 1px at 25% 40%, rgba(255,224,96,.4) 50%, transparent),
    radial-gradient(1.5px 1.5px at 52% 4%, rgba(255,255,255,.35) 50%, transparent),
    radial-gradient(1px 1px at 70% 60%, rgba(96,234,254,.4) 50%, transparent),
    radial-gradient(1px 1px at 90% 25%, rgba(255,255,255,.4) 50%, transparent),
    radial-gradient(1.5px 1.5px at 35% 75%, rgba(255,224,96,.3) 50%, transparent),
    radial-gradient(1px 1px at 60% 90%, rgba(255,255,255,.5) 50%, transparent),
    radial-gradient(1px 1px at 15% 85%, rgba(96,234,254,.3) 50%, transparent),
    radial-gradient(1px 1px at 80% 45%, rgba(255,255,255,.35) 50%, transparent);
  animation: or-twinkle 9s ease-in-out infinite alternate;
}
@keyframes or-twinkle{ 0%{opacity:.55} 100%{opacity:1} }

/* ── TOP NAV (matches site chrome) ───────────────────────────────────────── */
.or-lib-topbar{ position:sticky; top:0; z-index:100; display:flex; align-items:center; justify-content:space-between;
  padding:13px 28px; background:rgba(7,10,24,.88); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,224,96,.15); }
.or-lib-topbar-brand{ display:flex; align-items:center; gap:12px; color:var(--or-gold);
  font-family:var(--or-font-display); font-weight:700; font-size:14px; letter-spacing:1.5px; text-transform:uppercase; }
.or-lib-topbar-brand img{ width:28px; height:28px; border-radius:6px; }
.or-lib-topbar-nav{ display:flex; gap:6px; align-items:center; }
.or-lib-topbar-link{ color:rgba(255,224,96,.7); font-family:var(--or-font-display); font-weight:600;
  font-size:12px; letter-spacing:1px; padding:6px 12px; border-radius:8px; border:1px solid transparent; transition:all .2s; }
.or-lib-topbar-link:hover{ color:var(--or-gold); border-color:rgba(255,224,96,.3); background:rgba(255,224,96,.06); }
.or-lib-topbar-link.active{ color:var(--or-gold); border-color:rgba(255,224,96,.4); background:rgba(255,224,96,.08); }
/* mobile: collapse the nav behind the hamburger. Without this, launch-styles' display:flex above
   overrides library-styles' mobile display:none and the nav stays permanently expanded. The hamburger
   button + dropdown styling come from library-styles.css (loaded first). */
@media (max-width:600px){ .or-lib-topbar-nav{ display:none; } .or-lib-topbar-nav.or-lib-nav-open{ display:flex; } }

.or-lib-wrap{ position:relative; z-index:1; max-width:var(--or-maxw); margin:0 auto; padding:0 24px 90px; }
.or-lib-breadcrumb{ display:flex; align-items:center; gap:8px; padding:14px 0 0; font-size:12px; color:var(--or-text-faint); }
.or-lib-breadcrumb a{ color:rgba(255,224,96,.6); }
.or-lib-breadcrumb a:hover{ color:var(--or-gold); }
.or-lib-breadcrumb .sep{ opacity:.4; }

/* ════════════════════════════════════════════════════════════════════════
   THEATRE  —  the immersive watch-live centrepiece (Tier 2)
   ════════════════════════════════════════════════════════════════════════ */
.lh-theatre{ position:relative; margin:18px 0 26px; border-radius:var(--or-r-xl);
  border:1px solid var(--or-line); background:
    linear-gradient(165deg, rgba(12,16,36,.96), rgba(16,12,24,.92));
  box-shadow:var(--shadow-card); overflow:hidden; isolation:isolate; }
/* status-reactive top edge + ambient glow */
.lh-theatre::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(120% 80% at 50% -10%, var(--status-soft), transparent 60%);
  transition:background .8s var(--ease); }
.lh-theatre::after{ content:""; position:absolute; left:0; right:0; top:0; height:2px; z-index:3;
  background:linear-gradient(90deg, transparent, var(--status), transparent); opacity:.9;
  box-shadow:0 0 18px var(--status); transition:background .6s var(--ease), box-shadow .6s var(--ease); }

.lh-theatre-grid{ position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr); gap:0; }
@media (max-width:880px){ .lh-theatre-grid{ grid-template-columns:1fr; } }

/* ── Left: the stage (video / standby / state visuals) ── */
.lh-stage{ position:relative; aspect-ratio:16/9; background:#04060e; overflow:hidden; border-right:1px solid var(--or-line); }
@media (max-width:880px){ .lh-stage{ border-right:none; border-bottom:1px solid var(--or-line); } }
/* the stage box relies on the theatre's overflow clip; only the iframe needs its own radius (iframes ignore an ancestor's clip) — round it directly so no square corner pokes past the card */
.lh-stage iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; border-radius:var(--or-r-xl) 0 0 var(--or-r-xl); opacity:0; transition:opacity .6s var(--ease); }
@media (max-width:880px){ .lh-stage iframe{ border-radius:var(--or-r-xl) var(--or-r-xl) 0 0; } }
.lh-stage iframe.ready{ opacity:1; }
.lh-stage-canvas{ position:absolute; inset:0; width:100%; height:100%; }

/* Standby / awaiting / mission-control overlays sit on the stage */
.lh-stage-overlay{ position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:14px; text-align:center; padding:24px; transition:opacity .5s var(--ease); }
.lh-stage-overlay[hidden]{ display:none; }
.lh-so-glyph{ width:64px; height:64px; opacity:.85; filter:drop-shadow(0 0 16px var(--status)); }
.lh-so-title{ font-family:var(--or-font-display); font-size:clamp(15px,2.4vw,22px); letter-spacing:2px; text-transform:uppercase; color:#fff; }
.lh-so-sub{ font-size:13px; color:var(--or-text-dim); max-width:420px; }
.lh-so-spinner{ display:inline-flex; align-items:center; gap:8px; font-size:12px; color:var(--status); letter-spacing:1px; }
.lh-so-spinner::before{ content:""; width:11px; height:11px; border-radius:50%; border:2px solid var(--status); border-right-color:transparent; animation:lh-spin .8s linear infinite; }
@keyframes lh-spin{ to{ transform:rotate(360deg); } }

/* ── Branded "radar" holding screen (on-theme for Orbital Radar) ── */
.lh-radar{ position:relative; width:132px; height:132px; border-radius:50%; margin-bottom:8px;
  background:radial-gradient(circle, transparent 0 27%, rgba(96,234,254,.10) 27% 28%, transparent 28% 55%, rgba(96,234,254,.09) 55% 56%, transparent 56% 83%, rgba(96,234,254,.09) 83% 84%, transparent 84%);
  border:1px solid rgba(96,234,254,.32); box-shadow:0 0 36px rgba(96,234,254,.14), inset 0 0 30px rgba(96,234,254,.05); }
.lh-radar::before, .lh-radar::after{ content:""; position:absolute; background:rgba(96,234,254,.16); }
.lh-radar::before{ left:50%; top:7%; bottom:7%; width:1px; transform:translateX(-.5px); }
.lh-radar::after{ top:50%; left:7%; right:7%; height:1px; transform:translateY(-.5px); }
.lh-radar-sweep{ position:absolute; inset:0; border-radius:50%;
  background:conic-gradient(from 0deg, rgba(57,255,20,.5), rgba(57,255,20,.05) 50deg, transparent 95deg); animation:lh-radar-spin 3.2s linear infinite; }
@keyframes lh-radar-spin{ to{ transform:rotate(360deg); } }
.lh-radar-core{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
/* framed circular "hub" so the logo reads as the radar centre, not a floating square */
.lh-radar-core::before{ content:""; position:absolute; width:56px; height:56px; border-radius:50%;
  background:radial-gradient(circle, rgba(12,18,36,.97) 58%, rgba(7,10,24,.85)); border:1px solid rgba(96,234,254,.4);
  box-shadow:0 0 20px rgba(96,234,254,.22), inset 0 0 14px rgba(0,0,0,.55); }
.lh-radar-core img{ position:relative; width:30px; height:30px; border-radius:50%; object-fit:cover; opacity:.96;
  filter:drop-shadow(0 0 8px rgba(255,224,96,.45));
  -webkit-mask-image:radial-gradient(circle, #000 56%, transparent 76%); mask-image:radial-gradient(circle, #000 56%, transparent 76%); }
.lh-radar-blip{ position:absolute; top:50%; left:50%; width:7px; height:7px; margin:-3.5px; border-radius:50%; background:var(--or-gold); box-shadow:0 0 9px var(--or-gold); }
.lh-radar-blip.b1{ animation:lh-orbit1 6s linear infinite; }
.lh-radar-blip.b2{ width:5px; height:5px; background:var(--or-go); box-shadow:0 0 9px var(--or-go); animation:lh-orbit2 9s linear infinite; }
@keyframes lh-orbit1{ from{ transform:rotate(0) translateX(48px) rotate(0); } to{ transform:rotate(360deg) translateX(48px) rotate(-360deg); } }
@keyframes lh-orbit2{ from{ transform:rotate(150deg) translateX(32px) rotate(-150deg); } to{ transform:rotate(510deg) translateX(32px) rotate(-510deg); } }
.lh-or-wordmark{ font-family:var(--or-font-display); font-weight:900; font-size:clamp(19px,3.2vw,28px); letter-spacing:5px; color:var(--or-gold);
  text-shadow:0 0 30px rgba(255,224,96,.35), 0 0 70px rgba(255,224,96,.12); }

/* Lazy video facade (lite embed) */
.lh-facade{ position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:14px; background:transparent; border:0; color:#fff; cursor:pointer; }
.lh-facade-play{ width:66px; height:66px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:24px;
  background:var(--status-soft); border:1.5px solid var(--status); color:var(--status); box-shadow:0 0 32px -6px var(--status);
  transition:transform .2s var(--ease); padding-left:4px; }
.lh-facade:hover .lh-facade-play{ transform:scale(1.09); }
.lh-facade-txt{ font-size:12px; letter-spacing:1px; color:var(--or-text-dim); }

/* Mission-control mini telemetry over the stage when launched w/o feed */
.lh-stage-met{ position:absolute; left:0; right:0; bottom:0; z-index:2; display:flex; gap:18px; align-items:center; justify-content:center;
  padding:12px; background:linear-gradient(0deg, rgba(4,6,14,.92), transparent); font-variant-numeric:tabular-nums; }
.lh-stage-met[hidden]{ display:none; }
.lh-sm-cell{ text-align:center; }
.lh-sm-val{ font-family:var(--or-font-display); font-size:clamp(14px,2vw,20px); color:#fff; }
.lh-sm-lbl{ font-size:9px; letter-spacing:1.5px; text-transform:uppercase; color:var(--or-text-faint); }

/* completed-launch summary — fills the stage so a finished mission reads as deliberate, not a barren starfield */
.lh-stage-done{ position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; text-align:center; padding:24px 24px 64px; }
.lh-stage-done[hidden]{ display:none; }
.lh-done-ring{ width:90px; height:90px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  border:2px solid var(--or-go-soft); background:radial-gradient(circle, rgba(76,255,142,.12), transparent 70%);
  box-shadow:0 0 40px -6px var(--or-go-soft), inset 0 0 26px rgba(76,255,142,.12); }
.lh-done-check{ font-size:44px; line-height:1; color:var(--or-go-soft); text-shadow:0 0 18px var(--or-go-soft); }
.lh-done-title{ font-family:var(--or-font-display); font-size:clamp(16px,2.4vw,22px); letter-spacing:2px; text-transform:uppercase; color:#fff; }
.lh-done-sub{ font-size:13px; color:var(--or-text-dim); max-width:440px; line-height:1.5; }

/* Live tag on the stage */
.lh-stage-tag{ position:absolute; top:12px; left:12px; z-index:3; display:inline-flex; align-items:center; gap:7px;
  padding:5px 11px; border-radius:var(--or-r-pill); font-size:10px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase;
  background:rgba(4,6,14,.7); border:1px solid var(--status); color:#fff; backdrop-filter:blur(8px); }
.lh-stage-tag .dot{ width:8px; height:8px; border-radius:50%; background:var(--status); box-shadow:0 0 8px var(--status); animation:lh-dot 1.4s ease-in-out infinite; }
@keyframes lh-dot{ 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.45;transform:scale(.8)} }

/* ── Right: console (identity, countdown, actions) ── */
.lh-console{ position:relative; z-index:1; display:flex; flex-direction:column; padding:22px 24px; gap:18px; min-width:0; }

.lh-identity{ display:flex; align-items:center; gap:14px; }
.lh-patch{ width:58px; height:58px; border-radius:14px; object-fit:cover; flex-shrink:0;
  border:1px solid var(--or-line-strong); background:rgba(255,255,255,.04); }
.lh-id-text{ min-width:0; }
.lh-id-vehicle{ font-family:var(--or-font-display); font-weight:700; font-size:clamp(16px,2.4vw,22px); color:#fff; letter-spacing:.5px; line-height:1.15; }
.lh-id-mission{ font-size:13px; color:var(--or-text-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lh-id-provider{ display:inline-flex; align-items:center; gap:6px; margin-top:3px; font-size:11px; color:var(--status);
  letter-spacing:.5px; cursor:pointer; border-bottom:1px dashed transparent; }
.lh-id-provider:hover{ border-bottom-color:var(--status); }

/* Status pill */
.lh-status{ display:inline-flex; align-items:center; gap:9px; align-self:flex-start; padding:7px 15px; border-radius:var(--or-r-pill);
  font-family:var(--or-font-display); font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase;
  color:var(--status); background:var(--status-soft); border:1px solid var(--status); }
.lh-status .dot{ width:9px; height:9px; border-radius:50%; background:var(--status); box-shadow:0 0 10px var(--status); }
#lh-app[data-state="go"] .lh-status .dot,
#lh-app[data-state="liftoff"] .lh-status .dot,
#lh-app[data-state="ascent"] .lh-status .dot{ animation:lh-dot 1.3s ease-in-out infinite; }

/* ── COUNTDOWN ── */
.lh-countdown{ display:flex; align-items:flex-end; justify-content:center; gap:6px; padding:6px 0 2px; font-variant-numeric:tabular-nums; }
.lh-cd-seg{ display:flex; flex-direction:column; align-items:center; gap:6px; }
.lh-cd-digits{ display:inline-flex; font-family:var(--or-font-display); font-weight:900; font-size:clamp(34px,6.4vw,58px); line-height:1; color:#fff;
  text-shadow:0 0 32px var(--status); transition:text-shadow .5s var(--ease); }
/* each digit lives in a fixed-width slot → numbers never shift as they change */
.lh-cd-digit{ display:inline-block; width:clamp(20px,4.2vw,38px); text-align:center; }
.lh-cd-lbl{ font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--or-text-faint); }
.lh-cd-sep{ font-family:var(--or-font-display); font-weight:900; font-size:clamp(28px,5vw,46px); color:var(--status); opacity:.7;
  align-self:flex-start; margin-top:2px; animation:lh-blink 1s step-end infinite; }
@keyframes lh-blink{ 50%{opacity:.15} }
.lh-cd-prefix{ font-family:var(--or-font-display); font-weight:900; font-size:clamp(26px,5vw,46px); color:var(--status); align-self:flex-start; margin-top:2px; }

/* Big single-line state messages (hold/scrub/awaiting/launched) */
.lh-cd-message{ text-align:center; padding:8px 0 4px; }
.lh-cd-message .big{ font-family:var(--or-font-display); font-weight:900; font-size:clamp(26px,5vw,46px); letter-spacing:2px;
  color:var(--status); text-shadow:0 0 30px var(--status); }
.lh-cd-message .sub{ margin-top:6px; font-size:12px; color:var(--or-text-dim); letter-spacing:.5px; }
#lh-app[data-state="liftoff"] .lh-cd-message .big{ animation:lh-launch-pulse 1.4s var(--ease) infinite; }
@keyframes lh-launch-pulse{ 0%,100%{ text-shadow:0 0 24px var(--status); } 50%{ text-shadow:0 0 52px var(--status), 0 0 90px var(--status); } }

/* T+ MET clock — reuses the countdown digit slots so it's on-brand AND jitter-free */
.lh-met-clock{ text-align:center; padding:6px 0 4px; }
.lh-met-time{ display:inline-flex; align-items:flex-start; justify-content:center; gap:4px; }
.lh-met-time .lh-cd-prefix, .lh-met-time .lh-cd-sep{ margin-top:0; align-self:flex-start; }
.lh-met-sub{ margin-top:6px; font-size:12px; color:var(--or-text-dim); letter-spacing:.5px; }

/* Recycle / next-attempt chip (hold & scrub) */
.lh-recycle{ display:flex; align-items:center; justify-content:center; gap:10px; margin-top:4px; padding:9px 14px;
  border-radius:var(--or-r-md); background:var(--status-soft); border:1px dashed var(--status); font-size:12px; color:var(--or-text); }
.lh-recycle b{ color:var(--status); font-family:var(--or-font-display); letter-spacing:1px; }

/* meta row (NET / pad / window) */
.lh-meta{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--or-line); border-radius:var(--or-r-md); overflow:hidden; }
.lh-meta-cell{ background:var(--or-bg-2); padding:10px 12px; min-width:0; }
.lh-meta-lbl{ font-size:9px; letter-spacing:1.5px; text-transform:uppercase; color:var(--or-text-faint); margin-bottom:3px; }
.lh-meta-val{ font-size:13px; color:#fff; line-height:1.3; overflow-wrap:anywhere; }
@media (max-width:480px){ .lh-meta{ grid-template-columns:1fr 1fr; } .lh-meta-cell:nth-child(3){ grid-column:1/-1; } }

/* action buttons */
.lh-actions{ display:flex; flex-wrap:wrap; gap:9px; }
.lh-btn{ display:inline-flex; align-items:center; gap:7px; padding:9px 15px; border-radius:var(--or-r-pill); font-size:12px;
  font-weight:600; letter-spacing:.5px; border:1px solid var(--or-line-strong); background:var(--or-surface-3); color:var(--or-text);
  transition:transform .15s var(--ease), border-color .2s, background .2s, box-shadow .2s; }
.lh-btn:hover{ transform:translateY(-2px); border-color:var(--status); box-shadow:0 8px 24px -10px var(--status); }
.lh-btn:active{ transform:translateY(0); }
.lh-btn-primary{ background:linear-gradient(135deg,var(--or-orange),var(--or-orange-lo)); color:#0a0a0f; border-color:transparent; font-weight:700; }
.lh-btn-primary:hover{ box-shadow:0 10px 30px -8px var(--or-orange); }
.lh-btn-tz{ margin-left:auto; }
.lh-tz-btn{ padding:5px 10px; font-size:11px; background:transparent; border:1px solid var(--or-line); color:var(--or-text-dim); border-radius:8px; }
.lh-tz-btn.active{ color:var(--status); border-color:var(--status); background:var(--status-soft); }

.lh-powered{ font-size:10px; color:var(--or-text-faint); letter-spacing:1px; text-align:center; margin-top:auto; padding-top:6px; }
.lh-powered b{ color:var(--status); }

/* ════════════════════════════════════════════════════════════════════════
   PANELS — generic card system
   ════════════════════════════════════════════════════════════════════════ */
.lh-deck{ display:grid; grid-template-columns:repeat(12,1fr); gap:var(--or-gap); margin-top:8px; }
.lh-panel{ grid-column:span 12; background:var(--or-surface); border:1px solid var(--or-line); border-radius:var(--or-r-lg);
  padding:18px 20px; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); position:relative; overflow:hidden;
  transition:opacity .5s var(--ease), transform .5s var(--ease); }
.lh-panel[hidden]{ display:none; }
.lh-panel.col-6{ grid-column:span 6; }
.lh-panel.col-7{ grid-column:span 7; }
.lh-panel.col-5{ grid-column:span 5; }
.lh-panel.col-8{ grid-column:span 8; }
.lh-panel.col-4{ grid-column:span 4; }
@media (max-width:760px){ .lh-panel,.lh-panel.col-6,.lh-panel.col-7,.lh-panel.col-5,.lh-panel.col-8,.lh-panel.col-4{ grid-column:span 12; } }
.lh-panel-h{ display:flex; align-items:center; gap:9px; margin:0 0 14px; font-family:var(--or-font-display); font-size:13px;
  font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:#fff; }
.lh-panel-h .ico{ font-size:16px; }
.lh-panel-h .tag{ margin-left:auto; font-size:10px; font-weight:700; letter-spacing:1px; color:var(--status);
  padding:3px 9px; border-radius:var(--or-r-pill); background:var(--status-soft); border:1px solid var(--status); font-family:var(--or-font-display); }
.section-reveal{ opacity:0; transform:translateY(18px); }
.section-reveal.in{ opacity:1; transform:none; }

/* ── TELEMETRY (Tier 0/3) ── */
.lh-telem-grid{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:1px; background:var(--or-line); border-radius:var(--or-r-md); overflow:hidden; }
@media (max-width:620px){ .lh-telem-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.lh-telem-cell{ background:var(--or-bg-2); padding:12px 10px; text-align:center; min-width:0; }
.lh-telem-val{ font-family:var(--or-font-display); font-weight:700; font-size:clamp(15px,2.1vw,21px); color:#fff; font-variant-numeric:tabular-nums; transition:color .3s; white-space:nowrap; }
.lh-telem-val.cold{ color:var(--or-text-faint); }
.lh-telem-val.nominal{ color:var(--or-go-soft); }
.lh-telem-val.warn{ color:var(--or-orange); }
.lh-telem-unit{ font-size:10px; color:var(--or-text-faint); }
.lh-telem-lbl{ font-size:9px; letter-spacing:1.5px; text-transform:uppercase; color:var(--or-text-faint); margin-top:4px; }
.lh-telem-note{ margin-top:12px; font-size:11px; color:var(--or-text-faint); text-align:center; }
.lh-telem-note b{ color:var(--status); }
#lh-telem-chart{ width:100%; height:150px; margin-top:14px; border-radius:var(--or-r-sm); background:rgba(4,6,14,.5); }

/* ── STAGE EVENT TIMELINE (Tier 0) ── */
.lh-timeline{ display:flex; gap:0; overflow-x:auto; padding:6px 2px 12px; scrollbar-width:thin; }
.lh-tl-event{ flex:0 0 auto; min-width:96px; position:relative; padding-top:26px; text-align:center; opacity:.45; transition:opacity .4s; }
.lh-tl-event::before{ content:""; position:absolute; top:9px; left:0; right:0; height:2px; background:var(--or-line-strong); }
.lh-tl-event:first-child::before{ left:50%; }
.lh-tl-event:last-child::before{ right:50%; }
.lh-tl-dot{ position:absolute; top:3px; left:50%; transform:translateX(-50%); width:14px; height:14px; border-radius:50%;
  background:var(--or-bg-1); border:2px solid var(--or-line-strong); z-index:1; transition:all .4s; }
.lh-tl-t{ font-family:var(--or-font-display); font-size:12px; color:#fff; font-variant-numeric:tabular-nums; }
.lh-tl-n{ font-size:10px; color:var(--or-text-dim); margin-top:2px; line-height:1.3; }
.lh-tl-event.passed{ opacity:1; }
.lh-tl-event.passed .lh-tl-dot{ background:var(--or-go-soft); border-color:var(--or-go-soft); box-shadow:0 0 10px var(--or-go-soft); }
.lh-tl-event.passed::before{ background:var(--or-go-soft); }
.lh-tl-event.active{ opacity:1; }
.lh-tl-event.active .lh-tl-dot{ background:var(--status); border-color:var(--status); box-shadow:0 0 0 4px var(--status-soft), 0 0 16px var(--status); animation:lh-dot 1.2s infinite; }
.lh-tl-event.active .lh-tl-t{ color:var(--status); }

/* ── TRAJECTORY (Tier 3) ── */
.lh-traj-wrap{ position:relative; }
#lh-traj-canvas{ width:100%; height:300px; border-radius:var(--or-r-md); background:
   radial-gradient(120% 90% at 50% 120%, rgba(57,255,20,.05), transparent 60%), rgba(4,6,14,.6); }
.lh-traj-legend{ display:flex; gap:16px; flex-wrap:wrap; margin-top:10px; font-size:11px; color:var(--or-text-dim); }
.lh-traj-legend span{ display:inline-flex; align-items:center; gap:6px; }
.lh-traj-legend i{ width:14px; height:3px; border-radius:2px; display:inline-block; }
.lh-traj-badge{ position:absolute; top:12px; right:14px; font-size:10px; letter-spacing:1px; color:var(--or-text-faint);
  background:rgba(4,6,14,.6); padding:4px 9px; border-radius:var(--or-r-pill); border:1px solid var(--or-line); }

/* ── CONFIDENCE METER (Tier 5: value precomputed server-side) ── */
.lh-conf-top{ display:flex; align-items:baseline; gap:10px; }
.lh-conf-pct{ font-family:var(--or-font-display); font-weight:900; font-size:38px; color:var(--status); font-variant-numeric:tabular-nums; }
.lh-conf-word{ font-size:13px; color:var(--or-text-dim); }
.lh-conf-bar{ height:10px; border-radius:var(--or-r-pill); background:rgba(255,255,255,.06); overflow:hidden; margin:12px 0 14px; }
.lh-conf-fill{ height:100%; border-radius:var(--or-r-pill); width:0;
  background:linear-gradient(90deg,var(--or-scrub),var(--or-orange) 50%,var(--or-go) 100%); transition:width 1s var(--ease-out); }
.lh-conf-factors{ display:flex; flex-direction:column; gap:7px; }
.lh-conf-factor{ display:flex; justify-content:space-between; font-size:12px; padding:6px 10px; border-radius:8px; background:rgba(255,255,255,.025); }
.lh-conf-factor .v{ font-family:var(--or-font-display); font-weight:700; }
.lh-conf-factor .v.pos{ color:var(--or-go-soft); } .lh-conf-factor .v.neg{ color:var(--or-scrub); } .lh-conf-factor .v.neu{ color:var(--or-text-faint); }

/* ── WEATHER + SCRUB PROBABILITY (Tier 6) ── */
.lh-wx{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.lh-wx-pov{ text-align:center; }
.lh-wx-pov .pct{ font-family:var(--or-font-display); font-weight:900; font-size:34px; color:var(--or-go); }
.lh-wx-pov .lbl{ font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--or-text-faint); }
.lh-wx-stats{ display:flex; gap:14px; flex-wrap:wrap; }
.lh-wx-stat{ font-size:12px; color:var(--or-text-dim); }
.lh-wx-stat b{ display:block; font-family:var(--or-font-display); font-size:16px; color:#fff; }
.lh-wx-src{ width:100%; font-size:10px; color:var(--or-text-faint); }

/* ── AI COMMENTARY (Tier 6) ── */
.lh-ai-feed{ display:flex; flex-direction:column; gap:10px; max-height:280px; overflow-y:auto; scrollbar-width:thin; }
.lh-ai-msg{ display:flex; gap:10px; padding:10px 12px; border-radius:var(--or-r-md); background:rgba(255,255,255,.025); border:1px solid var(--or-line);
  animation:lh-fade-up .5s var(--ease-out); }
@keyframes lh-fade-up{ from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none} }
.lh-ai-t{ font-family:var(--or-font-display); font-size:11px; color:var(--status); flex:0 0 auto; min-width:46px; font-variant-numeric:tabular-nums; }
.lh-ai-body{ font-size:13px; color:var(--or-text); line-height:1.5; }
.lh-ai-tag{ display:inline-block; font-size:9px; letter-spacing:1px; text-transform:uppercase; color:var(--or-purple);
  border:1px solid rgba(190,108,255,.4); border-radius:var(--or-r-pill); padding:1px 7px; margin-right:6px; }

/* ════════════════════════════════════════════════════════════════════════
   "SEE IT FROM YOUR SKY" — the differentiator (Tier 1)
   ════════════════════════════════════════════════════════════════════════ */
.lh-sky{ grid-column:span 12; border:1px solid rgba(96,234,254,.3); border-radius:var(--or-r-lg); overflow:hidden;
  background:linear-gradient(150deg, rgba(10,18,34,.92), rgba(8,12,28,.92)); position:relative; }
.lh-sky::before{ content:""; position:absolute; inset:0; background:radial-gradient(90% 120% at 100% 0%, rgba(96,234,254,.12), transparent 55%); pointer-events:none; }
.lh-sky-inner{ position:relative; display:grid; grid-template-columns:1.2fr 1fr; gap:0; }
@media (max-width:760px){ .lh-sky-inner{ grid-template-columns:1fr; } }
.lh-sky-l{ padding:22px 24px; }
.lh-sky-kicker{ font-family:var(--or-font-display); font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--or-info); }
.lh-sky-h{ font-family:var(--or-font-display); font-weight:700; font-size:clamp(18px,2.6vw,24px); color:#fff; margin:8px 0 6px; }
.lh-sky-sub{ font-size:13px; color:var(--or-text-dim); line-height:1.6; }
.lh-sky-pass{ margin-top:16px; display:flex; gap:16px; flex-wrap:wrap; }
.lh-sky-stat{ }
.lh-sky-stat b{ display:block; font-family:var(--or-font-display); font-size:20px; color:var(--or-info); }
.lh-sky-stat span{ font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--or-text-faint); }
.lh-sky-cta{ margin-top:18px; }
.lh-sky-r{ position:relative; min-height:220px; border-left:1px solid rgba(96,234,254,.18); }
@media (max-width:760px){ .lh-sky-r{ border-left:none; border-top:1px solid rgba(96,234,254,.18); } }
#lh-sky-canvas{ position:absolute; inset:0; width:100%; height:100%; }
.lh-sky-geo{ display:inline-flex; align-items:center; gap:7px; margin-top:14px; font-size:11px; color:var(--or-info);
  cursor:pointer; border:1px solid rgba(96,234,254,.35); border-radius:var(--or-r-pill); padding:6px 12px; background:rgba(96,234,254,.06); }

/* ════════════════════════════════════════════════════════════════════════
   SCHEDULE — tabs / filters / cards / stats
   ════════════════════════════════════════════════════════════════════════ */
.lh-sched-head{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:34px 0 14px; }
.lh-tabs{ display:flex; gap:6px; }
.lh-tab{ padding:8px 18px; border-radius:var(--or-r-pill); font-family:var(--or-font-display); font-size:12px; letter-spacing:1px;
  text-transform:uppercase; border:1px solid var(--or-line); background:transparent; color:var(--or-text-dim); }
.lh-tab.active{ color:var(--or-orange); border-color:var(--or-orange); background:rgba(255,140,66,.1); }
.lh-search{ margin-left:auto; position:relative; }
.lh-search input{ background:var(--or-bg-2); border:1px solid var(--or-line); border-radius:var(--or-r-pill); color:var(--or-text);
  padding:9px 16px 9px 36px; font-family:inherit; font-size:13px; width:200px; transition:border-color .2s, width .3s; }
.lh-search input:focus{ outline:none; border-color:var(--or-orange); width:240px; }
.lh-search::before{ content:"🔍"; position:absolute; left:13px; top:50%; transform:translateY(-50%); font-size:12px; opacity:.6; }

.lh-filters{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:18px; }
.lh-filter{ padding:6px 13px; border-radius:var(--or-r-pill); font-size:12px; border:1px solid var(--or-line);
  background:transparent; color:var(--or-text-dim); transition:all .2s; }
.lh-filter:hover{ border-color:var(--or-line-strong); color:var(--or-text); }
.lh-filter.active{ color:var(--or-orange); border-color:var(--or-orange); background:rgba(255,140,66,.1); }

.lh-cards{ display:flex; flex-direction:column; gap:10px; }
.lh-card{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:16px; padding:14px 18px;
  border-radius:var(--or-r-md); border:1px solid var(--or-line); background:var(--or-surface); cursor:pointer;
  transition:transform .2s var(--ease), border-color .2s, background .2s; position:relative; overflow:hidden; }
.lh-card:hover{ transform:translateX(4px); border-color:var(--status); background:var(--or-surface-2); }
.lh-card.is-hero{ border-color:var(--status); box-shadow:inset 3px 0 0 var(--status); }
.lh-card-when{ text-align:center; min-width:64px; }
.lh-card-when .d{ font-family:var(--or-font-display); font-size:20px; color:#fff; }
.lh-card-when .m{ font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--or-text-faint); }
.lh-card-when .t{ font-size:11px; color:var(--status); margin-top:2px; }
.lh-card-main{ min-width:0; }
.lh-card-veh{ font-family:var(--or-font-display); font-size:14px; color:#fff; }
.lh-card-mis{ font-size:12px; color:var(--or-text-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lh-card-prov{ font-size:11px; color:var(--or-text-faint); margin-top:2px; }
.lh-card-badge{ font-size:9px; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:4px 9px; border-radius:var(--or-r-pill);
  color:var(--status); background:var(--status-soft); border:1px solid var(--status); white-space:nowrap; }

/* ── STATS DASHBOARD ── */
.lh-stats-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--or-gap); }
@media (max-width:760px){ .lh-stats-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.lh-stat{ background:var(--or-surface); border:1px solid var(--or-line); border-radius:var(--or-r-md); padding:16px; text-align:center; }
.lh-stat-v{ font-family:var(--or-font-display); font-weight:900; font-size:30px; }
.lh-stat-v.o{color:var(--or-orange)} .lh-stat-v.g{color:var(--or-go)} .lh-stat-v.c{color:var(--or-info)} .lh-stat-v.y{color:var(--or-gold)}
.lh-stat-l{ font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--or-text-faint); margin-top:5px; }
.lh-bars{ display:flex; align-items:flex-end; gap:10px; height:150px; margin-top:8px; }
.lh-bar{ flex:1; display:flex; flex-direction:column; align-items:center; gap:6px; justify-content:flex-end; }
.lh-bar-fill{ width:100%; border-radius:6px 6px 0 0; background:linear-gradient(180deg,var(--or-orange),rgba(255,140,66,.3)); transition:height 1s var(--ease-out); }
.lh-bar-lbl{ font-size:10px; color:var(--or-text-dim); }
.lh-bar-val{ font-size:11px; color:#fff; font-family:var(--or-font-display); }
.lh-heat{ display:flex; gap:5px; height:90px; align-items:flex-end; margin-top:8px; }
.lh-heat-col{ flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; }
.lh-heat-bar{ width:100%; border-radius:4px; background:linear-gradient(180deg,var(--or-gold),rgba(255,224,96,.35)); }
.lh-heat-m{ font-size:9px; color:var(--or-text-faint); }

/* ── SEO ARTICLE / FAQ ── */
.lh-article{ margin-top:46px; color:var(--or-text-dim); line-height:1.8; font-size:14px; }
.lh-article h2{ color:#fff; font-size:22px; letter-spacing:1px; margin:32px 0 12px; }
.lh-article h3{ color:var(--or-gold); font-size:15px; margin:20px 0 8px; }
.lh-faq{ border:1px solid var(--or-line); border-radius:var(--or-r-md); margin:8px 0; overflow:hidden; background:var(--or-surface); }
.lh-faq summary{ padding:14px 18px; cursor:pointer; color:#fff; font-weight:600; list-style:none; display:flex; justify-content:space-between; }
.lh-faq summary::after{ content:"+"; color:var(--or-orange); font-size:18px; }
.lh-faq[open] summary::after{ content:"−"; }
.lh-faq-a{ padding:0 18px 16px; font-size:13px; }

/* ── FOOTER ── */
.lh-footer{ margin-top:60px; padding:30px 0; border-top:1px solid var(--or-line); text-align:center; color:var(--or-text-faint); font-size:12px; }

/* ── TOASTS ── */
.lh-toasts{ position:fixed; bottom:20px; left:50%; transform:translateX(-50%); z-index:600; display:flex; flex-direction:column; gap:8px; align-items:center; }
.lh-toast{ display:flex; align-items:center; gap:10px; padding:11px 18px; border-radius:var(--or-r-pill); background:rgba(10,14,28,.96);
  border:1px solid var(--status); color:#fff; font-size:13px; box-shadow:var(--shadow-card); animation:lh-toast-in .35s var(--ease-out); backdrop-filter:blur(10px); }
@keyframes lh-toast-in{ from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:none} }
.lh-toast .i{ font-size:16px; }
.lh-toast b{ color:var(--status); }

/* ── DEV SCENARIO SWITCHER (preview only — removed in production) ── */
.lh-dev{ position:fixed; right:14px; bottom:14px; z-index:700; font-family:var(--or-font-mono); }
.lh-dev-toggle{ display:flex; align-items:center; gap:8px; padding:10px 14px; border-radius:var(--or-r-pill);
  background:rgba(190,108,255,.16); border:1px solid var(--or-purple); color:#fff; font-size:12px; font-weight:700; letter-spacing:1px; box-shadow:var(--shadow-card); }
.lh-dev-panel{ position:absolute; right:0; bottom:54px; width:280px; max-height:70vh; overflow-y:auto; padding:14px;
  border-radius:var(--or-r-lg); background:rgba(8,10,22,.98); border:1px solid var(--or-purple); box-shadow:var(--shadow-card); display:none; }
.lh-dev.open .lh-dev-panel{ display:block; }
.lh-dev-h{ font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--or-purple); margin-bottom:4px; }
.lh-dev-note{ font-size:10px; color:var(--or-text-faint); margin-bottom:10px; line-height:1.5; }
.lh-dev-grid{ display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.lh-dev-btn{ padding:8px 6px; border-radius:8px; font-size:11px; border:1px solid var(--or-line); background:rgba(255,255,255,.03); color:var(--or-text); text-align:center; }
.lh-dev-btn:hover{ border-color:var(--or-purple); }
.lh-dev-btn.active{ background:var(--or-purple); color:#0a0a0f; font-weight:700; border-color:transparent; }
.lh-dev-row{ display:flex; gap:6px; margin-top:8px; }
.lh-dev-row .lh-dev-btn{ flex:1; }

/* ── FLOATING PIP TELEMETRY (sticky when scrolled past theatre during flight) ── */
.lh-pip{ position:fixed; bottom:16px; left:16px; z-index:500; display:none; align-items:center; gap:14px; padding:10px 16px;
  border-radius:var(--or-r-pill); background:rgba(8,10,22,.94); border:1px solid var(--status); box-shadow:var(--shadow-card);
  backdrop-filter:blur(12px); font-variant-numeric:tabular-nums; }
.lh-pip.show{ display:flex; }
.lh-pip .cell{ text-align:center; } .lh-pip .v{ font-family:var(--or-font-display); font-size:15px; color:#fff; } .lh-pip .l{ font-size:8px; letter-spacing:1px; color:var(--or-text-faint); }
.lh-pip .met{ color:var(--status); }

/* ── REVEAL on scroll ── */
@media (max-width:520px){
  .lh-console{ padding:18px 16px; }
  .lh-actions .lh-btn span.lbl{ display:none; }
  .lh-search input{ width:130px; } .lh-search input:focus{ width:160px; }
}

/* ════════════════════════════════════════════════════════════════════════
   FONT NORMALISATION — match the site convention:
   Orbitron = chrome (buttons, badges, uppercase micro-labels);
   JetBrains Mono = data values, timers, descriptive/body copy.
   (Placed last so it wins over earlier component declarations.)
   ════════════════════════════════════════════════════════════════════════ */
.lh-btn, .lh-tz-btn, .lh-filter,
.lh-meta-lbl, .lh-cd-lbl, .lh-telem-lbl, .lh-telem-unit, .lh-sm-lbl,
.lh-stat-l, .lh-sky-stat span, .lh-wx-pov .lbl, .lh-card-when .m,
.lh-card-badge, .lh-ai-tag, .lh-traj-badge, .lh-bar-lbl,
.or-fuel-heading, .or-fuel-preset, .or-fuel-submit{
  font-family: var(--or-font-display);
}
.lh-btn{ text-transform:uppercase; letter-spacing:.6px; font-weight:700; font-size:11px; }
.lh-tz-btn, .lh-filter{ text-transform:uppercase; letter-spacing:.5px; }
.lh-ai-t, .lh-toast{ font-family: var(--or-font-mono); }   /* timestamp/notification body = data/copy */

/* ── NUMERIC STABILITY — stop the flinch/reflow as digits change ── */
.lh-cd-digits, .lh-cd-message .big, .lh-sm-val, .lh-pip .v,
.lh-telem-val, .lh-tl-t, .lh-conf-pct, .lh-stat-v, .lh-ai-t, .lh-meta-val{
  font-variant-numeric: tabular-nums; font-feature-settings:"tnum" 1;
}
/* live readouts use JetBrains Mono (monospace = equal-width digits → zero jitter; matches site) */
.lh-telem-val, .lh-sm-val, .lh-pip .v{ font-family:var(--or-font-mono); font-weight:700; }
/* mission-control mini row over the stage: fixed cells so it can't recenter as values grow */
.lh-stage-met{ justify-content:space-evenly; }
.lh-sm-cell{ flex:0 0 96px; min-width:0; }
.lh-sm-val{ display:inline-block; }
/* PiP widget (bottom-left): fixed container + cells so the pill never resizes */
.lh-pip{ width:252px; gap:0; justify-content:space-between; }
.lh-pip .cell{ min-width:64px; }
.lh-pip .v{ display:inline-block; }

/* live-freshness indicator */
.lh-fresh{ display:inline-flex; align-items:center; gap:7px; font-family:var(--or-font-mono); font-size:11px; color:var(--or-text-dim); letter-spacing:.3px; }
.lh-fresh .dot{ width:7px; height:7px; border-radius:50%; background:var(--or-go); box-shadow:0 0 7px var(--or-go); animation:lh-dot 1.6s ease-in-out infinite; }

/* ════════════════════════════════════════════════════════════════════════
   SITE FOOTER (matches or-lib-footer chrome)
   ════════════════════════════════════════════════════════════════════════ */
.or-lib-footer{ margin-top:56px; padding:28px 0; border-top:1px solid rgba(255,224,96,.08); text-align:center; font-size:12px; color:rgba(255,255,255,.3); }
.or-lib-footer a{ color:rgba(255,224,96,.5); text-decoration:none; transition:color .2s; }
.or-lib-footer a:hover{ color:#ffe060; }
.or-lib-footer-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:32px; text-align:left; padding-bottom:28px; border-bottom:1px solid rgba(255,224,96,.06); margin-bottom:18px; }
.or-lib-footer-heading{ font-family:'Orbitron',monospace; font-weight:700; font-size:11px; color:rgba(255,224,96,.6); letter-spacing:1.2px; text-transform:uppercase; margin-bottom:10px; }
.or-lib-footer-col a{ display:block; color:rgba(255,255,255,.4); font-size:12px; line-height:1.4; padding:3px 0; }
.or-lib-footer-col a:hover{ color:#ffe060; }
.or-lib-footer-bottom{ text-align:center; }
.or-lib-footer-bottom a{ color:rgba(255,224,96,.7); }
.or-lib-footer a[aria-current="page"]{ color:#ffe060; opacity:.7; }
@media(max-width:900px){ .or-lib-footer-grid{ grid-template-columns:repeat(3,1fr); gap:24px; } }
@media(max-width:700px){ .or-lib-footer-grid{ grid-template-columns:repeat(2,1fr); gap:20px; } }

/* ════════════════════════════════════════════════════════════════════════
   RELATED RESOURCES (inter-site linking — SEO)
   ════════════════════════════════════════════════════════════════════════ */
.lh-related{ margin-top:48px; }
.lh-related-h{ font-family:var(--or-font-display); font-size:13px; letter-spacing:1.5px; text-transform:uppercase; color:var(--or-gold); margin-bottom:14px; display:flex; align-items:center; gap:9px; }
.lh-related-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(216px,1fr)); gap:12px; }
.lh-related-card{ display:block; padding:14px 16px; border-radius:var(--or-r-md); border:1px solid var(--or-line); background:var(--or-surface); transition:transform .2s var(--ease), border-color .2s, box-shadow .2s; }
.lh-related-card:hover{ transform:translateY(-2px); border-color:var(--or-gold); box-shadow:0 10px 28px -16px var(--or-gold); }
.lh-related-card b{ display:block; font-family:var(--or-font-display); font-size:13px; color:#fff; margin-bottom:3px; letter-spacing:.3px; }
.lh-related-card span{ font-size:11px; color:var(--or-text-dim); line-height:1.4; }
.lh-inline-link{ color:var(--or-info); border-bottom:1px solid rgba(96,234,254,.3); }
.lh-inline-link:hover{ border-bottom-color:var(--or-info); }
