/* Original moonlit great hall, with mist and floating candles. */
.atmosphere {
  background:
    linear-gradient(90deg, #08151c85 0%, #0c192849 50%, #11152955 100%),
    url('./assets/enchanted-hall.svg') center 48% / cover no-repeat,
    #0c1725;
}
.atmosphere:before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 40%, transparent 20%, #050d17aa 100%);
}
.aurora { background: radial-gradient(ellipse at 62% 8%, #bdc8ef1a, transparent 63%); }
.architecture { opacity: .055; }
.starfield { opacity: .43; }
.moonbeam {
  position: absolute; top: -7%; right: 20%; width: 55%; height: 125%;
  background: linear-gradient(165deg, #b4c4ef24, #9bb7d50b 65%, transparent);
  clip-path: polygon(62% 0, 69% 0, 100% 100%, 0 100%);
  transform: rotate(12deg); filter: blur(5px); opacity: .65;
}
.hall-mist {
  position: absolute; left: -15%; bottom: -12%; width: 130%; height: 52%;
  background: radial-gradient(ellipse at 30% 60%, #a1b8c34a, transparent 45%), radial-gradient(ellipse at 80% 70%, #b4b3cb33, transparent 40%);
  opacity: .24; filter: blur(23px);
  animation: drift-mist 32s ease-in-out infinite alternate;
}
.mist-far { bottom: 12%; height: 35%; opacity: .1; animation-duration: 43s; animation-direction: alternate-reverse; }
.floating-candles i { width: 6px; height: 36px; opacity: .75; box-shadow: 0 4px 12px #070d1c66; }
.floating-candles i:before { left: 0; width: 6px; height: 12px; box-shadow: 0 0 8px 3px #f5c37388, 0 0 38px 12px #e2ab4c19; }
.floating-candles i:nth-child(7) { left: 18%; top: 12%; height: 25px; animation-delay: -2.7s; }
.floating-candles i:nth-child(8) { right: 20%; top: 17%; height: 30px; animation-delay: -4.5s; }
.floating-candles i:nth-child(9) { left: 45%; bottom: 18%; height: 26px; opacity: .42; animation-delay: -1.8s; }
.floating-candles i:nth-child(10) { right: 43%; top: 22%; height: 22px; opacity: .45; animation-delay: -3.8s; }
.birth-panel { background: linear-gradient(135deg, #122835e8, #172332cc); }
.reading-card { background: linear-gradient(135deg, #203b36ed, #142b32ed); }
.topbar { background: linear-gradient(#07142180, #0d19212b); }
@keyframes drift-mist { from { transform: translateX(-4%) scale(1); } to { transform: translateX(6%) scale(1.07); } }
@media (max-width: 800px) {
  .atmosphere { background-position: center, 58% center; }
  .hall-mist { filter: blur(14px); opacity: .17; }
  .mist-far { opacity: .07; }
  .floating-candles i:nth-child(n+8) { display: none; }
  .moonbeam { width: 100%; right: -30%; opacity: .5; }
}
@media (prefers-reduced-motion: reduce) { .hall-mist { animation: none; } }