:root {
  /* Grey scale */
  --beam-grey-800: #1E2328;
  --beam-grey-text: #333333;
  --beam-grey-500: #4D4D4D;
  --beam-grey-400: #666666;
  --beam-grey-border: #CCCCCC;
  --beam-grey-100: #EBEBEB;
  --beam-page-bg: #E8E8E8;

  /* Brand — Structural Blue */
  --beam-blue: #52878F;
  --beam-blue-selected: rgba(82,135,143, 0.15);
  --beam-blue-tint: rgba(82,135,143, 0.05);

  /* Brand — Electric Green / Olive */
  --beam-green: #696347;
  --beam-green-selected: rgba(105,99,71, 0.15);
  --beam-green-tint: rgba(105,99,71, 0.05);

  /* Status — Muted Sage (success) */
  --beam-sage: #7A9E7E;
  --beam-sage-selected: rgba(122,158,126, 0.15);
  --beam-sage-tint: rgba(122,158,126, 0.05);

  /* Status — Warm Amber (warning) */
  --beam-amber: #C4A44A;
  --beam-amber-selected: rgba(196,164,74, 0.15);
  --beam-amber-tint: rgba(196,164,74, 0.05);

  /* Status — Muted Coral (error) */
  --beam-coral: #C67B7B;
  --beam-coral-selected: rgba(198,123,123, 0.15);
  --beam-coral-tint: rgba(198,123,123, 0.05);

  /* Status — Info Blue */
  --beam-info: #5A8A91;
  --beam-info-selected: rgba(90,138,145, 0.15);
  --beam-info-tint: rgba(90,138,145, 0.05);

  /* Status — Progress Amber */
  --beam-progress: #B8915A;
  --beam-progress-selected: rgba(184,145,90, 0.15);
  --beam-progress-tint: rgba(184,145,90, 0.05);

  /* Surfaces */
  --color-surface-high: #FFFFFF;
  --color-surface-muted: #E8E8E8;
  --color-surface-emphasis: #1E2328;

  /* Spacing (unchanged) */
  --spacing-card: 1.25rem;
  --spacing-section: 1.5rem;
  --spacing-tight: 0.75rem;

  /* Typography (unchanged) */
  --font-size-h1: 1.5rem;
  --font-size-h2: 1.125rem;
  --font-size-body: 0.9375rem;
}

.btn-primary {
  background: var(--beam-blue);
  color: var(--color-surface-high);
  transition: background 0.2s ease;
}

.btn-primary:hover {
  background: #4a7a81;
}

.text-brand {
  color: var(--beam-blue);
}

.border-brand {
  border-color: var(--beam-blue);
}

.bg-brand-soft {
  background: var(--beam-blue-tint);
}