html[data-theme="light"] {
  --bg: #fafafa;
  --fg: rgba(0, 0, 0, 0.92);
  --strong: #242424;
  --dialog-bg: #f4f4f4;
  --rule: rgba(0, 0, 0, 0.12);
  color-scheme: light;
}

/* EXP: Flip the site's SVG images from white to black. */
html[data-theme="light"] img { filter: invert(1); }

.tocMenu { position: relative; }

.themeToggle {
  position: absolute;
  top: calc(15px + 0.125rem);
  right: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid var(--strong);
  border-radius: 50%;
  background: transparent;
  color: var(--strong);
  cursor: pointer;
}

.themeToggle svg {
  width: 1.4rem; height: 1.4rem;
  fill: none; stroke: currentColor; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round;
}

.themeToggle .moonIcon { display: none; }

html[data-theme="light"] .themeToggle .moonIcon { display: block; }

html[data-theme="light"] .themeToggle .sunIcon { display: none; }

::view-transition-old(root),
::view-transition-new(root) { animation: none; mix-blend-mode: normal; }