/* Generated from /design-system/tokens.json. */
/* Do not edit directly. Run `npm run tokens:build`. */

@layer ds.reset, ds.tokens, ds.base, ds.components, ds.utilities, ds.overrides;

@layer ds.tokens {
  :root {
    color-scheme: light dark;

    --ds-color-neutral-0: oklch(99.2% 0.004 84);
    --ds-color-neutral-100: oklch(95.3% 0.010 84);
    --ds-color-neutral-200: oklch(92.4% 0.013 84);
    --ds-color-neutral-300: oklch(86.4% 0.016 84);
    --ds-color-neutral-400: oklch(74.2% 0.017 76);
    --ds-color-neutral-50: oklch(97.2% 0.007 84);
    --ds-color-neutral-500: oklch(61.0% 0.017 70);
    --ds-color-neutral-600: oklch(49.0% 0.016 63);
    --ds-color-neutral-700: oklch(36.6% 0.015 59);
    --ds-color-neutral-800: oklch(25.4% 0.012 56);
    --ds-color-neutral-900: oklch(17.2% 0.010 54);
    --ds-color-neutral-950: oklch(12.0% 0.008 52);

    --ds-color-brand-400: oklch(74.2% 0.104 44);
    --ds-color-brand-500: oklch(56.8% 0.118 38);
    --ds-color-brand-600: oklch(48.6% 0.109 36);
    --ds-color-brand-700: oklch(40.6% 0.094 34);

    --ds-color-green-400: oklch(73.3% 0.150 161.5);
    --ds-color-green-500: oklch(50.6% 0.142 152.4);
    --ds-color-green-550: oklch(45.6% 0.131 154.1);
    --ds-color-red-400: oklch(72.9% 0.169 34.1);
    --ds-color-red-500: oklch(54.8% 0.176 32.7);
    --ds-color-red-550: oklch(65.8% 0.173 31.4);
    --ds-color-blue-400: oklch(75.9% 0.124 258.4);
    --ds-color-blue-500: oklch(56.3% 0.241 260.8);
    --ds-color-accent-code: oklch(95.8% 0.012 91.5);
    --ds-color-accent-onColorDark: oklch(15.9% 0.004 84.6);
    --ds-color-accent-onColorLight: oklch(100.0% 0.000 89.9);
    --ds-color-accent-soft: oklch(88.1% 0.032 65.9);

    --ds-font-family-serif: "Instrument Serif", Georgia, serif;
    --ds-font-family-sans: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --ds-font-family-mono: "Geist Mono", ui-monospace, "SF Mono", monospace;

    --ds-font-size-2xl: clamp(1.3125rem, 1.20rem + 0.55vw, 1.5rem);
    --ds-font-size-3xl: clamp(1.75rem, 1.52rem + 1.10vw, 2.25rem);
    --ds-font-size-4xl: clamp(2.5rem, 2.10rem + 1.95vw, 3.5rem);
    --ds-font-size-5xl: clamp(3.5rem, 3.00rem + 2.40vw, 4.75rem);
    --ds-font-size-lg: clamp(1rem, 0.96rem + 0.24vw, 1.08rem);
    --ds-font-size-md: clamp(0.875rem, 0.84rem + 0.22vw, 0.95rem);
    --ds-font-size-sm: clamp(0.6875rem, 0.66rem + 0.14vw, 0.75rem);
    --ds-font-size-xl: clamp(1.125rem, 1.07rem + 0.30vw, 1.25rem);
    --ds-font-size-xs: clamp(0.625rem, 0.60rem + 0.12vw, 0.6875rem);
    --ds-font-size-f10: clamp(10px, 10px, 10px);
    --ds-font-size-f105: clamp(10.5px, 10.5px, 10.5px);
    --ds-font-size-f11: clamp(11px, 11px, 11px);
    --ds-font-size-f115: clamp(11.5px, 11.5px, 11.5px);
    --ds-font-size-f12: clamp(12px, 12px, 12px);
    --ds-font-size-f125: clamp(12.5px, 12.5px, 12.5px);
    --ds-font-size-f13: clamp(13px, 13px, 13px);
    --ds-font-size-f135: clamp(13.5px, 13.5px, 13.5px);
    --ds-font-size-f14: clamp(14px, 14px, 14px);
    --ds-font-size-f145: clamp(14.5px, 14.5px, 14.5px);
    --ds-font-size-f15: clamp(15px, 15px, 15px);
    --ds-font-size-f155: clamp(15.5px, 15.5px, 15.5px);
    --ds-font-size-f16: clamp(16px, 16px, 16px);
    --ds-font-size-f165: clamp(16.5px, 16.5px, 16.5px);
    --ds-font-size-f17: clamp(17px, 17px, 17px);
    --ds-font-size-f175: clamp(17.5px, 17.5px, 17.5px);
    --ds-font-size-f18: clamp(18px, 18px, 18px);
    --ds-font-size-f19: clamp(19px, 19px, 19px);
    --ds-font-size-f20: clamp(20px, 20px, 20px);
    --ds-font-size-f21: clamp(21px, 21px, 21px);
    --ds-font-size-f22: clamp(22px, 22px, 22px);
    --ds-font-size-f23: clamp(23px, 23px, 23px);
    --ds-font-size-f30: clamp(30px, 30px, 30px);
    --ds-font-size-f9: clamp(9px, 9px, 9px);
    --ds-font-size-f95: clamp(9.5px, 9.5px, 9.5px);

    --ds-line-height-body: 1.55;
    --ds-line-height-heading: 1.08;
    --ds-line-height-loose: 1.65;
    --ds-line-height-tight: 1.04;

    --ds-font-weight-bold: 700;
    --ds-font-weight-medium: 500;
    --ds-font-weight-regular: 400;
    --ds-font-weight-semibold: 600;

    --ds-font-tracking-normal: 0em;
    --ds-font-tracking-tight: -0.02em;
    --ds-font-tracking-wide: 0.04em;

    --ds-space-1: 4px;
    --ds-space-10: 40px;
    --ds-space-12: 48px;
    --ds-space-16: 64px;
    --ds-space-2: 8px;
    --ds-space-20: 80px;
    --ds-space-24: 96px;
    --ds-space-3: 12px;
    --ds-space-30: 120px;
    --ds-space-4: 16px;
    --ds-space-5: 20px;
    --ds-space-6: 24px;
    --ds-space-8: 32px;
    --ds-space-x10: 10px;
    --ds-space-x104: 104px;
    --ds-space-x11: 11px;
    --ds-space-x128: 128px;
    --ds-space-x14: 14px;
    --ds-space-x140: 140px;
    --ds-space-x144: 144px;
    --ds-space-x15: 15px;
    --ds-space-x160: 160px;
    --ds-space-x18: 18px;
    --ds-space-x180: 180px;
    --ds-space-x2: 2px;
    --ds-space-x200: 200px;
    --ds-space-x22: 22px;
    --ds-space-x26: 26px;
    --ds-space-x28: 28px;
    --ds-space-x3: 3px;
    --ds-space-x30: 30px;
    --ds-space-x36: 36px;
    --ds-space-x40: 40px;
    --ds-space-x44: 44px;
    --ds-space-x5: 5px;
    --ds-space-x52: 52px;
    --ds-space-x56: 56px;
    --ds-space-x6: 6px;
    --ds-space-x7: 7px;
    --ds-space-x72: 72px;
    --ds-space-x88: 88px;
    --ds-space-x9: 9px;

    --ds-radius-2xl: 32px;
    --ds-radius-full: 999px;
    --ds-radius-lg: 18px;
    --ds-radius-md: 12px;
    --ds-radius-sm: 8px;
    --ds-radius-xl: 24px;
    --ds-radius-xs: 4px;

    --ds-motion-duration-arrive: 800ms;
    --ds-motion-duration-base: 200ms;
    --ds-motion-duration-fast: 160ms;
    --ds-motion-duration-glide: 750ms;
    --ds-motion-duration-intent: 150ms;
    --ds-motion-duration-leisure: 500ms;
    --ds-motion-duration-micro: 140ms;
    --ds-motion-duration-overlay: 1000ms;
    --ds-motion-duration-page: 900ms;
    --ds-motion-duration-quick: 180ms;
    --ds-motion-duration-reveal: 600ms;
    --ds-motion-duration-scene: 700ms;
    --ds-motion-duration-settle: 400ms;
    --ds-motion-duration-slow: 300ms;
    --ds-motion-duration-toast: 260ms;
    --ds-motion-duration-toggle: 240ms;
    --ds-motion-duration-track: 220ms;
    --ds-motion-duration-view: 420ms;
    --ds-motion-duration-normal: var(--ds-motion-duration-base);

    --ds-motion-easing-curtain: cubic-bezier(0.76, 0, 0.24, 1);
    --ds-motion-easing-expo: cubic-bezier(0.16, 1, 0.3, 1);
    --ds-motion-easing-quint: cubic-bezier(0.22, 1, 0.36, 1);
    --ds-motion-easing-spring: cubic-bezier(0.32, 0.72, 0, 1);
    --ds-motion-easing-spring-out: cubic-bezier(0.34, 1.56, 0.64, 1);
    --ds-motion-easing-standard: var(--ds-motion-easing-expo);

    --ds-shadow-lg: 0 0 0 1px rgb(20 18 16 / 8%), 0 8px 20px -4px rgb(20 18 16 / 10%), 0 24px 48px -12px rgb(20 18 16 / 12%);
    --ds-shadow-md: 0 0 0 1px rgb(20 18 16 / 6%), 0 2px 6px -1px rgb(20 18 16 / 6%), 0 8px 20px -8px rgb(20 18 16 / 8%);
    --ds-shadow-sm: 0 0 0 1px rgb(20 18 16 / 5%), 0 1px 2px -1px rgb(20 18 16 / 5%);
    --ds-shadow-xs: 0 0 0 1px rgb(20 18 16 / 4%);
  }

  :root {
    --ds-semantic-color-background-page: light-dark(oklch(99.2% 0.004 84), oklch(12.0% 0.008 52));
    --ds-semantic-color-background-raised: light-dark(oklch(97.2% 0.007 84), oklch(17.2% 0.010 54));
    --ds-semantic-color-background-sunken: light-dark(oklch(95.3% 0.010 84), oklch(12.0% 0.008 52));
    --ds-semantic-color-background-overlay: light-dark(rgba(250, 248, 243, 0.72), rgba(14, 13, 11, 0.72));
    --ds-semantic-color-surface-code: light-dark(oklch(95.8% 0.012 91.5), oklch(17.2% 0.010 54));

    --ds-semantic-color-text-primary: light-dark(oklch(17.2% 0.010 54), oklch(97.2% 0.007 84));
    --ds-semantic-color-text-secondary: light-dark(oklch(36.6% 0.015 59), oklch(92.4% 0.013 84));
    --ds-semantic-color-text-muted: light-dark(oklch(49.0% 0.016 63), oklch(86.4% 0.016 84));
    --ds-semantic-color-text-subtle: light-dark(oklch(74.2% 0.017 76), oklch(61.0% 0.017 70));

    --ds-semantic-color-action-primary: light-dark(oklch(56.8% 0.118 38), oklch(74.2% 0.104 44));
    --ds-semantic-color-action-soft: light-dark(oklch(88.1% 0.032 65.9), rgba(217, 142, 108, 0.14));
    --ds-semantic-color-action-glow: light-dark(rgba(139, 58, 30, 0.08), rgba(217, 142, 108, 0.10));

    --ds-semantic-color-border-base: light-dark(rgba(20, 18, 16, 0.08), rgba(244, 239, 228, 0.08));
    --ds-semantic-color-border-strong: light-dark(rgba(20, 18, 16, 0.18), rgba(244, 239, 228, 0.16));
    --ds-semantic-color-focus-ring: light-dark(oklch(56.8% 0.118 38), oklch(74.2% 0.104 44));

    --ds-semantic-color-status-success: light-dark(oklch(50.6% 0.142 152.4), oklch(73.3% 0.150 161.5));
    --ds-semantic-color-status-success-strong: light-dark(oklch(45.6% 0.131 154.1), oklch(73.3% 0.150 161.5));
    --ds-semantic-color-status-danger: light-dark(oklch(54.8% 0.176 32.7), oklch(72.9% 0.169 34.1));
    --ds-semantic-color-status-danger-strong: light-dark(oklch(54.8% 0.176 32.7), oklch(65.8% 0.173 31.4));
    --ds-semantic-color-status-info: light-dark(oklch(56.3% 0.241 260.8), oklch(75.9% 0.124 258.4));
    --ds-semantic-color-status-on-color: light-dark(oklch(100.0% 0.000 89.9), oklch(15.9% 0.004 84.6));
  }

  :root[data-theme="light"] { color-scheme: light; }
  :root[data-theme="dark"]  { color-scheme: dark; }

  :root {
    --ds-component-nav-height: 68px;
    --ds-component-nav-height-compact: 60px;
    --ds-component-nav-background: var(--ds-semantic-color-background-overlay);
    --ds-component-button-radius: var(--ds-radius-md);
    --ds-component-button-background: var(--ds-semantic-color-background-raised);
    --ds-component-button-foreground: var(--ds-semantic-color-text-primary);
    --ds-component-card-radius: var(--ds-radius-lg);
    --ds-component-card-surface: var(--ds-semantic-color-background-raised);
    --ds-component-loader-duration: var(--ds-motion-duration-overlay);
    --ds-component-loader-easing: var(--ds-motion-easing-curtain);
    --ds-component-focus-ring: 0 0 0 2px var(--ds-semantic-color-focus-ring);
    --ds-component-badge-radius: var(--ds-radius-full);
    --ds-component-badge-background: var(--ds-semantic-color-action-soft);
    --ds-component-badge-foreground: var(--ds-semantic-color-text-primary);
    --ds-component-badge-border: var(--ds-semantic-color-border-base);
    --ds-component-tag-radius: var(--ds-radius-full);
    --ds-component-tag-background: var(--ds-semantic-color-background-raised);
    --ds-component-tag-foreground: var(--ds-semantic-color-text-secondary);
    --ds-component-tag-border: var(--ds-semantic-color-border-base);
    --ds-component-alert-radius: var(--ds-radius-md);
    --ds-component-alert-background: var(--ds-semantic-color-background-raised);
    --ds-component-alert-foreground: var(--ds-semantic-color-text-primary);
    --ds-component-alert-border: var(--ds-semantic-color-border-base);
    --ds-layout-content-max-width: 1200px;
  }
}
