/* Generated from design-system/tokens.json. */
:root {
  --c-ink-900: #050508;
  --c-ink-800: #0c0c12;
  --c-ink-700: #12121a;
  --c-ink-600: #1a1a24;
  --c-ink-500: #222230;
  --c-ink-400: #2a2a3a;
  --c-ink-300: #3a3a4a;
  --c-ink-200: #404050;
  --c-ink-150: #888890;
  --c-ink-100: #9090a0;
  --c-ink-050: #c8c8d0;
  --c-ink-025: #f0f0f5;
  --c-cream-500: #ffffff;
  --c-cream-400: #fafaf7;
  --c-cream-300: #f5f5f0;
  --c-cream-200: #f0f0ec;
  --c-cream-100: #e5e5e0;
  --c-cream-050: #d4d4cf;
  --c-red-500: #ff3b3b;
  --c-red-400: #ff6b6b;
  --c-red-glow: rgba(255, 59, 59, 0.25);
  --c-red-dim: rgba(255, 59, 59, 0.6);
  --c-red-subtle: rgba(255, 59, 59, 0.1);
  --c-red-border: rgba(255, 59, 59, 0.2);
  --text-primary: var(--c-ink-025);
  --text-secondary: var(--c-ink-050);
  --text-muted: var(--c-ink-100);
  --text-faint: #a2a2b0;
  --text-fainter: #a2a2b0;
  --bg-base: var(--c-ink-900);
  --bg-stripe: var(--c-ink-700);
  --bg-elevated: var(--c-ink-800);
  --surface: var(--c-ink-600);
  --surface-elevated: var(--c-ink-500);
  --surface-glass: rgba(26, 26, 36, 0.6);
  --surface-card: linear-gradient(145deg, rgba(26, 26, 36, 0.8) 0%, rgba(12, 12, 18, 0.9) 100%);
  --border-default: var(--c-ink-400);
  --border-subtle: var(--c-ink-300);
  --border-strong: var(--c-ink-200);
  --border-glow: var(--c-red-border);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5);
  --shadow-card: 0 8px 40px rgba(0, 0, 0, 0.4), 0 0 30px var(--c-red-subtle);
  --shadow-glow-red: 0 0 30px var(--c-red-glow);
  --shadow-glow-red-intense: 0 0 50px rgba(255, 59, 59, 0.5);
  --navbar-bg: rgba(5, 5, 8, 0.8);
  --navbar-bg-scrolled: rgba(5, 5, 8, 0.95);
  --navbar-border: rgba(255, 255, 255, 0.1);
  --mobile-overlay-bg: rgba(0, 0, 0, 0.7);
  --hero-bg: radial-gradient(ellipse at 50% 0%, #1a1a2e 0%, #050508 70%);
  --hero-grid: rgba(255, 255, 255, 0.03);
  --body-grid: rgba(127, 127, 127, 0.04);
  --accent-red: #ff3b3b;
  --accent-red-dim: var(--c-red-dim);
  --accent-red-btn: #c8302e;
  --accent-red-glow: var(--c-red-glow);
  --accent-red-subtle: var(--c-red-subtle);
  --gradient-silver: linear-gradient(135deg, #f0f0f5 0%, #b7b7c4 100%);
  --gradient-hero: var(--hero-bg);
  --gradient-red: linear-gradient(135deg, #ff3b3b 0%, #ff6b6b 100%);
  --gradient-card: var(--surface-card);
  --silver-100: var(--text-primary);
  --silver-200: var(--text-secondary);
  --silver-300: var(--text-muted);
  --silver-400: var(--text-faint);
  --silver-500: var(--text-fainter);
  --silver-600: #2a2a3a;
  --bg-primary: var(--bg-base);
  --bg-secondary: var(--bg-elevated);
  --bg-tertiary: var(--bg-stripe);
  --border: var(--border-default);
  --border-light: var(--border-subtle);
  --font-heading: 'Space Grotesk', 'Inter', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;
  --space-section: 80px;
  --container-max: 1200px;
  --container-narrow: 760px;
  --border-radius-sm: 8px;
  --border-radius-md: 12px;
  --border-radius-lg: 16px;
  --border-radius-xl: 24px;
  --border-radius: 8px;
  --transition-fast: 150ms ease;
  --transition-base: 200ms ease;
  --transition-slow: 300ms ease;
  --transition-slower: 500ms ease-out;
  --z-base: 1;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-fixed: 300;
  --z-modal: 400;
  --z-tooltip: 500;
  --type-display: clamp(2.8rem, 5.5vw, 4.7rem);
  --type-page: clamp(2.4rem, 5vw, 4.25rem);
  --type-body: 1rem;
  --type-small: 0.875rem;
  --control-min: 44px;
  --reading-measure: 68ch;
  --focus-ring: 2px solid var(--text-primary);
  --hero-offset: 128px;
  --hero-offset-mobile: 112px;
  --hero-measure: 900px;
  --space-section-mobile: 48px;
  --card-cover-height: 120px;
  --accent-text: #ff3b3b;
  --type-display-mobile: clamp(2.3rem, 8vw, 3.5rem);
}
:root[data-theme="light"] {
  --text-primary: #1a1a1f;
  --text-secondary: #2e2e35;
  --text-muted: #5e5751;
  --text-faint: #68615b;
  --text-fainter: #68615b;
  --bg-base: var(--c-cream-400);
  --bg-stripe: var(--c-cream-200);
  --bg-elevated: var(--c-cream-500);
  --surface: var(--c-cream-500);
  --surface-elevated: var(--c-cream-500);
  --surface-glass: rgba(255, 255, 255, 0.85);
  --surface-card: linear-gradient(145deg, #ffffff 0%, #fafaf7 100%);
  --border-default: var(--c-cream-100);
  --border-subtle: var(--c-cream-050);
  --border-strong: #b0a89e;
  --border-glow: rgba(255, 59, 59, 0.18);
  --shadow-sm: 0 2px 8px rgba(20, 20, 31, 0.05);
  --shadow-md: 0 4px 16px rgba(20, 20, 31, 0.08);
  --shadow-lg: 0 8px 32px rgba(20, 20, 31, 0.10);
  --shadow-card: 0 8px 40px rgba(20, 20, 31, 0.08), 0 0 30px rgba(255, 59, 59, 0.06);
  --shadow-glow-red: 0 0 30px rgba(255, 59, 59, 0.20);
  --shadow-glow-red-intense: 0 0 50px rgba(255, 59, 59, 0.30);
  --navbar-bg: rgba(255, 255, 255, 0.85);
  --navbar-bg-scrolled: rgba(255, 255, 255, 0.95);
  --navbar-border: rgba(20, 20, 31, 0.08);
  --mobile-overlay-bg: rgba(20, 20, 31, 0.5);
  --hero-bg: radial-gradient(ellipse at 50% 0%, #ffffff 0%, #f0f0ec 70%);
  --hero-grid: rgba(20, 20, 31, 0.05);
  --body-grid: rgba(20, 20, 31, 0.04);
  --gradient-silver: linear-gradient(135deg, #1a1a1f 0%, #5e5751 100%);
  --gradient-hero: var(--hero-bg);
  --gradient-card: var(--surface-card);
  --accent-red: #ff3b3b;
  --accent-red-btn: #b52b29;
  --accent-text: #b52b29;
}