.aurora-ampp { position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; overflow: visible; background: #0b0f1a; z-index: -1; } .aurora-ampp::before { content: ""; position: absolute; inset: -30%; background: radial-gradient(40% 50% at 20% 30%, rgba(60, 80, 180, 0.45) 0%, transparent 75%), radial-gradient(45% 55% at 75% 25%, rgba(40, 150, 160, 0.40) 0%, transparent 75%), radial-gradient(50% 60% at 60% 75%, rgba(200, 46, 206, 0.35) 0%, transparent 75%), radial-gradient(40% 50% at 30% 80%, rgba(80, 110, 200, 0.40) 0%, transparent 75%); filter: blur(80px) saturate(1.2); opacity: 0.65; animation: aurora-anim 12s ease-in-out infinite alternate; pointer-events: none; z-index: -1; } @keyframes aurora-anim { from { transform: translate3d(-4%, -3%, 0) rotate(0deg); } to { transform: translate3d(4%, 3%, 0) rotate(36deg); } } @media (prefers-reduced-motion: reduce) { .aurora-ampp::before { animation: none; } }