.topbar{
    position:sticky;
    top:0;
    z-index:40;
    min-height:var(--topbar-h);
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:18px;
    margin:-22px -22px 18px;
    padding:18px 22px;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.10);
    border-radius:0;
    background:rgba(12,22,46,.72);
    backdrop-filter:blur(16px);
    transition:background var(--transition), border-color var(--transition);
}

.topbar.is-scrolled{
    background:rgba(12,22,46,.92);
    border-bottom-color:rgba(255,255,255,.14);
}

.topbar-left,
.topbar-right{
    display:flex;
    align-items:center;
    gap:14px;
    min-width:0;
}

.topbar-left{ flex:1 1 auto; }
.page-heading{ min-width:0; }

.page-heading h1{
    margin:0 0 4px;
    font-size:clamp(22px, 2vw, 28px);
    line-height:1.08;
    letter-spacing:-.02em;
}

.page-heading p{
    margin:0;
    color:var(--text-soft);
    font-size:13px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.icon-btn{
    position:relative;
    width:46px;
    height:46px;
    flex:0 0 46px;
    display:grid;
    place-items:center;
    border-radius:16px;
    border:1px solid var(--stroke);
    background:rgba(255,255,255,.05);
    color:var(--text);
    transition:background var(--transition), border-color var(--transition), transform var(--transition), color var(--transition);
}

.icon-btn:hover{
    background:rgba(255,255,255,.10);
    border-color:var(--stroke-strong);
    transform:translateY(-1px);
}

.icon-btn svg{ width:20px; height:20px; }
.mobile-menu-btn,
.mobile-close{ display:none; }

.search-box{
    position:relative;
    width:min(420px, 34vw);
    min-width:200px;
}

.search-box input{
    min-height:48px;
    padding:0 16px 0 44px;
    border-radius:16px;
}

.search-box svg{
    position:absolute;
    top:50%;
    left:14px;
    width:18px;
    height:18px;
    transform:translateY(-50%);
    color:var(--text-muted);
    pointer-events:none;
}

.notify-dot{
    position:absolute;
    top:10px;
    right:11px;
    width:10px;
    height:10px;
    border-radius:999px;
    background:var(--brand-pink);
    box-shadow:0 0 0 4px rgba(24,76,145,.18);
}

.theme-switch{ display:inline-flex; align-items:center; cursor:pointer; }
.theme-switch input{ position:absolute; opacity:0; pointer-events:none; }
.theme-switch-ui{
    position:relative;
    width:62px;
    height:36px;
    display:inline-flex;
    align-items:center;
    padding:4px;
    border-radius:999px;
    border:1px solid var(--stroke);
    background:rgba(255,255,255,.06);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
    transition:background var(--transition), border-color var(--transition);
}
.theme-switch-ball{
    width:26px;
    height:26px;
    border-radius:50%;
    background:linear-gradient(135deg, var(--soft-pink), var(--soft-blue));
    box-shadow:0 4px 12px rgba(0,0,0,.25);
    transform:translateX(0);
    transition:transform var(--transition);
}
.theme-switch input:checked + .theme-switch-ui .theme-switch-ball{ transform:translateX(26px); }

.profile-btn{
    display:inline-flex;
    align-items:center;
    gap:12px;
    min-height:50px;
    padding:4px 8px 4px 4px;
    border-radius:18px;
    border:1px solid var(--stroke);
    background:rgba(255,255,255,.04);
    transition:background var(--transition), border-color var(--transition);
    cursor:pointer;
}
.profile-btn:hover{ background:rgba(255,255,255,.09); border-color:var(--stroke-strong); }
.profile-avatar{
    width:42px;
    height:42px;
    flex:0 0 42px;
    border-radius:14px;
    display:grid;
    place-items:center;
    font-size:16px;
    font-weight:800;
    color:#fff;
    background:linear-gradient(135deg, var(--brand-pink), var(--brand-purple));
}
.profile-copy{ min-width:0; display:flex; flex-direction:column; gap:3px; }
.profile-copy strong,
.profile-copy span{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.profile-copy strong{ font-size:14px; line-height:1.1; }
.profile-copy span{ font-size:12px; color:var(--text-muted); }