/* Ship Marine AI design tokens.
   Night is the default theme. Day applies when <html data-theme="light">.
   Every colour in the platform must come from these variables. */
:root, [data-theme="dark"] {
  --bg: #071526;
  --bg-alt: #091A2E;
  --surface: #0C2036;
  --surface-raised: #0E2238;
  --sidebar: #0A1A2D;
  --header: rgba(7, 21, 38, 0.86);
  --input: #0A1B2E;
  --chip: rgba(230, 238, 244, 0.06);
  --row-hover: rgba(230, 238, 244, 0.035);
  --track: #1A3049;
  --rule: #16304A;
  --line: #1E3550;
  --line-strong: #22405F;
  --line-soft: #1A3049;
  --ink: #E6EEF4;
  --ink-nav: #B7C6D5;
  --ink-muted: #9DB0C3;
  --ink-dim: #8397AD;
  --accent: #3FD2C0;
  --accent-soft: rgba(63, 210, 192, 0.12);
  --accent-line: rgba(63, 210, 192, 0.45);
  --accent-border: rgba(63, 210, 192, 0.55);
  --on-accent: #04131C;
  --ai: #2CCFC0;
  --ok: #4ADE80;
  --ok-soft: rgba(74, 222, 128, 0.1);
  --ok-line: rgba(74, 222, 128, 0.4);
  --bad: #FCA5A5;
  --bad-soft: rgba(248, 113, 113, 0.1);
  --bad-line: rgba(248, 113, 113, 0.42);
  --warn: #FCD34D;
  --warn-soft: rgba(251, 191, 36, 0.08);
  --warn-line: rgba(251, 191, 36, 0.38);
  --info: #7DD3FC;
  --info-soft: rgba(56, 189, 248, 0.08);
  --info-line: rgba(56, 189, 248, 0.32);
  --ref: #C4B5FD;
  --ref-soft: rgba(167, 139, 250, 0.1);
  --ref-line: rgba(167, 139, 250, 0.38);
  --soon: #4ADE80;
  --soon-soft: rgba(74, 222, 128, 0.1);
  --soon-line: rgba(74, 222, 128, 0.45);
  --focus-ring: var(--accent);
  color-scheme: dark;
}
[data-theme="light"] {
  --bg: #F6F8FA;
  --bg-alt: #EDF2F6;
  --surface: #FFFFFF;
  --surface-raised: #FFFFFF;
  --sidebar: #FFFFFF;
  --header: rgba(246, 248, 250, 0.88);
  --input: #FFFFFF;
  --chip: #EDF2F6;
  --row-hover: #F3F7FA;
  --track: #E3EAF0;
  --rule: #DCE4EB;
  --line: #D6E0E8;
  --line-strong: #CBD6E0;
  --line-soft: #DCE4EB;
  --ink: #0B2340;
  --ink-nav: #3E5470;
  --ink-muted: #4A5F77;
  --ink-dim: #5D7189;
  --accent: #087F75;
  --accent-soft: rgba(8, 127, 117, 0.12);
  --accent-line: rgba(8, 127, 117, 0.45);
  --accent-border: rgba(8, 127, 117, 0.55);
  --on-accent: #FFFFFF;
  --ai: #0A9488;
  --ok: #15803D;
  --ok-soft: rgba(21, 128, 61, 0.08);
  --ok-line: rgba(21, 128, 61, 0.35);
  --bad: #B42318;
  --bad-soft: rgba(180, 35, 24, 0.07);
  --bad-line: rgba(180, 35, 24, 0.32);
  --warn: #8A4B08;
  --warn-soft: #FDF6E7;
  --warn-line: rgba(180, 100, 9, 0.35);
  --info: #0B5C8A;
  --info-soft: #EEF6FB;
  --info-line: rgba(11, 92, 138, 0.25);
  --ref: #5B3FA8;
  --ref-soft: rgba(91, 63, 168, 0.08);
  --ref-line: rgba(91, 63, 168, 0.3);
  --soon: #15803D;
  --soon-soft: rgba(21, 128, 61, 0.08);
  --soon-line: rgba(21, 128, 61, 0.45);
  --focus-ring: var(--accent);
  color-scheme: light;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-2-5: 10px;
  --space-3: 12px;
  --space-3-5: 14px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --radius-xs: 5px;
  --radius-sm: 7px;
  --radius-md: 8px;
  --radius-input: 10px;
  --radius-tile: 12px;
  --radius-notice: 14px;
  --radius-card: 16px;
  --radius-pill: 999px;
  --sidebar-width: 272px;
  --sidebar-collapsed: 72px;
  --header-height: 100px;
  --content-max: 1200px;
  --control-height: 46px;
  --control-height-sm: 38px;
  --chip-height: 40px;
  --target-min: 44px;
  --shadow-tab: 0 1px 2px rgba(0, 0, 0, 0.18);
  --font-display: "Newsreader", Georgia, serif;
  --font-sans: "IBM Plex Sans", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;
}

/* Type styles (sizes are the desktop values; page-title and display styles use clamp() in ship-marine-ai.css) */
.t-display-hero { font-family: var(--font-display); font-size: 80px; line-height: 1.02; font-weight: 400; letter-spacing: -0.025em; }
.t-display-section { font-family: var(--font-display); font-size: 52px; line-height: 1.08; font-weight: 400; letter-spacing: -0.02em; }
.t-page-title { font-family: var(--font-display); font-size: 52px; line-height: 1.05; font-weight: 400; letter-spacing: -0.02em; }
.t-section-title { font-family: var(--font-sans); font-size: 20px; line-height: 1.3; font-weight: 600; letter-spacing: -0.005em; }
.t-subsection { font-family: var(--font-sans); font-size: 15px; line-height: 1.4; font-weight: 600; }
.t-lead { font-family: var(--font-sans); font-size: 17px; line-height: 1.6; font-weight: 400; }
.t-kicker { font-family: var(--font-sans); font-size: 15px; line-height: 1.4; font-weight: 500; }
.t-body { font-family: var(--font-sans); font-size: 15px; line-height: 1.55; font-weight: 400; }
.t-table { font-family: var(--font-sans); font-size: 14.5px; line-height: 1.45; font-weight: 400; }
.t-nav { font-family: var(--font-sans); font-size: 15px; line-height: 1.3; font-weight: 400; }
.t-sub-nav { font-family: var(--font-sans); font-size: 14px; line-height: 1.3; font-weight: 400; }
.t-label { font-family: var(--font-sans); font-size: 13px; line-height: 1.4; font-weight: 600; }
.t-hint { font-family: var(--font-sans); font-size: 13px; line-height: 1.55; font-weight: 400; }
.t-pill { font-family: var(--font-sans); font-size: 12.5px; line-height: 1.35; font-weight: 600; }
.t-badge { font-family: var(--font-sans); font-size: 12px; line-height: 1.35; font-weight: 500; }
.t-code { font-family: var(--font-mono); font-size: 13px; line-height: 1.5; font-weight: 400; }