/* Žvaigždutės plaukia, sukasi ir išblėsdamos užleidžia vietą kitoms. */
.little-magic { position: relative; isolation: isolate; }
.magijos-zvaigzdutes { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: -1; }
.magijos-zvaigzdute {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--dydis);
  height: var(--dydis);
  color: var(--spalva);
  opacity: 0;
  animation: magijos-zvaigzdes-pulsas var(--trukme) ease-in-out infinite;
  animation-delay: var(--velavimas);
}
.magijos-zvaigzdute svg {
  display: block;
  width: 100%;
  height: 100%;
  animation: zvaigzdutes-plaukimas var(--plaukimo-trukme) ease-in-out infinite alternate;
  animation-delay: var(--velavimas);
}
@keyframes zvaigzdutes-plaukimas {
  from { transform: translate(0, 0) rotate(-12deg); }
  to { transform: translate(var(--plaukimas-x), var(--plaukimas-y)) rotate(28deg); }
}
@keyframes magijos-zvaigzdes-pulsas {
  0%, 100% { transform: scale(.25); opacity: 0; filter: drop-shadow(0 0 0 transparent); }
  20%, 75% { opacity: .35; }
  45% { transform: scale(1.18); opacity: .6; filter: drop-shadow(0 0 5px currentColor); }
  85% { transform: scale(.65); opacity: .15; }
}
.zvaigzdutes-sustabdytos * { animation-play-state: paused; }
@media (max-width: 760px) { .magijos-zvaigzdute:nth-child(3n) { display: none; } }
@media (prefers-reduced-motion: reduce) { .magijos-zvaigzdute { animation: none; opacity: .2; } .magijos-zvaigzdute svg { animation: none; } }