/* 顶栏账户状态徽标 — 全部使用主题变量，不硬编码颜色（保护涨跌语义色与深浅主题） */
.lx-ub { position: relative; display: inline-flex; align-items: center; margin-right: 2px; }

.lx-ub-btn {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 40px; height: 40px; padding: 0 10px 0 4px;
  border: 1px solid var(--border, rgba(255,255,255,.10));
  background: var(--bg-card, rgba(255,255,255,.04));
  border-radius: 999px; cursor: pointer; color: var(--text-primary, #e8eef8);
  transition: border-color var(--dur-fast, .18s) var(--ease-smooth, ease);
}
.lx-ub-btn:hover { border-color: var(--accent, #5a8cff); }

/* 热区扩展：移动端至少 44×44（命中测试口径，不影响布局） */
.lx-ub-btn::after { content: ""; position: absolute; inset: -3px -2px; }

.lx-ub-avatar {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 50%;
  background: linear-gradient(135deg, var(--accent, #5a8cff), var(--brand-violet, #7a5cff));
  color: #fff; font-size: 14px; font-weight: 700; flex: 0 0 auto;
}

.lx-ub-meta { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.15; max-width: 132px; }
.lx-ub-name { font-size: 13px; font-weight: 600; max-width: 132px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lx-ub-tier { font-size: 11px; opacity: .72; white-space: nowrap; }
.lx-ub-tier.is-pro { color: var(--accent, #7ba9f7); opacity: 1; }

.lx-ub-menu {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 1200;
  width: 248px; padding: 12px;
  background: var(--bg-elevated, var(--bg-card, #141a26));
  border: 1px solid var(--border, rgba(255,255,255,.10));
  border-radius: 12px; box-shadow: 0 12px 32px rgba(0,0,0,.35);
  color: var(--text-primary, #e8eef8); font-size: 13px;
}
.lx-ub-mhead { display: flex; align-items: center; gap: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--border, rgba(255,255,255,.08)); }
.lx-ub-mav { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%;
  background: linear-gradient(135deg, var(--accent, #5a8cff), var(--brand-violet, #7a5cff)); color: #fff; font-weight: 700; flex: 0 0 auto; }
.lx-ub-minfo { min-width: 0; }
.lx-ub-mname { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 180px; }
.lx-ub-msub { font-size: 11px; opacity: .6; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 180px; }

.lx-ub-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0 0; }
.lx-ub-row span { opacity: .62; }
.lx-ub-row b { font-weight: 600; }

.lx-ub-logout {
  margin-top: 12px; width: 100%; min-height: 40px; height: 40px;
  border: 1px solid var(--border, rgba(255,255,255,.10));
  border-radius: 10px; background: transparent;
  color: var(--danger, #ff6b6b); cursor: pointer; font-size: 13px;
}
.lx-ub-logout:hover { background: rgba(255,107,107,.10); }

/* 窄屏：只保留头像，杜绝顶栏挤压/溢出 */
@media (max-width: 860px) {
  .lx-ub-meta { display: none; }
  .lx-ub-btn { min-height: 44px; height: 44px; padding: 0; width: 44px; justify-content: center; }
  .lx-ub-menu { width: 232px; }
}