.tabs { display:flex; justify-content:center; gap:4px; }
.tab { border:0; background:transparent; color:var(--text-2); padding:8px 14px; border-radius:999px; font-weight:500; min-height:40px; }
.tab:hover { background:var(--hover); color:var(--text); }
.tab.on { background:var(--nav-active-bg); color:var(--nav-active-fg); font-weight:600; }
.tab .count {
  margin-left:6px; min-width:0; width:8px; height:8px; padding:0; font-size:0; background:var(--gold-400);
  box-shadow:0 0 0 2px var(--surface);
}
.tab.on .count { box-shadow:0 0 0 2px var(--nav-active-bg); }
.panel .tabs { gap:2px; }
.panel .tab { padding:8px 10px; white-space:nowrap; display:inline-flex; align-items:center; }
.tabpane { display:flex; flex-direction:column; gap:18px; }
.mdl-body > .tabpane { gap:18px; }