/* Yardarm AI · Option D Sextant · v1.1.0 · Generated from tokens.json by tools/build_tokens.py. Do not edit by hand. */
/* Fonts are not loaded from this file (no CSS import rule, so no serial request chain). Put the contents of tokens/fonts.html
   in <head> before this stylesheet. Without it, the fallbacks in --ya-font-* are used. */

:root {
  --ya-brand-abyss: #06131A;
  --ya-brand-fathom: #0B2230;
  --ya-brand-slate: #4A5D63;
  --ya-brand-seafoam: #E6ECEB;
  --ya-brand-chart-teal: #3CC2B0;
  --ya-brand-teal-deep: #0B6B63;
  --ya-brand-brass: #DDA955;
  --ya-brand-brass-deep: #8F6418;
  --ya-dv-satellite: #7CC8FF;
  --ya-dv-orbit: #B3A9FF;
  --ya-dv-ground-station: #F29BD4;
  --ya-dv-inactive: #80979D;
  --ya-dv-selection: #FFFFFF;
  --ya-dv-sensor-fov: rgba(242, 155, 212, 0.20);
  --ya-dv-orbit-history: rgba(179, 169, 255, 0.50);
  --ya-alert-critical: #FF5A52;
  --ya-alert-serious: #FF8F4D;
  --ya-alert-caution: #F4E04D;
  --ya-alert-normal: #5DD68C;
  --ya-alert-standby: #9CC4E8;
  --ya-alert-off: #80979D;
  --ya-alert-light-critical: #B42318;
  --ya-alert-light-serious: #AD4407;
  --ya-alert-light-caution: #7A5C00;
  --ya-alert-light-normal: #1C7547;
  --ya-alert-light-standby: #2F6690;
  --ya-alert-light-off: #4A5D63;
  --ya-dv-print-series1: #0B6B63;
  --ya-dv-print-series2: #1A5C93;
  --ya-dv-print-series3: #5B4BB7;
  --ya-dv-print-series4: #A23B84;
  --ya-dv-print-series5: #8F6418;
  --ya-dv-print-series6: #4A5D63;
  --ya-font-display: 'Space Grotesk', Arial, Helvetica, sans-serif;
  --ya-font-body: Inter, Arial, Helvetica, sans-serif;
  --ya-font-mono: 'JetBrains Mono', 'Courier New', monospace;
  --ya-text-caption-size: 0.75rem;
  --ya-text-caption-line: 1.5;
  --ya-text-caption-weight: 400;
  --ya-text-caption-tracking: 0.02em;
  --ya-text-small-size: 0.875rem;
  --ya-text-small-line: 1.5;
  --ya-text-small-weight: 400;
  --ya-text-small-tracking: 0;
  --ya-text-body-size: 1rem;
  --ya-text-body-line: 1.5;
  --ya-text-body-weight: 400;
  --ya-text-body-tracking: 0;
  --ya-text-lead-size: 1.312rem;
  --ya-text-lead-line: 1.5;
  --ya-text-lead-weight: 400;
  --ya-text-lead-tracking: 0;
  --ya-text-h4-size: 1.75rem;
  --ya-text-h4-line: 1.3;
  --ya-text-h4-weight: 500;
  --ya-text-h4-tracking: -0.015em;
  --ya-text-h3-size: 2.375rem;
  --ya-text-h3-line: 1.3;
  --ya-text-h3-weight: 500;
  --ya-text-h3-tracking: -0.015em;
  --ya-text-h2-size: 3.188rem;
  --ya-text-h2-line: 1.15;
  --ya-text-h2-weight: 500;
  --ya-text-h2-tracking: -0.015em;
  --ya-text-h1-size: 4.188rem;
  --ya-text-h1-line: 1.15;
  --ya-text-h1-weight: 500;
  --ya-text-h1-tracking: -0.015em;
  --ya-text-display-size: 5.625rem;
  --ya-text-display-line: 1.05;
  --ya-text-display-weight: 500;
  --ya-text-display-tracking: -0.015em;
  --ya-space-0: 0px;
  --ya-space-1: 4px;
  --ya-space-2: 8px;
  --ya-space-3: 12px;
  --ya-space-4: 16px;
  --ya-space-5: 24px;
  --ya-space-6: 32px;
  --ya-space-7: 48px;
  --ya-space-8: 64px;
  --ya-space-9: 96px;
  --ya-radius-none: 0px;
  --ya-radius-sm: 3px;
  --ya-radius-md: 6px;
  --ya-radius-lg: 10px;
  --ya-radius-pill: 999px;
  --ya-shadow-raised: 0 1px 2px rgba(0,0,0,.12), 0 4px 12px rgba(0,0,0,.08);
  --ya-shadow-overlay: 0 8px 32px rgba(0,0,0,.35);
  --ya-motion-fast: 120ms;
  --ya-motion-base: 200ms;
  --ya-ease: cubic-bezier(0.2, 0, 0, 1);
}

