.c68bi-scroll-circle-block {
	/* Keep a real box so fixed children are reliable across browsers. */
	position: static;
	height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	overflow: visible;
}

.c68bi-scroll-circle {
	position: fixed;
	bottom: max(var(--c68bi-sc-bottom, 24px), env(safe-area-inset-bottom, 0px));
	z-index: var(--c68bi-sc-z, 100000) !important;
	width: var(--c68bi-sc-width, var(--c68bi-sc-size, 56px));
	height: var(--c68bi-sc-height, var(--c68bi-sc-size, 56px));
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: var(--c68bi-sc-radius, 50%);
	background: var(--c68bi-sc-bg, #ffffff);
	box-shadow: var(--c68bi-sc-shadow, 0 8px 24px rgba(15, 23, 42, 0.14));
	filter: var(--c68bi-sc-filter, none);
	color: var(--c68bi-sc-text, #0f172a);
	display: grid;
	place-items: center;
	opacity: 0;
	visibility: hidden;
	transform: translateY(12px) scale(0.92);
	transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s ease;
	cursor: default;
	line-height: 1;
	appearance: none;
	-webkit-appearance: none;
}

.c68bi-scroll-circle[data-click-top="true"],
.c68bi-scroll-circle[data-click-action="top"] {
	cursor: pointer;
}

.c68bi-scroll-circle.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0) scale(1);
}

.c68bi-scroll-circle--bottom-right {
	right: max(var(--c68bi-sc-side, 24px), env(safe-area-inset-right, 0px));
	left: auto;
}

.c68bi-scroll-circle--bottom-left {
	left: max(var(--c68bi-sc-side, 24px), env(safe-area-inset-left, 0px));
	right: auto;
}

.c68bi-scroll-circle--bottom-center {
	left: 50%;
	right: auto;
	transform: translate(-50%, 12px) scale(0.92);
}

.c68bi-scroll-circle--bottom-center.is-visible {
	transform: translate(-50%, 0) scale(1);
}

.c68bi-scroll-circle__svg {
	position: absolute;
	inset: 0;
	display: block;
	overflow: visible;
	pointer-events: none;
}

.c68bi-scroll-circle__track,
.c68bi-scroll-circle__progress {
	fill: none !important;
	stroke-width: var(--c68bi-sc-stroke, 4px);
	stroke-linejoin: round;
}

.c68bi-scroll-circle__track {
	stroke: var(--c68bi-sc-track, rgba(15, 23, 42, 0.12)) !important;
}

