:root {
  color-scheme: light;
  --color-page-bg: #ececec;
  --color-surface: #ffffff;
  --color-surface-elevated: #ffffff;
  --color-text-primary: #231f20;
  --color-text-secondary: #7b7b7b;
  --color-border: #e3e3e3;
  --color-card-border: #e2e8f0;
  --color-input-border: #e2e8f0;
  --color-input-bg: #ffffff;
  --color-input-bg-disabled: #f3f4f6;
  --color-surface-inset: #ffffff;
  --color-surface-highest: #f8f9fb;
  --color-outline-variant: #e2e8f0;
  --color-status: #ea5939;
  --color-cyan: #02b4c2;
  --color-ring: #ffffff;

  --text-primary: #14215d;
  --surface-muted: #f3f4f6;
  --accent: #F49744;
  --color-brand-yellow: #F49744;
}

.dark {
  color-scheme: dark;
  --color-page-bg: #0f131d;
  --color-surface: #080c15;
  --color-surface-elevated: #080c15;
  --color-text-primary: #ffffff;
  --color-text-secondary: #c6c6c6;
  --color-border: #c6c6c6;
  --color-card-border: #2a3342;
  --color-input-border: #2a3342;
  --color-input-bg: #080c15;
  --color-input-bg-disabled: #0f131d;
  --color-surface-inset: #1a1f2e;
  --color-surface-highest: #1a202e;
  --color-outline-variant: #2a3342;
  --color-status: #ea5939;
  --color-cyan: #f49744;
  --color-ring: #080c15;

  --text-primary: #ffffff;
  --surface-muted: #1a1f2e;
  --accent: #F49744;
  --color-brand-yellow: #F49744;
}