:root {
  color-scheme: light;
  --color-base: #f2ede0;
  --color-surface: #e9e2cf;
  --color-border: #cfcdc1;
  --color-muted: #6a7268;
  --color-text: #17271f;
  --color-red: #a53c2c;
  --color-orange: #b96f28;
  --color-yellow: #85630e;
  --color-green: #4f7340;
  --color-teal: #2f7565;
  --color-blue: #3d6485;
  --color-purple: #7c4f79;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-base: #151b17;
  --color-surface: #1e2620;
  --color-border: #3b3f38;
  --color-muted: #949285;
  --color-text: #e8e1cf;
  --color-red: #d0654e;
  --color-orange: #cf8542;
  --color-yellow: #cba55a;
  --color-green: #8cab72;
  --color-teal: #72ad9c;
  --color-blue: #7fa8c9;
  --color-purple: #b391b8;
}