:root {
  --c-surface-0: #fafafa;
  --c-surface-1: #f5f5f5;
  --c-surface-2: #e5e5e5;

  --c-border: #e5e5e5;
  --c-border-soft: #d4d4d4;
  --c-border-faint: #f5f5f5;
  --c-border-strong: #525252;

  --c-text: #171717;
  --c-text-secondary: #404040;
  --c-text-muted: #525252;
  --c-text-subtle: #737373;
  --c-text-faint: #a3a3a3;
  --c-text-faintest: #d4d4d4;

  --c-danger-bg: #fee2e2;
  --c-danger-border: #fca5a5;
  --c-danger-text: #b91c1c;
  --c-danger-text-strong: #991b1b;

  --c-accent: #0284c7;
  --c-accent-soft: #7dd3fc;
  --c-accent-text: #0369a1;
  --c-accent-2: #7c3aed;
  --c-accent-3: #16a34a;
}