.header-navbar .navbar-wrapper > .navbar-container {
    display: flex;
    align-items: center;
    min-height: 60px;
}
.header-navbar .navbar-container > .bookmark-wrapper {
    flex: 0 0 auto;
    align-self: stretch;
}
.header-navbar .navbar-container > .navbar-collapse {
    flex: 1;
    min-width: 0;
    align-self: stretch;
    align-items: center;
}
.yupao-navbar-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: inherit;
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
    letter-spacing: 0;
}
.yupao-navbar-brand-detail { color: #7b8490; font-size: 10px; font-weight: 500; }
.header-navbar .navbar-right > .navbar-nav { flex-direction: row; align-items: center; }
.header-navbar .yupao-account-item { display: flex; align-items: center; padding: 0 6px; }
.header-navbar .yupao-account-team { padding-left: 0; }
.header-navbar .yupao-account-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 34px;
    padding: 2px 8px;
    border-radius: 4px;
    color: #4e5968;
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    white-space: nowrap;
    text-decoration: none;
    letter-spacing: 0;
}
.header-navbar .yupao-account-action > i { color: #7b8795; font-size: 14px; width: 14px; text-align: center; }
@media (hover: hover) and (pointer: fine) {
    .header-navbar .yupao-account-action:hover { background: #f0f2f5; color: #334155; }
    .header-navbar .yupao-account-toggle:hover { background: #f0f2f5; }
    .header-navbar .yupao-account-team .yupao-account-action:hover { background: #2965a6; color: #fff; }
    .header-navbar .yupao-account-problems:hover { background: #fce8eb; color: #b93543; }
}
.header-navbar .yupao-account-action:focus-visible,
.header-navbar .yupao-account-toggle:focus-visible { outline: 2px solid #2374cf; outline-offset: 3px; }
.header-navbar .yupao-account-team .yupao-account-action { height: 30px; min-height: 30px; padding: 0 10px; border: 1px solid transparent; background: #3677bb; color: #fff; font-weight: 400; line-height: 1; }
.header-navbar .yupao-account-team .yupao-account-action > i { color: inherit; }
.header-navbar .yupao-account-problems { height: 30px; min-height: 30px; padding: 0 8px; border: 1px solid #f4d8dc; background: #fff3f4; color: #bc4050; }
.header-navbar .yupao-account-problems > i,
.header-navbar .yupao-account-problems .yupao-account-label { color: inherit; }
.header-navbar .yupao-account-points { border-left: 1px solid #e4e7eb; margin-left: 6px; padding-left: 12px; }
.header-navbar .yupao-account-label { color: #707b89; font-size: 12px; }
.header-navbar .yupao-account-count { min-width: 18px; padding: 0 4px; border-radius: 3px; background: #fff; text-align: center; font-size: 12px; font-weight: 600; line-height: 18px; font-variant-numeric: tabular-nums; }
.header-navbar .yupao-account-metric { display: flex; flex-direction: column; gap: 1px; }
.header-navbar .yupao-account-metric strong { font-size: 13px; font-weight: 500; line-height: 17px; font-variant-numeric: tabular-nums; }
.header-navbar .yupao-account-metric small { margin-left: 6px; color: #88919d; font-size: 11px; font-variant-numeric: tabular-nums; }
.header-navbar .yupao-account-profile { position: relative; margin-left: 8px; padding-left: 12px; border-left: 1px solid #e4e7eb; }
.header-navbar .yupao-account-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 2px 4px !important;
    border-radius: 4px;
    color: #414b58;
}
.header-navbar .yupao-account-toggle::after { display: none; }
.header-navbar .yupao-account-identity { display: flex; flex-direction: column; gap: 1px; text-align: right; min-width: 0; }
.header-navbar .yupao-account-name { display: block; max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #414b58; font-size: 13px; line-height: 18px; font-weight: 500; }
.header-navbar .yupao-account-meta { display: flex; justify-content: flex-end; align-items: center; gap: 10px; font-size: 11px; line-height: 15px; color: #77818f; white-space: nowrap; }
.header-navbar .yupao-account-online { display: inline-flex; align-items: center; gap: 4px; }
.header-navbar .yupao-account-online > i { font-size: 7px; }
.header-navbar .yupao-account-avatar { flex: 0 0 32px; width: 32px; height: 32px; object-fit: cover; }
.header-navbar .yupao-account-chevron { font-size: 12px; color: #77818f; }
.header-navbar .yupao-account-menu { position: absolute; top: 100%; right: 0; left: auto; min-width: 245px; max-width: calc(100vw - 16px); border-radius: 6px; }
.header-navbar .navbar-nav .yupao-account-profile.show { position: relative; }
.header-navbar .navbar-container .yupao-account-profile .yupao-account-menu.show { position: absolute; left: auto !important; }
.header-navbar .yupao-account-menu .dropdown-item { display: flex; align-items: center; gap: 8px; white-space: normal; }
.header-navbar .yupao-account-dropdown-balance { margin-left: auto; font-size: 12px; font-variant-numeric: tabular-nums; }
.header-navbar .yupao-account-mobile-identity { display: none; }
@media (max-width: 1399px) {
    .yupao-navbar-brand-detail { display: none; }
    .header-navbar .yupao-account-item { padding: 0 4px; }
    .header-navbar .yupao-account-team { padding-left: 0; }
}
@media (max-width: 991px) {
    .yupao-navbar-location { display: none; }
    .header-navbar .yupao-account-item { padding: 0 4px; }
    .header-navbar .yupao-account-profile { margin-left: 4px; padding-left: 12px; }
    .header-navbar .yupao-account-name { max-width: 110px; }
}
@media (max-width: 767px) {
    .yupao-navbar-brand { font-size: 14px; }
    .header-navbar .yupao-account-team .yupao-account-action > span,
    .header-navbar .yupao-account-problems .yupao-account-label,
    .header-navbar .yupao-account-points,
    .header-navbar .yupao-account-identity,
    .header-navbar .yupao-account-chevron { display: none; }
    .header-navbar .yupao-account-action { min-width: 36px; padding: 4px; gap: 4px; }
    .header-navbar .yupao-account-team .yupao-account-action { width: 32px; min-width: 32px; padding: 0; }
    .header-navbar .yupao-account-problems { padding: 0 4px; }
    .header-navbar .yupao-account-profile { margin-left: 4px; padding-left: 8px; }
    .header-navbar .yupao-account-toggle { min-width: 36px; justify-content: center; }
    .header-navbar .yupao-account-mobile-identity { display: flex; flex-direction: column; gap: 3px; padding: 10px 16px; border-bottom: 1px solid rgba(132, 146, 164, .18); overflow-wrap: anywhere; }
    .header-navbar .yupao-account-mobile-identity > span { font-size: 11px; color: #77818f; }
}