.scene { position: fixed; inset: 0; width: 100vw; height: 100vh; overflow: hidden; }
.aurora { position: absolute; inset: -30%; filter: blur(80px) saturate(160%) brightness(0.9); animation: spin 90s linear infinite; }
.blob { position: absolute; border-radius: 50%; mix-blend-mode: screen; }
.b1 { width:700px; height:700px; left:3%;   top:-10%;    animation: float1 20s ease-in-out infinite; }
.b2 { width:600px; height:600px; right:2%;  top:20%;     animation: float2 24s ease-in-out infinite; }
.b3 { width:800px; height:800px; left:30%;  bottom:-15%; animation: float3 28s ease-in-out infinite; }
.b4 { width:500px; height:500px; left:55%;  top:-20%;    animation: float4 18s ease-in-out infinite; }
.b5 { width:450px; height:450px; left:10%;  bottom:5%;   animation: float5 22s ease-in-out infinite; }
.blob::before { content:""; position:absolute; inset:0; border-radius:50%; opacity:0; transform:scale(0.82); }
.b1::before { background:radial-gradient(circle at 35% 35%,var(--colAcc2),transparent 60%); animation:breathe 16s ease-in-out infinite 0s; }
.b2::before { background:radial-gradient(circle at 65% 40%,var(--colAcc1),transparent 60%); animation:breathe 18s ease-in-out infinite 1.4s; }
.b3::before { background:radial-gradient(circle at 40% 60%,var(--colCon),transparent 55%),radial-gradient(circle at 62% 38%,var(--aurora-4),transparent 65%); animation:breathe 22s ease-in-out infinite 2.8s; }
.b4::before { background:radial-gradient(circle at 50% 50%,var(--colAcc3),transparent 60%); animation:breathe 14s ease-in-out infinite 0.7s; }
.b5::before { background:radial-gradient(circle at 40% 55%,var(--colCon),transparent 58%); animation:breathe 20s ease-in-out infinite 3.5s; }
@keyframes spin   { to{transform:rotate(360deg);} }
@keyframes float1 { 0%,100%{transform:translate(0,0);}  50%{transform:translate(5%,-4%);} }
@keyframes float2 { 0%,100%{transform:translate(0,0);}  50%{transform:translate(-4%,6%);} }
@keyframes float3 { 0%,100%{transform:translate(0,0);}  50%{transform:translate(3%,-5%);} }
@keyframes float4 { 0%,100%{transform:translate(0,0);}  50%{transform:translate(-6%,3%);} }
@keyframes float5 { 0%,100%{transform:translate(0,0);}  50%{transform:translate(4%,-3%);} }
@keyframes breathe { 0%{transform:scale(.80);opacity:0;} 10%{opacity:.72;} 50%{transform:scale(1.10);opacity:.78;} 90%{opacity:.72;} 100%{transform:scale(.80);opacity:0;} }

body {
  background-color: var(--colMain);
  height:100vh;
  background-attachment: fixed;
  background-size: 100% 100%;
  animation: none;
}