:root {
  --figma-color-bg-default: #070708;
  --figma-color-bg-elevated: #0f1012;
  --figma-color-surface-default: #15171b;
  --figma-color-surface-hover: #1c1f24;
  --figma-color-border-default: #2a2620;
  --figma-color-text-primary: #f1ead8;
  --figma-color-text-secondary: #9d937c;
  --figma-color-brand-default: #c9a227;
  --figma-color-brand-highlight: #f2d675;
  --figma-color-feedback-success: #2fc085;
  --figma-color-feedback-danger: #f36b6b;

  --figma-space-1: 4px;
  --figma-space-2: 8px;
  --figma-space-3: 12px;
  --figma-space-4: 16px;
  --figma-space-5: 20px;
  --figma-space-6: 24px;
  --figma-space-8: 32px;
  --figma-space-10: 40px;

  --figma-radius-sm: 8px;
  --figma-radius-md: 10px;
  --figma-radius-lg: 12px;
  --figma-radius-xl: 18px;
  --figma-radius-pill: 999px;

  --figma-font-caption: 12px;
  --figma-font-body-sm: 13px;
  --figma-font-body-md: 14px;
  --figma-font-h3: 16px;
  --figma-font-h2: 20px;
  --figma-font-h1: 24px;
  --figma-font-display: 30px;

  --figma-shadow-card: 0 12px 34px rgba(0, 0, 0, 0.5);
}