/* GTK design tokens — editorial field-notes codex.
   Three tiers: primitives → semantic → component. Components reference semantic only.
   Light on bare :root; dark under [data-theme="dark"] + prefers-color-scheme fallback.
   All color values are hex: mermaid themeVariables are read from these at runtime. */

:root {
  color-scheme: light dark;

  /* ---- primitives: paper & ink ---- */
  --paper-50: #fffdf9;
  --paper-100: #f7f4ee;
  --paper-200: #f0ece3;
  --paper-300: #e5dfd2;
  --paper-400: #d8d0bf;
  --ink-900: #1f1b16;
  --ink-700: #433d33;
  --ink-500: #5f584d;
  --ink-300: #6a6355; /* ≥4.5:1 on every light surface (worst: 5.05 on --bg-inset) */
  --line-200: #e2dbcd;
  --line-400: #c8bfae;

  /* oxblood accent */
  --ox-600: #8c3626;
  --ox-700: #6e2a1e;
  --ox-300: #d98e70;
  --ox-200: #e8b39c;

  /* stage ramp (sequential, light surface: light → dark teal-green; lightness monotonic) */
  --stage-stub-l: #c6d9cd;
  --stage-seedling-l: #92bda3;
  --stage-budding-l: #5e9c7c;
  --stage-evergreen-l: #2c6e4f;
  /* stage ramp (dark surface: dark → light; lightness monotonic) */
  --stage-stub-d: #33453b;
  --stage-seedling-d: #47684f;
  --stage-budding-d: #5d8a6f;
  --stage-evergreen-d: #8dc2a3;

  /* ---- typography ---- */
  --font-prose: Charter, 'Bitstream Charter', 'Sitka Text', Cambria, Georgia, serif;
  --font-ui: system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: ui-monospace, 'SF Mono', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.0625rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 1.875rem;
  --text-3xl: 2.375rem;
  --leading-prose: 1.75;
  --leading-heading: 1.2;
  --leading-ui: 1.5;
  --leading-code: 1.65;
  --measure: 70ch;

  /* ---- spacing (8px grid, 4px substep) ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;

  /* ---- semantic: light ---- */
  --bg: var(--paper-100);
  --bg-raised: var(--paper-50);
  --bg-inset: var(--paper-200);
  --bg-hover: var(--paper-300);
  --text: var(--ink-900);
  --text-muted: var(--ink-500);
  --text-faint: var(--ink-300);
  --border: var(--line-200);
  --border-strong: var(--line-400);
  --accent: var(--ox-600);
  --accent-strong: var(--ox-700);
  --link: var(--ox-600);
  --link-hover: var(--ox-700);
  --mark-bg: #f3e3a5;
  --focus-ring: #8c3626;

  --stage-stub: var(--stage-stub-l);
  --stage-seedling: var(--stage-seedling-l);
  --stage-budding: var(--stage-budding-l);
  --stage-evergreen: var(--stage-evergreen-l);
  --stage-planned-border: var(--line-400);

  /* callouts: border / bg / label */
  --co-note-border: #7c8fae;   --co-note-bg: #eef1f6;   --co-note-fg: #3d5378;
  --co-tip-border: #5e9c7c;    --co-tip-bg: #eaf2ec;    --co-tip-fg: #2c6e4f;
  --co-warning-border: #c2903a;--co-warning-bg: #f8f0dd;--co-warning-fg: #8a5f14;
  --co-danger-border: #b5493a; --co-danger-bg: #f9e9e5; --co-danger-fg: #8c3626;
  --co-example-border: #8a7fae;--co-example-bg: #f0eef6;--co-example-fg: #58487e;
  --co-definition-border: #4e8a96; --co-definition-bg: #e8f1f2; --co-definition-fg: #2d616b;
  --co-intuition-border: #b0761f;  --co-intuition-bg: #faf1e0;  --co-intuition-fg: #7d5410;
  --co-gotcha-border: #a05275;     --co-gotcha-bg: #f7ecf1;     --co-gotcha-fg: #7a3455;

  /* diagram tokens (inline SVG + mermaid themeVariables source) */
  --dg-stroke: #433d33;
  --dg-fill-1: #eef1f6;
  --dg-fill-2: #eaf2ec;
  --dg-fill-3: #f8f0dd;
  --dg-accent: #8c3626;
  --dg-muted: #8a8275;

  /* importance */
  --imp-top: var(--ox-600);
}

/* ---- semantic: dark (explicit choice) ---- */
:root[data-theme='light'] { color-scheme: light; }

