/* Compact operator workspace. CSS only: all existing controls and call state remain live. */
@media(max-width:760px){
 #app .shell .content{padding:18px 14px 96px}
 #app .lead-layout{gap:16px}
 #app .callbar.card{display:grid;grid-template-columns:minmax(0,1fr) 38px 38px;align-items:center;gap:14px 8px;padding:18px;min-height:0;border-radius:20px;box-shadow:0 8px 25px #3b28520a}
 #app .callbar .operator-campaign-badge{grid-column:1;grid-row:1;min-width:0;padding:0!important;margin:0!important;background:transparent!important;border-radius:0!important;color:#8c7a9c!important;font-size:11px!important;font-weight:600!important;line-height:1.5;overflow-wrap:anywhere}
 #app .callbar .sip-inline-control{grid-column:2;grid-row:1;justify-content:center;min-height:38px}
 #app .callbar .sip-inline-control .switch{position:relative;width:34px;flex-basis:34px;height:20px;min-height:20px}
 #app .callbar .sip-inline-control .switch:after{width:14px;height:14px;top:3px;left:3px}
 #app .callbar .sip-inline-control .switch.on:after{left:17px}
 #app .callbar #sip-settings{grid-column:3;grid-row:1;width:38px;height:38px;min-height:38px;padding:0;border-radius:10px;font-size:17px;border:1px solid #e8e0ee;background:#f8f5fb;color:#887298}
 #app .callbar .callstate{grid-column:1/-1;grid-row:2;display:flex;gap:11px;min-width:0;flex-basis:auto;margin:0;padding:15px 0;border-top:1px solid #f0eaf5;border-bottom:1px solid #f0eaf5;align-items:flex-start}
 #app .callbar .callstate>div:last-child{min-width:0;flex:1}
 #app .callbar .call-icon{width:32px;height:32px;min-width:32px;font-size:12px;margin-top:1px;background:#edf5ef;color:#69a379}
 #app .callbar .callstate strong{font-size:14px;font-weight:650;line-height:1.45;letter-spacing:-.015em}
 #app .callbar .callstate small{font-size:11px;line-height:1.5;margin-top:5px;color:#95879f;max-width:none}
 #app .callbar .dial-field{grid-column:1/-1;grid-row:auto;min-width:0;width:100%;order:0}
 #app .callbar .dial-field label{font-size:11px;color:#9a8aa4;margin-bottom:7px}
 #app .callbar input.call-number{width:100%;height:46px;min-height:46px;padding:0 13px;font-size:16px;line-height:1.3;letter-spacing:.01em;border-radius:11px;background:#fcfafe}
 #app .callbar #call-button{grid-column:1/-1;grid-row:auto;width:100%;min-width:0;min-height:46px;height:auto;padding:12px 10px;font-size:13px;line-height:1.4;border-radius:11px;order:0}
 #app .callbar #call-button:disabled{background:#edf2ee;border:1px solid #e2e9e4;color:#84968a;opacity:1;box-shadow:none}
 #app .callbar #mute-button,#app .callbar #speakerphone-button{grid-column:1/-1;min-height:42px;font-size:12px;width:100%;order:0}
 #app .callbar .hidden{display:none!important}
 #app .lead-card.card-pad,#app .workflow-card{padding:18px;border-radius:20px}
 #app .card-config-row{display:flex;justify-content:flex-end}
 #app .card-config-row #configure-card{min-height:36px;padding:8px 11px;font-size:11px;line-height:1.4;background:#f8f5fb;border-color:#e9e1ef}
 #app .lead-data-section{padding:15px}
 #app .lead-data-section .section-title{font-size:15px;line-height:1.4;margin-bottom:13px}
 #app .result{font-size:12px;min-height:44px;padding:10px}
 #app .workflow-tabs{display:flex;width:100%;gap:3px;overflow-x:auto}
 #app .workflow-tab{font-size:11px;padding:8px 9px;gap:5px;min-height:38px}
 #app .workflow-heading h2{font-size:18px}
 #app .workflow{padding:16px 0 0}
 /* A single clear form surface and a compact two-column result selector. */
 #app .lead-card.card-pad{gap:18px;box-shadow:0 10px 30px #39234e08}
 #app .lead-card .lead-data-section{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0}
 #app .lead-card .dynamic-card-sections{gap:22px}
 #app .lead-card .lead-data-section+.lead-data-section{border-top:1px solid #eee7f3;padding-top:20px}
 #app .lead-card .field label,#app .callbar .dial-field label{color:#766981;font-size:12px}
 #app .lead-card .field input,#app .lead-card .field select{min-height:46px;background:#fbf9fd;border-color:#e1d8e9}
 #app .lead-card .results{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0 20px}
 #app .lead-card .result{display:flex;align-items:center;gap:8px;min-width:0;min-height:48px;line-height:1.35;text-align:left;background:#faf8fc;border-color:#e6ddec;color:#6a5d76;border-radius:12px;overflow-wrap:anywhere}
 #app .lead-card .result.selected{background:#eee6fa;border-color:#aa8bce;color:#593587;box-shadow:inset 0 0 0 1px #aa8bce}
 #app .lead-card .result .radio{flex-shrink:0}
 #app .lead-card .result-title{font-size:15px;color:#493952;margin-top:4px}
 #app .lead-card textarea{min-height:92px;line-height:1.6;padding:12px;background:#fbf9fd}
 #app .lead-card #save-result{width:100%;min-height:48px;padding:12px;font-size:13px;line-height:1.4;border-radius:12px;background:linear-gradient(180deg,#7855ce,#6441b3);box-shadow:inset 0 1px #ffffff29,0 6px 14px #5f35951b}
 #app .lead-card #save-result:disabled{background:#f0ebf5;color:#a091ac;border-color:#e8dfef;box-shadow:none;opacity:1}
 #app .lead-card .next-actions{background:#faf7fd;border:1px solid #eae1f1;padding:15px;border-radius:14px;box-shadow:none}
 #app .lead-card .next-actions .section-title{font-size:13px;color:#85718f;margin-bottom:12px}
 #app .callbar .callstate small{color:#807189}
 #app .workflow-card .script-steps article{padding:16px;background:#faf8fd;border:1px solid #ebe3f2;border-radius:12px}
}
@media(max-width:680px){
 #app .shell .topbar{display:grid;grid-template-columns:36px minmax(94px,1fr) 72px 36px;grid-template-rows:auto auto auto;align-items:center;gap:10px 8px;padding:max(10px,env(safe-area-inset-top)) 14px 10px;min-height:0;position:relative;background:#fff}
 #app .topbar .brand{grid-column:1;grid-row:1;min-width:0;width:36px;flex:none;gap:0}
 #app .topbar .brand img{width:32px;height:32px;border-radius:10px}
 #app .topbar .brand>div{display:none}
 #app .topbar .presence-control{grid-column:2;grid-row:1;width:100%;min-width:0;min-height:36px;height:36px;padding:0 8px;border-radius:10px;background:#faf8fc;gap:6px}
 #app .topbar .presence-control>button{width:100%;font-size:11px!important;padding-right:0;min-height:30px}
 #app .topbar .presence-control .dot{width:6px;height:6px;flex-shrink:0}
 #app .topbar .workspace-nav-controls{grid-column:3;grid-row:1;display:flex;width:72px;gap:4px}
 #app .topbar .workspace-nav-controls button{width:34px;height:36px;min-height:36px;padding:0;border-radius:9px;font-size:20px;border-color:#e9e1ef;background:#fff}
 #app .topbar .user-menu{display:flex;grid-column:4;grid-row:1;position:static;top:auto;right:auto;margin:0;width:36px;min-width:0;justify-content:center}
 #app .topbar .user-menu .profile-button{display:flex;width:36px;height:36px;min-height:36px;padding:0;border-radius:50%;align-items:center;justify-content:center}
 #app .topbar .user-menu .avatar{width:28px;height:28px;font-size:11px}
 #app .topbar .user-menu .notification-button,#app .topbar .user-menu .user-copy{display:none}
 #app .topbar .tabs{grid-column:1/-1;grid-row:2;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:3px;width:100%;height:58px;min-height:58px;margin:0;padding:4px;overflow:visible;border-radius:13px;background:#f5f1f9;border:1px solid #eae2f1;align-items:stretch}
 #app .topbar .tabs .tab{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-width:0;width:100%;height:48px;min-height:48px;padding:5px 2px;font-size:10px;line-height:1.15;font-weight:600;white-space:nowrap;border-radius:9px}
 #app .topbar .tabs .tab .lucide{width:17px;height:17px;flex-shrink:0}
 #app .topbar .tabs .tab.active{background:#7152c8;box-shadow:0 3px 8px #6342a21c}
 #app .topbar .header-search{grid-column:1/-1;grid-row:3;min-width:0;width:100%;margin:0}
 #app .topbar .header-search input{height:38px;min-height:38px;font-size:14px}
 #app .topbar .header-search.hidden{display:none}
 #app #chat-fab,#app #quick-phone{width:46px;height:46px;min-height:46px;box-shadow:0 7px 18px #3e265226}
}