/* Cursor */
@media (hover: hover) and (pointer: fine) {
	html.unk-document--cursor:not(.unk-document--touch),
	html.unk-document--cursor:not(.unk-document--touch) * {
		cursor: none !important;
	}
}

html.unk-document--touch .unk-cursor {
	display: none !important;
}

@media (forced-colors: active) {
	.unk-cursor {
		display: none !important;
	}
}

.unk-cursor {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	display: none;
	width: auto;
	height: auto;
	padding-top: var(--unk-space-md);
	padding-left: var(--unk-space-md);
	color: var(--unk-color-text-muted);
	font-family: var(--unk-font-family-01);
	font-size: 0.5rem;
	line-height: 1;
	text-transform: uppercase;
	white-space: nowrap;
	pointer-events: none;
}

.unk-cursor__crosshair {
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	opacity: var(--unk-line-opacity);
	pointer-events: none;
}

.unk-cursor__cross {
	position: absolute;
	transform-origin: 0 0;
	will-change: transform;
}

.unk-cursor__cross--horizontal-start,
.unk-cursor__cross--horizontal-end {
	top: 0;
	left: 0;
	width: 100vw;
	height: 1px;
}

.unk-cursor__cross--vertical-start,
.unk-cursor__cross--vertical-end {
	top: 0;
	left: 0;
	width: 1px;
	height: 100vh;
}

.unk-cursor__cross--horizontal-start {
	transform-origin: 100% 50%;
}

.unk-cursor__cross--horizontal-end {
	transform-origin: 0% 50%;
}

.unk-cursor__cross--vertical-start {
	transform-origin: 50% 100%;
}

.unk-cursor__cross--vertical-end {
	transform-origin: 50% 0%;
}

.unk-cursor__cross-line {
	position: absolute;
	inset: 0;
	background: var(--unk-color-accent);
	will-change: transform;
}

.unk-cursor__cross--horizontal-start .unk-cursor__cross-line {
	transform-origin: right center;
}

.unk-cursor__cross--horizontal-end .unk-cursor__cross-line {
	transform-origin: left center;
}

.unk-cursor__cross--vertical-start .unk-cursor__cross-line {
	transform-origin: bottom center;
}

.unk-cursor__cross--vertical-end .unk-cursor__cross-line {
	transform-origin: top center;
}

.unk-cursor__pointer {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 15px;
	height: 15px;
	transform-origin: center;
	will-change: transform;
}

.unk-cursor__pointer-line {
	position: absolute;
	display: block;
	background: var(--unk-color-accent);
	box-shadow: 0 0 3px var(--unk-color-accent);
	box-shadow:
		0 0 3px var(--unk-color-accent),
		0 0 8px color-mix(in srgb, var(--unk-color-accent) 60%, transparent);
	transform-origin: center;
	will-change: transform, filter;
}

.unk-cursor__pointer-line--horizontal {
	top: 7px;
	left: 0;
	width: 100%;
	height: 1px;
}

.unk-cursor__pointer-line--vertical {
	top: 0;
	left: 7px;
	width: 1px;
	height: 100%;
}

.unk-cursor__label {
	position: absolute;
	top: 8px;
	left: 8px;
	width: max-content;
	color: var(--unk-color-accent);
	font-size: var(--unk-font-size-10);
	line-height: 1;
	white-space: nowrap;
	pointer-events: none;
	will-change: transform;
}

.unk-cursor__label-content {
	display: block;
}