/* v01-neon — token overrides. Electric blue and hot magenta on black: the
   two colours of a lit sign at night. Loaded after the shared tokens, and
   also by every deep-dive page (DEEPDIVE_VARIATION in scripts/lib/config.mjs),
   so this palette has to read well under long prose as well as under display
   type. Overrides only; no component is redeclared here. */

:root {
  --bg: #07070c;
  --surface: #101018;
  --surface-2: #15151f;
  --surface-3: #1b1b28;
  --border: #1d1d2a;
  --border-2: #4a4a63;
  --text: #f2f2f7;
  --text-dim: #a8a8c0;
  --text-faint: #8c8ca8;

  --accent: #3d7bff;
  --accent-hi: #86b4ff;
  --accent-2: #ff3ea5;
  --accent-2-hi: #ff86c6;
  --on-accent: #05050a;

  --font-display: var(--font-brand);
  --display-1: clamp(2.5rem, 6.4vw, 5.5rem);
  --display-2: clamp(1.75rem, 3.6vw, 3rem);

  --line: var(--border-2);
  --notch: 28px;
  --shadow-x: 9px;
  --shadow-y: 9px;
  --shadow-hover-x: 14px;
  --shadow-hover-y: 14px;

  --dot-color: color-mix(in srgb, var(--accent-hi) 20%, transparent);
  --dot-gap: 30px;
  --dot-parallax: 0.3;

  --dither-cell: 7px;
  --dither-tint: color-mix(in srgb, var(--accent) 55%, transparent);
  --dither-band-height: clamp(200px, 26vw, 400px);

  --crt-opacity: 0.12;
  --crt-vignette: 0.55;

  --arrow-color: var(--accent-2);
  --arrow-width: 6px;
  --arrow-dash: 20 14;
  --arrow-glow: color-mix(in srgb, var(--accent-2) 45%, transparent);
  --arrow-head: 24px;
}
