/* Keep the photographic folio's paper and ink. The garden comes from light,
   depth and moving petals rather than a new colored layer on each section. */
.music-atmosphere {
  position: fixed;
  inset: 0;
  z-index: 50;
  overflow: hidden;
  overflow: clip;
  contain: paint;
  pointer-events: none;
  user-select: none;
  opacity: 0;
  transition: opacity .9s ease;
}
.music-atmosphere[hidden] { display: none; }
.music-atmosphere.is-visible { opacity: 1; }
.music-atmosphere-wash,
.music-atmosphere-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.music-atmosphere-wash {
  background: linear-gradient(125deg, #fff8eb0a, transparent 45%, #a3b19706);
}
.music-atmosphere-canvas { display: block; }
.hero, .site-header { transition: background-color 2.8s ease; }
body.music-flowers-active .hero,
body.music-flowers-active .site-header { background-color: #f5f2eb; }

@media (prefers-reduced-motion: reduce) {
  .music-atmosphere, .hero, .site-header { transition: none; }
}
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  .music-atmosphere-wash { display: none; }
}
@media (forced-colors: active) {
  .music-atmosphere { display: none; }
  body.music-flowers-active .hero,
  body.music-flowers-active .site-header { background-color: Canvas; }
}