body {
  margin-top: 5em;
  margin-left: 10%;
  margin-right: 10%;
  font-family: sans-serif;
}
.figure {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
:root:has([value="dark"]:checked) {
    color-scheme: dark;
    color: white;
    --background: #0d0d0d;
    background-color: var(--background);
    --accent: #00ff77;
    --accent-transparent: #00ff7777;
    --accent2: #00aaff;
}
:root:has([value="light"]:checked) {
  color-scheme: light;
  --background: white;
  color: black;
  --accent: #14ab0e;
  --accent-transparent: #14ab0e99;
  --accent2: #1a6991;
}
:root:has([value="lowcontrast"]:checked) {
    color-scheme: dark;
    color: white;
    background-color: var(--background);
  --background: #1e1e2e;
  color: #cdd6f4;
  --accent: #a6e3a1;
  --accent-transparent: #a6e3a177;
  --accent2: #89b4fa;
}