:root {
	--brand: #4f7cff;
	--brand-dim: rgba(79, 124, 255, 0.12);
	--brand-border: rgba(79, 124, 255, 0.28);
	--surface: #0f1525;
	--muted: #8b93a7;
	--gold: #fbbf24;
}

body {
	background: #080d1a;
	font-family: "Inter", sans-serif;
	color: #d6daea;
}

ip-navbar { display: block; }

/* ── Navbar ── */
.navbar {
	background: rgba(8, 13, 26, 0.92) !important;
	backdrop-filter: blur(12px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}
.navbar-brand {
	font-weight: 800;
	font-size: 1.1rem;
	letter-spacing: -0.02em;
	color: #fff !important;
}
.navbar-brand span { color: var(--brand); }
.nav-link {
	color: var(--muted) !important;
	font-size: 0.88rem;
}
.nav-link:hover,
.nav-link.active { color: #fff !important; }
.nav-pill {
	background: var(--brand) !important;
	color: #fff !important;
	border-radius: 7px !important;
	padding: 6px 16px !important;
	font-weight: 600 !important;
	font-size: 0.85rem;
}
.nav-pill-chat {
	background: rgba(251,191,36,0.15) !important;
	color: #fbbf24 !important;
	border: 1px solid rgba(251,191,36,0.35) !important;
	border-radius: 7px !important;
	padding: 6px 16px !important;
	font-weight: 600 !important;
}
.nav-pill-chat:hover {
	background: rgba(251,191,36,0.25) !important;
	color: #fde68a !important;
}

/* ── Footer ── */
footer {
	border-top: 1px solid rgba(255, 255, 255, 0.07);
	font-size: 0.81rem;
	color: var(--muted);
}
footer a {
	color: var(--muted);
	text-decoration: none;
}
footer a:hover { color: #fff; }

/* ── Shared buttons ── */
.btn-brand {
	background: var(--brand);
	color: #fff;
	border: none;
	border-radius: 9px;
	padding: 11px 26px;
	font-weight: 600;
	font-size: 0.9rem;
	box-shadow: 0 0 24px rgba(79, 124, 255, 0.28);
	transition: transform 0.2s, opacity 0.2s;
}
.btn-brand:hover { transform: translateY(-2px); opacity: 0.9; color: #fff; }
.btn-ghost {
	background: rgba(255, 255, 255, 0.05);
	color: #d6daea;
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 9px;
	padding: 10px 22px;
	font-size: 0.9rem;
	transition: background 0.2s;
}
.btn-ghost:hover { background: rgba(255, 255, 255, 0.09); color: #fff; }

/* ── Shared section typography ── */
.section-tag {
	font-family: "JetBrains Mono", monospace;
	font-size: 0.68rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--brand);
	margin-bottom: 10px;
}
.section-title {
	font-size: clamp(1.5rem, 3vw, 2.2rem);
	font-weight: 800;
	letter-spacing: -0.03em;
	line-height: 1.15;
	color: #fff;
}
.section-title .accent { color: var(--brand); }
.section-sub {
	color: var(--muted);
	font-size: 0.93rem;
	max-width: 400px;
	line-height: 1.65;
}