/* Farmville Theme — Loading screens (front-end overlay, preview page, admin swatches) */

/* ── Full-screen overlay ────────────────────────────────────────────────── */
#tc-preloader.fv-load {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 18px;
	background: #f7f1e3;
	opacity: 1;
	visibility: visible;
	transition: opacity .5s ease, visibility .5s ease;
}
#tc-preloader.fv-load.loaded {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}
.fv-load-art {
	width: min(60vw, 260px);
	height: min(60vw, 260px);
	display: flex;
	align-items: center;
	justify-content: center;
}
.fv-load-art svg { width: 100%; height: 100%; overflow: visible; }
.fv-load-cap { text-align: center; }
.fv-load-sub {
	display: block;
	font: 600 14px/1 system-ui, -apple-system, "Segoe UI", sans-serif;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #b76a3c;
	margin-bottom: 10px;
}
.fv-load-bar {
	width: 180px;
	height: 6px;
	border-radius: 999px;
	background: #e6dcc7;
	overflow: hidden;
	margin: 0 auto;
}
.fv-load-bar-fill {
	display: block;
	height: 100%;
	width: 40%;
	border-radius: 999px;
	background: linear-gradient(90deg, #d98a4a, #b76a3c);
	animation: fvload-progress 1.4s ease-in-out infinite;
}

/* ── Admin swatch (dashboard picker) ────────────────────────────────────── */
.tc-load-swatch {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	background: #f7f1e3;
	border-radius: 10px;
	overflow: hidden;
}
.tc-load-swatch svg { width: 100%; height: 100%; overflow: visible; }

/* ── Keyframes ──────────────────────────────────────────────────────────── */
@keyframes fvload-progress { 0% { transform: translateX(-110%); } 100% { transform: translateX(360%); } }
@keyframes fvload-peck { 0%,60% { transform: translate(0,0) rotate(0); } 70% { transform: translate(2px,16px) rotate(18deg); } 80% { transform: translate(2px,16px) rotate(18deg); } 100% { transform: translate(0,0) rotate(0); } }
@keyframes fvload-worm-wiggle { 0%,100% { d: path("M -10 6 Q -5 0 0 6 T 10 6 T 20 6"); } 50% { d: path("M -10 6 Q -5 12 0 6 T 10 6 T 20 6"); } }
@keyframes fvload-worm-shrink { 0%,65% { transform: scaleX(1); opacity: 1; } 75% { transform: scaleX(.35); opacity: .6; } 80%,100% { transform: scaleX(1); opacity: 1; } }
@keyframes fvload-chew { 0%,40%,80%,100% { transform: translateY(0); } 20%,60% { transform: translateY(2px); } }
@keyframes fvload-graze { 0%,100% { transform: rotate(0) translateY(0); } 45%,55% { transform: rotate(18deg) translateY(8px); } }
@keyframes fvload-grass-bend { 0%,100% { transform: rotate(0); } 50% { transform: rotate(-12deg); } }
@keyframes fvload-roll { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } }
@keyframes fvload-splash { 0%,80%,100% { opacity: 0; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-14px); } }
@keyframes fvload-hop { 0%,100% { transform: translate(0,0) rotate(0); } 25% { transform: translate(0,-26px) rotate(-8deg); } 50% { transform: translate(0,0) rotate(0); } }
@keyframes fvload-count-pop { 0%,100% { opacity: 0; transform: translateY(10px) scale(.8); } 30%,70% { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes fvload-float-bob { 0%,100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-4px) rotate(2deg); } }
@keyframes fvload-ripple { 0% { r: 6; opacity: .6; } 100% { r: 42; opacity: 0; } }
@keyframes fvload-hop-side { 0%,100% { transform: translateX(0) translateY(0); } 25% { transform: translateX(10px) translateY(-18px); } 50% { transform: translateX(20px) translateY(0); } 75% { transform: translateX(10px) translateY(-18px); } }
@keyframes fvload-ear-flop { 0%,100% { transform: rotate(0); } 50% { transform: rotate(-14deg); } }
@keyframes fvload-orbit { 0% { transform: rotate(0) translateX(46px) rotate(0); } 100% { transform: rotate(360deg) translateX(46px) rotate(-360deg); } }
@keyframes fvload-wing-buzz { 0%,100% { transform: scaleY(1); } 50% { transform: scaleY(.3); } }
@keyframes fvload-sun-rise { 0% { transform: translateY(40px); } 100% { transform: translateY(0); } }
@keyframes fvload-crow-bob { 0%,70%,100% { transform: rotate(0); } 80%,90% { transform: rotate(-12deg); } }
@keyframes fvload-bubble-pop { 0%,60%,100% { opacity: 0; transform: scale(.6); } 75%,85% { opacity: 1; transform: scale(1); } }
@keyframes fvload-gallop { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@keyframes fvload-leg-run-a { 0%,100% { transform: rotate(20deg); } 50% { transform: rotate(-25deg); } }
@keyframes fvload-leg-run-b { 0%,100% { transform: rotate(-25deg); } 50% { transform: rotate(20deg); } }
@keyframes fvload-dust { 0% { opacity: .7; transform: translate(0,0) scale(.4); } 100% { opacity: 0; transform: translate(-26px,-4px) scale(1.4); } }
@keyframes fvload-nibble { 0%,100% { transform: rotate(0); } 50% { transform: rotate(10deg) translateY(3px); } }
@keyframes fvload-bush-shake { 0%,100% { transform: translateX(0); } 25% { transform: translateX(-1px) rotate(-2deg); } 75% { transform: translateX(1px) rotate(2deg); } }

@media (prefers-reduced-motion: reduce) {
	.fv-load-art svg * , .fv-load-bar-fill { animation: none !important; }
}