/* dotdotQ design tokens. Source of truth: CLAUDE.md section 3.
   Edit here, then run scripts/make_brand.ps1 to copy into website/. */

:root {
  /* dark theme (default) */
  --bg: #030303;            /* page */
  --surface: #111111;       /* cards, panels */
  --surface-2: #222222;     /* raised rows, hover */
  --border: #222222;
  --border-strong: #333333;
  --text: #d1d1db;          /* body */
  --text-strong: #ffffff;   /* headings, key numbers */
  --text-secondary: #9ca3af;
  --text-muted: #6c6b80;    /* labels, captions */
  --brand: #001BFF;         /* FILLS ONLY: buttons, bars, highlights */
  --brand-text: #0067ff;    /* text, lines and icons on dark */
  --brand-soft: #4e8af4;    /* positive deltas, secondary accents */
  --brand-deep: #142fbd;    /* accent borders */
  --selected: #121127;      /* selected row / card background */
  --alert: #EB3163;         /* ONLY for things needing attention */
  --neutral-series: #4c4b63;/* comparison series, last-period data */

  /* type */
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* shape */
  --radius: 6px;
  --radius-sm: 3px;
}

[data-theme="light"] {
  --bg: #F1F1F1;
  --surface: #ffffff;
  --surface-2: #e9eaec;
  --border: #dedede;
  --border-strong: #d1d1db;
  --text: #121127;
  --text-strong: #030303;
  --text-secondary: #4c4b63;
  --text-muted: #6c6b80;
  --brand: #001BFF;
  --brand-text: #001BFF;
  --brand-soft: #0067ff;
  --brand-deep: #142fbd;
  --selected: #e6e9ff;
  --alert: #EB3163;
  --neutral-series: #9d9d9d;
}