/* hub_user_menu v1 2026-10-04: condensed profile/avatar menu. Uniform small pills in a 2-column grid.
   Overrides inline font:inherit / nowrap that made Last.fm friends, App lock and Colored usernames oversized.
   Colors still come from the theme / user-color tint rules (not touched here). */
.hub-user-chip .hub-user-menu { width: min(18rem, 90vw); max-width: min(18rem, 90vw); padding: 0.5rem 0.55rem 0.55rem; gap: 0.25rem; }
.hub-user-chip .hub-user-menu .hub-user-menu-actions {
  display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.3rem !important; align-items: stretch;
}
.hub-user-chip .hub-user-menu .hub-user-logout,
.hub-user-chip .hub-user-menu .hm-lfm-priv-open.hub-user-logout {
  font-family: inherit !important; font-size: 0.72rem !important; font-weight: 650 !important; line-height: 1.15 !important;
  padding: 0.34rem 0.5rem !important; margin: 0 !important; min-height: 1.95rem; width: 100%; box-sizing: border-box;
  display: inline-flex !important; align-items: center; justify-content: center; text-align: center;
  white-space: normal !important; overflow-wrap: anywhere; border-radius: 999px; cursor: pointer;
}
/* Last.fm friends sits just above the grid: same small pill, full row */
.hub-user-chip .hub-user-menu > .hm-lfm-priv-open.hub-user-logout { margin: 0.1rem 0 0 !important; }
/* long labels take the full row so they stay on one line */
.hub-user-chip .hub-user-menu .hub-user-menu-actions > .hub-user-namecol,
.hub-user-chip .hub-user-menu .hub-user-menu-actions > .hub-user-lib { grid-column: 1 / -1; flex-direction: column; }
.hub-user-chip .hub-user-menu .hub-user-lib > span { width: 100%; margin-top: 0.2rem !important; }
.hub-user-chip .hub-user-menu .hub-user-logout[hidden] { display: none !important; }
@media (min-width: 720px) {
  .hub-user-chip .hub-user-menu { width: 18.5rem; max-width: 18.5rem; }
}

/* applang v1: Language picker row */
.hub-user-chip .hub-user-menu .hub-user-lang { display: flex; align-items: center; justify-content: space-between; gap: 0.4rem;
  font-size: 0.72rem; font-weight: 650; margin: 0.1rem 0 0.15rem; }
.hub-user-chip .hub-user-menu .hub-user-lang select { flex: 1 1 auto; min-width: 0; max-width: 11rem; font: inherit; font-size: 0.72rem;
  padding: 0.28rem 0.5rem; border-radius: 999px; color: #e2e8f0; background: rgba(15,23,42,0.85);
  border: 1px solid rgba(148,163,184,0.35); color-scheme: dark; }

/* gbchip 2026-10-05 (gbleft-20261008: GB left of pool) under @handle */
.hub-user-chip .hub-user-menu .hub-user-menu-gb {
  font-size: 0.7rem; font-weight: 650; font-variant-numeric: tabular-nums;
  color: #94a3b8; margin: -0.15rem 0 0.35rem; letter-spacing: 0.01em;
}
.hub-user-chip .hub-user-menu .hub-user-menu-gb.is-infinite { color: #c4b5fd; }
/* gbleft-20261008: "X GB left" bright, "of Y GB" muted; amber when under 10% */
.hub-user-chip .hub-user-menu .hub-user-menu-gb .hub-user-menu-gb-left { color: #e2e8f0; font-weight: 750; }
.hub-user-chip .hub-user-menu .hub-user-menu-gb.is-low .hub-user-menu-gb-left { color: #fbbf24; }
.hub-user-chip .hub-user-menu .hub-user-menu-gb[hidden] { display: none !important; }

/* lockgrace-row 2026-10-11: "Unlock lasts" = full-width row, label left (one line), select right */
.hub-user-chip .hub-user-menu .hub-user-menu-actions > .hub-user-lockgrace {
  grid-column: 1 / -1; justify-content: space-between !important; gap: 0.4rem; white-space: nowrap !important; overflow-wrap: normal; text-align: left; padding-left: 0.75rem !important; cursor: default; }
.hub-user-chip .hub-user-menu .hub-user-lockgrace select { flex: 0 1 auto; min-width: 0; max-width: 9rem; font: inherit; font-size: 0.72rem;
  padding: 0.18rem 0.45rem; border-radius: 999px !important; color: #e2e8f0; background: rgba(15,23,42,0.85);
  border: 1px solid rgba(148,163,184,0.35) !important; color-scheme: dark; }

/* menuopaque2 2026-10-19: solid open menus; keep top bar visible only while a menu is actually open */
html.hpv-on .hub-top:has(.hub-user-chip.is-open),
html.hpv-on .hub-top:has(.hub-nav-dd-btn[aria-expanded="true"]) { opacity: 1 !important; }
.hub-user-chip.is-open .hub-user-menu, .hub-nav-dd-menu:not([hidden]) {
  background: color-mix(in srgb, var(--hub-switch-on, var(--accent-icon, #610085)) 10%, rgb(12,16,30));
}
@supports not (background: color-mix(in srgb, red 10%, blue)) {
  .hub-user-chip.is-open .hub-user-menu, .hub-nav-dd-menu:not([hidden]) { background: rgb(14,18,34); }
}