#wpapp-preloader {
	position: fixed;
	top: 0; left: 0;
	width: 100%; height: 100%;
	background: #000; /* Black background */
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 999999;
}

.wpapp-preloader-wrapper {
	position: relative;
	width: var(--wpapp-width, 250px);
	aspect-ratio: 1 / 1; /* ✅ Keep it a perfect square */
	overflow: hidden;
}

.wpapp-preloader-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
	opacity: 0.2; /* ✅ Light opacity like your example */
}

.wpapp-preloader-wrapper::after {
	content: "";
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	background: var(--wpapp-image) no-repeat center/contain;
	opacity: 1;
	clip-path: inset(100% 0 0 0);
	animation: wpapp-fill 5s linear infinite;
}

@keyframes wpapp-fill {
	0%   { clip-path: inset(100% 0 0 0); }
	100% { clip-path: inset(0 0 0 0); }
}