/* Default site theme: dark. Toggle with <html data-theme="light">. */
:root, [data-theme="dark"] {
  color-scheme: dark;
  --ya-color-bg: #06131A;
  --ya-color-surface: #0B1E27;
  --ya-color-surface-alt: #112A35;
  --ya-color-surface-raised: #133241;
  --ya-color-border: #22414F;
  --ya-color-border-strong: #6A858C;
  --ya-color-text: #E9F1EF;
  --ya-color-text-muted: #97B0B3;
  --ya-color-primary: #4CCDBA;
  --ya-color-primary-hover: #7ADCCD;
  --ya-color-on-primary: #06131A;
  --ya-color-accent: #7FDCCD;
  --ya-color-accent-fill: #3CC2B0;
  --ya-color-on-accent-fill: #06131A;
  --ya-color-link: #8ED8F2;
  --ya-color-focus: #7FDCCD;
  --ya-color-danger: #FF5A52;
  --ya-color-warning: #F4E04D;
  --ya-color-success: #5DD68C;
  --ya-color-info: #8CC8F2;
  --ya-chip-critical-bg: #291D22;
  --ya-chip-serious-bg: #292421;
  --ya-chip-caution-bg: #273021;
  --ya-chip-normal-bg: #122E2A;
  --ya-chip-standby-bg: #1B2C37;
  --ya-chip-off-bg: #17252C;
}
[data-theme="light"] {
  color-scheme: light;
  --ya-color-bg: #FFFFFF;
  --ya-color-surface: #F3F6F5;
  --ya-color-surface-alt: #E6ECEB;
  --ya-color-surface-raised: #FFFFFF;
  --ya-color-border: #CCD7D6;
  --ya-color-border-strong: #6B8087;
  --ya-color-text: #0A1A22;
  --ya-color-text-muted: #4A5D63;
  --ya-color-primary: #0B2230;
  --ya-color-primary-hover: #16384A;
  --ya-color-on-primary: #FFFFFF;
  --ya-color-accent: #0B6B63;
  --ya-color-accent-fill: #0B6B63;
  --ya-color-on-accent-fill: #FFFFFF;
  --ya-color-link: #1A5C93;
  --ya-color-focus: #0B6B63;
  --ya-color-danger: #B42318;
  --ya-color-warning: #8A5A00;
  --ya-color-success: #1C7547;
  --ya-color-info: #1A5C93;
  --ya-alert-critical: #B42318;
  --ya-alert-serious: #AD4407;
  --ya-alert-caution: #7A5C00;
  --ya-alert-normal: #1C7547;
  --ya-alert-standby: #2F6690;
  --ya-alert-off: #4A5D63;
  --ya-chip-critical-bg: #F8E9E8;
  --ya-chip-serious-bg: #F7ECE6;
  --ya-chip-caution-bg: #F2EFE6;
  --ya-chip-normal-bg: #E8F1ED;
  --ya-chip-standby-bg: #EAF0F4;
  --ya-chip-off-bg: #EDEFEF;
}

/* Base elements */
body { margin: 0; background: var(--ya-color-bg); color: var(--ya-color-text); font-family: var(--ya-font-body);
  font-size: var(--ya-text-body-size); line-height: var(--ya-text-body-line); -webkit-font-smoothing: antialiased; }
