/* malkasem — design tokens.
 *
 * GENERATED from designs/malkasem/site.css lines 5-52 — the two :root blocks, verbatim.
 * Do not hand-edit: re-run artifacts/extract_tokens.py instead.
 *
 * This file holds custom properties ONLY. Structure lives in components.css, so a
 * direction swap (modern <-> editorial) is a token-file replacement, not a rewrite.
 *
 * Source hash: 4503f8362fc1648f
 */

:root {
  color-scheme: light;
  --bg:      oklch(99% 0.002 240);
  --surface: oklch(100% 0 0);
  --fg:      oklch(18% 0.012 250);
  --muted:   oklch(50% 0.014 250);
  --meta:    oklch(58% 0.014 250);
  --border:  oklch(92% 0.005 250);
  --accent:  oklch(58% 0.18 255);
  --accent-hover: oklch(51% 0.17 255);
  --on-accent:    oklch(100% 0 0);
  --paper:   oklch(100% 0 0);
  --ink:     oklch(18% 0.014 250);
  --accent-soft: color-mix(in oklch, var(--accent) 14%, transparent);
  --fg-soft:     color-mix(in oklch, var(--fg) 6%, transparent);
  --font-display: -apple-system, BlinkMacSystemFont, 'SF Pro Display', system-ui, sans-serif;
  --font-body:    -apple-system, BlinkMacSystemFont, 'SF Pro Text', system-ui, sans-serif;
  --font-mono:    ui-monospace, 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  --fs-h1: clamp(40px, 5.5vw, 68px);
  --fs-h2: clamp(30px, 4vw, 44px);
  --fs-h3: 20px;
  --fs-lead: 19px;
  --fs-body: 16px;
  --fs-meta: 13px;
  --gap-sm: 12px;
  --gap-md: 20px;
  --gap-lg: 32px;
  --gap-xl: 56px;
  --gap-2xl: 96px;
  --container: 1120px;
  --gutter: 32px;
  --radius: 10px;
  --radius-lg: 16px;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg:      oklch(17% 0.012 250);
  --surface: oklch(21% 0.012 250);
  --fg:      oklch(95% 0.004 250);
  --muted:   oklch(75% 0.012 250);
  --meta:    oklch(70% 0.012 250);
  --border:  oklch(30% 0.012 250);
  --accent:  oklch(70% 0.15 255);
  --accent-hover: oklch(76% 0.13 255);
  --on-accent:    oklch(17% 0.012 250);
  --paper:   oklch(99% 0.002 240);
  --accent-soft: color-mix(in oklch, var(--accent) 20%, transparent);
}