/**
 * Kingdom — soft light-filled atmosphere (no music motifs).
 * Add body.jg-kingdom-page + first-child .jg-ambient.jg-ambient--kingdom
 */

body.jg-kingdom-page {
  isolation: isolate;
  position: relative;
}

.jg-ambient.jg-ambient--kingdom {
  position: fixed;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: -1;
}

.jg-ambient--kingdom::before,
.jg-ambient--kingdom::after {
  content: "";
  position: absolute;
  inset: -8%;
  opacity: 0.45;
  background: radial-gradient(ellipse 110% 85% at 50% -15%, rgba(255, 225, 195, 0.4), transparent 52%),
    radial-gradient(ellipse 75% 60% at 90% 40%, rgba(190, 205, 230, 0.12), transparent 50%),
    radial-gradient(ellipse 55% 70% at 5% 85%, rgba(220, 200, 170, 0.1), transparent 48%);
  animation: jg-kingdom-light 95s ease-in-out infinite;
}

.jg-ambient--kingdom::after {
  opacity: 0.28;
  background: linear-gradient(
    115deg,
    transparent 0%,
    rgba(255, 248, 235, 0.06) 42%,
    transparent 70%
  );
  animation: jg-kingdom-light 120s ease-in-out infinite reverse;
}

@keyframes jg-kingdom-light {
  0%,
  100% {
    transform: translate3d(0, 0, 0) scale(1);
    opacity: 0.42;
  }
  50% {
    transform: translate3d(-0.8%, 0.4%, 0) scale(1.01);
    opacity: 0.48;
  }
}

html:not([data-theme="sunlit"]) .jg-ambient--kingdom::before,
html:not([data-theme="sunlit"]) .jg-ambient--kingdom::after {
  opacity: 0.18;
  filter: saturate(0.85);
}

@media (prefers-reduced-motion: reduce) {
  .jg-ambient--kingdom::before,
  .jg-ambient--kingdom::after {
    animation: none !important;
  }
}
