:root {
  --color-primary: #0056b3;
  --color-primary-hover: #004494;
  --color-primary-active: #003a7a;
  --color-primary-subtle: #e6f0fa;

  --color-accent: #78be20;
  --color-accent-hover: #66a31b;
  --color-accent-active: #558817;
  --color-accent-subtle: #f0f8e8;

  --color-bg: #ffffff;
  --color-bg-muted: #f4f4f4;
  /* Slightly deeper than --color-bg-muted for footer bands */
  --color-bg-footer: #e8e8e8;
  --color-bg-elevated: #ffffff;

  --color-text: #2d3436;
  --color-text-secondary: #636e72;
  --color-text-muted: #b2bec3;
  --color-text-on-primary: #ffffff;
  --color-text-on-accent: #1a1a1a;

  --color-border: #e8e8e8;
  --color-border-strong: #d0d0d0;
  --color-focus-ring: rgba(0, 86, 179, 0.35);

  --color-success: var(--color-accent);
  --color-success-bg: var(--color-accent-subtle);

  --radius: 4px;
}