/* Freeze the approved framing; only bounded stage lighting moves. */
.scene .scene-art {
  animation: none;
  transform: scale(1.005);
}

.scene .stage-spotlight {
  position: absolute;
  left: 44%;
  top: 12%;
  width: 28%;
  height: 64%;
  overflow: hidden;
  pointer-events: none;
  mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 70%, transparent);
}

.scene .stage-spotlight::before {
  content: "";
  position: absolute;
  top: -12%;
  left: -8%;
  width: 80%;
  height: 120%;
  pointer-events: none;
  clip-path: polygon(48% 0, 52% 0, 100% 100%, 0 100%);
  transform-origin: 50% 0;
  background: linear-gradient(90deg, transparent 5%, rgb(255 227 163 / 8%) 26%, rgb(255 227 163 / 28%) 50%, rgb(255 227 163 / 8%) 74%, transparent 95%);
  animation: a10-stage-sweep 5.2s ease-in-out infinite;
  will-change: transform, opacity;
}

.scene .stage-spotlight--sapphire::before {
  left: 36%;
  width: 66%;
  background: linear-gradient(90deg, transparent 5%, rgb(164 209 255 / 7%) 26%, rgb(190 226 255 / 24%) 50%, rgb(164 209 255 / 7%) 74%, transparent 95%);
  animation-delay: -2.6s;
}

@keyframes a10-stage-sweep {
  0%, 100% { transform: rotate(-17deg); opacity: .55; }
  50% { transform: rotate(17deg); opacity: .95; }
}

html[data-motion="paused"] .scene [data-scene-motion]::before,
html[data-motion="hidden"] .scene [data-scene-motion]::before {
  animation-play-state: paused;
}

@media (min-width: 641px) and (max-width: 1050px) {
  .scene .stage-spotlight { left: 54%; width: 20%; }
}

@media (max-width: 640px) {
  .scene .stage-spotlight {
    left: 0;
    top: 9%;
    width: 34%;
    height: 21%;
  }
}