html[data-theme] {
  --color-character-tile-text-dark-fill: #fbf9f0;
  --color-character-tile-text-light-fill: #9db7d2;
}
html[data-theme]:not([data-theme="dark"]) {
  --color-bg: #ffbe8a;
  --color-border: #7d755e;
  --color-inverse: #2b3546;
  --color-inverse-text: #b4e5fe;
  --color-surface: #f0ebd6;
  --color-text: #5e4726;
  --color-text-muted: #6b7280;
  --color-yellow-dark: #854d0e;
  --color-yellow-mid: #edbd0e;
  --color-yellow-subtle: #feebc3;
}
html[data-theme="dark"] {
  --color-bg: #202031;
  --color-border: #47465d;
  --color-inverse: #736754;
  --color-inverse-text: #ffe9d1;
  --color-surface: #1f2123;
  --color-surface-hover: #3b3e43;
  --color-text: #b3d0ff;
  --color-text-muted: #9ca3af;
  --color-yellow-dark: #dcebfe;
  --color-yellow-mid: #ee8917;
  --color-yellow-subtle: #b0641c;
}