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

.snow__flake {
	position: absolute;
	top: -6vh;
	left: var(--_left, 0);
	width: var(--_size, 8px);
	height: var(--_size, 8px);
	border-radius: 50%;
	background: #ffffff;
	opacity: var(--_opacity, .8);
	filter: drop-shadow(0 0 6px rgba(255, 255, 255, .8));
	will-change: transform;
	animation: snow-fall var(--_duration, 10s) linear var(--_delay, 0s) infinite;
}

@keyframes snow-fall {
	from {
		transform: translate3d(0, 0, 0);
	}
	to {
		transform: translate3d(var(--_drift, 0px), 112vh, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.snow {
		display: none;
	}
}