.topbar{
  display:flex; align-items:center; gap:14px;
  padding:14px 26px; border-bottom:1px solid var(--line);
  position:sticky; top:0; background:var(--topbar-bg); backdrop-filter:blur(6px);
  z-index:30;
  padding-top:calc(14px + env(safe-area-inset-top,0px));
}
.menu-btn{display:none; background:none; border:none; color:var(--text); font-size:20px;}
.search{
  flex:1; max-width:420px;
  display:flex; align-items:center; gap:8px;
  background:var(--panel); border:1px solid var(--line); border-radius:8px;
  padding:8px 12px; color:var(--muted-2); font-size:13.5px;
}
.search svg{width:15px;height:15px; opacity:.7;}
.topbar-right{margin-left:auto; display:flex; align-items:center; gap:16px;}
.icon-btn{
  width:36px; height:36px; border-radius:8px; background:var(--panel);
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  color:var(--muted); position:relative;
}
.icon-btn svg{width:16px;height:16px;}
.badge-dot{
  position:absolute; top:-4px; right:-4px; background:var(--red); color:#fff;
  font-size:9.5px; font-weight:700; border-radius:20px; min-width:15px; height:15px;
  display:flex; align-items:center; justify-content:center; padding:0 3px;
}
.user-chip{display:flex; align-items:center; gap:9px;}
.avatar{
  width:32px;height:32px;border-radius:50%; background:linear-gradient(145deg,var(--avatar-grad-1),var(--avatar-grad-2));
  display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; color:var(--muted);
  border:1px solid var(--line);
}
.user-meta{line-height:1.1;}
.user-name{font-size:13px; font-weight:600;}
.user-role{font-size:10.5px; color:var(--muted-2);}