/*
 * Styles for the celebration elements spawned by the shared scratch-card
 * module (assets/js/wcard-scratch-reveal.js). Loaded alongside that script
 * for any template that declares "Uses Shared Scratch: true". Uses
 * var(--accent)/var(--primary) so it themes itself to whatever colors are
 * set in the admin, regardless of which template is active.
 */
.wcard-shared-spark{
	position:fixed;
	z-index:1200;
	width:6px; height:6px;
	border-radius:50%;
	background:radial-gradient(circle, #fff, var(--accent));
	box-shadow:0 0 8px 2px var(--accent);
	pointer-events:none;
	animation:wcardSharedSparkFly 0.8s ease-out forwards;
}
@keyframes wcardSharedSparkFly{
	to{ transform:translate(var(--dx), var(--dy)) scale(0); opacity:0; }
}

.wcard-shared-petal-burst{
	position:fixed;
	top:-30px;
	width:14px; height:14px;
	background:radial-gradient(circle at 30% 30%, #fff, var(--accent));
	border-radius:70% 0 70% 0;
	z-index:1250;
	pointer-events:none;
	animation-name:wcardSharedPetalBurstFall;
	animation-timing-function:linear;
	animation-fill-mode:forwards;
}
@keyframes wcardSharedPetalBurstFall{
	0%{ transform:translateY(0) translateX(0) rotate(0deg); opacity:0.95; }
	100%{ transform:translateY(105vh) translateX(var(--drift)) rotate(400deg); opacity:0; }
}

.wcard-shared-confetti{
	position:fixed;
	z-index:1300;
	pointer-events:none;
	border-radius:1px;
	animation-name:wcardSharedConfettiFall;
	animation-timing-function:ease-out;
	animation-fill-mode:forwards;
}
@keyframes wcardSharedConfettiFall{
	0%{ transform:translate(0,0) rotate(0deg); opacity:1; }
	100%{ transform:translate(var(--drift), var(--fall)) rotate(var(--spin)); opacity:0; }
}