:root {
  color-scheme: light;

  --color-bench: #f1f3f2;
  --color-surface: #ffffff;
  --color-ink: #12181a;
  --color-ink-soft: #5c6b68;
  --color-grid: #dce4e2;
  --color-match: #0b6f6e;
  --color-match-bg: #dcefef;
  --color-diverge: #c23b2e;
  --color-diverge-bg: #f6deda;
  --color-pending: #8a6b1e;
  --color-pending-bg: #f3ead2;
  --color-slate: #5b6663;
  --color-slate-bg: #e7eae8;
  --color-overlay: rgb(18 24 26 / 38%);
  --color-focus: #0e7c7b;

  --font-display: "Space Grotesk", "Avenir Next", sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;

  --radius-1: 4px;
  --radius-2: 6px;
  --radius-3: 8px;
  --radius-4: 10px;
  --radius-5: 12px;
  --radius-pill: 999px;

  --shadow-shell: 0 12px 36px rgb(18 24 26 / 8%);
  --shadow-dialog: 0 24px 64px rgb(18 24 26 / 18%);

  --sidebar-width: 236px;
  --sidebar-width-collapsed: 60px;
  --header-height: 64px;
  --content-max-width: 1440px;
  --motion-fast: 160ms;
}