/* Cursor — extraído de src/lib/components/Cursor.svelte.
   Scopeado con anidamiento nativo bajo su raíz para evitar colisiones
   de nombres de clase al pasar de CSS scoped de Svelte a CSS global. */

.cursor-ring,
	.cursor-core {
	position: fixed;
	left: 0;
	top: 0;
	border-radius: 50%;
	pointer-events: none;
	z-index: 9999;
	opacity: 0;
}

.cursor-ring.on,
	.cursor-core.on {
	opacity: 1;
}

.cursor-ring {
	width: 30px;
	height: 30px;
	border: 1.5px solid var(--ember);
	mix-blend-mode: difference;
	transition:
		width 0.25s,
		height 0.25s,
		background 0.25s;
}

.cursor-ring.is-hot {
	width: 52px;
	height: 52px;
	background: color-mix(in srgb, var(--accent) 20%, transparent);
}

.cursor-core {
	width: 6px;
	height: 6px;
	background: var(--ember);
}

@media (pointer: coarse) {
	.cursor-ring,
	.cursor-core {
		display: none;
	}
}