.topbar{background:#fbfcf4;border-color:#d9e4c7}.agent-shell{background:#f1f5e6}.dial-rail,.queue-rail{background:#f8faef;border-color:#d9e4c7}.rail-primary{background:#5c8d32;box-shadow:0 3px 8px #5c8d324d}.rail-button{border-color:#d7e2c8;color:#61794f}.toggle-row{color:#5c7350}.toggle-row input:checked+.toggle{background:#78a942}.mode-switch button{background:#e8efdc;color:#718562}.mode-switch button.active{color:#547d2d}.rail-section{border-color:#d9e4c7}.action-button{border-color:#d9e4c7;color:#5d7650}.recording-card{border-color:#d9e4c7}.customer-column{background:#f1f5e6}.customer-header,.customer-form{border-color:#d9e4c7}.customer-title h1{color:#294d2b}.person-icon{background:#e8f0da;color:#5c8d32}.outline-button{border-color:#d9e4c7;color:#58734a}.save-button{background:#5c8d32;border-color:#5c8d32}.customer-form input,.customer-form textarea{background:#fcfdf8;border-color:#d9e4c7}.customer-meta{background:#f8faef;border-color:#d9e4c7}.customer-meta span{background:#e8efdc;color:#5e7948}.customer-meta button{color:#5c8d32}.below-panels .panel,.queue-panel{border-color:#d9e4c7}.badge{background:#e8efdc;color:#547d2d}.secondary{background:#e4edd7;color:#527c2e}.call{background:#6f9f38}.primary{background:#5c8d32}.primary:hover,.call:hover{background:#456f27}.service-status{background:#fff7df;border-color:#ead9a6;color:#927324}.service-status.online{background:#e5f2d6;border-color:#c6dda9;color:#4d7b2e}.queue-title b{background:#e8efdc;color:#5c8d32}.queue-item time{background:#fff4dc;color:#a37a25}.transcript-heading h2{color:#294d2b}.agent-line small{color:#6b9937}.agent-line p{background:#edf4df}.customer-line p{background:#f2f4ec}.customer-line small{color:#4b8c50}.app-footer{border-color:#d9e4c7;background:#fbfcf4}.app-footer b{color:#4f8a45}.eyebrow{color:#bd724d}.status-dot{background:#6a9d3e}.live-dot{background:#d96758}@media(max-width:680px){.dial-rail{border-color:#d9e4c7}}
.topbar{height:58px}.topbar-brand{align-items:center;display:flex}.workspace-label{border-left:1px solid var(--line);color:var(--muted);font-size:12px;margin-left:14px;padding-left:14px}.agent-extension{background:#eef5f2;border-radius:4px;color:var(--teal-dark);font-size:11px;padding:4px 7px}.agent-shell{background:#edf2fa;display:grid;grid-template-columns:178px minmax(580px,1fr) 245px;min-height:calc(100vh - 90px)}.dial-rail,.queue-rail{background:#f7f9fc;padding:18px 9px}.dial-rail{border-right:1px solid #dae2ee}.queue-rail{border-left:1px solid #dae2ee}.rail-kicker{color:#7d8ba5;font-size:9px;font-weight:700;letter-spacing:1px;margin:0 0 8px;text-transform:uppercase}.live-dot{background:#e72d58;border-radius:50%;display:inline-block;height:6px;margin-right:5px;width:6px}.rail-primary,.rail-button,.action-button,.hangup-button{align-items:center;border:0;border-radius:6px;cursor:pointer;display:flex;font:600 11px 'DM Sans';gap:8px;padding:10px;width:100%}.rail-primary{background:#386be0;box-shadow:0 3px 8px #386be04d;color:#fff;justify-content:center;margin-bottom:7px;text-transform:capitalize}.rail-button{background:#fff;border:1px solid #dbe4f1;color:#66758f;justify-content:center;margin-bottom:10px}.toggle-row{align-items:center;color:#536583;display:flex;font-size:11px;gap:7px;margin:8px 0 14px}.toggle-row input{display:none}.toggle{background:#c3ccdb;border-radius:9px;height:16px;position:relative;width:29px}.toggle:after{background:#fff;border-radius:50%;content:'';height:12px;left:2px;position:absolute;top:2px;width:12px}.toggle-row input:checked+.toggle{background:#3c6ee6}.toggle-row input:checked+.toggle:after{left:15px}.mode-switch{display:grid;gap:4px;grid-template-columns:1fr 1fr}.mode-switch button{background:#e7edf8;border:0;border-radius:5px;color:#6a7d9f;font-size:9px;padding:7px 2px}.mode-switch button.active{background:#fff;color:#386be0;font-weight:700}.rail-section{border-top:1px solid #dbe4ef;margin-top:17px;padding-top:14px}.action-button{background:#fff;border:1px solid #dbe4ef;color:#5d6e89;margin-bottom:6px}.action-button time{color:#e72d58;margin-left:auto}.action-button.recording{border-color:#ffc4d2;color:#e72d58}.hangup-button{background:#e42d52;color:#fff;justify-content:center;margin-top:11px;text-transform:capitalize}.dtmf-row{display:flex;gap:4px;margin-top:8px}.dtmf-row input{font-size:10px;min-width:0;padding:8px;width:100%}.dtmf-row button{background:#e5ebf5;border:0;border-radius:4px;color:#56709a;font-size:10px}.recording-card{background:#fff;border:1px solid #dbe4ef;border-radius:6px;margin-top:14px;padding:11px 9px}.recording-card strong,.recording-card span{display:block;font-size:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recording-card strong{color:#50617d;margin-bottom:4px}.recording-card span{color:#8794aa}.customer-column{min-width:0;padding:17px 12px}.customer-header{align-items:center;background:#fff;border:1px solid #dce5f1;border-radius:7px 7px 0 0;display:flex;justify-content:space-between;padding:10px 12px}.customer-title{align-items:center;display:flex;gap:8px}.person-icon{align-items:center;background:#eef3ff;border-radius:7px;color:#4775dc;display:flex;font-size:18px;height:28px;justify-content:center;width:28px}.customer-title h1{font-size:13px;margin:0}.customer-title p{color:#7b89a0;font-size:9px;margin-top:2px}.customer-actions{display:flex;gap:6px}.outline-button,.save-button{background:#fff;border:1px solid #dce5f1;border-radius:5px;color:#526684;font-size:10px;padding:8px 10px}.save-button{background:#386be0;border-color:#386be0;color:#fff}.customer-form{background:#fff;border:1px solid #dce5f1;border-top:0;display:grid;gap:9px;grid-template-columns:repeat(6,1fr);padding:12px}.customer-form label{color:#8a97ad;font-size:8px;gap:4px;text-transform:uppercase}.customer-form input,.customer-form textarea{background:#fbfcfe;border:1px solid #dce5f1;border-radius:5px;font-size:11px;padding:8px;width:100%}.customer-form textarea{resize:vertical}.customer-form .wide{grid-column:span 3}.customer-meta{align-items:center;background:#f7f9fc;border:1px solid #dce5f1;border-top:0;color:#7d8ba5;display:flex;gap:8px;padding:8px 12px}.customer-meta span{background:#edf2fa;border-radius:10px;font-size:8px;padding:4px 7px}.customer-meta button{background:none;border:0;color:#386be0;font-size:8px;margin-left:auto}.below-panels{display:grid;gap:12px;grid-template-columns:1fr 1fr;margin-top:12px}.below-panels .panel{box-shadow:none;padding:15px}.dial-panel .panel-heading{margin-bottom:11px}.dial-panel h2{font-size:14px}.transcript-panel{min-height:325px}.transcript-heading{align-items:center;display:flex;justify-content:space-between;margin-bottom:12px}.transcript-heading>div{align-items:center;display:flex}.transcript-heading h2{font-size:14px}.transcript-heading .muted{font-size:9px}.transcript-line{margin-bottom:10px}.transcript-line small{color:#4775dc;font-size:8px;font-weight:700}.transcript-line small time{color:#a0aabe;font-weight:400;margin-left:4px}.transcript-line p{border-radius:5px;font-size:10px;line-height:1.35;margin-top:4px;padding:8px 9px}.agent-line p{background:#edf2fd}.customer-line small{color:#198d67}.customer-line p{background:#f1f3f6}.typing{color:#a2adbf;font-size:16px;letter-spacing:2px}.queue-panel{background:#fff;border:1px solid #dce5f1;border-radius:6px;padding:12px}.queue-heading{align-items:center;display:flex;justify-content:space-between}.queue-heading .rail-kicker{margin:0}.queue-heading .service-status{font-size:8px;padding:4px 7px}.status-big{border-bottom:1px solid #e4eaf2;display:flex;flex-direction:column;padding:18px 0}.status-big strong{color:#386be0;font:600 22px 'Space Grotesk'}.status-big span{color:#8490a6;font-size:10px;margin-top:2px}.queue-title{align-items:center;display:flex;justify-content:space-between;margin:17px 0 8px}.queue-title h2{font-size:12px}.queue-title b{background:#edf2ff;border-radius:9px;color:#386be0;font-size:9px;padding:3px 7px}.queue-item{align-items:center;border-top:1px solid #edf0f5;display:grid;font-size:10px;gap:3px;grid-template-columns:1fr auto;padding:10px 0}.queue-item small{color:#8591a5;font-size:8px}.queue-item time{background:#fff4dc;border-radius:4px;color:#bd8b27;font-size:8px;padding:3px}.queue-note{color:#8995aa;display:flex;font-size:8px;justify-content:space-between;margin-top:12px;padding:0 3px}.app-footer{align-items:center;background:#fff;border-top:1px solid #dce5ef;color:#8491a8;display:flex;font-size:8px;justify-content:space-between;min-height:32px;padding:0 18px}.app-footer b{color:#188b68;font-weight:600}@media(max-width:980px){.agent-shell{grid-template-columns:165px minmax(0,1fr)}.queue-rail{display:none}.below-panels{grid-template-columns:1fr}.transcript-panel{min-height:0}}@media(max-width:680px){.workspace-label,.agent-extension{display:none}.agent-shell{display:block}.dial-rail{border-bottom:1px solid #dbe4ef;border-right:0}.dial-rail .rail-section,.recording-card{display:none}.customer-column{padding:9px}.customer-header{align-items:flex-start;gap:10px}.customer-actions{flex-direction:column}.customer-form{grid-template-columns:1fr 1fr}.customer-form .wide{grid-column:span 2}.customer-meta{flex-wrap:wrap}.customer-meta button{margin-left:0}.topbar{height:auto}.app-footer{font-size:7px}}
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{--ink:#14212b;--muted:#71808a;--paper:#f4f7f5;--panel:#fff;--line:#dce5e1;--teal:#087f73;--teal-dark:#075c55;--coral:#e46e4e;--shadow:0 16px 40px rgba(20,45,47,.08)}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px 'DM Sans',sans-serif}h1,h2,h3,p{margin:0}h1,h2,h3,strong{font-family:'Space Grotesk',sans-serif}h1{font-size:42px;letter-spacing:0}h2{font-size:21px}h3{font-size:15px;margin-bottom:12px}.muted{color:var(--muted)}.eyebrow{color:var(--coral);font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase}.brand-mark{align-items:center;background:var(--coral);border-radius:11px;color:#fff;display:flex;font:700 18px 'Space Grotesk';height:52px;justify-content:center;width:52px}.brand-mark.small{border-radius:8px;font-size:13px;height:31px;margin-right:10px;width:31px}.login-page{align-items:center;background:linear-gradient(135deg,#e4f0eb 0%,#f8f5ed 100%);display:flex;justify-content:center;min-height:100vh;padding:24px}.login-shell{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);max-width:420px;padding:42px;width:100%}.login-shell h1{font-size:32px;margin:20px 0 8px}.alert{border-radius:6px;margin:20px 0;padding:12px}.error{background:#fff0ed;color:#a9432d}.login-form{display:grid;gap:17px;margin-top:28px}label{color:var(--muted);display:grid;font-size:13px;font-weight:600;gap:7px}input,textarea{background:#fbfcfb;border:1px solid var(--line);border-radius:6px;color:var(--ink);font:inherit;outline:none;padding:12px}input:focus,textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px #087f7319}.button{border:0;border-radius:6px;cursor:pointer;font:600 14px 'DM Sans';padding:12px 18px}.button:disabled{cursor:wait;opacity:.55}.primary{background:var(--teal);color:#fff}.primary:hover,.call:hover{background:var(--teal-dark)}.topbar{align-items:center;background:#fff;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;padding:15px max(24px,calc((100% - 1180px)/2))}.topbar>div:first-child{align-items:center;display:flex}.agent{align-items:center;color:var(--muted);display:flex;gap:9px}.agent a{color:var(--teal);font-weight:600;margin-left:17px;text-decoration:none}.status-dot{background:#22a486;border-radius:50%;height:8px;width:8px}.console{margin:0 auto;max-width:1180px;padding:54px 24px}.intro{align-items:end;display:flex;justify-content:space-between;margin-bottom:30px}.intro h1{margin:8px 0 5px}.service-status{background:#fff7e9;border:1px solid #f0dcb6;border-radius:20px;color:#9b6d19;font-size:13px;padding:8px 13px}.service-status.online{background:#e5f5ef;border-color:#b9e0d3;color:#13755f}.service-status.offline{background:#fff0ed;border-color:#f2c5ba;color:#a9432d}.workspace{display:grid;gap:22px;grid-template-columns:1.15fr .85fr}.panel{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);padding:25px}.panel-heading{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.search-row{display:flex;gap:10px}.search-row input{flex:1}.secondary{background:#e7f1ee;color:var(--teal-dark)}.lead-results{border-top:1px solid var(--line);margin-top:19px;max-height:430px;overflow:auto}.empty{color:var(--muted);padding:25px 0;text-align:center}.lead-result{align-items:center;background:transparent;border:0;border-bottom:1px solid var(--line);cursor:pointer;display:grid;gap:3px;padding:15px 4px;text-align:left;width:100%}.lead-result:hover,.lead-result.selected{background:#f1f8f5}.lead-result strong{font-size:15px}.lead-result span{color:var(--muted);font-size:13px}.lead-result em{color:var(--teal);font-size:11px;font-style:normal;text-transform:capitalize}.badge{background:#f0f5f3;border-radius:15px;color:var(--teal-dark);font-size:12px;padding:6px 10px}.dial-form{display:flex;gap:10px}.dial-form input{flex:1}.call{background:var(--coral);color:#fff}.call-state{color:var(--muted);font-size:13px;min-height:42px;padding:14px 0 0}.divider{border-top:1px solid var(--line);margin:20px 0}.dispositions{display:grid;gap:8px;grid-template-columns:1fr 1fr;margin-bottom:17px}.dispositions[aria-disabled=true]{opacity:.45}.dispositions button{background:#f8faf9;border:1px solid var(--line);border-radius:5px;color:var(--ink);cursor:pointer;font:500 12px 'DM Sans';padding:10px 7px}.dispositions button:hover{border-color:var(--teal);color:var(--teal)}textarea{resize:vertical;width:100%}@media(max-width:720px){h1{font-size:34px}.topbar{padding:13px 16px}.agent{font-size:12px}.agent a{margin-left:5px}.console{padding:34px 16px}.intro{align-items:start;flex-direction:column;gap:18px}.workspace{grid-template-columns:1fr}.panel{padding:20px}}
.webrtc-status{background:#eef5f2;border-radius:10px;color:#71808a;font-size:10px;margin-left:9px;padding:4px 8px}