/* ==========================================================
   Backdrop: starfield with drifting embers (fire, left) and
   frost (ice, right).
   Remove the two backdrop lines from a page to turn it off.
   ========================================================== */

.backdrop {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(ellipse 60% 45% at 15% 100%, rgba(255, 106, 31, 0.14), transparent 70%),
    radial-gradient(ellipse 60% 45% at 85% 100%, rgba(127, 214, 255, 0.12), transparent 70%),
    radial-gradient(ellipse 55% 40% at 50% 100%, rgba(180, 60, 255, 0.12), transparent 70%),
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(218, 0, 255, 0.06), transparent 70%),
    #000;
}

.backdrop canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* Let the backdrop show through */
.has-backdrop .chapter {
  backdrop-filter: blur(6px);
}