/* Keep intrinsic content intact when the viewport is short or zoomed. */
.main:has(.live-inbox){height:100dvh;grid-template-columns:minmax(0,1fr)}
.chat-pane .chat-live:not(:has(.email-editor-expanded:not([hidden]))){
 grid-template-rows:max-content max-content minmax(180px,1fr) max-content;
 overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;
}
#chatLive .chat-head{flex-wrap:wrap;align-content:flex-start;min-height:max-content}
#chatLive .chat-head .operation-actions{flex-wrap:wrap;overflow:visible;max-width:100%;padding-bottom:0;gap:8px;min-width:0}
#chatLive .ticket-header-buttons{flex:0 1 auto;flex-wrap:wrap;min-width:0;max-width:100%}
#chatLive .ticket-header-tags{flex-wrap:wrap;min-width:0;max-width:100%}
#chatLive .chat-head .operation-actions>*{flex-shrink:1}
#chatLive .chat-person-copy :is(strong,span){max-width:100%}
#chatLive .chat-person-copy .copy-inline{white-space:normal;overflow-wrap:anywhere}
#chatLive .email-composer{min-height:min-content}
#chatLive #emailEditorHost:not(.email-editor-expanded){height:clamp(320px,40dvh,420px);min-height:min-content;flex:none}
#chatLive #emailEditorHost .ql-container{flex:1 0 100px;height:100px;min-height:100px}
#chatLive #emailEditorHost .email-editor-footer{flex-wrap:wrap;gap:10px}
#chatLive #emailEditorHost .email-send-actions{flex-wrap:wrap;max-width:100%;gap:8px}
#chatLive #emailEditorHost .email-insert-tools{gap:4px;max-width:100%}
#chatLive .ticket-sla-summary{white-space:normal}
.sidebar{overflow-y:auto;overscroll-behavior:contain}
.audit-entry{min-width:0;overflow-wrap:anywhere}
.audit-entry :is(header,p,details){min-width:0;max-width:100%}
.super-kpi{min-width:0}
.super-kpi>div{min-width:0;overflow-wrap:anywhere}
.super-card{min-width:0}
.super-card :is(#queueTable,#agentTable){overflow:auto;max-width:100%}
body .notifications-heading{flex-wrap:wrap}
.email-editor fieldset{min-inline-size:0;max-width:100%}
.email-address-line,.email-fields label,.email-fields input{min-width:0}
@media(max-width:600px){
 .btn{white-space:normal;max-width:100%;padding-block:10px;text-align:center}
 .super-kpis{grid-template-columns:minmax(0,1fr)}
 body .notification-categories{grid-template-columns:minmax(0,1fr)}
 #chatLive .chat-head .operation-actions{width:100%}
 #chatLive .ticket-header-buttons{flex-basis:100%;gap:6px}
 #chatLive #emailEditorHost:not(.email-editor-expanded){height:auto;min-height:360px}
 #chatLive #emailEditorHost .ql-container{flex:1 0 140px;min-height:140px}
 #chatLive #emailEditorHost .email-editor-footer{padding:10px 12px}
 #chatLive #emailEditorHost .email-send-actions{width:100%;justify-content:flex-end}
}
@media(max-width:420px){
 .topbar{padding-inline:8px;gap:2px;min-width:0}
 .topbar-actions{gap:2px;min-width:0}
 .topbar .icon-btn{width:40px;min-width:40px;height:44px;flex:none}
 .topbar .user-chip{padding:2px;width:38px;flex:none;justify-content:center}
 .topbar .user-chip .avatar{width:30px;height:30px}
 .email-editor-footer{padding-inline:12px;min-width:0}
 .email-editor-footer>*,.email-send-actions{min-width:0;max-width:100%;flex-wrap:wrap}
 .email-editor-footer .btn{overflow-wrap:anywhere}
}

@media(max-width:900px){.login-shell{display:grid;grid-template-columns:minmax(0,1fr);width:100%;max-width:100%;min-width:0;overflow-x:clip}.login-form-panel{box-sizing:border-box;width:100%;min-width:0;padding:clamp(20px,6vw,40px)}.login-card{box-sizing:border-box;width:100%;max-width:440px;min-width:0}.login-card :is(h2,.login-intro,form,.form-label,.field,.login-submit,.internal-help){box-sizing:border-box;max-width:100%;min-width:0}}
@media(max-width:560px){.login-card h2{font-size:clamp(24px,8vw,34px);white-space:normal;overflow-wrap:anywhere}.login-intro,.internal-help{white-space:normal;overflow-wrap:anywhere}}