/* Design tokens. Warm paper in light mode, a quiet graphite in dark mode. */
:root {
  --font: ui-sans-serif, -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI', Inter, Roboto, 'Helvetica Neue', sans-serif;
  --mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  --bg: #f4f3ee;
  --surface: #ffffff;
  --surface-2: #faf9f5;
  --ink: #1f1e1b;
  --ink-2: #4d4a44;
  --muted: #8b877d;
  --line: #e7e4db;
  --line-2: #d9d5c9;

  --accent: #3b4cca;
  --accent-ink: #2d3bab;
  --accent-soft: #e9ecfb;
  --violet: #7a4dd8;
  --violet-soft: #f0eafb;
  --amber: #d98a00;
  --amber-soft: #fdf1d6;
  --green: #1f9d6b;
  --red: #d64545;
  --red-soft: #fbe9e9;

  --edge: #8b93a9;
  --dot: #d3cfc3;

  --shadow-1: 0 1px 2px rgba(31, 30, 27, 0.07), 0 0 0 0.5px rgba(31, 30, 27, 0.04);
  --shadow-2: 0 8px 24px rgba(31, 30, 27, 0.12), 0 2px 6px rgba(31, 30, 27, 0.06);
  --shadow-3: 0 22px 60px rgba(31, 30, 27, 0.26), 0 4px 12px rgba(31, 30, 27, 0.1);

  --radius: 10px;
  --topbar-h: 52px;
  --sidebar-w: 276px;
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}

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

@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --bg: #151513;
    --surface: #1e1d1a;
    --surface-2: #191816;
    --ink: #ecebe4;
    --ink-2: #c5c2b8;
    --muted: #8f8b80;
    --line: #2c2a25;
    --line-2: #3a3731;

    --accent: #93a3ff;
    --accent-ink: #b7c1ff;
    --accent-soft: #262b54;
    --violet: #b79bff;
    --violet-soft: #2e2548;
    --amber: #f0b44a;
    --amber-soft: #38300f;
    --green: #4cc590;
    --red: #f08080;
    --red-soft: #3d2222;

    --edge: #6d7388;
    --dot: #2b2923;

    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4), 0 0 0 0.5px rgba(255, 255, 255, 0.04);
    --shadow-2: 0 8px 24px rgba(0, 0, 0, 0.5), 0 2px 6px rgba(0, 0, 0, 0.3);
    --shadow-3: 0 22px 60px rgba(0, 0, 0, 0.65), 0 4px 12px rgba(0, 0, 0, 0.4);
    color-scheme: dark;
  }
}