/* V2.452 community support and multi-avatar header overrides. */
.topbar-main-row {
gap: 8px;
}
body .lounge-app .lounge-topbar {
height: calc(108px + env(safe-area-inset-top));
min-height: calc(108px + env(safe-area-inset-top));
max-height: calc(108px + env(safe-area-inset-top));
padding-bottom: 8px;
grid-template-rows: 50px 32px;
}
.brand-community {
min-width: 0;
flex: 1 1 auto;
display: flex;
align-items: flex-start;
gap: 7px;
}
.brand-community .brand-link {
flex: 0 0 auto;
}
body .lounge-app .brand-rate-stack {
min-width: 0;
flex: 0 0 auto;
display: grid;
justify-items: start;
gap: 2px;
}
.brand-community .room-title-copy {
min-width: 0;
flex: 1 1 auto;
margin-top: 10px;
align-content: start;
}
.brand-community-divider {
width: 2px;
height: 25px;
margin-top: 10px;
flex: 0 0 2px;
border-radius: 999px;
background: #2f62a6;
opacity: .82;
}
body .lounge-app .brand-community .city-lounge-title {
display: block;
overflow: hidden;
color: #3f4a5d;
font-size: 10.5px !important;
font-family: var(--xm-font-display, Inter, ui-sans-serif, system-ui, sans-serif);
font-weight: 450 !important;
line-height: 1.15;
text-overflow: ellipsis;
white-space: nowrap;
}
body .lounge-app .brand-community .room-title-en {
margin-top: 2px;
color: #98a1af;
font-size: 6.5px !important;
font-family: var(--xm-font-display, Inter, ui-sans-serif, system-ui, sans-serif);
font-weight: 400 !important;
line-height: 1;
letter-spacing: 0.035em;
}
body .lounge-app .room-status-row {
min-height: 32px;
transform: none;
gap: 6px;
}
body .lounge-app .room-title-status {
min-width: 0;
flex: 1 1 auto;
align-self: center;
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: flex-start;
gap: 1px !important;
}
body .lounge-app .room-secondary-status {
min-width: 0;
display: inline-flex;
align-items: center;
gap: 5px;
}
body .lounge-app .room-meta-status {
min-width: 0;
margin-left: 0;
flex: 0 1 auto;
display: inline-flex;
align-items: center;
gap: 4px;
}
body .lounge-app .lounge-support-trigger,
body .lounge-app .lounge-app-trigger {
height: 19px;
min-height: 19px;
padding: 0 6px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 2px;
border: 1px solid #dce3ed;
border-radius: 999px;
background: #fff;
color: #31558b;
font-size: 7.5px;
font-weight: 650;
text-decoration: none;
}
body .lounge-app .lounge-support-trigger svg,
body .lounge-app .lounge-app-trigger svg {
width: 8px;
height: 8px;
}
body .lounge-app .room-status-row .room-online-count {
margin-top: 0;
flex: 0 0 auto;
gap: 3px;
color: #7f8b9d;
font-size: 8px;
font-weight: 400 !important;
line-height: 1.2;
letter-spacing: 0;
white-space: nowrap;
}
body .lounge-app .online-people {
min-width: 0;
min-height: 28px;
flex: 0 0 auto;
padding-left: 3px;
justify-content: flex-end;
}
body .lounge-app .room-status-row .online-person-button,
body .lounge-app .room-status-row .online-person-button:nth-child(n+2) {
position: relative;
width: 27px;
height: 27px;
margin-left: -5px;
  display: grid;
}
body .lounge-app .room-status-row .online-person-button:first-child {
margin-left: 0;
}
body .lounge-app .online-people-overflow {
position: relative;
z-index: 2;
width: 25px;
height: 25px;
margin-left: -5px;
display: grid;
place-items: center;
color: #526178;
border: 2px solid rgba(255, 255, 255, .96);
border-radius: 50%;
background: #edf1f6;
box-shadow: 0 2px 8px rgba(31, 66, 115, .12);
font-size: 7.5px;
font-weight: 600;
font-variant-numeric: tabular-nums;
}
body .lounge-app .avatar-online {
width: 24px;
height: 24px;
}

@media (max-width: 359px) {
body .lounge-app .room-secondary-status { gap: 3px; }
body .lounge-app .lounge-support-trigger,
body .lounge-app .lounge-app-trigger { padding-inline: 4px; font-size: 7px; }
}

body .lounge-app .home-exchange-rate.lounge-home-exchange-rate {
width: fit-content;
max-width: 100%;
min-height: 16px;
margin-top: -2px;
padding: 0 4px;
display: inline-flex;
align-items: center;
gap: 2px;
color: #0f172a;
border: 1px solid rgba(37, 99, 235, 0.13);
border-radius: 999px;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(248, 251, 255, 0.86)), rgba(255, 255, 255, 0.9);
box-shadow: 0 12px 26px rgba(30, 58, 138, 0.065), inset 0 1px 0 rgba(255, 255, 255, 0.92);
letter-spacing: 0;
white-space: nowrap;
pointer-events: none;
}
body .lounge-app .home-exchange-label,
body .lounge-app .home-exchange-cny,
body .lounge-app .home-exchange-lak,
body .lounge-app .home-exchange-swap {
font-size: 8.5px !important;
font-weight: 500 !important;
line-height: 1 !important;
letter-spacing: 0 !important;
}
body .lounge-app .home-exchange-label {
color: #1e3a8a;
}
body .lounge-app .home-exchange-cny,
body .lounge-app .home-exchange-lak {
min-width: 13px;
height: 13px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 999px;
}
body .lounge-app .home-exchange-cny {
color: #1e3a8a;
border: 1px solid rgba(37, 99, 235, 0.14);
background: rgba(239, 246, 255, 0.9);
}
body .lounge-app .home-exchange-lak {
color: #0284c7;
border: 1px solid rgba(14, 165, 233, 0.16);
background: rgba(236, 254, 255, 0.9);
}
body .lounge-app .home-exchange-swap {
color: #64748b;
}
body .lounge-app .home-exchange-value {
color: #0f172a;
font-size: 10px !important;
font-weight: 600 !important;
line-height: 1 !important;
letter-spacing: 0 !important;
}
body .lounge-app .content-scroll {
scrollbar-width: none;
}
body .lounge-app .content-scroll::-webkit-scrollbar {
width: 0;
height: 0;
display: none;
}
@media (max-width: 380px) {
.brand-community {
  gap: 5px;
}
body .lounge-app .brand-community .city-lounge-title {
  font-size: 9.5px !important;
}
body .lounge-app .brand-community .room-title-en {
  font-size: 5.7px !important;
}
body .lounge-app .room-title-status,
body .lounge-app .room-secondary-status {
  gap: 3px !important;
}
body .lounge-app .lounge-support-trigger {
  padding-inline: 3px;
  font-size: 6.9px;
}
body .lounge-app .room-status-row .online-person-button,
body .lounge-app .room-status-row .online-person-button:nth-child(n+2) {
  width: 25px;
  height: 25px;
  margin-left: -5px;
}
body .lounge-app .avatar-online {
  width: 22px;
  height: 22px;
}
}