:root {
  color-scheme: light dark;

  --color-bg: light-dark(oklch(0.965 0.018 78), oklch(0.175 0.02 54));
  --color-surface: light-dark(oklch(0.99 0.01 78), oklch(0.22 0.022 54));
  --color-surface-2: light-dark(oklch(0.925 0.025 76), oklch(0.27 0.024 54));
  --color-ink: light-dark(oklch(0.205 0.025 54), oklch(0.95 0.015 78));
  --color-ink-soft: light-dark(oklch(0.41 0.025 56), oklch(0.76 0.02 74));
  --color-line: light-dark(oklch(0.78 0.028 72), oklch(0.36 0.024 54));
  --color-line-dark: oklch(0.38 0.025 56);
  --color-accent: light-dark(oklch(0.49 0.17 34), oklch(0.72 0.16 42));
  --color-accent-hover: light-dark(oklch(0.44 0.17 34), oklch(0.77 0.145 42));
  --color-accent-active: light-dark(oklch(0.4 0.16 34), oklch(0.81 0.13 42));
  --color-accent-fg: light-dark(oklch(0.985 0.012 78), oklch(0.18 0.025 54));
  --color-accent-on-dark: oklch(0.78 0.14 42);
  --color-dark: oklch(0.19 0.025 53);
  --color-dark-2: oklch(0.235 0.027 53);
  --color-light: oklch(0.965 0.018 78);
  --color-light-soft: oklch(0.79 0.027 74);
  --color-focus: oklch(0.5 0.18 250);
  --color-success: oklch(0.52 0.13 150);

  --font-sans: Inter, Aptos, "Segoe UI", Arial, sans-serif;
  --font-serif: Georgia, "Times New Roman", serif;
  --font-mono: "SFMono-Regular", Consolas, monospace;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 650;
  --weight-bold: 800;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: clamp(1.75rem, 1.28rem + 2vw, 3rem);
  --text-3xl: clamp(2.6rem, 1.46rem + 4.85vw, 6.6rem);
  --text-project: clamp(1.45rem, 1.2rem + 0.9vw, 2.1rem);

  --spacing: 0.25rem;
  --space-section: clamp(4.5rem, 3rem + 6vw, 8.5rem);
  --container-page: 82rem;
  --container-prose: 43rem;
  --card-min: 19rem;
  --header-height: 4.5rem;
  --control-md: 2.75rem;
  --control-lg: 3.25rem;
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --radius-full: 9999px;
  --border-width: 1px;
  --focus-width: 3px;
  --focus-offset: 3px;
  --shadow-card: 0 1rem 3rem oklch(0.18 0.02 50 / 0.12);

  --dur-micro: 120ms;
  --dur-micro-exit: 90ms;
  --dur-ui: 240ms;
  --dur-ui-exit: 170ms;
  --dur-large: 520ms;
  --dur-large-exit: 340ms;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in: cubic-bezier(0.55, 0, 1, 0.45);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --shift-sm: 0.25rem;
  --shift-md: 0.75rem;
  --shift-lg: 1.5rem;
  --scale-card: 1.015;
  --rotate-card: 2deg;
  --ticker-distance: -50%;
  --z-sticky: 10;
  --z-skip: 20;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-micro: 0ms;
    --dur-micro-exit: 0ms;
    --dur-ui: 0ms;
    --dur-ui-exit: 0ms;
    --dur-large: 0ms;
    --dur-large-exit: 0ms;
    --shift-sm: 0rem;
    --shift-md: 0rem;
    --shift-lg: 0rem;
    --scale-card: 1;
    --rotate-card: 0deg;
  }
}