.digimax-animations-layer {
  --dax-hearts-color: #e8416d;
  --dax-hearts-secondary-color: #ff8fb3;
  --dax-snow-color: #ffffff;
  --dax-snow-shadow-color: #d8f3ff;
  --dax-layer-opacity: 0.85;
  contain: layout paint style;
  inset: 0;
  opacity: var(--dax-layer-opacity);
  overflow: hidden;
  pointer-events: none;
  position: fixed;
  width: 100%;
  z-index: 9999;
}

.digimax-animations-layer,
.digimax-animations-layer * {
  box-sizing: border-box;
}

.digimax-animations-particle {
  display: block;
  left: var(--dax-left);
  pointer-events: none;
  position: absolute;
  top: -14vh;
  will-change: transform, opacity;
}

.digimax-animations-heart {
  animation: digimax-animations-heart-fall var(--dax-duration) linear var(--dax-delay) infinite;
  background: var(--dax-hearts-color);
  height: var(--dax-size);
  opacity: var(--dax-particle-opacity);
  transform: rotate(-45deg);
  width: var(--dax-size);
}

.digimax-animations-heart:nth-child(2n) {
  background: var(--dax-hearts-secondary-color);
}

.digimax-animations-heart::before,
.digimax-animations-heart::after {
  background: inherit;
  border-radius: 999px;
  content: "";
  display: block;
  height: var(--dax-size);
  position: absolute;
  width: var(--dax-size);
}

.digimax-animations-heart::before {
  top: calc(var(--dax-size) * -0.5);
}

.digimax-animations-heart::after {
  left: calc(var(--dax-size) * 0.5);
}

.digimax-animations-snow {
  animation: digimax-animations-snow-fall var(--dax-duration) linear var(--dax-delay) infinite;
  background: var(--dax-snow-color);
  border-radius: 999px;
  box-shadow: 0 0 10px var(--dax-snow-shadow-color);
  height: var(--dax-size);
  opacity: var(--dax-particle-opacity);
  width: var(--dax-size);
}

@keyframes digimax-animations-heart-fall {
  0% {
    opacity: 0;
    transform: translate3d(0, -14vh, 0) rotate(-45deg) scale(0.86);
  }

  8% {
    opacity: var(--dax-particle-opacity);
  }

  50% {
    transform: translate3d(var(--dax-drift-half), 52vh, 0) rotate(var(--dax-spin-half)) scale(1);
  }

  92% {
    opacity: var(--dax-particle-opacity);
  }

  100% {
    opacity: 0;
    transform: translate3d(var(--dax-drift), 116vh, 0) rotate(var(--dax-spin-final)) scale(1.08);
  }
}

@keyframes digimax-animations-snow-fall {
  0% {
    opacity: 0;
    transform: translate3d(0, -12vh, 0);
  }

  10% {
    opacity: var(--dax-particle-opacity);
  }

  50% {
    transform: translate3d(var(--dax-drift-half), 52vh, 0);
  }

  94% {
    opacity: var(--dax-particle-opacity);
  }

  100% {
    opacity: 0;
    transform: translate3d(var(--dax-drift), 112vh, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .digimax-animations-layer {
    opacity: 0.35;
  }

  .digimax-animations-particle {
    animation-duration: calc(var(--dax-duration) * 2);
  }
}
