/**
 * Theme: Day / Night
 * Body class .theme-light (default) or .theme-dark overrides design tokens.
 * Used with js/theme.js; persist choice in localStorage.
 */

/* ─── Light (default) ─── */
body.theme-light,
body:not(.theme-dark) {
  --white: #fafaf8;
  --off: #f2f0ea;
  --off2: #e8e4db;
  --off3: #d4cfc3;
  --ink: #0d0d0b;
  --ink2: #1c1c19;
  --text: #42423d;
  --muted: #8a8a82;
  --gold: #9e7b3a;
  --gold2: #c49a4a;
  --gold3: #e8c870;
  --bg-hero: #0d0d0b;
  --bg-ticker: #0d0d0b;
  --bg-vessel: #0d0d0b;
  --bg-markets: #1c1c19;
}

/* ─── Dark ─── */
body.theme-dark {
  --white: #0d0d0b;
  --off: #1a1a18;
  --off2: #242420;
  --off3: #2e2e2a;
  --ink: #fafaf8;
  --ink2: #e8e4db;
  --text: #c4c4be;
  --muted: #8a8a82;
  --gold: #c49a4a;
  --gold2: #e8c870;
  --gold3: #f0d878;
  --bg-hero: #0a0a09;
  --bg-ticker: #0a0a09;
  --bg-vessel: #0a0a09;
  --bg-markets: #121210;
}

/* Ensure hero/vessel/ticker use theme-aware bg when possible */
.hero { background-color: var(--bg-hero) !important; }
.ticker { background-color: var(--bg-ticker) !important; }
.vessel { background-color: var(--bg-vessel) !important; }
.markets { background-color: var(--bg-markets) !important; }

/* Site is always dark: keep nav scrolled state dark (override inline nav.s) */
body.theme-dark nav.s,
nav.s {
  background: rgba(13, 13, 11, 0.92) !important;
  backdrop-filter: saturate(180%) blur(20px);
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}
body.theme-dark nav.s .nlogo,
nav.s .nlogo { color: var(--ink) !important; }
body.theme-dark nav.s .nlinks a,
nav.s .nlinks a { color: rgba(255, 255, 255, 0.65) !important; }
body.theme-dark nav.s .ncta,
nav.s .ncta { border-color: rgba(196, 154, 74, 0.6) !important; color: var(--gold2) !important; }