.ya-display { font-family: var(--ya-font-display); font-size: var(--ya-text-display-size); line-height: var(--ya-text-display-line); font-weight: var(--ya-text-display-weight); letter-spacing: var(--ya-text-display-tracking); text-transform: none; margin: 0 0 var(--ya-space-4); }
h1, .ya-h1 { font-family: var(--ya-font-display); font-size: var(--ya-text-h1-size); line-height: var(--ya-text-h1-line); font-weight: var(--ya-text-h1-weight); letter-spacing: var(--ya-text-h1-tracking); text-transform: none; margin: 0 0 var(--ya-space-4); }
h2, .ya-h2 { font-family: var(--ya-font-display); font-size: var(--ya-text-h2-size); line-height: var(--ya-text-h2-line); font-weight: var(--ya-text-h2-weight); letter-spacing: var(--ya-text-h2-tracking); text-transform: none; margin: 0 0 var(--ya-space-4); }
h3, .ya-h3 { font-family: var(--ya-font-display); font-size: var(--ya-text-h3-size); line-height: var(--ya-text-h3-line); font-weight: var(--ya-text-h3-weight); letter-spacing: var(--ya-text-h3-tracking); text-transform: none; margin: 0 0 var(--ya-space-4); }
h4, .ya-h4 { font-family: var(--ya-font-display); font-size: var(--ya-text-h4-size); line-height: var(--ya-text-h4-line); font-weight: var(--ya-text-h4-weight); letter-spacing: var(--ya-text-h4-tracking); text-transform: none; margin: 0 0 var(--ya-space-4); }
.ya-lead { font-size: var(--ya-text-lead-size); line-height: var(--ya-text-lead-line); color: var(--ya-color-text-muted); }
.ya-caption { font-size: var(--ya-text-caption-size); letter-spacing: var(--ya-text-caption-tracking); color: var(--ya-color-text-muted); }
code, pre, .ya-mono { font-family: var(--ya-font-mono); font-size: 0.9em; }
a { color: var(--ya-color-link); text-underline-offset: 0.18em; }
:focus-visible { outline: 2px solid var(--ya-color-focus); outline-offset: 2px; }
.ya-btn { display: inline-flex; align-items: center; gap: var(--ya-space-2); padding: var(--ya-space-3) var(--ya-space-5);
  border-radius: var(--ya-radius-md); font: 600 var(--ya-text-small-size)/1 var(--ya-font-body); border: 1px solid transparent;
  background: var(--ya-color-primary); color: var(--ya-color-on-primary); cursor: pointer; text-decoration: none;
  transition: background var(--ya-motion-fast) var(--ya-ease); }
.ya-btn:hover { background: var(--ya-color-primary-hover); }
.ya-btn--ghost { background: transparent; color: var(--ya-color-text); border-color: var(--ya-color-border-strong); }
.ya-card { background: var(--ya-color-surface); border: 1px solid var(--ya-color-border-strong); border-radius: var(--ya-radius-lg); padding: var(--ya-space-5); }
/* Cards on a surface section (or anywhere they must lift off the page): one elevation step up. */
.ya-card--raised { background: var(--ya-color-surface-raised); box-shadow: var(--ya-shadow-raised); }
.ya-input { background: var(--ya-color-surface-alt); color: var(--ya-color-text); border: 1px solid var(--ya-color-border-strong); border-radius: var(--ya-radius-md); }
.ya-divider { border: 0; border-top: 1px solid var(--ya-color-border); }  /* decorative only */
/* Status chip: always with a glyph and a text label. <span class="ya-chip" data-status="critical">⬣ CRITICAL</span> */
.ya-chip { display: inline-flex; align-items: center; gap: var(--ya-space-1); padding: 2px var(--ya-space-2); border: 1px solid currentColor;
  border-radius: var(--ya-radius-md); font: 600 var(--ya-text-caption-size)/1.4 var(--ya-font-mono); letter-spacing: .06em; }
.ya-chip[data-status="critical"] { color: var(--ya-alert-critical); background: var(--ya-chip-critical-bg); }
.ya-chip[data-status="serious"] { color: var(--ya-alert-serious); background: var(--ya-chip-serious-bg); }
.ya-chip[data-status="caution"] { color: var(--ya-alert-caution); background: var(--ya-chip-caution-bg); }
.ya-chip[data-status="normal"] { color: var(--ya-alert-normal); background: var(--ya-chip-normal-bg); }
.ya-chip[data-status="standby"] { color: var(--ya-alert-standby); background: var(--ya-chip-standby-bg); }
.ya-chip[data-status="off"] { color: var(--ya-alert-off); background: var(--ya-chip-off-bg); }