/* APP BAR */
.bar{position:sticky;top:0;z-index:60;background:color-mix(in oklab,var(--bg) 88%,transparent);
  backdrop-filter:saturate(140%) blur(12px);border-bottom:1px solid var(--line)}
.bar{overflow-x:clip}
.bar-in{max-width:1180px;margin:0 auto;padding:0 18px;height:58px;display:flex;align-items:center;gap:10px;min-width:0}
.bar-in>*{min-width:0}
.brand,.icon-btn,.lang-btn,.row-ctl,.bar-sep,[data-auth-slot],.tabs{flex:none}
.bar .search{flex:1 1 auto;min-width:0}
.brand{display:flex;align-items:center;gap:9px;background:none;border:0;padding:0;color:var(--ink);
  font-family:var(--fh);font-weight:800;letter-spacing:.06em;font-size:13.5px;margin-right:6px}
.brand:hover{color:var(--ink)}
.tabs{display:flex;gap:2px;background:var(--surface2);border-radius:999px;padding:4px;margin-left:4px}
.tabs button{display:flex;align-items:center;gap:7px;border:0;background:none;color:var(--sub);font-size:13.1px;
  font-weight:600;padding:7px 13px;border-radius:999px;white-space:nowrap}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-current="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 0 var(--line2)}
.bar .spacer{flex:1}
.icon-btn{width:36px;height:36px;display:grid;place-items:center;border-radius:999px;border:1px solid var(--line);
  background:var(--surface);color:var(--sub)}
.icon-btn:hover{border-color:var(--line2);color:var(--ink)}
.lang-btn{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px 0 10px;border-radius:999px;
  border:1px solid var(--line);background:var(--surface);color:var(--sub)}
.lang-btn:hover{border-color:var(--line2);color:var(--ink)}
.lang-btn b{font-family:var(--fm);font-size:10.8px;letter-spacing:.1em;font-weight:700}
.bar-sep{width:1px;height:22px;background:var(--line2);margin:0 4px;flex:none}
.row-ctl{display:flex;align-items:center;gap:6px}
:where(button,a,input,select):focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.avatar-btn{display:flex;align-items:center;gap:9px;border:1px solid var(--line);background:var(--surface);
  border-radius:999px;padding:4px 12px 4px 4px;height:38px;max-width:200px}
.avatar-btn:hover{border-color:var(--line2)}
.avatar{width:30px;height:30px;border-radius:999px;background:var(--accent);color:var(--accent-ink);
  display:grid;place-items:center;font-family:var(--fh);font-weight:700;font-size:12.6px;flex:none}
.avatar.lg{width:52px;height:52px;font-size:21px}
.avatar-btn>span:not(.avatar){font-size:12.2px;color:var(--sub);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:130px}
