/*
 * global.css — Pre-JS critical styles (FOUC prevention + boot screen)
 *
 * IMPORTANT: The two :root values below are hardcoded snapshots of
 * defaultDesign.semantic.page.bg and defaultDesign.colors.brand.primary[500]
 * from @autismllm/anytheme. If those token values change, update here too.
 *
 * ThemeProvider will override these at runtime — these exist only to prevent
 * a flash of wrong background before JS loads.
 */

:root {
	--any-color-bg:      #0b0d12;
	--any-color-primary: #00cb9f;
}

*, *::before, *::after {
	-webkit-tap-highlight-color: transparent;
	-webkit-touch-callout: none;
}

html {
	margin: 0;
	padding: 0;
	background-color: var(--any-color-bg);
	color-scheme: dark;
}

body {
	margin: 0;
	padding: 0;
	min-height: 100dvh;
	background-color: var(--any-color-bg);
	user-select: none;
	-webkit-user-select: none;
	overscroll-behavior: none;
	color-scheme: dark;
}

/* ── Boot screen — shown while SvelteKit hydrates ─────────────── */

#app-root            { display: none; }
#app-root.mounted    { display: contents; }
#app-root.mounted ~ #boot { display: none; }

#boot {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100dvh;
	flex-direction: column;
	gap: 1rem;
}

.boot-brand {
	font-size: 1.5rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	color: var(--any-color-primary);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
	animation: boot-pulse 1.5s ease-in-out infinite;
}

.boot-loader {
	width: 32px;
	height: 32px;
	border: 3px solid color-mix(in srgb, var(--any-color-primary) 15%, transparent);
	border-top-color: var(--any-color-primary);
	border-radius: 50%;
	animation: boot-spin 0.8s linear infinite;
}

@keyframes boot-pulse {
	0%, 100% { opacity: 0.4; }
	50%       { opacity: 1; }
}

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