:root {
  /* Indigo color scale */
  --indigo-50: #eef2ff;
  --indigo-100: #e0e7ff;
  --indigo-200: #c7d2fe;
  --indigo-300: #a5b4fc;
  --indigo-400: #818cf8;
  --indigo-500: #6366f1;
  --indigo-600: #2563eb;
  --indigo-700: #4338ca;
  --indigo-800: #3730a3;
  --indigo-900: #312e81;
  /* Fuchsia color scale */
  --fuchsia-50: #fdf4ff;
  --fuchsia-100: #fae8ff;
  --fuchsia-200: #f5d0fe;
  --fuchsia-300: #f0abfc;
  --fuchsia-400: #e879f9;
  --fuchsia-500: #d946ef;
  --fuchsia-600: #ec4899;
  --fuchsia-700: #c026d3;
  --fuchsia-800: #a21caf;
  --fuchsia-900: #86198f;
  /* Neutral grays */
  --gray-50: #f9fafb;
  --gray-100: #e5e7eb;
  --gray-500: #6b7280;
  --gray-700: #374151;
  --gray-900: #111827;
  /* Semantic colors */
  --green: #10b981;
  --red: #ef4444;
  --amber: #f59e0b;
  /* Typography */
  --font-sans: 'Poppins', sans-serif;
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1.125rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  /* Line heights */
  --leading-tight: 1.25;
  --leading-snug: 1.375;
  --leading-normal: 1.5;
  /* Spacing */
  --space-0: 0;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-7: 1.75rem;
  --space-8: 2rem;
  --space-9: 3rem;
  --space-10: 4rem;
  /* Radius */
  --radius-sm: .25rem;
  --radius-lg: 1rem;
  --radius-full: 9999px;
  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0,0,0,.05);
  --shadow-md: 0 4px 6px rgba(0,0,0,.1);
  --shadow-lg: 0 10px 15px rgba(0,0,0,.25); }

body {
  font-family: var(--font-sans);
  color: var(--gray-700);
  background: var(--gray-50);
  line-height: var(--leading-normal);
  font-size: var(--text-base);
}

h1 {
  font-size: 2.5rem;
  font-weight: 600;
}

h2 {
  font-size: 2rem;
  font-weight: 600;
}

h3 {
  font-size: 1.75rem;
  font-weight: 600;
}

/* Utility classes (limited set) */
.p-4, .btn {
  padding: var(--space-4); }

.m-2 {
  margin: var(--space-2); }

.flex {
  display: flex; }

.items-center {
  align-items: center; }

.gap-6 {
  gap: var(--space-6); }

.text-indigo-600 {
  color: var(--indigo-600); }

.bg-indigo-600 {
  background-color: var(--indigo-600);
  color: white; }

.radius-lg {
  border-radius: var(--radius-lg); }

.shadow-lg {
  box-shadow: var(--shadow-lg); }

/* Button component variants */
.btn {
  border-radius: var(--radius-sm);
  cursor: pointer;
  display: inline-block;
  text-decoration: none; }

.btn-primary {
  background: var(--indigo-600);
  color: white; }

.btn-outline {
  background: transparent;
  border: 2px solid var(--indigo-600);
  color: var(--indigo-600); }

.btn-transparent {
  background: transparent;
  border: 2px solid currentColor;
  color: inherit; }

.btn-outline:hover,
.btn-transparent:hover {
  background-color: rgba(0, 0, 0, 0.05); }

/* Dark mode via data-theme */
html[data-theme="dark"] {
  --gray-50: #111827;
  --gray-700: #f9fafb; }
