:root {
  --text-display: 36px;
  --text-display--line-height: 40px;
  --text-display--letter-spacing: -0.026em;
  --text-display--font-weight: 900;

  --text-heading-xl: 27px;
  --text-heading-xl--line-height: 32px;
  --text-heading-xl--letter-spacing: -0.02em;
  --text-heading-xl--font-weight: 750;

  --text-heading-lg: 22px;
  --text-heading-lg--line-height: 27px;
  --text-heading-lg--letter-spacing: -0.015em;
  --text-heading-lg--font-weight: 700;

  --text-heading-md: 18px;
  --text-heading-md--line-height: 24px;
  --text-heading-md--letter-spacing: -0.012em;
  --text-heading-md--font-weight: 600;

  --text-heading-sm: 16px;
  --text-heading-sm--line-height: 21px;
  --text-heading-sm--letter-spacing: -0.01em;
  --text-heading-sm--font-weight: 550;

  --text-heading-xs: 14px;
  --text-heading-xs--line-height: 19px;
  --text-heading-xs--letter-spacing: -0.006em;
  --text-heading-xs--font-weight: 650;

  --text-lede: 20px;
  --text-lede--line-height: 30px;
  --text-lede--letter-spacing: -0.004em;
  --text-lede--font-weight: 300;

  --text-body-lg: 18px;
  --text-body-lg--line-height: 27px;
  --text-body-lg--letter-spacing: 0em;
  --text-body-lg--font-weight: 400;

  --text-body: 16px;
  --text-body--line-height: 24px;
  --text-body--letter-spacing: -0.002em;
  --text-body--font-weight: 400;

  --text-body-sm: 15px;
  --text-body-sm--line-height: 21px;
  --text-body-sm--letter-spacing: -0.006em;
  --text-body-sm--font-weight: 400;

  --text-table: 15px;
  --text-table--line-height: 21px;
  --text-table--letter-spacing: -0.006em;
  --text-table--font-weight: 400;

  --text-data: 15px;
  --text-data--line-height: 21px;
  --text-data--letter-spacing: -0.006em;
  --text-data--font-weight: 550;

  --text-label: 14px;
  --text-label--line-height: 18px;
  --text-label--letter-spacing: -0.006em;
  --text-label--font-weight: 650;

  --text-caption: 13.5px;
  --text-caption--line-height: 19px;
  --text-caption--letter-spacing: 0em;
  --text-caption--font-weight: 500;

  --text-micro: 12px;
  --text-micro--line-height: 16px;
  --text-micro--letter-spacing: 0.01em;
  --text-micro--font-weight: 500;

  --text-code: 13px;
  --text-code--line-height: 20px;
  --text-code--letter-spacing: 0em;
  --text-code--font-weight: 400;

  --font-code: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  --text-overline: 12px;
  --text-overline--line-height: 16px;
  --text-overline--letter-spacing: 0.04em;
  --text-overline--font-weight: 700;

  --text-table-header: 12px;
  --text-table-header--line-height: 16px;
  --text-table-header--letter-spacing: 0.05em;
  --text-table-header--font-weight: 750;
}

:root {
  --dur-fast: 100ms;
  --dur-base: 150ms;
  --dur-moderate: 200ms;
  --dur-slow: 300ms;
  --dur-enter: 375ms;
  --dur-mark: 250ms;
  --dur-draw: 750ms;

  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-out: cubic-bezier(0, 0, 0, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-emphasized: cubic-bezier(0.3, 1.15, 0.4, 1);
}
@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur-base: 0ms; --dur-moderate: 0ms; --dur-slow: 0ms; --dur-enter: 0ms; --dur-mark: 0ms; --dur-draw: 0ms; }
}

