:root {
  --ink-0:    oklch(98% 0.005 80);
  --ink-50:   oklch(96% 0.008 80);
  --ink-100:  oklch(92% 0.012 80);
  --ink-200:  oklch(86% 0.015 80);
  --ink-300:  oklch(78% 0.018 80);
  --ink-400:  oklch(68% 0.020 80);
  --ink-500:  oklch(56% 0.020 80);
  --ink-600:  oklch(46% 0.020 80);
  --ink-700:  oklch(36% 0.020 80);
  --ink-800:  oklch(26% 0.020 80);
  --ink-900:  oklch(18% 0.020 80);
  --ink-1000: oklch(10% 0.020 80);

  --accent-300: oklch(72% 0.14 28);
  --accent-500: oklch(54% 0.18 28);
  --accent-600: oklch(48% 0.20 28);
  --accent-700: oklch(42% 0.20 28);

  --bias-western:     oklch(50% 0.18 260);
  --bias-non-aligned: oklch(56% 0.04 80);
  --bias-adversarial: oklch(56% 0.20 28);

  --status-positive: oklch(56% 0.16 150);
  --status-warning:  oklch(72% 0.16 80);
  --status-error:    oklch(56% 0.22 28);
  --status-info:     oklch(56% 0.16 240);

  --ink-0-d:    oklch(12% 0.005 80);
  --ink-50-d:   oklch(16% 0.008 80);
  --ink-100-d:  oklch(22% 0.012 80);
  --ink-200-d:  oklch(28% 0.015 80);
  --ink-300-d:  oklch(46% 0.018 80);
  --ink-400-d:  oklch(56% 0.020 80);
  --ink-500-d:  oklch(68% 0.020 80);
  --ink-600-d:  oklch(78% 0.020 80);
  --ink-700-d:  oklch(86% 0.020 80);
  --ink-800-d:  oklch(92% 0.020 80);
  --ink-900-d:  oklch(94% 0.020 80);
  --ink-1000-d: oklch(98% 0.020 80);

  --accent-300-d: oklch(72% 0.18 28);
  --accent-500-d: oklch(64% 0.20 28);
  --accent-600-d: oklch(56% 0.20 28);
  --accent-700-d: oklch(48% 0.20 28);

  --color-bg:            var(--ink-0);
  --color-bg-elevated:   var(--ink-50);
  --color-bg-inset:      var(--ink-100);
  --color-bg-overlay:    oklch(0% 0 0 / 0.5);
  --color-text:          var(--ink-900);
  --color-text-strong:   var(--ink-1000);
  --color-text-muted:    var(--ink-500);
  --color-text-subtle:   var(--ink-300);
  --color-text-inverse:  var(--ink-0);
  --color-border:        oklch(0% 0 0 / 0.10);
  --color-border-strong: oklch(0% 0 0 / 0.20);
  --color-accent:        var(--accent-500);
  --color-accent-hover:  var(--accent-600);
  --color-accent-text:   var(--ink-0);
  --color-bias-western:     var(--bias-western);
  --color-bias-non-aligned: var(--bias-non-aligned);
  --color-bias-adversarial: var(--bias-adversarial);
  --color-positive: var(--status-positive);
  --color-warning:  var(--status-warning);
  --color-error:    var(--status-error);
  --color-info:     var(--status-info);

  --font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    'DM Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --fs-xs:   13px;
  --fs-sm:   14px;
  --fs-base: 16px;
  --fs-md:   18px;
  --fs-lg:   20px;
  --fs-xl:   24px;
  --fs-2xl:  32px;
  --fs-3xl:  44px;
  --fs-4xl:  64px;

  --lh-tight:  1.2;
  --lh-snug:   1.35;
  --lh-normal: 1.5;
  --lh-loose:  1.6;

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  --space-1:  4px;
  --space-2:  8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;

  --radius-sm:   4px;
  --radius:      8px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-pill: 999px;

  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast:    120ms;
  --dur:         200ms;
  --dur-slow:    320ms;

  --max-w-prose:  680px;
  --max-w-feed:   1080px;
  --max-w-grid:   1200px;
  --max-w-bleed:  1440px;
  --gutter:       var(--space-4);
  --touch-target: 44px;

  --shadow-sm:  0 1px 2px oklch(0% 0 0 / 0.05);
  --shadow:     0 2px 8px oklch(0% 0 0 / 0.08);
  --shadow-lg:  0 8px 24px oklch(0% 0 0 / 0.12);

  --z-base:      1;
  --z-elevated:  10;
  --z-sticky:    100;
  --z-modal:     1000;
  --z-toast:     2000;

  color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg:            var(--ink-0-d);
    --color-bg-elevated:   var(--ink-50-d);
    --color-bg-inset:      var(--ink-100-d);
    --color-text:          var(--ink-900-d);
    --color-text-strong:   var(--ink-1000-d);
    --color-text-muted:    var(--ink-500-d);
    --color-text-subtle:   var(--ink-300-d);
    --color-text-inverse:  var(--ink-0-d);
    --color-border:        oklch(100% 0 0 / 0.10);
    --color-border-strong: oklch(100% 0 0 / 0.20);
    --color-accent:        var(--accent-500-d);
    --color-accent-hover:  var(--accent-600-d);
  }
}

[data-theme="dark"] {
  --color-bg:            var(--ink-0-d);
  --color-bg-elevated:   var(--ink-50-d);
  --color-bg-inset:      var(--ink-100-d);
  --color-text:          var(--ink-900-d);
  --color-text-strong:   var(--ink-1000-d);
  --color-text-muted:    var(--ink-500-d);
  --color-text-subtle:   var(--ink-300-d);
  --color-text-inverse:  var(--ink-0-d);
  --color-border:        oklch(100% 0 0 / 0.10);
  --color-border-strong: oklch(100% 0 0 / 0.20);
  --color-accent:        var(--accent-500-d);
  --color-accent-hover:  var(--accent-600-d);
}

[data-theme="light"] {
  --color-bg:            var(--ink-0);
  --color-bg-elevated:   var(--ink-50);
  --color-bg-inset:      var(--ink-100);
  --color-text:          var(--ink-900);
  --color-text-strong:   var(--ink-1000);
  --color-text-muted:    var(--ink-500);
  --color-text-subtle:   var(--ink-300);
  --color-text-inverse:  var(--ink-0);
  --color-border:        oklch(0% 0 0 / 0.10);
  --color-border-strong: oklch(0% 0 0 / 0.20);
  --color-accent:        var(--accent-500);
  --color-accent-hover:  var(--accent-600);
}
