.ml-confetti-container {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	pointer-events: none;
	z-index: 9999999;
	overflow: hidden;
	perspective: 1000px;
}

/* STANDARD */
.ml-confetti-piece {
	position: absolute;
	width: 15px;
	height: 15px;
	opacity: 0;
	top: var(--start-y, -50px);
	left: var(--start-x, 50%);
	will-change: transform, opacity;
	--ml-scale: 1;
}

/* OBLICI */
.ml-confetti-piece.is-round { width: 6px; height: 6px; border-radius: 50%; }
.ml-confetti-piece.is-tiny { width: 2px; height: 2px; border-radius: 50%; }
.ml-confetti-piece.is-streamer { width: 5px; height: 40px; border-radius: 10%; }
.ml-confetti-piece.is-blurred { filter: blur(2px); }

/* MOBILE */
@media (max-width: 768px) {
	.ml-confetti-piece { width: 8px; height: 8px; }
	.ml-confetti-piece.is-streamer { width: 4px; height: 20px; }
}

/* ANIMACIJA */
.ml-confetti-piece.animate {
	animation: mlFluidFall var(--duration) cubic-bezier(1, 0.1, 0.1, 1.0) forwards;
}

@keyframes mlFluidFall {
	0% {
		opacity: 0;
		transform: translate3d(0,0,0) rotateX(0) rotateY(0) scale(var(--ml-scale));
	}
	10% {
		opacity: 1;
		transform: translate3d(var(--side-kick), var(--up-kick), 0)
			rotateX(var(--rot-apex-x))
			rotateY(var(--rot-apex-y))
			scale(var(--ml-scale));
	}
	100% {
		opacity: 0;
		transform: translate3d(calc(var(--side-kick) + var(--drift)), 100vh, 0)
			rotateX(var(--rot-x))
			rotateY(var(--rot-y))
			scale(var(--ml-scale));
	}
}
