/** Loading screen */
#foreground {
	overflow: visible;
	z-index: 999;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	transition: opacity 0.5s ease;
}

#foreground.loaded {
	/* opacity: 0; */
	pointer-events: none;
}

.preloader {
	position: relative;
	/* background: var(--primary); */
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	user-select: none;
}

#followCursor {
	height: 200vw;
	width: 200vw;
	user-select: none;
}

#loading {
	position: fixed;
	color: var(--background);
	z-index: 9;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	white-space: nowrap;
}

#loading > span {
	position: relative;
	display: inline-block;
	z-index: 9;
	opacity: 0;
	filter: blur(10px);
	transform: translate(0, -50%);
}

#loading.hidden {
	animation: fadeOut 0.5s ease forwards;
}

@keyframes fadeOut {
	to {
		opacity: 0;
		transform: translate(-50%, -50%) scale(0.8);
	}
}
