/* Free-roaming cartoon mouse — happy roam → sad hide → repeat */
.ei-scroll-mouse {
	--ei-mouse-w: 96px;
	--ei-mouse-h: 96px;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 90;
	width: var(--ei-mouse-w);
	height: var(--ei-mouse-h);
	pointer-events: none;
	will-change: transform, opacity;
	opacity: 0;
	transform: translate3d(0, 0, 0);
	transition: opacity 0.55s ease;
	/* Never expand page width / cause horizontal scrollbar */
	contain: layout style;
}

.ei-scroll-mouse.is-ready {
	opacity: 1;
}

.ei-scroll-mouse.is-hiding {
	opacity: 0;
}

.ei-scroll-mouse__sprite {
	display: block;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: contain;
	filter: drop-shadow(0 8px 14px rgba(15, 23, 42, 0.18));
	transform-origin: center bottom;
	transition: transform 0.25s ease;
}

.ei-scroll-mouse.is-left .ei-scroll-mouse__sprite {
	transform: scaleX(-1);
}

.ei-scroll-mouse[data-pose="run"] .ei-scroll-mouse__sprite {
	background-image: url('../images/mouse-happy-run.png');
}

.ei-scroll-mouse[data-pose="side"] .ei-scroll-mouse__sprite {
	background-image: url('../images/mouse-happy-side.png');
}

.ei-scroll-mouse[data-pose="wave"] .ei-scroll-mouse__sprite {
	background-image: url('../images/mouse-happy-wave.png');
}

.ei-scroll-mouse[data-pose="up"] .ei-scroll-mouse__sprite {
	background-image: url('../images/mouse-look-up.png');
}

.ei-scroll-mouse[data-pose="sad"] .ei-scroll-mouse__sprite {
	background-image: url('../images/mouse-sad-down.png');
	transform: scaleX(1) translateY(6px);
}

.ei-scroll-mouse.is-left[data-pose="sad"] .ei-scroll-mouse__sprite {
	transform: scaleX(-1) translateY(6px);
}

@media (max-width: 560px) {
	.ei-scroll-mouse {
		--ei-mouse-w: 72px;
		--ei-mouse-h: 72px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ei-scroll-mouse__sprite {
		transition: none;
	}
}
