/* Colors — Blue Hour palette.
   Base ramp = literal brand hexes. Semantic aliases below map roles.
   Discipline: mostly Twilight + Clarity; Glow used sparingly so it reads as light.
   Glow is ACCENT/DISPLAY only — never small body text on light (fails AA). */
:root {
  /* --- Base ramp --- */
  --twilight: #131A2E;      /* primary dark base — hero, dark sections, nav */
  --midnight: #0A0F1C;      /* deepest — footer, overlays, depth */
  --glow: #F4B860;          /* primary warm accent — the light; CTAs, highlights */
  --glow-bright: #FFD89A;   /* luminous highlight — focus, the light-line */
  --clarity: #F7F9FB;       /* clean near-white — daytime bg, body text on dark */
  --sky: #E8F0F7;           /* pale tint — light section fills */
  --ink: #1A2233;           /* body/heading text on light surfaces */
  --muted: #5B6675;         /* secondary text, captions, labels */

  /* Support tints derived from the ramp (harmonious, not new hues) */
  --twilight-raise: #1B233B;   /* elevated dark card surface */
  --twilight-border: #2A3350;  /* hairline divider on dark */
  --glow-soft: #F4B86022;      /* glow at low alpha — subtle warm fills */
  --ink-08: #1A22331A;         /* borders/dividers on light */
  --ink-05: #1A22330D;         /* faint fills on light */

  /* --- Semantic aliases --- */
  /* Surfaces */
  --surface-dark: var(--twilight);
  --surface-darkest: var(--midnight);
  --surface-dark-raise: var(--twilight-raise);
  --surface-light: var(--clarity);
  --surface-light-tint: var(--sky);
  --surface-card-light: #FFFFFF;
  --surface-card-dark: var(--twilight-raise);

  /* Text */
  --text-on-dark: var(--clarity);
  --text-on-dark-muted: #A7B0C0;
  --text-on-light: var(--ink);
  --text-muted: var(--muted);
  --text-accent: var(--glow);

  /* Accent + interaction */
  --accent: var(--glow);
  --accent-bright: var(--glow-bright);
  --accent-hover: #F6C071;     /* glow, lightened for hover on fill */
  --accent-press: #E5A84C;     /* glow, darkened for press */

  /* Borders */
  --border-on-dark: var(--twilight-border);
  --border-on-dark-warm: #F4B86033;  /* subtle warm border on dark cards */
  --border-on-light: var(--ink-08);

  /* Focus ring */
  --focus-ring: var(--glow-bright);
}
