/* Base styles */
html, body {
	height: 100%;
	margin: 0;
}

body {
	background-color: #0b0b0b; /* darker background */
	color: #e6e6e6;
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
	padding-top: 56px; /* space for fixed topbar */
}

/* Subtle glow points rendered as true circles */
.glows {
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: 0;
}
.glow {
	position: absolute;
	width: 760px;
	height: 760px;
	border-radius: 50%;
	background: radial-gradient(circle at 50% 50%, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.02) 40%, transparent 60%);
	filter: blur(40px);
	opacity: 0.6;
}
.g1 {
	left: -220px;
	top: -180px;
	background: radial-gradient(circle at 50% 50%, rgba(255,255,255,0.16) 0%, rgba(255,255,255,0.02) 40%, transparent 60%);
}
.g2 {
	right: -240px;
	top: 60px;
	width: 680px;
	height: 680px;
	background: radial-gradient(circle at 50% 50%, rgba(255,200,150,0.12) 0%, rgba(255,200,150,0.02) 40%, transparent 60%);
}
.g3 {
	left: 50%;
	transform: translateX(-50%);
	bottom: -220px;
	width: 820px;
	height: 820px;
	background: radial-gradient(circle at 50% 50%, rgba(180,200,255,0.12) 0%, rgba(180,200,255,0.02) 40%, transparent 60%);
}

/* Ensure app content sits above the glow overlay */
#root {
	position: relative;
	z-index: 1;
}

/* Topbar */
.topbar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 56px;
	background: rgba(6,6,6,0.95); /* slightly darker full-width bar */
	display: block;
	z-index: 3;
}
.topbar .container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 16px;
	height: 100%;
}
.logo {
	display: none;
}
.nav .btn {
	display: none;
}

