/*
 * Design tokens. Same system as the RAF Scatter docs (reference/DESIGN_REFERENCE.md, Part 1):
 * off-black / off-white neutrals, one desaturated violet accent, Geist + Geist Mono,
 * 12px containers, 8px controls, 4-6px small inline things. Nothing is pill-shaped.
 */

:root {
  color-scheme: dark;

  /* Neutrals: dark (default) */
  --bg: #111111;
  --surface: #191919;
  --hover: #262626;
  --line: #2a2a2a;
  --line-strong: #3d3d3d;
  --text: #f2f2f2;
  --text-body: #bdbdbd;
  --text-2: #8a8a8a;
  --text-muted: #666666;
  --well: #0a0a0a; /* image wells stay dark in both themes */
  --dot: #ffffff1c;
  --backdrop: #000000a6;
  --shadow-float: 0 1px 2px #0a0a0a4d, 0 8px 24px #0a0a0a59;

  /* One accent, used sparingly (tags, small washes) */
  --accent: #a48be0;
  --accent-text: #bba8eb;
  --accent-tint: #a48be014;

  /* Type */
  --font: 'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
  --text-sm: 0.875rem;
  --text-base: 0.9375rem;

  /* Shape */
  --radius: 12px;
  --radius-sm: 8px;
  --radius-xs: 6px;

  /* Layout */
  --gutter: 0.5rem;
  --sidebar-w: 18.75rem;
  --content-w: 42rem;

  /* Motion */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-io: cubic-bezier(0.45, 0, 0.55, 1);
}

:root[data-theme='light'] {
  color-scheme: light;

  --bg: #fcfcfb;
  --surface: #f2f2f1;
  --hover: #e8e8e7;
  --line: #e4e4e3;
  --line-strong: #cdcdcc;
  --text: #141414;
  --text-body: #3b3b3b;
  --text-2: #6b6b6b;
  --text-muted: #8f8f8f;
  --well: #0f0f0f;
  --dot: #1414141c;
  --backdrop: #1111114d;
  --shadow-float: 0 1px 2px #1414140f, 0 8px 24px #1414141a;

  --accent: #6f49bb;
  --accent-text: #5b36a6;
  --accent-tint: #6f49bb12;
}