/* ---------- Ambient background glows ---------- */

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

.ambient__glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
}

.ambient__glow--top {
  top: -160px;
  left: 50%;
  width: 520px;
  height: 520px;
  margin-left: -260px;
  opacity: calc(var(--glow-opacity) * 0.8);
  background: radial-gradient(circle, var(--accent) 0%, transparent 68%);
  animation: drift 14s ease-in-out infinite;
  filter: blur(64px);
  transition: background 700ms ease, opacity 700ms ease;
}

.ambient__glow--bottom {
  bottom: -120px;
  left: -80px;
  width: 380px;
  height: 380px;
  filter: blur(80px);
  opacity: 0.35;
  background: radial-gradient(circle, var(--accent-2) 0%, transparent 70%);
  animation: floaty 11s ease-in-out infinite;
  transition: background 700ms ease;
}

@keyframes drift {
  0%,
  100% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  50% {
    transform: translate3d(30px, 20px, 0) scale(1.12);
  }
}

@keyframes floaty {
  0%,
  100% {
    transform: translate3d(0, 0, 0);
  }
  50% {
    transform: translate3d(0, -26px, 0);
  }
}

@keyframes sliderHintBounce {
  0%,
  100% {
    transform: translateY(0);
    opacity: 0.65;
  }
  50% {
    transform: translateY(-4px);
    opacity: 1;
  }
}

/* ---------- Level icon pop-in on level change ---------- */

.level-card__icon.level-changed {
  animation: popin 400ms ease;
}

@keyframes popin {
  0% {
    opacity: 0;
    transform: scale(0.6) translateY(8px);
  }
  60% {
    transform: scale(1.08);
  }
  100% {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

/* ---------- Achievement unlock pop ---------- */

.achievement-card.just-unlocked {
  animation: unlock-pop 0.6s ease;
}

@keyframes unlock-pop {
  0% {
    transform: scale(1);
  }
  40% {
    transform: scale(1.12);
    box-shadow: 0 0 24px var(--accent);
  }
  100% {
    transform: scale(1);
  }
}

/* ---------- Motion sensitivity ---------- */

@media (prefers-reduced-motion: reduce) {
  .ambient__glow--top,
  .ambient__glow--bottom,
  .level-card__icon.level-changed,
  .achievement-card.just-unlocked,
  .slider-hint__arrow {
    animation: none;
  }

  .hype-meter__fill,
  body {
    transition-duration: 0.01ms !important;
  }
}