/* Every custom property of the site, once. Names follow DESIGN.md; head.html links this
   sheet first, so every other sheet reads these and defines none. */
:root {
  --canvas: #ffffff;
  --surface: #f6f6f5;
  --surface-2: #ffffff;
  --surface-3: #e9e9e8;
  --inverse: #0a0a0b;
  --inverse-ink: #fafafa;
  --inverse-muted: #a1a1aa;
  --inverse-accent: #23c088;
  --inverse-warning: #d6a13c;
  --ink: #0a0a0b;
  --body: #3d3d40;
  --muted: #6a6a6e;
  --hairline: #e6e6e4;
  --hairline-strong: #d8d8d6;
  --accent: #0c7253;
  --accent-strong: #0b6249;
  --accent-ink: #ffffff;
  --accent-dim: color-mix(in srgb, var(--accent) 15%, transparent);
  --accent-fog: color-mix(in srgb, var(--accent) 8%, transparent);
  --warning: #8a5a12;
  --warning-fog: color-mix(in srgb, var(--warning) 8%, transparent);
  --danger: #bf3529;
  --danger-weak: #f8e7e4;
  --font-display: 'Sora', system-ui, sans-serif;
  --font-body: 'Sora', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 9999px;
  --max-width: 1200px;
  --sidebar-width: 260px;
  --ease-stiff: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 140ms;
  --duration-mid: 280ms;
}

[data-theme="dark"] {
  --canvas: #08080a;
  --surface: #131315;
  --surface-2: #1b1b1e;
  --surface-3: #232327;
  --inverse: #050506;
  --inverse-ink: #fafafa;
  --inverse-muted: #a1a1aa;
  --inverse-accent: #23c088;
  --inverse-warning: #d6a13c;
  --ink: #fafafa;
  --body: #bcbcc0;
  --muted: #8e8e93;
  --hairline: #262629;
  --hairline-strong: #34343a;
  --accent: #23c088;
  --accent-strong: #1fa878;
  --accent-ink: #06120d;
  --accent-dim: color-mix(in srgb, var(--accent) 15%, transparent);
  --accent-fog: color-mix(in srgb, var(--accent) 8%, transparent);
  --warning: #d6a13c;
  --warning-fog: color-mix(in srgb, var(--warning) 10%, transparent);
  --danger: #f0776b;
  --danger-weak: #2a1512;
}