.c68bi-scroll-circle__progress {
	stroke: var(--c68bi-sc-progress, #0f172a) !important;
	stroke-linecap: round;
	transition: stroke-dashoffset 0.05s linear;
	/* Keep dash math tied to pathLength="100". */
	stroke-dasharray: 100;
}

.c68bi-scroll-circle__fill {
	fill: var(--c68bi-sc-bg, #ffffff) !important;
	stroke: none !important;
}

.c68bi-scroll-circle__water-wave {
	fill: var(--c68bi-sc-water, #38bdf8);
}

.c68bi-scroll-circle__water-wave.is-deep {
	fill: var(--c68bi-sc-water-deep, #0ea5e9);
	opacity: 0.85;
}

.c68bi-scroll-circle__water-motion {
	animation: c68biScWaterWave 2.8s linear infinite;
}

.c68bi-scroll-circle--line-curve .c68bi-scroll-circle__track,
.c68bi-scroll-circle--line-curve .c68bi-scroll-circle__progress,
.c68bi-scroll-circle--line-wavy .c68bi-scroll-circle__track,
.c68bi-scroll-circle--line-wavy .c68bi-scroll-circle__progress {
	stroke-linejoin: round;
	stroke-linecap: round;
}

@keyframes c68biScWaterWave {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

.c68bi-scroll-circle--shape-circle {
	border-radius: 50%;
	overflow: hidden;
}

.c68bi-scroll-circle--shape-square,
.c68bi-scroll-circle--shape-square-sm,
.c68bi-scroll-circle--shape-rectangle,
.c68bi-scroll-circle--shape-rectangle-sm {
	overflow: hidden;
}

.c68bi-scroll-circle--shape-triangle,
.c68bi-scroll-circle--shape-triangle-sm {
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	filter: var(--c68bi-sc-triangle-filter, drop-shadow(0 6px 14px rgba(15, 23, 42, 0.16)));
}

.c68bi-scroll-circle--slant {
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	filter: var(--c68bi-sc-triangle-filter, drop-shadow(0 6px 14px rgba(15, 23, 42, 0.16)));
	overflow: visible;
}

.c68bi-scroll-circle--slant .c68bi-scroll-circle__svg {
	overflow: visible;
}

.c68bi-scroll-circle--slant .c68bi-scroll-circle__track,
.c68bi-scroll-circle--slant .c68bi-scroll-circle__progress {
	fill: none;
}

.c68bi-scroll-circle--shape-triangle .c68bi-scroll-circle__center,
.c68bi-scroll-circle--shape-triangle-sm .c68bi-scroll-circle__center {
	transform: translateY(14%);
}

.c68bi-scroll-circle__center {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	user-select: none;
	color: inherit;
}

.c68bi-scroll-circle__center--both {
	flex-direction: column;
	gap: 0.08em;
	line-height: 1;
}

.c68bi-scroll-circle__center--both .c68bi-scroll-circle__glyph {
	font-size: calc(min(var(--c68bi-sc-width, var(--c68bi-sc-size, 56px)), var(--c68bi-sc-height, var(--c68bi-sc-size, 56px))) * var(--c68bi-sc-icon-size, 0.38) * 0.85);
	line-height: 0;
}

.c68bi-scroll-circle__center--both .c68bi-scroll-circle__percent {
	font-size: calc(min(var(--c68bi-sc-width, var(--c68bi-sc-size, 56px)), var(--c68bi-sc-height, var(--c68bi-sc-size, 56px))) * var(--c68bi-sc-text-size, 0.22) * 0.75);
}

.c68bi-scroll-circle__percent {
	font-size: calc(min(var(--c68bi-sc-width, var(--c68bi-sc-size, 56px)), var(--c68bi-sc-height, var(--c68bi-sc-size, 56px))) * var(--c68bi-sc-text-size, 0.22));
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	letter-spacing: -0.02em;
	color: var(--c68bi-sc-text, #0f172a);
}

.c68bi-scroll-circle__glyph {
	font-size: calc(min(var(--c68bi-sc-width, var(--c68bi-sc-size, 56px)), var(--c68bi-sc-height, var(--c68bi-sc-size, 56px))) * var(--c68bi-sc-icon-size, 0.38));
	line-height: 0;
	color: var(--c68bi-sc-icon, var(--c68bi-sc-text, #0f172a));
}

.c68bi-scroll-circle__icon-svg {
	display: block;
	width: 1em;
	height: 1em;
}

.c68bi-scroll-circle__glyph[data-c68bi-sc-auto] .c68bi-scroll-circle__glyph-up,
.c68bi-scroll-circle__glyph[data-c68bi-sc-auto].is-down .c68bi-scroll-circle__glyph-up {
	display: none;
}

.c68bi-scroll-circle__glyph[data-c68bi-sc-auto] .c68bi-scroll-circle__glyph-down {
	display: inline-flex;
}

.c68bi-scroll-circle__glyph[data-c68bi-sc-auto].is-up .c68bi-scroll-circle__glyph-down {
	display: none;
}

.c68bi-scroll-circle__glyph[data-c68bi-sc-auto].is-up .c68bi-scroll-circle__glyph-up {
	display: inline-flex;
}

/* Horizontal / vertical scroll progress bars */
.c68bi-scroll-bar {
	position: fixed;
	z-index: calc(var(--c68bi-sc-z, 100000) + 10) !important;
	margin: 0;
	padding: 0;
	border: 0;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	overflow: visible;
	box-shadow: var(--c68bi-sc-shadow, none);
	filter: var(--c68bi-sc-filter, none);
	transition: opacity 0.28s ease, visibility 0.28s ease;
}

.c68bi-scroll-bar--horizontal {
	left: 0;
	right: 0;
	width: 100%;
	height: var(--c68bi-sc-bar-h, 4px);
	background: var(--c68bi-sc-bar-track, rgba(15, 23, 42, 0.12));
}

.c68bi-scroll-bar--horizontal.c68bi-scroll-bar--top {
	top: 0;
	bottom: auto;
}

.c68bi-scroll-bar--horizontal.c68bi-scroll-bar--bottom {
	bottom: 0;
	top: auto;
}

.c68bi-scroll-bar--vertical {
	top: 0;
	bottom: 0;
	height: 100%;
	width: var(--c68bi-sc-vbar-w, 4px);
	background: var(--c68bi-sc-vbar-track, rgba(15, 23, 42, 0.12));
}

.c68bi-scroll-bar--vertical.c68bi-scroll-bar--left {
	left: 0;
	right: auto;
}

.c68bi-scroll-bar--vertical.c68bi-scroll-bar--right {
	right: 0;
	left: auto;
}

.c68bi-scroll-bar.is-visible {
	opacity: 1;
	visibility: visible;
}

.c68bi-scroll-bar__fill {
	display: block;
	height: 100%;
	width: 100%;
	will-change: transform;
}

.c68bi-scroll-bar--horizontal .c68bi-scroll-bar__fill {
	background: var(--c68bi-sc-bar, #0f172a);
	transform: scaleX(0);
	transform-origin: left center;
}

.c68bi-scroll-bar--vertical .c68bi-scroll-bar__fill {
	background: var(--c68bi-sc-vbar, #0f172a);
	transform: scaleY(0);
	transform-origin: top center;
}

@media (prefers-reduced-motion: reduce) {
	.c68bi-scroll-circle,
	.c68bi-scroll-circle__progress,
	.c68bi-scroll-bar {
		transition: none;
	}

	.c68bi-scroll-circle__water-motion {
		animation: none;
	}
}

@media ( max-width: 767px ) {
	.c68bi-scroll-circle {
		width: min(var(--c68bi-sc-width, var(--c68bi-sc-size, 56px)), 72px);
		height: min(var(--c68bi-sc-height, var(--c68bi-sc-size, 56px)), 48px);
	}

	.c68bi-scroll-circle--shape-circle,
	.c68bi-scroll-circle--shape-square,
	.c68bi-scroll-circle--shape-square-sm {
		width: min(var(--c68bi-sc-width, var(--c68bi-sc-size, 56px)), 48px);
		height: min(var(--c68bi-sc-height, var(--c68bi-sc-size, 56px)), 48px);
	}

	.c68bi-scroll-circle--shape-square-sm {
		width: min(var(--c68bi-sc-width, var(--c68bi-sc-size, 40px)), 40px);
		height: min(var(--c68bi-sc-height, var(--c68bi-sc-size, 40px)), 40px);
	}

	.c68bi-scroll-circle--shape-rectangle-sm {
		width: min(var(--c68bi-sc-width, 52px), 56px);
		height: min(var(--c68bi-sc-height, 36px), 36px);
	}

	.c68bi-scroll-circle--shape-triangle-sm {
		width: min(var(--c68bi-sc-width, var(--c68bi-sc-size, 40px)), 40px);
		height: min(var(--c68bi-sc-height, var(--c68bi-sc-size, 40px)), 40px);
	}
}