/* JL Digital — Nocturne tokens (night-crossing redesign; type ratified to
   Nocturne v3, 2026-08-15).
   Fonts are self-hosted to match the CSP (font-src 'self'): the brand-spec
   pair restored from the original brand foundation (git c931b7a) —
   fraunces-600.woff2 (display serif, variable optical size 9–144) and
   public-sans.woff2 (body/UI, variable weight 100–900). Exactly two files,
   61.9kb total — the two-file lock holds; never add a third family. */

@font-face {
  font-family: "Fraunces";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/fraunces-600.woff2") format("woff2");
}
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  /* Variable range — one file carries real weights 100–900, no faux bold. */
  font-weight: 100 900;
  font-display: swap;
  src: url("../assets/fonts/public-sans.woff2") format("woff2");
}

:root {
  --color-bg: #161826;
  --color-surface: #232532;
  --color-text: #e9e9ed;
  --color-accent: #9184d9;
  /* F27: was color-mix(in srgb, #e9e9ed 16%, transparent). Dividers are
     structural (card edges, hairlines) — on an old Android WebView without
     color-mix support they'd vanish entirely, so this one token stays as a
     plain rgba. Identical colour, universal support. */
  --color-divider: rgba(233, 233, 237, 0.16);

  /* F47: the hero's signature night-gradient hexes, promoted from magic
     numbers in main.css so the night scene is tuned in one place.
     deep = zenith at the very top, mid = the warm band above the horizon,
     low = the darkest edge where the sky meets the panel. */
  --color-night-deep: #0d0e18;
  /* T13 (Nocturne v3): was #1a1d33 — below perceptual threshold against the
     #161826 page on most panels, so the "night gradient" read as flat black.
     One visible step bluer/brighter; deep and low stay put so the zenith
     and the horizon edge keep their darkness. */
  --color-night-mid: #202440;
  --color-night-low: #10121f;

  --color-neutral-100: #f3f5fe;
  --color-neutral-200: #e4e7f5;
  --color-neutral-300: #cfd3e5;
  --color-neutral-400: #b2b6ca;
  --color-neutral-500: #9397ab;
  --color-neutral-600: #75798c;
  --color-neutral-700: #595d6c;
  --color-neutral-800: #3f424d;
  --color-neutral-900: #292b31;

  --color-accent-100: #f5f4ff;
  --color-accent-200: #e7e5fe;
  --color-accent-300: #d2cefd;
  --color-accent-400: #b5abfc;
  --color-accent-500: #968ae0;
  --color-accent-600: #796cbf;
  --color-accent-700: #5d5294;
  --color-accent-800: #423a6a;
  --color-accent-900: #2b2741;

  /* F12: was #262a60 — a noticeably bluer, brighter slab that hue-jumped
     against the #161826 page. Pulled ~55% of the way toward the page bg
     (color-mix(in srgb, #161826 55%, #262a60) ≈ #1d2040, stored as a literal
     so the token itself never depends on color-mix support). The band now
     reads as "deeper night", not "different site". The glow keeps its old
     value so the radial highlight still lifts the band's focal corner. */
  --color-section: #1d2040;
  --color-section-glow: #353b80;

  /* Nocturne v3 type register: the serif is the voice (headlines, the big
     step numerals, pull quotes — what Jun *says*), the sans is the machine
     (body, buttons, tags, nav — what the site *does*). --font-heading stays
     the UI-chrome token so .btn/.brand/.channel rules read unchanged; only
     the elements that consume --font-display change voice. */
  --font-display: "Fraunces", Georgia, serif;
  --font-heading: "Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;

  --shadow-sm: 0 0 0 1px #3f424d;
  --shadow-md: 0 0 0 1px #595d6c, 0 6px 18px rgba(0, 0, 0, 0.55);
  --shadow-lg: 0 0 0 1px #9397ab, 0 16px 40px rgba(0, 0, 0, 0.65);

  --pad-x: clamp(20px, 5vw, 72px);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}