/* =========================================================
   AniLog — атмосферный фон
   ========================================================= */

/* ---------- Атмосферный фон ---------- */

.ambient {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}

.ambient::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.32;
  background-image: radial-gradient(rgba(255, 255, 255, 0.06) 0.7px, transparent 0.9px);
  background-size: 34px 34px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), transparent 86%);
  -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), transparent 86%);
}

.ambient__glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(110px);
  will-change: transform;
}

.ambient__glow--violet {
  width: 46vw;
  height: 46vw;
  min-width: 440px;
  min-height: 440px;
  top: -24vw;
  left: -10vw;
  background: radial-gradient(circle, rgba(124, 77, 255, 0.35), transparent 68%);
  animation: drift-violet 24s ease-in-out infinite alternate;
}

.ambient__glow--cyan {
  width: 36vw;
  height: 36vw;
  min-width: 340px;
  min-height: 340px;
  top: 12vh;
  right: -18vw;
  background: radial-gradient(circle, rgba(56, 189, 248, 0.18), transparent 68%);
  animation: drift-cyan 30s ease-in-out infinite alternate;
}

.ambient__glow--rose {
  width: 34vw;
  height: 34vw;
  min-width: 320px;
  min-height: 320px;
  bottom: -18vw;
  left: 30vw;
  background: radial-gradient(circle, rgba(244, 114, 182, 0.09), transparent 68%);
  animation: drift-rose 26s ease-in-out infinite alternate;
}

.ambient__grain {
  position: absolute;
  inset: 0;
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}