:root {
  --surface-0: #0f0f14;
  --surface-1: #1a1a1a;
  --surface-2: #18181b;
  --surface-3: #2a2a2a;
  --surface-card: rgba(26, 26, 26, 0.7);

  --text-primary: #e4e4e7;
  --text-secondary: #a1a1aa;
  --text-muted: #52525b;

  --accent: #a78bfa;
  --accent-hover: #c4b5fd;
  --accent-subtle: rgba(167, 139, 250, 0.06);

  --error: #ef4444;
  --error-subtle: rgba(239, 68, 68, 0.06);
  --error-border: rgba(239, 68, 68, 0.15);
  --warning: #facc15;
  --danger: #ef4444;

  --border-subtle: rgba(255, 255, 255, 0.08);
  --border-hover: rgba(255, 255, 255, 0.15);
  --border-active: rgba(255, 255, 255, 0.25);

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;

  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;

  --blur-card: 10px;

  --shadow-sm: 0 0 0 1px rgba(255, 255, 255, 0.2);
  --shadow-accent: 0 0 0 3px rgba(167, 139, 250, 0.3);

  --neutral-fill-rest: var(--surface-2);
  --neutral-fill-hover: var(--surface-3);
  --neutral-fill-active: var(--surface-3);
  --neutral-foreground-rest: var(--text-primary);
  --neutral-stroke-rest: var(--border-subtle);
  --neutral-stroke-hover: var(--border-hover);
  --accent-fill-rest: var(--accent);
  --accent-fill-hover: var(--accent-hover);
  --accent-foreground-rest: var(--accent);
  --accent-foreground-hover: var(--accent-hover);
  --fill-color: var(--surface-0);
}