.ls-loading-overlay {
	position: fixed;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 18px;
	background: rgba(0, 0, 0, 0.4);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	z-index: 2147483000;
	opacity: 0;
	transition: opacity 0.15s ease-out;
	pointer-events: all;
}

.ls-loading-overlay[data-ready="1"] {
	opacity: 1;
}

.ls-loading-spinner {
	width: 48px;
	height: 48px;
	border: 4px solid var(--ls-accent-faint);
	border-top-color: var(--ls-accent);
	border-radius: 50%;
	animation: ls-loading-spin 0.9s linear infinite;
}

@keyframes ls-loading-spin {
	to { transform: rotate(360deg); }
}

.ls-loading-label {
	/* The pill background is forced dark (it sits over the dimming backdrop
	   regardless of OS theme), so the label must stay light. */
	color: #ffffff;
	font: 500 16px/1.2 system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
	letter-spacing: 0.02em;
	text-align: center;
	max-width: 80vw;
	padding: 6px 14px;
	background: rgba(0, 0, 0, 0.45);
	border-radius: 999px;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

@media (prefers-reduced-motion: reduce) {
	.ls-loading-spinner { animation: none; border-top-color: transparent; }
	.ls-loading-overlay { transition: none; }
}