/* Scene and artwork share an ID palette. Layout and controls live in app.css. */
.scene-background {
  isolation: isolate;
  background: #080809;
}
.scene-background [data-scene-base],
.scene-background [data-scene-wash] {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: var(--scene-ink, #080809);
}
.scene-background [data-scene-base] {
  z-index: 0;
}
.scene-background [data-scene-wash] {
  z-index: 1;
  transform-origin: 68% 48%;
}
.scene-background .scene-light {
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse at 70% 35%,
    color-mix(in srgb, var(--scene-primary) 22%, transparent),
    transparent 76%
  );
}
.scene-background .scene-light + .scene-light {
  background: radial-gradient(
    ellipse at 30% 75%,
    color-mix(in srgb, var(--scene-secondary) 16%, transparent),
    transparent 72%
  );
}
.scene-background [data-ambient] {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: none;
}
.scene-background [data-ambient] + [data-ambient] {
  display: none;
}
.ambient-matter {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0.92;
}
.scene-like-light {
  position: absolute;
  inset: 10% -10% -10%;
  z-index: 2;
  opacity: 0;
  background: radial-gradient(ellipse at 57% 66%, #ffe9bc 0%, #ff962a70 18%, transparent 58%);
  pointer-events: none;
}
.scene-cover-atmosphere {
  position: absolute;
  inset: -20%;
  background-position: center;
  background-size: cover;
  filter: blur(58px) saturate(1.28);
  transform: scale(1.12);
  opacity: 0.84;
}
.scene-background [data-artwork='real'] .scene-light,
.scene-background [data-artwork='real'] .ambient-matter {
  opacity: 0.3;
}
.scene-background[data-cover-art='real'] [data-light-field] {
  opacity: 0.32;
}
.scene-background::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  background: radial-gradient(ellipse at 68% 47%, transparent 7%, #08080908 48%, #080809b8 100%);
  pointer-events: none;
}
.hero-cover > .cover {
  transform-origin: 50% 64%;
  backface-visibility: hidden;
}
.motion-ghost {
  backface-visibility: hidden;
  contain: paint;
}
body[data-motion-active] .play-button.is-loading::after {
  animation-play-state: paused;
}
@media (prefers-reduced-motion: reduce) {
  .scene-background [data-ambient] {
    transform: none !important;
  }
}