/* ─── Design tokens ─────────────────────────────────── */
:root {
    --blue: #3b9eff;
    --blue-dim: rgba(59, 158, 255, 0.12);
    --blue-bdr: rgba(59, 158, 255, 0.25);
    --blue-glow: rgba(59, 158, 255, 0.20);
    --surface: #0d1120;
    --surface2: #131929;
    --border: #1e2540;
    --muted: #8891b0;
    --faint: #555e7a;
    --green: #2ecc71;
    --red: #e74c3c;
    --amber: #f39c12;
    --gray: rgb(197, 193, 193);
}

/* ─── Navbar ────────────────────────────────────────── */
.bb-navbar {
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    padding: 0 48px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    top: 0;
    z-index: 1000;
    flex-shrink: 0;
}

.bb-logo-external {
    font-size: 26px;
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    color: #fff;
    letter-spacing: -0.5px;
    vertical-align: middle;
}

.bb-logo-external span {
    color: var(--blue);
}

.show {
    visibility: visible;
}

.hide {
    visibility: hidden !important;
    display: none !important;
}

.bb-nav-links {
    display: flex;
    align-items: center;
    gap: 32px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.bb-nav-links li {
    margin: 0;
    padding: 0;
}

.bb-nav-links a {
    font-size: 16px;
    color: var(--muted);
    transition: color 0.15s;
}

.bb-nav-links a:hover {
    color: #fff;
}

.bb-nav-links-active a {
    color: whitesmoke;
}