:root {
  --primary-color: #136EB9;
  --cta-color: #2B8E2B;
  --bg: #f8fafc;
  --fg: #0f172a;
  --border: #0f172a;
  --shadow: 5px 5px 0px 0px #0f172a;
  --shadow-sm: 3px 3px 0px 0px #0f172a;
  --shadow-active: 2px 2px 0px 0px #0f172a;
  --shadow-hover: 6px 6px 0px 0px #0f172a;
  --radius: 10px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #111111;
    --fg: #f0f0f0;
    --border: #525252;
    --shadow: 5px 5px 0px 0px #525252;
    --shadow-sm: 3px 3px 0px 0px #525252;
    --shadow-active: 2px 2px 0px 0px #525252;
    --shadow-hover: 6px 6px 0px 0px #525252;
  }
}