/* Ready Infinity – cursor círculo sólido con contraste + vida permanente */
html.ri-cursor-on,
html.ri-cursor-on * {
	cursor: none !important;
}

html.ri-cursor-on input,
html.ri-cursor-on textarea,
html.ri-cursor-on select,
html.ri-cursor-on [contenteditable="true"] {
	cursor: text !important;
}

#ri-cursor {
	position: fixed;
	top: 0;
	left: 0;
	width: 22px;
	height: 22px;
	margin: -11px 0 0 -11px;
	z-index: 99950;
	pointer-events: none;
	opacity: 0;
	visibility: hidden;
	/* El blend va en el mismo nodo que se mueve; si va en un hijo, el transform lo anula */
	mix-blend-mode: difference;
	will-change: transform, width, height, margin;
	transform: translate3d(-100px, -100px, 0);
	transition:
		width 0.28s cubic-bezier(0.22, 1, 0.36, 1),
		height 0.28s cubic-bezier(0.22, 1, 0.36, 1),
		margin 0.28s cubic-bezier(0.22, 1, 0.36, 1),
		opacity 0.2s ease,
		visibility 0.2s linear;
}

#ri-cursor__blob {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: #ffffff;
	transform-origin: 50% 50%;
	will-change: transform, border-radius;
	animation: ri-cursor-live 2.4s ease-in-out infinite;
}

html.ri-cursor-on #ri-cursor.is-on {
	opacity: 1;
	visibility: visible;
}

html.ri-cursor-on #ri-cursor.is-hidden {
	opacity: 0;
	visibility: hidden;
}

/* Hover interactivo: círculo más grande + latido más vivo */
#ri-cursor.is-hover {
	width: 48px;
	height: 48px;
	margin: -24px 0 0 -24px;
}

#ri-cursor.is-hover #ri-cursor__blob {
	animation-duration: 1.35s;
}

/* Click: aprieta un instante */
#ri-cursor.is-click {
	width: 16px;
	height: 16px;
	margin: -8px 0 0 -8px;
	transition-duration: 0.1s;
}

#ri-cursor.is-hover.is-click {
	width: 36px;
	height: 36px;
	margin: -18px 0 0 -18px;
}

#ri-cursor.is-click #ri-cursor__blob {
	animation: none;
	transform: scale(0.92);
	border-radius: 50%;
}

/* Respiración + morfología suave permanente */
@keyframes ri-cursor-live {
	0%,
	100% {
		transform: scale(1) rotate(0deg);
		border-radius: 50%;
	}
	25% {
		transform: scale(1.1, 0.92) rotate(4deg);
		border-radius: 46% 54% 52% 48%;
	}
	50% {
		transform: scale(0.94) rotate(0deg);
		border-radius: 50%;
	}
	75% {
		transform: scale(1.06, 1.12) rotate(-4deg);
		border-radius: 54% 46% 48% 52%;
	}
}

@media (prefers-reduced-motion: reduce) {
	#ri-cursor {
		display: none !important;
	}

	html.ri-cursor-on,
	html.ri-cursor-on * {
		cursor: auto !important;
	}
}

@media (hover: none), (pointer: coarse) {
	#ri-cursor {
		display: none !important;
	}

	html.ri-cursor-on,
	html.ri-cursor-on * {
		cursor: auto !important;
	}
}
