.CosmicGalaxyCanvasContainer {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.015), transparent 18%),
    radial-gradient(ellipse at 50% 44%, rgba(255, 255, 255, 0.045), transparent 44%),
    #020204;
  overflow: hidden;
  isolation: isolate;
}

.CosmicGalaxyCanvasContainer::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 148px),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.012) 0 1px, transparent 1px 132px);
  opacity: 0.16;
  mix-blend-mode: screen;
  animation: CosmicGridBreathingAnimation 12s ease-in-out infinite alternate;
}

.CosmicGalaxyCanvasContainer::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  background:
    radial-gradient(ellipse at 50% 35%, transparent 0%, rgba(2, 2, 4, 0.16) 54%, rgba(2, 2, 4, 0.78) 100%),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 5px);
  opacity: 0.58;
  mix-blend-mode: multiply;
}

.CosmicGalaxyCanvasElement {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}

.CosmicNebulaVignetteOverlay {
  position: absolute;
  inset: 0;
  z-index: 4;
  background:
    linear-gradient(90deg, rgba(2, 2, 4, 0.72), transparent 18%, transparent 82%, rgba(2, 2, 4, 0.72)),
    radial-gradient(ellipse at 50% 40%, transparent 42%, rgba(3, 3, 5, 0.38) 82%, rgba(3, 3, 5, 0.86) 100%);
  pointer-events: none;
}

@keyframes CosmicGridBreathingAnimation {
  0% {
    opacity: 0.08;
    transform: scale(1);
  }
  100% {
    opacity: 0.18;
    transform: scale(1.018);
  }
}