:root {
	--bg: #07080c;
	--text: #f5f6fa;
	--accent: #ff5a4e;
	--glow-violet: #6c5cff;
	--glow-cyan: #2ec5ff;
	--glow-mint: #3dd97a;
	--glass: rgba(255, 255, 255, 0.07);
}
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body {
	display: grid;
	place-items: center;
	padding: 16px;
	background:
		radial-gradient(40vmax 40vmax at 15% 20%, color-mix(in srgb, var(--glow-violet) 35%, transparent), transparent),
		radial-gradient(35vmax 35vmax at 85% 30%, color-mix(in srgb, var(--glow-cyan) 25%, transparent), transparent),
		radial-gradient(40vmax 40vmax at 55% 95%, color-mix(in srgb, var(--glow-mint) 18%, transparent), transparent),
		var(--bg);
	color: var(--text);
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.glass {
	width: min(100%, 420px);
	padding: 40px 28px;
	text-align: center;
	background: var(--glass);
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 28px;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}
@supports (backdrop-filter: blur(1px)) {
	.glass {
		-webkit-backdrop-filter: blur(24px) saturate(140%);
		backdrop-filter: blur(24px) saturate(140%);
	}
}
@media (prefers-reduced-transparency: reduce) {
	.glass { background: #14161d; -webkit-backdrop-filter: none; backdrop-filter: none; }
}
.logo { width: 72px; height: 72px; color: var(--accent); display: block; margin: 0 auto; }
h1 { margin: 16px 0 4px; font-size: 2rem; letter-spacing: 0.01em; }
.soon { margin: 0; font-size: 1.1rem; opacity: 0.8; }
.btn {
	display: inline-block;
	padding: 12px 22px;
	color: var(--text);
	text-decoration: none;
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 999px;
}
.btn:hover { border-color: var(--accent); }
.btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }