/*
 * Design tokens. Borrowed in spirit from Syto: a single source of truth for
 * colors/spacing/typography, themable by overriding the custom properties on
 * a [data-theme] root. Concrete values are placeholders pending the design pass.
 */
:root {
  /* Palette */
  --color-bg: #ffffff;
  --color-surface: #f7f7fa;
  --color-border: #e2e2ea;
  --color-text: #1a1a2e;
  --color-text-muted: #6b6b80;
  --color-accent: #3b5bdb;
  --color-accent-contrast: #ffffff;

  /* Status */
  --color-success: #2f9e44;
  --color-error: #e03131;
  --color-warning: #f08c00;
  --color-info: #1971c2;

  /* Typography */
  --font-sans: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: ui-monospace, 'SF Mono', 'Cascadia Code', Menlo, monospace;
  --font-size-base: 14px;

  /* Spacing scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;

  /* Layout */
  --header-height: 48px;
  --radius: 6px;
}

[data-theme='experimental'] {
  --color-bg: #16161f;
  --color-surface: #1f1f2c;
  --color-border: #2c2c3a;
  --color-text: #e8e8f0;
  --color-text-muted: #9a9ab0;
  --color-accent: #748ffc;
  --color-accent-contrast: #0b0b12;
}