/* ── Signal palette ───────────────────────────────────────────────────────────
   Substrate is a WARM near-black (hue 90): never blue-black.
   Signal is acid lime; Flare is amber. Both share L 0.86 so they read as one
   family. Accents are for edges, ticks, small type and one primary button -
   never for body copy on dark.
   Dark is the default theme; [data-theme="light"] is the paper counterpart.
   ─────────────────────────────────────────────────────────────────────────── */

:root {
  /* base ramp: warm neutral */
  --ink-1000: oklch(0.12 0.006 90);
  --ink-950: oklch(0.158 0.007 90);
  --ink-900: oklch(0.196 0.008 90);
  --ink-850: oklch(0.232 0.008 90);
  --ink-800: oklch(0.28 0.009 90);
  --ink-700: oklch(0.36 0.009 90);
  --ink-600: oklch(0.48 0.008 90);
  --ink-500: oklch(0.6 0.008 90);
  --ink-400: oklch(0.72 0.007 90);
  --ink-300: oklch(0.83 0.006 90);
  --ink-200: oklch(0.9 0.005 95);
  --ink-100: oklch(0.955 0.005 95);
  --ink-050: oklch(0.978 0.006 95);

  /* accents */
  --signal: oklch(0.86 0.19 128);
  --signal-dim: oklch(0.7 0.15 128);
  --signal-deep: oklch(0.5 0.13 128);
  --flare: oklch(0.86 0.15 60);
  --flare-deep: oklch(0.56 0.13 60);

  /* semantic */
  --danger: oklch(0.68 0.19 25);
  --info: oklch(0.8 0.1 220);

  /* ── dark theme (default) ── */
  --bg-page: var(--ink-1000);
  --bg-page-alt: var(--ink-950);
  --surface-card: var(--ink-900);
  --surface-raised: var(--ink-850);
  --surface-sunken: oklch(0.14 0.006 90);
  --surface-inverse: var(--ink-050);

  --border-hairline: oklch(0.3 0.009 90);
  --border-strong: oklch(0.4 0.009 90);
  --border-signal: oklch(0.86 0.19 128 / 0.45);

  --text-primary: oklch(0.965 0.006 95); /* 16.9:1 on --bg-page */
  --text-body: oklch(0.895 0.006 95); /*  13.6:1: long-form default */
  --text-secondary: oklch(0.78 0.007 90); /* 9.7:1 */
  --text-muted: oklch(0.655 0.008 90); /*  6.1:1: labels only */
  --text-on-signal: oklch(0.16 0.03 128);
  --text-signal: var(--signal);
  --text-flare: var(--flare);

  --focus-ring: var(--signal);
  --selection-bg: oklch(0.86 0.19 128 / 0.28);

  /* motif textures */
  --texture-dots: radial-gradient(
    var(--border-hairline) 1px,
    transparent 1.1px
  );
  --texture-dots-size: 14px 14px;
  --texture-grid: linear-gradient(
      to right,
      color-mix(in oklch, var(--border-hairline) 55%, transparent) 1px,
      transparent 1px
    ),
    linear-gradient(
      to bottom,
      color-mix(in oklch, var(--border-hairline) 55%, transparent) 1px,
      transparent 1px
    );
  --texture-grid-size: 64px 64px;

  /* gradients: used only behind heroes and on card edges */
  --grad-hero: radial-gradient(
      120% 90% at 8% -10%,
      oklch(0.86 0.19 128 / 0.16) 0%,
      transparent 55%
    ),
    radial-gradient(
      90% 70% at 100% 0%,
      oklch(0.86 0.15 60 / 0.1) 0%,
      transparent 60%
    );
  /* Richer three-wash version for hero surfaces only. */
  --grad-hero-rich: radial-gradient(
      100% 80% at 6% -12%,
      oklch(0.86 0.19 128 / 0.22) 0%,
      transparent 58%
    ),
    radial-gradient(
      80% 70% at 100% -6%,
      oklch(0.86 0.15 60 / 0.14) 0%,
      transparent 62%
    ),
    radial-gradient(
      70% 90% at 62% 118%,
      oklch(0.7 0.15 128 / 0.1) 0%,
      transparent 60%
    );
  --grad-edge: linear-gradient(
    90deg,
    var(--signal),
    color-mix(in oklch, var(--signal) 40%, var(--flare)) 55%,
    transparent
  );
}

[data-theme="light"] {
  --bg-page: var(--ink-050);
  --bg-page-alt: var(--ink-100);
  --surface-card: oklch(1 0 0);
  --surface-raised: oklch(1 0 0);
  --surface-sunken: var(--ink-100);
  --surface-inverse: var(--ink-1000);

  --border-hairline: oklch(0.88 0.005 95);
  --border-strong: oklch(0.78 0.006 95);
  --border-signal: oklch(0.5 0.13 128 / 0.4);

  --text-primary: oklch(0.19 0.008 90); /* 15.2:1 on paper */
  --text-body: oklch(0.245 0.009 90); /* 12.6:1 */
  --text-secondary: oklch(0.38 0.009 90); /* 7.9:1 */
  --text-muted: oklch(0.48 0.008 90); /*  5.4:1 */
  --text-on-signal: oklch(0.16 0.03 128);
  --text-signal: var(--signal-deep);
  --text-flare: var(--flare-deep);

  --focus-ring: var(--signal-deep);
  --selection-bg: oklch(0.86 0.19 128 / 0.4);

  --texture-dots: radial-gradient(oklch(0.8 0.006 95) 1px, transparent 1.1px);
  --grad-hero-rich: radial-gradient(
      100% 80% at 6% -12%,
      oklch(0.86 0.19 128 / 0.34) 0%,
      transparent 58%
    ),
    radial-gradient(
      80% 70% at 100% -6%,
      oklch(0.86 0.15 60 / 0.26) 0%,
      transparent 62%
    ),
    radial-gradient(
      70% 90% at 62% 118%,
      oklch(0.7 0.15 128 / 0.16) 0%,
      transparent 60%
    );
  --grad-hero: radial-gradient(
      120% 90% at 8% -10%,
      oklch(0.86 0.19 128 / 0.3) 0%,
      transparent 55%
    ),
    radial-gradient(
      90% 70% at 100% 0%,
      oklch(0.86 0.15 60 / 0.22) 0%,
      transparent 60%
    );
}