/* DarkSignal · tokens · theme "Instrument"
 * Cool laboratory paper, journal serif display, mono readouts, one indigo
 * accent kept deliberately distinct from the chart series hues.
 * Bridges onto the docs-platform shell (families/docs-platform.css v1.0).
 *
 * Chart colours are the dataviz reference palette, validated all-pairs for the
 * three slots used (light: worst CVD dE 9.2, normal 24.0; dark: 9.4 / 20.9).
 * Dark values are SELECTED steps for the dark surface, not an inversion.
 */
:root {
  color-scheme: light;
  --color-paper:    oklch(97.8% 0.004 250);
  --color-paper-2:  oklch(95.2% 0.006 250);
  --color-paper-3:  oklch(91.8% 0.008 250);
  --color-rule:     oklch(87.0% 0.008 250);
  --color-rule-2:   oklch(77.0% 0.010 250);
  --color-neutral:  oklch(58.0% 0.012 250);
  --color-muted:    oklch(43.0% 0.014 250);
  --color-ink-2:    oklch(33.0% 0.016 255);
  --color-ink:      oklch(20.0% 0.018 258);

  --color-accent:      oklch(43.0% 0.120 280);
  --color-accent-ink:  oklch(36.0% 0.120 280);
  --color-accent-soft: oklch(94.0% 0.025 280);
  --color-focus:       oklch(50.0% 0.170 280);

  /* status: reserved, always shipped with an icon + label */
  --color-good: #0ca30c;
  --color-warn: #b87a00;
  --color-crit: #d03b3b;

  /* chart palette — light steps */
  --chart-surface: #fcfcfb;
  --chart-grid:    #e1e0d9;
  --chart-axis:    #c3c2b7;
  --chart-muted:   #898781;
  --series-1: #2a78d6;
  --series-2: #eb6834;
  --series-3: #1baf7a;
  --series-grey: #c3c2b7;
  --rho-1: #86b6ef;
  --rho-2: #2a78d6;
  --rho-3: #104281;
  --div-lo:  #2a78d6;
  --div-mid: #f0efec;
  --div-hi:  #e34948;
  --seq-lo:  #e6f0fc;
  --seq-hi:  #0d366b;

  --font-display: "Source Serif 4", ui-serif, Georgia, serif;
  --font-body: "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.9375rem;
  --text-md: 1.0625rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 1.9rem;
  --text-3xl: 2.4rem;
  --text-display: 3.4rem;

  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4.5rem;

  --rule-hair: 1px;
  --radius-sm: 2px;
  --radius-md: 4px;
  --measure: 68ch;
  --page-gutter: clamp(1rem, 4vw, 2.5rem);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --color-paper:    oklch(17.5% 0.008 255);
    --color-paper-2:  oklch(21.0% 0.010 255);
    --color-paper-3:  oklch(25.0% 0.012 255);
    --color-rule:     oklch(31.0% 0.012 255);
    --color-rule-2:   oklch(41.0% 0.014 255);
    --color-neutral:  oklch(63.0% 0.012 250);
    --color-muted:    oklch(77.0% 0.010 250);
    --color-ink-2:    oklch(86.0% 0.008 250);
    --color-ink:      oklch(95.0% 0.006 250);
    --color-accent:      oklch(78.0% 0.100 280);
    --color-accent-ink:  oklch(84.0% 0.090 280);
    --color-accent-soft: oklch(28.0% 0.050 280);
    --color-focus:       oklch(80.0% 0.140 280);
    --color-good: #0ca30c;
    --color-warn: #fab219;
    --color-crit: #e66767;
    --chart-surface: #1a1a19;
    --chart-grid:    #2c2c2a;
    --chart-axis:    #383835;
    --chart-muted:   #898781;
    --series-1: #3987e5;
    --series-2: #d95926;
    --series-3: #199e70;
    --series-grey: #55544f;
    --rho-1: #1c5cab;
    --rho-2: #3987e5;
    --rho-3: #9ec5f4;
    --div-lo:  #3987e5;
    --div-mid: #383835;
    --div-hi:  #e66767;
    --seq-lo:  #1d2633;
    --seq-hi:  #9ec5f4;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-paper:    oklch(17.5% 0.008 255);
  --color-paper-2:  oklch(21.0% 0.010 255);
  --color-paper-3:  oklch(25.0% 0.012 255);
  --color-rule:     oklch(31.0% 0.012 255);
  --color-rule-2:   oklch(41.0% 0.014 255);
  --color-neutral:  oklch(63.0% 0.012 250);
  --color-muted:    oklch(77.0% 0.010 250);
  --color-ink-2:    oklch(86.0% 0.008 250);
  --color-ink:      oklch(95.0% 0.006 250);
  --color-accent:      oklch(78.0% 0.100 280);
  --color-accent-ink:  oklch(84.0% 0.090 280);
  --color-accent-soft: oklch(28.0% 0.050 280);
  --color-focus:       oklch(80.0% 0.140 280);
  --color-good: #0ca30c;
  --color-warn: #fab219;
  --color-crit: #e66767;
  --chart-surface: #1a1a19;
  --chart-grid:    #2c2c2a;
  --chart-axis:    #383835;
  --chart-muted:   #898781;
  --series-1: #3987e5;
  --series-2: #d95926;
  --series-3: #199e70;
  --series-grey: #55544f;
  --rho-1: #1c5cab;
  --rho-2: #3987e5;
  --rho-3: #9ec5f4;
  --div-lo:  #3987e5;
  --div-mid: #383835;
  --div-hi:  #e66767;
  --seq-lo:  #1d2633;
  --seq-hi:  #9ec5f4;
}