:root[data-theme='dark'] {
  color-scheme: dark;
  --bg: #171412;
  --bg-raised: #201c18;
  --bg-inset: #26211c;
  --bg-hover: #2e2822;
  --text: #e9e3d7;
  --text-muted: #aaa190;
  --text-faint: #998f80; /* ≥4.5:1 on every dark surface (worst: 5.01 on --bg-inset) */
  --border: #35302a;
  --border-strong: #4d463c;
  --accent: var(--ox-300);
  --accent-strong: var(--ox-200);
  --link: var(--ox-300);
  --link-hover: var(--ox-200);
  --mark-bg: #5c4d1a;
  --focus-ring: #d98e70;

  --stage-stub: var(--stage-stub-d);
  --stage-seedling: var(--stage-seedling-d);
  --stage-budding: var(--stage-budding-d);
  --stage-evergreen: var(--stage-evergreen-d);
  --stage-planned-border: #4d463c;

  --co-note-border: #7c8fae;   --co-note-bg: #212733;   --co-note-fg: #a9bcd9;
  --co-tip-border: #5d8a6f;    --co-tip-bg: #1f2b23;    --co-tip-fg: #9ecbb0;
  --co-warning-border: #c2903a;--co-warning-bg: #2f2717;--co-warning-fg: #dfb96a;
  --co-danger-border: #c05a49; --co-danger-bg: #301d18; --co-danger-fg: #e39a86;
  --co-example-border: #8a7fae;--co-example-bg: #262231;--co-example-fg: #bcb1dc;
  --co-definition-border: #58939f; --co-definition-bg: #1c2a2c; --co-definition-fg: #96c5cd;
  --co-intuition-border: #b0761f;  --co-intuition-bg: #2d2414;  --co-intuition-fg: #d8ab5e;
  --co-gotcha-border: #b06a8c;     --co-gotcha-bg: #2c1f26;     --co-gotcha-fg: #d8a2bd;

  --dg-stroke: #cfc7b8;
  --dg-fill-1: #212733;
  --dg-fill-2: #1f2b23;
  --dg-fill-3: #2f2717;
  --dg-accent: #d98e70;
  --dg-muted: #7d7466;

  --imp-top: var(--ox-300);
}

/* ---- semantic: dark (system preference, no explicit choice) ---- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --bg: #171412;
    --bg-raised: #201c18;
    --bg-inset: #26211c;
    --bg-hover: #2e2822;
    --text: #e9e3d7;
    --text-muted: #aaa190;
    --text-faint: #998f80; /* ≥4.5:1 on every dark surface (worst: 5.01 on --bg-inset) */
    --border: #35302a;
    --border-strong: #4d463c;
    --accent: var(--ox-300);
    --accent-strong: var(--ox-200);
    --link: var(--ox-300);
    --link-hover: var(--ox-200);
    --mark-bg: #5c4d1a;
    --focus-ring: #d98e70;

    --stage-stub: var(--stage-stub-d);
    --stage-seedling: var(--stage-seedling-d);
    --stage-budding: var(--stage-budding-d);
    --stage-evergreen: var(--stage-evergreen-d);
    --stage-planned-border: #4d463c;

    --co-note-border: #7c8fae;   --co-note-bg: #212733;   --co-note-fg: #a9bcd9;
    --co-tip-border: #5d8a6f;    --co-tip-bg: #1f2b23;    --co-tip-fg: #9ecbb0;
    --co-warning-border: #c2903a;--co-warning-bg: #2f2717;--co-warning-fg: #dfb96a;
    --co-danger-border: #c05a49; --co-danger-bg: #301d18; --co-danger-fg: #e39a86;
    --co-example-border: #8a7fae;--co-example-bg: #262231;--co-example-fg: #bcb1dc;
    --co-definition-border: #58939f; --co-definition-bg: #1c2a2c; --co-definition-fg: #96c5cd;
    --co-intuition-border: #b0761f;  --co-intuition-bg: #2d2414;  --co-intuition-fg: #d8ab5e;
    --co-gotcha-border: #b06a8c;     --co-gotcha-bg: #2c1f26;     --co-gotcha-fg: #d8a2bd;

    --dg-stroke: #cfc7b8;
    --dg-fill-1: #212733;
    --dg-fill-2: #1f2b23;
    --dg-fill-3: #2f2717;
    --dg-accent: #d98e70;
    --dg-muted: #7d7466;

    --imp-top: var(--ox-300);
  }
}