:root {
  /* Primitive color */
  --neutral-50: #f8fafc;
  --neutral-100: #f1f5f9;
  --neutral-200: #e2e8f0;
  --neutral-300: #cbd5e1;
  --neutral-400: #94a3b8;
  --neutral-500: #64748b;
  --neutral-600: #475569;
  --neutral-700: #334155;
  --neutral-800: #1e293b;
  --neutral-900: #0f172a;
  --neutral-950: #020617;

  --blue-50: #eff6ff;
  --blue-100: #dbeafe;
  --blue-200: #bfdbfe;
  --blue-300: #93c5fd;
  --blue-400: #60a5fa;
  --blue-500: #3b82f6;
  --blue-600: #2563eb;
  --blue-700: #1d4ed8;
  --blue-800: #1e40af;
  --blue-900: #1e3a8a;
  --blue-950: #172554;

  --teal-50: #f0fdfa;
  --teal-100: #ccfbf1;
  --teal-500: #14b8a6;
  --teal-600: #0d9488;
  --teal-700: #0f766e;
  --teal-800: #115e59;
  --teal-950: #042f2e;

  --green-100: #dcfce7;
  --green-700: #15803d;
  --green-800: #166534;
  --amber-100: #fef3c7;
  --amber-700: #b45309;
  --amber-800: #92400e;
  --red-100: #fee2e2;
  --red-700: #b91c1c;
  --red-800: #991b1b;
  --sky-100: #e0f2fe;
  --sky-700: #0369a1;

  /* Primitive type */
  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Newsreader", Georgia, serif;

  /* Primitive spacing */
  --space-0: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  /* Primitive radius */
  --radius-none: 0;
  --radius-xs: 0.375rem;
  --radius-sm: 0.625rem;
  --radius-md: 0.875rem;
  --radius-lg: 1rem;
  --radius-xl: 1.25rem;
  --radius-2xl: 1.5rem;
  --radius-full: 999px;

  /* Primitive elevation */
  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
  --shadow-sm: 0 6px 16px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 14px 34px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0 24px 60px rgba(15, 23, 42, 0.12);
  --shadow-overlay: 0 18px 48px rgba(15, 23, 42, 0.16);

  /* Primitive motion */
  --duration-fast: 150ms;
  --duration-base: 250ms;
  --duration-slow: 350ms;
  --duration-slower: 500ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-decelerate: cubic-bezier(0, 0, 0, 1);
  --ease-accelerate: cubic-bezier(0.3, 0, 1, 1);

  /* Semantic color */
  --background: var(--neutral-50);
  --foreground: var(--neutral-900);
  --surface: #ffffff;
  --surface-muted: var(--neutral-100);
  --surface-subtle: var(--neutral-50);
  --border: var(--neutral-200);
  --border-strong: var(--neutral-300);
  --muted-foreground: var(--neutral-600);
  --primary: var(--blue-600);
  --primary-foreground: #ffffff;
  --accent: var(--teal-700);
  --accent-foreground: #ffffff;
  --success: var(--green-700);
  --warning: var(--amber-700);
  --danger: var(--red-700);
  --info: var(--sky-700);
  --ring: var(--blue-600);

  /* Semantic type */
  --text-xs: clamp(0.75rem, 0.74rem + 0.04vw, 0.78rem);
  --text-sm: clamp(0.875rem, 0.86rem + 0.07vw, 0.94rem);
  --text-base: clamp(1rem, 0.96rem + 0.12vw, 1.0625rem);
  --text-lg: clamp(1.125rem, 1.06rem + 0.25vw, 1.25rem);
  --text-xl: clamp(1.375rem, 1.19rem + 0.55vw, 1.75rem);
  --text-2xl: clamp(1.875rem, 1.45rem + 1.3vw, 2.75rem);
  --text-3xl: clamp(2.5rem, 1.85rem + 2vw, 4rem);

  /* Semantic layout */
  --space-gutter: clamp(1rem, 0.55rem + 1.4vw, 2rem);
  --space-section: clamp(2.5rem, 1.45rem + 3vw, 5rem);
  --space-panel: var(--space-8);
  --space-control-x: var(--space-4);
  --space-control-y: var(--space-3);

  /* Semantic shape */
  --radius-control: var(--radius-sm);
  --radius-card: var(--radius-xl);
  --radius-panel: var(--radius-2xl);
  --radius-modal: var(--radius-2xl);
  --radius-pill: var(--radius-full);

  /* Semantic elevation */
  --elevation-rest: var(--shadow-xs);
  --elevation-raised: var(--shadow-md);
  --elevation-floating: var(--shadow-overlay);
  --elevation-modal: var(--shadow-lg);

  /* Semantic motion */
  --motion-hover: var(--duration-fast) var(--ease-standard);
  --motion-dropdown: var(--duration-base) var(--ease-decelerate);
  --motion-modal-enter: var(--duration-slow) var(--ease-decelerate);
  --motion-modal-exit: var(--duration-base) var(--ease-accelerate);

  /* Component tokens */
  --button-height-sm: 2.25rem;
  --button-height-md: 2.75rem;
  --button-height-lg: 3rem;
  --button-radius: var(--radius-control);
  --button-padding-x: var(--space-4);
  --input-height: 3rem;
  --input-radius: var(--radius-control);
  --input-padding-x: var(--space-4);
  --card-radius: var(--radius-card);
  --card-padding: var(--space-panel);
  --card-shadow: var(--elevation-rest);
  --sidebar-width: 18rem;
  --sidebar-item-height: 2.75rem;
  --theme-switch-height: 2.5rem;
  --theme-switch-option-size: 1.875rem;
  --theme-switch-radius: var(--radius-control);
  --theme-switch-background: var(--surface);
  --theme-switch-active-background: var(--surface-muted);
  --theme-switch-foreground: var(--muted-foreground);
  --theme-switch-active-foreground: var(--foreground);
}

[data-theme="light"],
.light {
  color-scheme: light;
}

[data-theme="dark"],
.dark {
  color-scheme: dark;
  --background: var(--neutral-950);
  --foreground: var(--neutral-50);
  --surface: var(--neutral-900);
  --surface-muted: var(--neutral-800);
  --surface-subtle: var(--neutral-900);
  --border: var(--neutral-800);
  --border-strong: var(--neutral-700);
  --muted-foreground: var(--neutral-400);
  --primary: var(--blue-400);
  --primary-foreground: var(--neutral-950);
  --accent: var(--teal-500);
  --accent-foreground: var(--neutral-950);
  --success: var(--green-100);
  --warning: var(--amber-100);
  --danger: var(--red-100);
  --info: var(--sky-100);
  --ring: var(--blue-400);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}