/* =====================================================================
   Time-of-day palette overrides — SCOPED TO HERO ONLY.

   The hero (<section id="top">) gets a tinted palette per TOD so the
   shader + hero chrome feel cohesive. The rest of the site always uses
   the default (night) palette from colors_and_type.css so nothing else
   gets washed in orange / pink / yellow.

   NOTE: because these only cascade inside #top, everything below the
   hero stays on the Direction A dark ink palette.
   ===================================================================== */

/* NIGHT — default. Deep navy-black, cool blue accent. */
[data-tod="night"] #top {
  --bg: #060814;
  --bg-elev-1: #0b0f1e;
  --bg-elev-2: #121729;
  --bg-elev-3: #1a2138;
  --accent: #6ea8ff;
  --accent-strong: #4a82e0;
  --accent-soft: #d4e3ff;
  --accent-ink: #050814;
  --border: color-mix(in oklab, #c4d0ff 14%, transparent);
  --border-strong: color-mix(in oklab, #c4d0ff 28%, transparent);
}

/* SUNRISE — warm amber-gold */
[data-tod="sunrise"] #top {
  --bg: #140d0a;
  --bg-elev-1: #1c1410;
  --bg-elev-2: #251b15;
  --bg-elev-3: #30241c;
  --fg: #fdf3e1;
  --fg-1: #fdf3e1;
  --fg-2: #f0e2c7;
  --fg-3: #d9c8a4;
  --fg-4: #a89471;
  --accent: #ffc857;
  --accent-strong: #f0a93a;
  --accent-soft: #fff1c7;
  --accent-ink: #1a1108;
  --border: color-mix(in oklab, #ffe9b8 16%, transparent);
  --border-strong: color-mix(in oklab, #ffe9b8 32%, transparent);
}

/* DAY — bright yellow-gold on dark ink (still dark for readability) */
[data-tod="day"] #top {
  --bg: #0f1018;
  --bg-elev-1: #171823;
  --bg-elev-2: #1f2130;
  --bg-elev-3: #282a3c;
  --fg: #fefcec;
  --fg-1: #fefcec;
  --fg-2: #f2efd8;
  --fg-3: #d4d0a8;
  --fg-4: #9a967a;
  --accent: #f8d347;
  --accent-strong: #e0b620;
  --accent-soft: #fff7c7;
  --accent-ink: #1a1608;
  --border: color-mix(in oklab, #fff4a8 14%, transparent);
  --border-strong: color-mix(in oklab, #fff4a8 28%, transparent);
}

/* SUNSET — deep orange → magenta */
[data-tod="sunset"] #top {
  --bg: #120812;
  --bg-elev-1: #1a0d18;
  --bg-elev-2: #22121e;
  --bg-elev-3: #2d1926;
  --fg: #fde4dc;
  --fg-1: #fde4dc;
  --fg-2: #f4c8b8;
  --fg-3: #d9a188;
  --fg-4: #a4715c;
  --accent: #ff7a3d;
  --accent-strong: #e85a2a;
  --accent-soft: #ffd4bc;
  --accent-ink: #180604;
  --border: color-mix(in oklab, #ffc4a8 16%, transparent);
  --border-strong: color-mix(in oklab, #ffc4a8 32%, transparent);
}
