/* Account menu (public/modules/usermenu.js) */
#user-dropdown { min-width: 268px; padding: 6px; gap: 1px; }
#user-dropdown > a, #user-dropdown > button, #user-dropdown .menu-theme { gap: 11px; min-height: 38px; font-size: 14px; font-weight: 500; }
#user-dropdown > a > svg:first-child, #user-dropdown > button > svg:first-child, #user-dropdown .menu-theme > svg:first-child { flex-shrink: 0; color: var(--ink-muted); width: 16px; height: 16px; }
#user-dropdown .um-label, #user-dropdown .mi-label { flex: 1; min-width: 0; }
#user-dropdown .menu-sep { margin: 5px 8px; }
/* header */
.menu-head.um-head { flex-direction: row; align-items: center; gap: 10px; padding: 8px 8px 12px; margin-bottom: 0; border-bottom: 0; }
.um-avatar { flex-shrink: 0; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 15px; color: #fff; background: linear-gradient(135deg, #F7A34A, #E2552B); }
.um-who { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.um-who b { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.um-who span { font-size: 12px; color: var(--ink-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.um-plan { flex-shrink: 0; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 700; background: var(--chip-bg); color: var(--ink-muted); }
.um-plan.pro, .um-plan.max { background: color-mix(in srgb, var(--cta-a, #E8652B) 16%, transparent); color: var(--cta-a, #E8652B); }
.um-plan:empty { display: none; }
/* upgrade: a soft highlighted row */
#user-dropdown #menu-upgrade { margin: 0 0 2px; background: color-mix(in srgb, var(--cta-a, #E8652B) 11%, transparent); color: var(--cta-a, #E8652B) !important; font-weight: 600; }
#user-dropdown #menu-upgrade:hover { background: color-mix(in srgb, var(--cta-a, #E8652B) 18%, transparent); }
#user-dropdown #menu-upgrade > svg:first-child { color: currentColor; }
#user-dropdown #menu-upgrade span { flex: 1; }
.um-go { flex-shrink: 0; opacity: .7; }
/* admin: same weight and colour as every other row */
#user-dropdown .menu-admin { font-weight: 500; }
#user-dropdown .menu-admin svg { color: var(--ink-muted); }
/* small extras on the right */
.um-tag { flex-shrink: 0; font-size: 11.5px; color: var(--ink-faint); }
#user-dropdown .mi-count { margin-left: auto; }
#user-dropdown .menu-theme { padding: 0 4px 0 10px; }
#user-dropdown .menu-sub > svg:last-child { color: var(--ink-faint); }
#user-dropdown .menu-subitems { margin-left: 18px; }
#user-dropdown #logout-btn:hover { color: var(--danger); }
#user-dropdown #logout-btn:hover svg { color: var(--danger); }
#user-dropdown .menu-sub[aria-expanded="true"] > svg:first-child { transform: none; }
#user-dropdown .menu-sub > span { flex: 1; text-align: left; }
#user-dropdown .menu-subitems a { color: var(--ink-muted) !important; font-weight: 500; }
#user-dropdown .menu-subitems a:hover { color: var(--ink) !important; }
.um-avatar { text-shadow: 0 1px 2px rgba(0, 0, 0, .25); }
#user-dropdown .menu-subitems > * { min-height: 34px; font-size: 13.5px; color: var(--ink-muted) !important; font-weight: 500; }
#user-dropdown .menu-subitems > *:hover { color: var(--ink) !important; }
#user-dropdown .menu-head .um-avatar { color: #fff; font-size: 15px; }
#user-dropdown .menu-head .um-plan { font-size: 11.5px; overflow: visible; }