html[data-theme]:not([data-theme="dark"]) {
  --color-bg: #ffa3eb;
  --color-inverse-text: #f9fafb;
  --color-surface: #8aa3ff;
  --color-surface-hover: #dc7aff;
  --color-text: #ffffff;
  --color-yellow-mid: #e5adff;
  --color-yellow-soft: #b3f0ff;
  --color-yellow-subtle: #d3fde0;
}
html[data-theme="dark"] {
  --color-bg: #b441a7;
  --color-inverse-text: #fbfbf9;
  --color-surface: #2b29a3;
  --color-surface-hover: #c131dd;
  --color-text: #fbf9f0;
  --color-yellow-mid: #d03eda;
  --color-yellow-soft: #5fb8c4;
  --color-yellow-subtle: #93e1ce;
}