html[data-theme]:not([data-theme="dark"]) {
  --color-bg: #f3f3f3;
  --color-surface: #ffffff;
  --color-surface-hover: #f5e2fa;
  --color-text: #111827;
}
html[data-theme="dark"] {
  --color-inverse-text: #fbfbf9;
}
html[data-theme]:not([data-theme="dark"]) .bg-bg {
  background-image: url('https://d2hplq259yjfnt.cloudfront.net/series/9ba99b67-9153-49f7-a321-3996c1ba6003/reader-patterns/light-e8fb453f-82aa-40e5-91c0-635317e4dbc8.jpg');
  background-repeat: repeat;
  background-size: auto;
  background-position: 0 0;
  background-color: var(--color-bg);
  background-attachment: local;
}
html[data-theme="dark"] .bg-bg {
  background-image: url('https://d2hplq259yjfnt.cloudfront.net/series/9ba99b67-9153-49f7-a321-3996c1ba6003/reader-patterns/dark-1612948c-e0fb-46d3-9ecb-9d52c9c86e35.jpg');
  background-repeat: repeat;
  background-size: auto;
  background-position: 0 0;
  background-color: var(--color-bg);
  background-attachment: local;
}