:root {
  --n-0: #ffffff;
  --n-25: #fafbfc;
  --n-50: #f4f6f8;
  --n-100: #e9edf1;
  --n-200: #dce2e8;
  --n-300: #c2cad3;
  --n-400: #97a2ae;
  --n-500: #68727e;
  --n-600: #515b66;
  --n-700: #3a434e;
  --n-800: #232a32;
  --n-900: #141a20;
  --accent-deep: #1e293b;
  --accent-tint: #e8ecf1;
  --accent-ink: #ffffff;
  --success: #1b9e51;
  --success-tint: #e6f2ea;
  --info: #2f86d4;
  --info-tint: #e5eef7;
  --caution: #e8ae05;
  --caution-tint: #fbf2d7;
  --orange: #e67e22;
  --orange-tint: #fceee6;
  --critical: #d43f2e;
  --critical-tint: #f8e7e5;
  --status-neutral: #89929b;
  --status-neutral-tint: #eceff2;
  --sh-1: 0 1px 2px rgba(20, 26, 32, 0.06);
  --sh-2: 0 2px 8px rgba(20, 26, 32, 0.08), 0 1px 2px rgba(20, 26, 32, 0.06);
  --sh-3: 0 8px 28px rgba(20, 26, 32, 0.12);
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;

  --z-base: 0;
  --z-sticky: 20;
  --z-rail: 30;
  --z-dropdown: 40;
  --z-overlay: 50;
  --z-modal: 60;
  --z-popover: 70;
  --z-toast: 80;
  --z-tooltip: 90;

  --background: var(--n-0);
  --foreground: var(--n-700);
  --card: var(--n-0);
  --card-foreground: var(--n-700);
  --popover: var(--n-0);
  --popover-foreground: var(--n-800);
  --primary: #334155;
  --primary-foreground: var(--accent-ink);
  --secondary: var(--n-50);
  --secondary-foreground: var(--n-800);
  --muted: var(--n-50);
  --muted-foreground: var(--n-500);
  --accent: var(--accent-tint);
  --accent-foreground: var(--accent-deep);
  --destructive: var(--critical);
  --border: var(--n-200);
  --input: var(--n-300);
  --ring: var(--primary);
  --chart-1: var(--success);
  --chart-2: var(--info);
  --chart-3: var(--caution);
  --chart-4: var(--critical);
  --chart-5: var(--status-neutral);
  --sidebar: var(--n-25);
  --sidebar-foreground: var(--n-700);
  --sidebar-primary: var(--primary);
  --sidebar-primary-foreground: var(--accent-ink);
  --sidebar-accent: var(--accent-tint);
  --sidebar-accent-foreground: var(--accent-deep);
  --sidebar-border: var(--n-200);
  --sidebar-ring: var(--n-400);

  --feature-card-from: var(--n-700);
  --feature-card-to: var(--n-800);
  --feature-card-fg: var(--n-0);
  --feature-card-muted: rgba(255, 255, 255, 0.7);
  --feature-card-highlight: #ff5a5a;
}

.dark {
  --n-0: #141a20;
  --n-25: #1a2229;
  --n-50: #232a32;
  --n-100: #2d3640;
  --n-200: #3a434e;
  --n-300: #515b66;
  --n-400: #6b7682;
  --n-500: #97a2ae;
  --n-600: #c2cad3;
  --n-700: #dce2e8;
  --n-800: #e9edf1;
  --n-900: #fafbfc;
  --accent-deep: #cbd5e1;
  --accent-tint: #334155;
  --accent-ink: #141a20;
  --success-tint: #1a3d2a;
  --info-tint: #1a2f42;
  --caution-tint: #433b1a;
  --orange-tint: #3d2a18;
  --critical-tint: #3d221e;
  --status-neutral-tint: #2d3338;
  --success: #34c77b;
  --info: #5aa9f0;
  --caution: #ebba2b; --critical: #f87171;
  --status-neutral: #aeb8c2;
  --orange: #e98b39;
  --sh-1: 0 1px 2px rgba(0, 0, 0, 0.2);
  --sh-2: 0 2px 8px rgba(0, 0, 0, 0.35), 0 1px 2px rgba(0, 0, 0, 0.3);
  --sh-3: 0 8px 28px rgba(0, 0, 0, 0.45);

  --background: var(--n-0);
  --foreground: var(--n-700);
  --card: var(--n-25);
  --card-foreground: var(--n-800);
  --popover: var(--n-25);
  --popover-foreground: var(--n-800);
  --primary: #94a3b8;
  --primary-foreground: var(--accent-ink);
  --secondary: var(--n-50);
  --secondary-foreground: var(--n-800);
  --muted: var(--n-50);
  --muted-foreground: var(--n-500);
  --accent: var(--accent-tint);
  --accent-foreground: var(--accent-deep);
  --destructive: #f87171;
  --border: var(--n-200);
  --input: var(--n-300);
  --ring: var(--primary);
  --sidebar: var(--n-25);
  --sidebar-foreground: var(--n-700);
  --sidebar-primary: var(--primary);
  --sidebar-primary-foreground: var(--accent-ink);
  --sidebar-accent: var(--accent-tint);
  --sidebar-accent-foreground: var(--accent-deep);
  --sidebar-border: var(--n-200);
  --sidebar-ring: var(--n-400);

  --feature-card-from: var(--n-100);
  --feature-card-to: var(--n-200);
  --feature-card-fg: var(--n-800);
  --feature-card-muted: rgba(255, 255, 255, 0.65);
  --feature-card-highlight: #ff5a5a;
}
