/* components/background/raindrop/index.wxss */
page {
	width: 100%;
	height: 100%;
	position: fixed;
}

.raindrops {
	width: 100%;
	height: 100%;
	z-index: -1;
	overflow: hidden;
	position: absolute;
	transform: rotate(3deg);

	@keyframes rainFall {
		from {
			transform: translateY(-10px);
		}
	
		to {
			transform: translateY(100vh);
		}
	}

	.raindrop {
		top: 0;
		width: 2px;
		height: 30px;
		opacity: .6;
		position: absolute;
		animation: rainFall linear infinite;
		background: linear-gradient(180deg, transparent, var(--theme-content-rain));
	}
}