/* Account controls own their palette so older light/dark skins cannot mix. */
html.site-pearl body.public-ui #topbarUserWrap {
  --account-surface:#fff; --account-soft:#f5f8fc; --account-line:#e2e8f0;
  --account-ink:#243447; --account-muted:#64748b; --account-accent:#2563eb;
  --account-wallet:#f8fafc; --account-danger:#b42341; --account-danger-bg:#fff3f5;
  --account-shadow:0 14px 36px #1e334b18,0 2px 6px #1e334b08;
}
html.site-pearl.site-dark body.public-ui #topbarUserWrap {
  --account-surface:#17212b; --account-soft:#202d3a; --account-line:#334353;
  --account-ink:#e5edf5; --account-muted:#a4b4c5; --account-accent:#93c5fd;
  --account-wallet:#1d2a36; --account-danger:#f5a3b4; --account-danger-bg:#342530;
  --account-shadow:0 14px 36px #0004,0 2px 6px #0002;
}
html.site-pearl body.public-ui #topbar #topbarUserBtn.topbar-user-chip {
  display:flex!important; align-items:center; gap:8px; box-sizing:border-box;
  min-width:132px!important; max-width:190px!important; width:auto!important;
  height:38px!important; min-height:38px!important; padding:4px 9px 4px 5px!important;
  border:1px solid var(--account-line)!important; border-radius:12px!important;
  background:var(--account-surface)!important; color:var(--account-ink)!important;
  box-shadow:0 1px 3px #142f4808!important; cursor:pointer;
  transition:background .18s,border-color .18s,box-shadow .18s!important;
}
html.site-pearl body.public-ui #topbar #topbarUserBtn.topbar-user-chip:is(:hover,[aria-expanded=true]) {
  background:var(--account-soft)!important; border-color:var(--account-accent)!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--account-accent) 10%,transparent)!important;
}
html.site-pearl body.public-ui #topbar #topbarUserBtn .topbar-user-avatar {
  width:28px!important; height:28px!important; min-width:28px!important; min-height:28px!important;
  flex:0 0 28px!important; border:1px solid var(--account-line)!important;
  background:var(--account-soft)!important; border-radius:50%!important; box-shadow:none!important;
}
html.site-pearl body.public-ui #topbar #topbarUserBtn .header-account-copy {gap:2px;flex:1;min-width:0}
html.site-pearl body.public-ui #topbar #topbarUserBtn .header-account-copy strong {
  display:flex; gap:5px; max-width:none; min-width:0;
  font:700 11px/1.25 var(--font-ui,system-ui,sans-serif)!important;
  color:var(--account-ink)!important; font-variant-numeric:tabular-nums;
}
html.site-pearl body.public-ui #topbar #topbarUserBtn .header-account-amount {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.site-pearl body.public-ui #topbar #topbarUserBtn .header-account-copy small {
  max-width:115px!important; font:500 9px/1.2 var(--font-ui,system-ui,sans-serif)!important;
  color:var(--account-muted)!important;
}
html.site-pearl body.public-ui #topbar #topbarUserBtn .header-account-chevron {display:grid;place-items:center;flex:none;color:var(--account-muted);transition:transform .18s}
html.site-pearl body.public-ui #topbar #topbarUserBtn .header-account-chevron svg {width:11px;height:11px}
html.site-pearl body.public-ui #topbar #topbarUserBtn[aria-expanded=true] .header-account-chevron {transform:rotate(180deg)}
html.site-pearl body.public-ui #topbar #topbarUserBtn .header-account-online {left:26px;bottom:4px;width:7px;height:7px;border:2px solid var(--account-surface);box-shadow:none;background:#169b72}
html.site-pearl body.public-ui #topbarUserWrap [data-ui-icon=coins] {width:16px!important;height:16px!important;flex:none;stroke-width:1.4;color:#a15a06!important}
html.site-pearl body.public-ui #topbarUserWrap [data-ui-icon=coins] .ui-symbol-tone {fill:#fbbf24!important;fill-opacity:1!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop {
  box-sizing:border-box; top:calc(100% + 9px)!important; right:0!important;
  width:284px!important; max-width:calc(100vw - 24px)!important;
  max-height:calc(100dvh - 80px); padding:6px!important;
  border:1px solid var(--account-line)!important; border-radius:15px!important;
  background:var(--account-surface)!important; color:var(--account-ink)!important;
  box-shadow:var(--account-shadow)!important; overflow-x:hidden; overflow-y:auto;
  scrollbar-color:var(--account-line) transparent; overscroll-behavior:contain;
  clip-path:none!important; transform:translateY(-5px)!important;
  transition:opacity .18s ease,transform .18s ease!important; will-change:auto;
}
html.site-pearl body.public-ui #topbar #topbarUserDrop:is(.open,.is-open) {transform:translateY(0)!important;opacity:1;pointer-events:auto}
html.site-pearl body.public-ui #topbar #topbarUserDrop[hidden] {display:none!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop::before {content:none!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop .header-profile-link {
  display:flex;align-items:center;gap:10px;min-height:58px;margin:0 0 6px;
  padding:9px!important;border:0!important;border-radius:10px!important;
  background:transparent!important;color:var(--account-ink)!important;text-decoration:none;
}
html.site-pearl body.public-ui #topbar #topbarUserDrop .header-profile-link:hover {background:var(--account-soft)!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-avatar {
  box-sizing:border-box!important;flex:0 0 34px!important;width:34px!important;height:34px!important;
  border:1px solid var(--account-line)!important;border-radius:50%!important;
  background:var(--account-soft)!important;box-shadow:none!important;overflow:hidden;
}
html.site-pearl body.public-ui #topbar #topbarUserDrop .header-profile-copy {flex:1;min-width:0}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-username {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:700;color:var(--account-ink)!important;line-height:1.5}
html.site-pearl body.public-ui #topbar #topbarUserDrop .header-profile-label {display:block;font-size:11px;color:var(--account-muted)!important;line-height:1.5}
html.site-pearl body.public-ui #topbar #topbarUserDrop .header-profile-link>.ui-symbol {width:14px;height:14px;flex:none;color:var(--account-muted)!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-balance-card {
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px!important;margin:0 3px 6px!important;border:1px solid var(--account-line)!important;
  border-radius:11px!important;background:var(--account-wallet)!important;box-shadow:none!important;
}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-balance-copy {min-width:0;flex:1}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-bal-label {display:flex;align-items:center;gap:6px;color:var(--account-muted)!important;font-size:11px;line-height:1.5}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-bal-amount {margin:4px 0 0!important;overflow-wrap:anywhere;color:var(--account-ink)!important;font-size:18px!important;font-weight:750;line-height:1.3;font-variant-numeric:tabular-nums}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-topup-btn {
  display:inline-flex;align-items:center;justify-content:center;gap:4px;flex:none;min-height:34px!important;
  width:auto!important;margin:0!important;padding:7px 9px!important;border:1px solid #2563eb!important;
  border-radius:8px!important;background:#2563eb!important;color:#fff!important;
  font-size:11px!important;font-weight:700;text-decoration:none;box-shadow:none!important;transform:none!important;
}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-topup-btn:hover {background:#1d4ed8!important;border-color:#1d4ed8!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-topup-btn>.ui-symbol {width:14px;height:14px;margin:0;color:inherit!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-links {display:flex;gap:2px;padding:3px!important;border:0!important;background:transparent!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop :is(.tud-link,.account-history-links>a) {
  display:flex;align-items:center;gap:9px;min-height:38px!important;padding:9px 10px!important;
  border:0!important;border-radius:8px!important;background:transparent!important;
  color:var(--account-ink)!important;font-size:12px!important;font-weight:550;line-height:1.4;
  text-decoration:none;transform:none!important;box-shadow:none!important;cursor:pointer;
}
html.site-pearl body.public-ui #topbar #topbarUserDrop :is(.tud-link,.account-history-links>a):hover,
html.site-pearl body.public-ui #topbar #topbarUserDrop .account-history-links>a[aria-current=page] {background:var(--account-soft)!important;color:var(--account-accent)!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-link>.ui-symbol {width:16px;min-width:16px;height:16px;margin:0;color:var(--account-muted)!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop .payment-menu-chevron {color:var(--account-muted)!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop .payment-menu-chevron>.ui-symbol {width:12px;height:12px}
html.site-pearl body.public-ui #topbar #topbarUserDrop .account-history-links {margin:2px 5px 5px 18px;padding-left:9px;border-color:var(--account-line)}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-logout {
  display:flex;align-items:center;gap:9px;min-height:38px!important;margin:5px 3px 3px;padding:9px 10px!important;
  border:0!important;border-radius:9px!important;background:var(--account-danger-bg)!important;
  color:var(--account-danger)!important;font-size:12px!important;font-weight:650;text-decoration:none;
}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-logout>.ui-symbol {width:16px;height:16px;margin:0;color:inherit!important}
html.site-pearl body.public-ui #topbar #topbarUserDrop .tud-logout:hover {filter:brightness(.97)}
html.site-pearl body.public-ui #topbarUserWrap :is(a,summary,button):focus-visible {outline:2px solid var(--account-accent)!important;outline-offset:2px}
@media(max-width:370px) {
  html.site-pearl body.public-ui #topbar #topbarUserBtn.topbar-user-chip {min-width:120px!important;max-width:150px!important;gap:6px;padding-right:7px!important}
  html.site-pearl body.public-ui #topbar #topbarUserBtn .header-account-copy small {max-width:82px!important}
}
@media(prefers-reduced-motion:reduce) {
  html.site-pearl body.public-ui #topbar #topbarUserDrop,
  html.site-pearl body.public-ui #topbar #topbarUserBtn.topbar-user-chip,
  html.site-pearl body.public-ui #topbar #topbarUserBtn .header-account-chevron {transition:none!important;animation:none!important}
}