/* ---------------------------------------------------------------------
   Fond "espace lointain" partage — mascotte_login.html / mascotte_register.html
   Couches (arriere -> avant) : nebuleuses CSS -> etoiles (canvas) ->
   etoile filante (canvas) -> scene 3D de noeuds (three.js, cf script inline)
   -> grille animee (deja fournie par mascotte-theme.css)
--------------------------------------------------------------------- */

.space-bg {
  position:fixed; inset:0; z-index:-5;
  overflow:hidden;
  pointer-events:none;
}

.space-bg .nebula {
  position:absolute;
  border-radius:50%;
  filter:blur(70px);
  will-change:transform;
}
.space-bg .neb1 {
  width:620px; height:620px; top:-12%; left:-10%;
  background:radial-gradient(circle, rgba(0,180,255,.16), transparent 70%);
  animation:nebDrift1 52s ease-in-out infinite alternate;
}
.space-bg .neb2 {
  width:560px; height:560px; bottom:-15%; right:-8%;
  background:radial-gradient(circle, rgba(130,70,220,.15), transparent 70%);
  animation:nebDrift2 64s ease-in-out infinite alternate;
}
.space-bg .neb3 {
  width:480px; height:480px; top:35%; right:15%;
  background:radial-gradient(circle, rgba(200,60,180,.1), transparent 72%);
  animation:nebDrift3 45s ease-in-out infinite alternate;
}
@keyframes nebDrift1 { from { transform:translate(0,0); } to { transform:translate(50px,35px); } }
@keyframes nebDrift2 { from { transform:translate(0,0); } to { transform:translate(-45px,-30px); } }
@keyframes nebDrift3 { from { transform:translate(0,0); } to { transform:translate(-30px,40px); } }

#starfield-canvas {
  position:fixed; inset:0; z-index:-4;
  width:100%; height:100%;
  pointer-events:none;
}

#hero-canvas {
  position:fixed; inset:0; z-index:-3;
  width:100%; height:100%;
  opacity:0; transition:opacity 1.6s ease;
  pointer-events:none;
}
#hero-canvas.is-ready { opacity:.15; }

@media (prefers-reduced-motion: reduce) {
  .space-bg .nebula { animation:none !important; }
}