/* Keep header children in their own tracks; long labels must not paint over neighbours. */
#app .shell .topbar .brand>div{min-width:0;overflow:hidden}
#app .shell .topbar .brand strong,
#app .shell .topbar .brand span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(min-width:761px){
 #app .shell .topbar .user-copy{flex:1 1 auto;min-width:0;max-width:180px}
 #app .shell .topbar .user-copy b,
 #app .shell .topbar .user-copy small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 #app .shell .topbar .profile-button{min-width:0;max-width:228px;overflow:hidden;flex:0 1 auto}
 #app .shell .topbar .user-menu{min-width:0;max-width:282px}
}
@media(min-width:761px) and (max-width:1550px){
 #app .shell .topbar{display:grid;grid-template-columns:minmax(0,1fr) 138px 82px minmax(210px,282px);grid-template-areas:"brand presence controls profile" "tabs tabs tabs search";align-items:center;gap:10px 8px;padding:12px 18px}
 #app .shell .topbar .brand{grid-area:brand;min-width:0;max-width:100%;width:auto}
 #app .shell .topbar .brand img{flex:none}
 #app .shell .topbar .presence-control{grid-area:presence}
 #app .shell .topbar .workspace-nav-controls{grid-area:controls}
 #app .shell .topbar .tabs{grid-area:tabs;min-width:0;width:100%;max-width:100%;margin:0}
 #app .shell .topbar .header-search{grid-area:search;min-width:0;width:100%;max-width:100%;margin:0}
 #app .shell .topbar .user-menu{grid-area:profile;justify-self:end;margin:0;max-width:100%}
}
@media(min-width:1551px){
 #app .shell .topbar .brand{flex:0 0 220px;min-width:220px}
 #app .shell .topbar .tabs{flex:1 1 520px;min-width:520px}
}
@media(min-width:761px) and (max-width:1100px){
 #app .crm-command-bar{flex-wrap:wrap}
 #app .crm-command-bar .crm-search{min-width:0;flex:1 1 180px}
}
/* Anchor positioned table labels inside the table's own scroll area. */
#app .enterprise-team-scroll{position:relative;min-width:0;max-width:100%}
@media(max-width:760px){
 /* Quick actions must not cover the mobile profile button. */
 html body #app .shell button#chat-fab,
 html body #app .shell button#quick-phone{top:auto!important;bottom:calc(176px + env(safe-area-inset-bottom))!important}
 html body #app .shell button#quick-phone{left:max(14px,env(safe-area-inset-left))!important;right:auto!important}
 html body #app .shell button#chat-fab{left:auto!important;right:max(14px,env(safe-area-inset-right))!important}
 html body #app .shell:not(:has(.lp-bottom-nav)) button#chat-fab,
 html body #app .shell:not(:has(.lp-bottom-nav)) button#quick-phone{bottom:calc(18px + env(safe-area-inset-bottom))!important}
}
#app .live-call-stats{padding:20px 24px;margin:0 0 18px}
#app .live-call-stats h2{margin:0 0 8px;font-size:22px}
#app .live-call-stats p{margin:0 0 18px;color:var(--muted,#827b90)}
#app .live-call-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
#app .live-call-metrics b{display:flex;flex-direction:column;gap:6px;padding:14px;border:1px solid #e7e1f0;border-radius:14px;font-size:14px;font-weight:500}
#app .live-call-metrics b span{font-size:26px;font-weight:700}
#app .live-call-operators{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
#app .live-call-operators>span{padding:8px 12px;background:#f5f1fb;border-radius:10px}
@media(max-width:760px){#app .live-call-stats{padding:16px}#app .live-call-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}}
@media(min-width:761px) and (max-width:900px){
 #app .shell .topbar{grid-template-columns:minmax(0,1fr) 138px 82px 48px;grid-template-areas:"brand presence controls profile" "tabs tabs search search"}
 #app .shell .topbar .user-menu{width:48px}
}
@media(min-width:761px) and (max-width:900px){
 #app .shell .topbar{grid-template-areas:"brand presence controls profile" "tabs tabs tabs tabs" "search search search search"}
}
#app .profile-menu{box-sizing:border-box;max-width:calc(100vw - 24px);max-height:calc(100dvh - 76px);overflow-y:auto}