/* Cursor */
site-cursor {
	display: none;
	pointer-events: none;
}

@media (pointer: fine) {
	html,
	html * {
		cursor: none !important;
	}

	site-cursor {
		display: block;
	}

	site-cursor > .cursor-circle,
	site-cursor > .cursor-point {
		position: fixed;
		top: 0;
		left: 0;
		z-index: var(--unk-z-cursor);
		width: 1px;
		height: 1px;
		visibility: hidden;
		will-change: transform;
	}

	site-cursor.is-visible > .cursor-circle,
	site-cursor.is-visible > .cursor-point {
		visibility: visible;
	}

	site-cursor > .cursor-circle > span,
	site-cursor > .cursor-point > span {
		position: absolute;
		top: 50%;
		left: 50%;
		display: block;
		width: 16px;
		height: 16px;
		border-radius: 50%;
		background: var(--unk-color-01);
		opacity: 0.1;
		transform: translate(-50%, -50%);
	}

	site-cursor > .cursor-point > span {
		width: 6px;
		height: 6px;
		opacity: 1;
	}
}