body.nura-dynamic-bg {
  isolation: isolate;
}

body.nura-dynamic-bg::before,
body.nura-dynamic-bg::after {
  content: "";
  position: fixed;
  inset: -24vmax;
  z-index: -1;
  pointer-events: none;
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity;
}

body.nura-dynamic-bg::before {
  background:
    radial-gradient(ellipse at 16% 18%, rgba(34, 202, 255, 0.18), transparent 30%),
    radial-gradient(ellipse at 76% 16%, rgba(126, 255, 227, 0.10), transparent 28%),
    radial-gradient(ellipse at 62% 82%, rgba(243, 189, 85, 0.09), transparent 30%);
  opacity: 0.78;
  animation: nuraAmbientA 46s linear infinite;
}

body.nura-dynamic-bg::after {
  background:
    radial-gradient(ellipse at 18% 72%, rgba(66, 219, 201, 0.12), transparent 30%),
    radial-gradient(ellipse at 82% 58%, rgba(34, 202, 255, 0.11), transparent 28%),
    radial-gradient(ellipse at 50% 24%, rgba(183, 168, 255, 0.08), transparent 26%);
  opacity: 0.58;
  mix-blend-mode: screen;
  animation: nuraAmbientB 62s linear infinite;
}

body.nura-bg-market::before { animation-duration: 52s; opacity: 0.82; }
body.nura-bg-market::after { animation-duration: 70s; opacity: 0.62; }
body.nura-bg-chat::before { animation-duration: 58s; opacity: 0.7; }
body.nura-bg-chat::after { animation-duration: 74s; opacity: 0.48; }
body.nura-bg-docs::before { animation-duration: 54s; opacity: 0.72; }
body.nura-bg-docs::after { animation-duration: 66s; opacity: 0.5; }

@keyframes nuraAmbientA {
  0% { transform: translate3d(-2%, -1%, 0) scale(1) rotate(0deg); opacity: 0.68; }
  23% { transform: translate3d(5%, 2%, 0) scale(1.08) rotate(4deg); opacity: 0.84; }
  49% { transform: translate3d(1%, 7%, 0) scale(0.96) rotate(-3deg); opacity: 0.7; }
  72% { transform: translate3d(-6%, 3%, 0) scale(1.12) rotate(5deg); opacity: 0.8; }
  100% { transform: translate3d(-2%, -1%, 0) scale(1) rotate(0deg); opacity: 0.68; }
}

@keyframes nuraAmbientB {
  0% { transform: translate3d(4%, 3%, 0) scale(1.05) rotate(6deg); opacity: 0.44; }
  31% { transform: translate3d(-3%, 6%, 0) scale(0.98) rotate(-4deg); opacity: 0.64; }
  57% { transform: translate3d(-7%, -2%, 0) scale(1.12) rotate(3deg); opacity: 0.52; }
  84% { transform: translate3d(3%, -5%, 0) scale(1.02) rotate(-5deg); opacity: 0.6; }
  100% { transform: translate3d(4%, 3%, 0) scale(1.05) rotate(6deg); opacity: 0.44; }
}

@media (prefers-reduced-motion: reduce) {
  body.nura-dynamic-bg::before,
  body.nura-dynamic-bg::after {
    animation: none !important;
  }
}
