/* Small pools of lamplight sit behind the people and their labels. */
#worldAtmosphere {
  position: absolute;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}

#worldAtmosphere .temple-lamp-glow {
  position: absolute;
  width: 158px;
  height: 218px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center,
    rgba(255, 199, 112, .16) 0%,
    rgba(244, 150, 66, .07) 30%,
    rgba(232, 117, 44, 0) 70%);
  opacity: .68;
  /* Eight steps per quarter-cycle: about nine updates/sec, on four small areas. */
  animation: templeLampFlicker 3.6s steps(8, end) -.8s infinite;
}

#worldAtmosphere .lamp-left-high { left: -30px; top: 406px; }
#worldAtmosphere .lamp-right-high {
  right: -30px;
  top: 406px;
  animation-duration: 4.2s;
  animation-delay: -2.7s;
}
#worldAtmosphere .lamp-left-low,
#worldAtmosphere .lamp-right-low {
  top: 880px;
  width: 190px;
  height: 156px;
  background: radial-gradient(ellipse at center,
    rgba(255, 204, 128, .12) 0%,
    rgba(242, 156, 77, .045) 35%,
    rgba(232, 117, 44, 0) 70%);
}
#worldAtmosphere .lamp-left-low {
  left: 50px;
  animation-duration: 3.8s;
  animation-delay: -1.9s;
}
#worldAtmosphere .lamp-right-low {
  right: 50px;
  animation-duration: 4.6s;
  animation-delay: -3.2s;
}

/* Reflected warmth is static; the carpet and text remain clear. */
#worldAtmosphere .temple-floor-wash {
  position: absolute;
  left: 110px;
  top: 1290px;
  width: 860px;
  height: 280px;
  background:
    radial-gradient(ellipse at 8% 50%, rgba(242, 178, 99, .065), transparent 39%),
    radial-gradient(ellipse at 92% 50%, rgba(242, 178, 99, .065), transparent 39%);
  opacity: .55;
}

@keyframes templeLampFlicker {
  0%, 100% { opacity: .64; }
  25% { opacity: .74; }
  50% { opacity: .67; }
  75% { opacity: .78; }
}

body.devotee-motion-paused #worldAtmosphere .temple-lamp-glow {
  animation-play-state: paused;
}
body[data-effects=gentle] #worldAtmosphere .temple-lamp-glow {
  animation: none;
  opacity: .58;
}
body[data-effects=gentle] #worldAtmosphere .temple-floor-wash { opacity: .35; }

@media (prefers-reduced-motion: reduce) {
  #worldAtmosphere .temple-lamp-glow {
    animation: none !important;
    opacity: .58;
  }
}
