.rd-back-to-top {
	position: fixed;
	right: clamp(18px, 3vw, 36px);
	bottom: clamp(18px, 3vw, 36px);
	z-index: 90;
	display: grid;
	width: 48px;
	height: 48px;
	padding: 0;
	place-items: center;
	border: 1px solid var(--rd-border, rgba(255, 255, 255, .14));
	border-radius: 50%;
	background: var(--rd-surface, #11151a);
	box-shadow: 0 12px 32px rgba(0, 0, 0, .28);
	color: #fff;
	cursor: pointer;
	opacity: 0;
	pointer-events: none;
	transform: translateY(10px);
	transition: opacity 180ms ease, transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.rd-back-to-top.is-visible {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);
}

.rd-back-to-top:hover {
	border-color: #5e949f;
	background: #1a2027;
	color: #5e949f;
	box-shadow: 0 16px 36px rgba(0, 0, 0, .34), 0 0 0 4px rgba(55, 217, 255, .12);
}

.rd-back-to-top.is-visible:hover {
	transform: translateY(-3px);
}

.rd-back-to-top.is-visible:active {
	transform: translateY(-1px) scale(.96);
}

.rd-back-to-top:focus-visible {
	outline: 3px solid var(--rd-accent, #37d9ff);
	outline-offset: 4px;
}

.rd-back-to-top svg {
	width: 22px;
	height: 22px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;
	transition: transform 180ms ease;
}

.rd-back-to-top:hover svg {
	transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
	.rd-back-to-top {
		transition: none;
	}

	.rd-back-to-top.is-visible:hover,
	.rd-back-to-top.is-visible:active {
		transform: translateY(0);
	}

	.rd-back-to-top svg {
		transition: none;
	}

	.rd-back-to-top:hover svg {
		transform: none;
	}
}
