/* Dashboard 3: Astral - AI Insights (d3/DESIGN.md). Soft and centred: tabs as pills across the top, a greeting, the orb as a nebula. */
.orb { --orb: nebula; }
.shell { grid-template-columns: minmax(0, 1fr); }
.rail { position: sticky; top: 56px; z-index: 9; height: auto; padding: 12px 32px; border-right: 0; border-bottom: 1px solid var(--border); overflow-x: auto; }
#nav { display: flex; justify-content: center; gap: 6px; }
.nav-i { flex: none; border-radius: var(--r-pill); padding: 0 16px; }
.nav-i[aria-current="page"] { background: var(--tint); color: var(--text); }
.btn, .seg, .seg button, .field { border-radius: var(--r-pill); }
.title-row { text-align: center; }
.stage { background: radial-gradient(55% 50% at 50% 50%, color-mix(in srgb, var(--accent) 16%, var(--surface)) 0%, color-mix(in srgb, var(--accent-2) 5%, var(--surface)) 45%, var(--surface) 75%); }
body { background: radial-gradient(900px 420px at 30% -160px, color-mix(in srgb, var(--accent) 12%, var(--bg)), transparent 70%) no-repeat, radial-gradient(700px 360px at 80% -120px, color-mix(in srgb, var(--accent-2) 7%, var(--bg)), transparent 70%) no-repeat, var(--bg); }
@media (max-width: 760px) { .rail { padding: 8px 16px; position: relative; top: 0; } #nav { flex-wrap: wrap; } }