/**
 * Kit tokens — generated from tokens.json
 * Edit tokens.json via update-tokens or Design admin; do not treat this file as source of truth.
 */
:root {

  --color-fg: #1C1917;
  --color-fg-muted: #78716C;
  --color-bg: #FFFBF8;
  --color-bg-elevated: #FFFFFF;
  --color-border: #F0E6E0;
  --color-accent: #E11D48;
  --color-accent-hover: #BE123C;
  --color-accent-contrast: #FFFFFF;
  --color-focus: #E11D48;
  --color-wash: #FFE4E6;
  --color-sun: #FDBA74;
  --color-code-bg: #F7F0EC;

  --font-sans: "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  --font-display: "Space Grotesk", "IBM Plex Sans", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;

  --type-xs: 0.75rem;
  --type-sm: 0.875rem;
  --type-base: 1.0625rem;
  --type-md: 1.125rem;
  --type-lg: 1.375rem;
  --type-xl: 1.75rem;
  --type-2xl: 2.125rem;
  --type-3xl: 2.75rem;
  --type-4xl: 3.25rem;

  --space-3xs: 0.25rem;
  --space-2xs: 0.375rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 5.5rem;

  --radius-sm: 0.35rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;
  --radius-full: 9999px;

  --shadow-sm: 0 1px 2px rgba(28, 25, 23, 0.04);
  --shadow-md: 0 8px 24px rgba(28, 25, 23, 0.06);
  --shadow-lg: 0 18px 40px rgba(28, 25, 23, 0.08);

  --layout-max: 60rem;
  --layout-content: 40rem;
  --layout-gutter: 1.25rem;

  --breakpoint-sm: 40rem;
  --breakpoint-md: 48rem;
  --breakpoint-lg: 64rem;
  --breakpoint-xl: 80rem;
}