/* Move the white background to the root so body can be transparent,
   letting the canvas (z-index:-1) sit between the html background
   and the body content without being hidden behind a solid body fill. */
html {
  background-color: #ffffff;
}

body {
  background-color: transparent !important;
}

/* In dark-mode the html root becomes the dark surface */
@media (prefers-color-scheme: dark) {
  html {
    background-color: #111111;
  }
}

/* Fixed canvas behind all body content */
#ascii-canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
}

/* Guarantee the theme's main layout elements stack above the canvas.
   These class/id names are from pages-themes/minimal. */
body > header,
body > #container,
body > section,
body > main,
body > article {
  position: relative;
  z-index: 0;
}
