.veil-progress-ui {
	position: fixed;
	z-index: 2147483647;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	opacity: 1;
	transition: opacity var(--veil-duration, 400ms) ease;
}

html.veil-revealing .veil-progress-ui,
html.veil-ready .veil-progress-ui {
	opacity: 0;
}

.veil-progress-group {
	position: absolute;
	left: 50%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	width: min(var(--veil-progress-width, 180px), calc(100vw - 40px));
	transform: translateX(-50%);
}

.veil-loader-text {
	position: absolute;
	left: 50%;
	display: block;
	box-sizing: border-box;
	width: min(720px, calc(100vw - 40px));
	color: var(--veil-text-color, #fff);
	font-family: var(--veil-text-font, inherit);
	font-size: var(--veil-text-size, 18px);
	font-weight: var(--veil-text-weight, 400);
	line-height: 1.5;
	text-align: var(--veil-text-align, center);
	white-space: pre-line;
	transform: translateX(-50%);
}

.veil-loader-text[data-position="below"] {
	top: calc(50% + var(--veil-indicator-half, 21px) + var(--veil-text-gap, 24px));
}

.veil-loader-text[data-position="above"] {
	bottom: calc(50% + var(--veil-indicator-half, 21px) + var(--veil-text-gap, 24px));
}

.veil-progress-ui[data-position="below"] .veil-progress-group {
	top: calc(50% + var(--veil-indicator-half, 21px) + var(--veil-progress-gap, 20px));
}

.veil-progress-ui[data-position="above"] .veil-progress-group {
	bottom: calc(50% + var(--veil-indicator-half, 21px) + var(--veil-progress-gap, 20px));
}

.veil-progress-ui[data-has-text="1"][data-position="below"][data-text-position="below"] .veil-progress-group {
	top: calc(50% + var(--veil-indicator-half, 21px) + var(--veil-text-gap, 24px) + var(--veil-text-block-height, 27px) + var(--veil-progress-gap, 20px));
}

.veil-progress-ui[data-has-text="1"][data-position="above"][data-text-position="above"] .veil-progress-group {
	bottom: calc(50% + var(--veil-indicator-half, 21px) + var(--veil-text-gap, 24px) + var(--veil-text-block-height, 27px) + var(--veil-progress-gap, 20px));
}

.veil-progress-track {
	position: relative;
	display: block;
	overflow: hidden;
	width: 100%;
	height: var(--veil-progress-height, 4px);
	border-radius: 999px;
	background: var(--veil-progress-track, rgba(255, 255, 255, .24));
}

.veil-progress-fill {
	position: absolute;
	inset: 0;
	display: block;
	border-radius: inherit;
	background: var(--veil-progress-color, #fff);
	transform: scaleX(0);
	transition: transform 120ms linear;
}

.veil-progress-percentage {
	display: block;
	color: var(--veil-percentage-color, #fff);
	font-family: var(--veil-percentage-font, inherit);
	font-size: var(--veil-percentage-size, 14px);
	font-variant-numeric: tabular-nums;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
}

.veil-progress-image {
	position: absolute;
	top: 50%;
	left: 50%;
	display: block;
	width: var(--veil-image-size, 96px);
	height: var(--veil-image-size, 96px);
	transform: translate(-50%, -50%);
}

.veil-progress-image-base,
.veil-progress-image-fill {
	position: absolute;
	inset: 0;
	display: block;
	background-image: var(--veil-image);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

.veil-progress-image-base {
	opacity: .28;
}

.veil-progress-image-fill {
	clip-path: inset(0 100% 0 0);
	transition: clip-path 120ms linear;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="fade"] .veil-progress-image {
	animation: veil-image-fade var(--veil-loader-speed) ease both;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="fade_up"] .veil-progress-image {
	animation: veil-progress-image-up var(--veil-loader-speed) ease both;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="fade_down"] .veil-progress-image {
	animation: veil-progress-image-down var(--veil-loader-speed) ease both;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="fade_left"] .veil-progress-image {
	animation: veil-progress-image-left var(--veil-loader-speed) ease both;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="fade_right"] .veil-progress-image {
	animation: veil-progress-image-right var(--veil-loader-speed) ease both;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation^="wipe_"] .veil-progress-image {
	-webkit-mask-image: linear-gradient(#000 0 0);
	-webkit-mask-repeat: no-repeat;
	mask-image: linear-gradient(#000 0 0);
	mask-repeat: no-repeat;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="wipe_up"] .veil-progress-image {
	-webkit-mask-position: bottom;
	animation: veil-image-wipe-v var(--veil-loader-speed) ease both;
	mask-position: bottom;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="wipe_down"] .veil-progress-image {
	-webkit-mask-position: top;
	animation: veil-image-wipe-v var(--veil-loader-speed) ease both;
	mask-position: top;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="wipe_left"] .veil-progress-image {
	-webkit-mask-position: right;
	animation: veil-image-wipe-h var(--veil-loader-speed) ease both;
	mask-position: right;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="wipe_right"] .veil-progress-image {
	-webkit-mask-position: left;
	animation: veil-image-wipe-h var(--veil-loader-speed) ease both;
	mask-position: left;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="zoom"] .veil-progress-image {
	animation: veil-progress-image-zoom var(--veil-loader-speed) cubic-bezier(.2, .8, .2, 1) both;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="rotate"] .veil-progress-image {
	animation: veil-progress-image-spin var(--veil-loader-speed) linear both;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-animation="bounce"] .veil-progress-image {
	animation: veil-progress-image-bounce var(--veil-loader-speed) ease-in-out both;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-playback="loop"] .veil-progress-image {
	animation-iteration-count: infinite;
}

html.veil-loading[data-veil-image-progress="1"][data-veil-image-playback="loop"]:not([data-veil-image-animation="rotate"]):not([data-veil-image-animation="bounce"]) .veil-progress-image {
	animation-direction: alternate;
}

@keyframes veil-progress-image-spin {
	from {
		transform: translate(-50%, -50%) rotate(0);
	}

	to {
		transform: translate(-50%, -50%) rotate(360deg);
	}
}

@keyframes veil-progress-image-up {
	from {
		opacity: 0;
		transform: translate(-50%, calc(-50% + 24px));
	}

	to {
		opacity: 1;
		transform: translate(-50%, -50%);
	}
}

@keyframes veil-progress-image-down {
	from {
		opacity: 0;
		transform: translate(-50%, calc(-50% - 24px));
	}

	to {
		opacity: 1;
		transform: translate(-50%, -50%);
	}
}

@keyframes veil-progress-image-left {
	from {
		opacity: 0;
		transform: translate(calc(-50% + 24px), -50%);
	}

	to {
		opacity: 1;
		transform: translate(-50%, -50%);
	}
}

@keyframes veil-progress-image-right {
	from {
		opacity: 0;
		transform: translate(calc(-50% - 24px), -50%);
	}

	to {
		opacity: 1;
		transform: translate(-50%, -50%);
	}
}

@keyframes veil-progress-image-zoom {
	from {
		opacity: 0;
		transform: translate(-50%, -50%) scale(.65);
	}

	to {
		opacity: 1;
		transform: translate(-50%, -50%);
	}
}

@keyframes veil-progress-image-bounce {
	0%,
	100% {
		transform: translate(-50%, -50%);
	}

	50% {
		transform: translate(-50%, calc(-50% - 10px));
	}
}

.veil-close {
	position: fixed;
	z-index: 2147483647;
	top: 20px;
	right: 20px;
	padding: 9px 14px;
	border: 1px solid currentColor;
	border-radius: 4px;
	background: transparent;
	color: var(--veil-color, #fff);
	font: inherit;
	font-size: 14px;
	line-height: 1.4;
	cursor: pointer;
}

.veil-close:hover,
.veil-close:focus-visible {
	background: color-mix(in srgb, var(--veil-color, #fff) 14%, transparent);
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.veil-progress-ui,
	.veil-progress-fill,
	.veil-progress-image-fill {
		transition-duration: 1ms !important;
	}

	.veil-progress-image {
		animation-duration: 1ms !important;
		animation-iteration-count: 1 !important;
	}
}
