.team-line-slots[hidden] { display: none !important; }
.operator-shell .topbar { flex-wrap:wrap; height:auto; gap:12px; }
.topbar > .agent-work-state { margin:0; width:285px; max-width:100%; flex:0 1 285px; }
.operator-shell .top-actions { margin-left:auto; flex-wrap:wrap; }
.engine-card { background:#08465a; border:1px solid #256174; border-radius:8px; padding:16px; }
.engine-card .section-head { gap:8px; padding-bottom:12px; border-bottom:1px solid #2b6577; }
.engine-card .section-head > span { font-size:13px; white-space:nowrap; }
.engine-card #lineState, .engine-card #activeAccount { display:none; }
.engine-registration { font-size:12px; color:#f4a8b8; display:flex; gap:5px; align-items:center; }
.engine-registration::before { content:''; width:7px; height:7px; border-radius:50%; background:currentColor; flex-shrink:0; }
.engine-registration.registered { color:#45d9ac; }
.engine-card .account-line { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px; margin:10px 0; }
.engine-card .engine-identity { font-size:13px; overflow-wrap:anywhere; color:#f0f8fb; }
.engine-card .rail-metrics { display:flex; flex-direction:column; gap:8px; }
.engine-card .rail-metrics > div { display:flex; justify-content:space-between; gap:8px; padding:0; border:0; background:transparent; }
.engine-card .rail-metrics strong { font-size:12px; color:#75d5c4; }
.phone-shell .call-actions #answer { display:none !important; }
#displayThemeToggle { width:40px; height:40px; flex:0 0 40px; padding:0; display:inline-flex; align-items:center; justify-content:center; }
@media (max-width: 700px) { .operator-shell .topbar { height:auto; min-height:120px; flex-wrap:wrap; overflow:visible; } .operator-shell .top-actions { flex-wrap:wrap; width:100%; gap:6px; } }
html[data-voice-theme="dark"] :is(.filter,.call-item,.log-item,.call-entry) { background:#272c33; color:#dce6f2; border-color:#414a55; }
html[data-voice-theme="dark"] .filter.active { background:#224462; color:#b7deff; border-color:#3d719b; }
html[data-voice-theme="dark"] { color-scheme:dark; --ink:#ecf0f5; --muted:#adb8c8; --panel:#202429; --line:#3a414a; }
html[data-voice-theme="dark"] body, html[data-voice-theme="dark"] .workspace-view { background:#171a1e; color:#ecf0f5; }
html[data-voice-theme="dark"] :is(.topbar,.phone-shell,.history-panel,.history-card,.login-card,dialog,.history-view,.workspace-main) { background:#202429; color:#ecf0f5; border-color:#3a414a; }
html[data-voice-theme="dark"] :is(.topbar h2,.phone-header,.phone-agent-identity,.phone-call-timer,.history-number,.team-line-slots h3) { color:#ecf0f5; }
html[data-voice-theme="dark"] :is(input,select,textarea,.ghost,.history-tab,.call-filter,.call-search,.history-item,.chat-message,.chat-compose) { background:#272c33; color:#e7edf4; border-color:#414a55; }
html[data-voice-theme="dark"] input::placeholder { color:#9daabb; }
html[data-voice-theme="dark"] .phone-shell :is(.number-display,.dialpad button) { background:#292f36; color:#edf3f9; border-color:#414a55; }
html[data-voice-theme="dark"] .phone-shell .dialpad button:hover:not(:disabled) { background:#343e49; }
html[data-voice-theme="dark"] .phone-shell .call-actions :is(#mute,#answer,#agentTransfer,#clearNumber) { background:#303842; color:#dce6f2; border-color:#475260; }
html[data-voice-theme="dark"] .phone-shell .call-actions { border-color:#3a414a; }
html[data-voice-theme="dark"] .team-line-tile.free { background:#183b32; color:#70e2b5; border-color:#2b6956; }
html[data-voice-theme="dark"] .team-line-tile.busy { background:#492832; color:#ffabbc; border-color:#874454; }
html[data-voice-theme="dark"] .team-line-tile.unknown { background:#30363e; color:#c1ccd9; border-color:#515e6f; }
html[data-voice-theme="dark"] :is(.team-line-summary,.agent-work-state) { background:#183b32; color:#70e2b5; border-color:#2b6956; }
html[data-voice-theme="dark"] .agent-work-state:is([data-state="busy"],[data-state="break"]) { background:#492832; color:#ffabbc; border-color:#874454; }
html[data-voice-theme="dark"] .agent-work-state[data-state="after_call"] { background:#403a22; color:#f5d585; border-color:#756333; }
html[data-voice-theme="dark"] .agent-work-state select { background:transparent; color:inherit; }
html[data-voice-theme="dark"] .agent-work-state option { background:#272c33; color:#e7edf4; }
html[data-voice-theme="dark"] #disconnect { background:#492832; color:#ffabbc; border-color:#874454; }
html[data-voice-theme="dark"] :is(.history-tabs,.history-filters,.chat-contact,.assigned-meta) { background:#252b32; border-color:#414a55; color:#dce6f2; }
html[data-voice-theme="dark"] :is(.history-tab.active,.call-filter.active) { background:#224462; color:#b7deff; border-color:#3d719b; }
.team-line-slots { margin: 0 0 10px; padding: 8px 0; border-block: 1px solid #d9e3ec; text-align: right; }
.team-line-slots header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; margin-bottom: 8px; }
.team-line-slots h3 { margin: 0; font-size: 13px; line-height: 1.6; letter-spacing: 0; }
.team-line-summary { font-size: 12px; line-height: 1.6; }
.team-line-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(60px, 1fr)); gap: 5px; max-height: 150px; overflow-y: auto; }
.team-line-tile { min-width: 0; height: 44px; border: 1px solid; border-radius: 5px; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.2; }
.team-line-tile .team-line-phone { font-family: "Segoe UI Symbol", sans-serif; font-size: 18px; line-height: 20px; }
.team-line-tile strong { font-size: 12px; direction: ltr; max-width: 100%; overflow-wrap: anywhere; }
.team-line-tile.free { background: #e8f7ee; color: #136437; border-color: #9cd8b4; }
.team-line-tile.busy { background: #fcebed; color: #a32439; border-color: #eaa3ae; }
.team-line-tile.unknown { background: #edf0f3; color: #53616e; border-color: #c6cfd8; }
#liveCallCard { display: none !important; }
.agent-work-state { display:flex; align-items:center; gap:8px; margin:0 0 12px; padding:6px 10px; border:1px solid #b4e8d6; background:#e9faf4; color:#087855; border-radius:6px; }
.agent-work-state select { flex:1; min-width:0; border:0; background:transparent; color:inherit; font-size:13px; font-weight:600; }
.agent-work-state[data-state="busy"], .agent-work-state[data-state="break"] { background:#fff1f3; color:#ad2849; border-color:#f1bdcb; }
.agent-work-state[data-state="after_call"] { background:#fff8e6; color:#825c00; border-color:#eddaaa; }
.agent-work-timer { font-size:12px; font-variant-numeric:tabular-nums; direction:ltr; }
#disconnect { color:#c82e56; background:#fff0f4; border-color:#ffe1ea; }
#disconnect::before { content:'\23FB'; margin-right:6px; font-size:18px; }
/* Lucide call action icons */
.call-actions :is(#call,#answer,#hangup,#mute,#clearNumber) { font-size: 0; min-height: 42px; display: flex; align-items: center; justify-content: center; }
.call-actions :is(#call,#answer,#hangup,#mute,#clearNumber,#agentTransfer)::before { content: ""; display: block; width: 21px; height: 21px; background: currentColor; mask: var(--call-icon) center / contain no-repeat; -webkit-mask: var(--call-icon) center / contain no-repeat; }
.call-actions #agentTransfer { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 13px; min-height: 36px; }
#call { --call-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M13.832%2016.568a1%201%200%200%200%201.213-.303l.355-.465A2%202%200%200%201%2017%2015h3a2%202%200%200%201%202%202v3a2%202%200%200%201-2%202A18%2018%200%200%201%202%204a2%202%200%200%201%202-2h3a2%202%200%200%201%202%202v3a2%202%200%200%201-.8%201.6l-.468.351a1%201%200%200%200-.292%201.233%2014%2014%200%200%200%206.392%206.384%22%2F%3E%3C%2Fsvg%3E"); }
.team-line-phone { --call-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M13.832%2016.568a1%201%200%200%200%201.213-.303l.355-.465A2%202%200%200%201%2017%2015h3a2%202%200%200%201%202%202v3a2%202%200%200%201-2%202A18%2018%200%200%201%202%204a2%202%200%200%201%202-2h3a2%202%200%200%201%202%202v3a2%202%200%200%201-.8%201.6l-.468.351a1%201%200%200%200-.292%201.233%2014%2014%200%200%200%206.392%206.384%22%2F%3E%3C%2Fsvg%3E"); }
#answer { --call-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M13%202a9%209%200%200%201%209%209%22%2F%3E%3Cpath%20d%3D%22M13%206a5%205%200%200%201%205%205%22%2F%3E%3Cpath%20d%3D%22M13.832%2016.568a1%201%200%200%200%201.213-.303l.355-.465A2%202%200%200%201%2017%2015h3a2%202%200%200%201%202%202v3a2%202%200%200%201-2%202A18%2018%200%200%201%202%204a2%202%200%200%201%202-2h3a2%202%200%200%201%202%202v3a2%202%200%200%201-.8%201.6l-.468.351a1%201%200%200%200-.292%201.233%2014%2014%200%200%200%206.392%206.384%22%2F%3E%3C%2Fsvg%3E"); }
#hangup { --call-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M10.1%2013.9a14%2014%200%200%200%203.732%202.668%201%201%200%200%200%201.213-.303l.355-.465A2%202%200%200%201%2017%2015h3a2%202%200%200%201%202%202v3a2%202%200%200%201-2%202%2018%2018%200%200%201-12.728-5.272%22%2F%3E%3Cpath%20d%3D%22M22%202%202%2022%22%2F%3E%3Cpath%20d%3D%22M4.76%2013.582A18%2018%200%200%201%202%204a2%202%200%200%201%202-2h3a2%202%200%200%201%202%202v3a2%202%200%200%201-.8%201.6l-.468.351a1%201%200%200%200-.292%201.233%2014%2014%200%200%200%20.244.473%22%2F%3E%3C%2Fsvg%3E"); }
#mute { --call-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2019v3%22%2F%3E%3Cpath%20d%3D%22M15%209.34V5a3%203%200%200%200-5.68-1.33%22%2F%3E%3Cpath%20d%3D%22M16.95%2016.95A7%207%200%200%201%205%2012v-2%22%2F%3E%3Cpath%20d%3D%22M18.89%2013.23A7%207%200%200%200%2019%2012v-2%22%2F%3E%3Cpath%20d%3D%22m2%202%2020%2020%22%2F%3E%3Cpath%20d%3D%22M9%209v3a3%203%200%200%200%205.12%202.12%22%2F%3E%3C%2Fsvg%3E"); }
#mute[data-call-unmute="true"] { --call-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2019v3%22%2F%3E%3Cpath%20d%3D%22M19%2010v2a7%207%200%200%201-14%200v-2%22%2F%3E%3Crect%20x%3D%229%22%20y%3D%222%22%20width%3D%226%22%20height%3D%2213%22%20rx%3D%223%22%2F%3E%3C%2Fsvg%3E"); }
#clearNumber { --call-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M10%205a2%202%200%200%200-1.344.519l-6.328%205.74a1%201%200%200%200%200%201.481l6.328%205.741A2%202%200%200%200%2010%2019h10a2%202%200%200%200%202-2V7a2%202%200%200%200-2-2z%22%2F%3E%3Cpath%20d%3D%22m12%209%206%206%22%2F%3E%3Cpath%20d%3D%22m18%209-6%206%22%2F%3E%3C%2Fsvg%3E"); }
#agentTransfer { --call-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%206h8%22%2F%3E%3Cpath%20d%3D%22m18%202%204%204-4%204%22%2F%3E%3Cpath%20d%3D%22M13.832%2016.568a1%201%200%200%200%201.213-.303l.355-.465A2%202%200%200%201%2017%2015h3a2%202%200%200%201%202%202v3a2%202%200%200%201-2%202A18%2018%200%200%201%202%204a2%202%200%200%201%202-2h3a2%202%200%200%201%202%202v3a2%202%200%200%201-.8%201.6l-.468.351a1%201%200%200%200-.292%201.233%2014%2014%200%200%200%206.392%206.384%22%2F%3E%3C%2Fsvg%3E"); }

.team-line-slots { border: 0; padding: 6px 0 10px; }
.team-line-summary { background: #e9faf4; color: #008a69; padding: 3px 8px; border-radius: 6px; }
.team-line-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.team-line-tile { height: 42px; flex-direction: row; gap: 7px; border-radius: 8px; }
.team-line-tile.free { background: #f4fbf9; color: #008667; border-color: #d8eae5; }
.team-line-tile strong { font-size: 13px; }
.team-line-tile .team-line-phone { font-size: 0; width: 16px; height: 16px; background: currentColor; mask: var(--call-icon) center / contain no-repeat; -webkit-mask: var(--call-icon) center / contain no-repeat; }
.phone-shell .number-display { border-radius: 8px; background: #f7fbfc; font-size: 30px; }
.phone-shell .dialpad { gap: 10px; }
.phone-shell .dialpad button { border-radius: 8px; background: #f7fbfc; box-shadow: 0 1px 2px #12314508; }
.phone-shell .call-actions { grid-template-columns: repeat(6,minmax(0,1fr)); gap: 10px; border-top: 1px solid #edf2f5; padding-top: 14px; }
.phone-shell .call-actions :is(#call,#answer,#hangup,#mute,#clearNumber,#agentTransfer) { font-size: 13px; display: flex; gap: 7px; border-radius: 8px; align-items: center; justify-content: center; min-width: 0; padding: 8px 2px; }
.phone-shell .call-actions :is(#mute,#answer,#agentTransfer,#clearNumber) { flex-direction: column; height: 62px; color: #41566c; background: #eef4f7; border: 1px solid #e4edf2; grid-row: 1; }
.phone-shell .call-actions #mute { grid-column: 1 / 3; }
.phone-shell .call-actions #answer { grid-column: 2; }
.phone-shell .call-actions #agentTransfer { grid-column: 3 / 5 !important; }
.phone-shell .call-actions #clearNumber { grid-column: 5 / 7; }
.phone-shell .call-actions :is(#call,#hangup) { grid-row: 2; height: 58px; font-size: 18px; font-weight: 700; flex-direction: row; }
.phone-shell .call-actions #call { grid-column: 1 / 4; background: #00956f; color: white; }
.phone-shell .call-actions #hangup { grid-column: 4 / 7; background: #ef3863; color: white; }

/* Compact phone surface; existing call controls remain unchanged. */
.phone-shell { padding:20px; border-radius:8px; box-shadow:0 8px 28px #203c5110; }
.phone-shell .phone-header { margin-bottom:14px; font-size:12px; }
.phone-shell .team-line-slots { padding:0 0 12px; margin-bottom:10px; }
.phone-shell .team-line-slots h3 { font-size:12px; color:#61758a; font-weight:600; }
.phone-shell .team-line-summary { font-size:11px; }
.phone-shell .team-line-tile { height:36px; border-radius:6px; }
.dial-number-wrap { position:relative; margin-bottom:12px; }
.phone-shell .dial-number-wrap .number-display { width:100%; margin:0; height:66px; padding:12px 48px; font-family:inherit; font-size:28px; font-weight:600; background:#f8fafc; border:1px solid #cbd8e5; border-radius:8px; box-shadow:inset 0 1px 2px #122b4010; }
.phone-shell .dial-number-wrap .number-display::placeholder { font-size:23px; font-weight:500; color:#8998a8; }
.dial-number-wrap:focus-within .number-display { border-color:#4296d4; outline:2px solid #4296d420; }
#clearDialNumber { position:absolute; right:10px; top:50%; transform:translateY(-50%); width:30px; height:30px; min-height:0; padding:0; display:flex; align-items:center; justify-content:center; border:0; border-radius:6px; background:#e9eff5; color:#60768c; }
#clearDialNumber:hover:not(:disabled) { background:#dce7f1; color:#245879; }
#clearDialNumber:disabled { opacity:.3; }
.phone-shell .dialpad { gap:8px; }
.phone-shell .dialpad button { min-height:0; height:64px; padding:8px; background:#fafcfd; border:1px solid #e0e8ef; box-shadow:0 1px 2px #18384c08; font-family:inherit; font-size:25px; font-weight:600; }
.phone-shell .dialpad span { font-size:9px; margin-top:4px; font-weight:500; color:#8b9bac; }
.phone-shell .call-actions { margin-top:12px; padding-top:12px; gap:8px; }
.phone-shell .call-actions :is(#mute,#agentTransfer,#clearNumber) { height:50px; font-size:12px; gap:4px; }
.phone-shell .call-actions :is(#call,#hangup) { height:50px; font-size:16px; }
html[data-voice-theme="dark"] .phone-shell .dial-number-wrap .number-display { background:#252d35; color:#eef4fa; border-color:#465666; }
html[data-voice-theme="dark"] #clearDialNumber { background:#35424f; color:#c0d3e4; }
html[data-voice-theme="dark"] .phone-shell .dialpad button { background:#272e36; border-color:#3d4956; color:#eff5fa; }
html[data-voice-theme="dark"] .phone-shell .team-line-slots h3 { color:#a7b7c8; }

/* Adapt to the browser's usable viewport, including browser zoom. */
.workspace-view { width:100%; max-width:100%; grid-template-columns:210px minmax(0,1fr); height:100dvh; min-height:0; }
.command-rail { min-width:0; padding:14px; gap:14px; overflow-y:auto; }
.command-rail > * { min-width:0; max-width:100%; box-sizing:border-box; }
.command-rail .engine-card .section-head { flex-wrap:wrap; }
.command-rail .engine-card .engine-identity { min-width:0; max-width:100%; }
.phone-shell .call-actions :is(#mute,#agentTransfer,#clearNumber) { padding:4px 2px; line-height:1.2; }
.phone-shell .call-actions :is(#mute,#agentTransfer,#clearNumber)::before { flex-shrink:0; width:18px; height:18px; }
.operator-shell { grid-template-rows:auto minmax(0,1fr); padding:10px; gap:10px; }
.operator-shell .topbar { min-height:64px; padding:10px 14px; flex-direction:row; align-items:center; }
.operator-shell .topbar h2 { font-size:23px; }
.operator-shell .top-actions { width:auto; max-width:100%; gap:6px; }
.topbar > .agent-work-state { flex:0 1 260px; width:260px; }
.work-grid { grid-template-columns:minmax(0,1fr) minmax(270px,32%); gap:10px; min-width:0; }
.call-stage { display:flex; flex-direction:column; align-items:center; min-height:0; overflow-y:auto; overflow-x:hidden; padding:0 2px 8px; gap:8px; }
.call-stage .phone-shell { width:100%; max-width:480px; min-width:0; flex:0 0 auto; margin:0 auto; box-sizing:border-box; }
.history-panel { min-width:0; width:100%; height:100%; overflow-y:auto; padding:12px; box-sizing:border-box; }
.history-panel .history-tabs, .history-panel .log-tools { flex-wrap:wrap; }
.history-panel :is(.call-search,.call-log,.history-view) { min-width:0; max-width:100%; }
.brand-lockup .workspace-logo { max-width:100%; height:auto; }
@media (min-width:1051px) and (max-height:850px) {
 .call-stage .phone-shell { max-width:430px; padding:12px 16px; }
 .phone-shell .phone-header { margin-bottom:8px; min-height:22px; }
 .phone-shell .team-line-slots { margin-bottom:6px; padding-bottom:6px; }
 .phone-shell .team-line-grid { max-height:84px; }
 .phone-shell .team-line-tile { height:32px; }
 .dial-number-wrap { margin-bottom:8px; }
 .phone-shell .dial-number-wrap .number-display { height:54px; min-height:0; }
 .phone-shell .dialpad { margin-top:0; gap:6px; }
 .phone-shell .dialpad button { height:48px; min-height:0; padding:5px; }
 .phone-shell .call-actions { margin-top:8px; padding-top:8px; gap:6px; }
 .phone-shell .call-actions :is(#mute,#agentTransfer,#clearNumber) { height:44px; min-height:0; }
 .phone-shell .call-actions :is(#call,#hangup) { height:44px; min-height:0; }
}
@media (max-width:1050px) {
 html, body, .app { overflow:auto; }
 .workspace-view { height:auto; min-height:100dvh; overflow:visible; grid-template-columns:180px minmax(0,1fr); }
 .operator-shell { overflow:visible; grid-template-rows:auto auto; }
 .work-grid { grid-template-columns:minmax(0,1fr); overflow:visible; }
 .call-stage { overflow:visible; }
 .history-panel { height:360px; }
}
@media (max-width:760px) {
 .workspace-view { grid-template-columns:minmax(0,1fr); }
 .command-rail { grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-rows:auto auto; gap:10px; }
 .command-rail .brand-lockup { align-self:start; }
 .command-rail .rail-nav { grid-column:1; }
 .command-rail .engine-card { grid-column:2; grid-row:1 / 3; align-self:stretch; padding:10px; }
 .engine-card .section-head { flex-wrap:wrap; }
 .operator-shell .topbar { gap:8px; }
 .operator-shell .top-actions { width:100%; margin-left:0; }
 .topbar > .agent-work-state { flex:1 1 230px; }
 .call-stage .phone-shell { padding:14px; }
}

/* Fixed vector icon: no dependency on installed symbol fonts. */
#disconnect { display:inline-flex; align-items:center; justify-content:center; gap:7px; white-space:nowrap; }
#disconnect::before { content:''; display:block; flex:0 0 18px; width:18px; height:18px; margin:0; background:currentColor; mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m16%2017%205-5-5-5%22%2F%3E%3Cpath%20d%3D%22M21%2012H9%22%2F%3E%3Cpath%20d%3D%22M9%2021H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h4%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat; -webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m16%2017%205-5-5-5%22%2F%3E%3Cpath%20d%3D%22M21%2012H9%22%2F%3E%3Cpath%20d%3D%22M9%2021H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h4%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat; }
.operator-shell .top-actions > * { flex-shrink:0; }
.history-panel .log-tools { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
.history-panel .log-tools .filter { min-width:0; padding:8px 3px; white-space:normal; overflow-wrap:anywhere; }
.history-panel .history-head { flex-wrap:wrap; gap:8px; }
/* Glass is restricted to primary surfaces, not every repeated item. */
html[data-voice-theme="dark"] body,
html[data-voice-theme="dark"] .workspace-view { background-color:#060b16; color:#f8fafc; }
html[data-voice-theme="dark"] .workspace-main { background:transparent; }
html[data-voice-theme="dark"] :is(.topbar,.phone-shell,.history-panel,.login-card,dialog) {
 background-color:rgba(15,23,42,.75);
 backdrop-filter:blur(20px);
 -webkit-backdrop-filter:blur(20px);
 border:1px solid rgba(255,255,255,.08);
 box-shadow:0 8px 32px 0 rgba(0,0,0,.37);
 color:#f8fafc;
}
html[data-voice-theme="dark"] .history-view { background:transparent; }
html[data-voice-theme="dark"] .command-rail { background:#0b1425; }
html[data-voice-theme="dark"] .engine-card { background:rgba(15,23,42,.75); border-color:rgba(255,255,255,.08); }
html[data-voice-theme="dark"] .phone-shell :is(.dialpad button,.dial-number-wrap .number-display) { background:rgba(30,41,59,.65); border-color:rgba(255,255,255,.1); color:#f8fafc; }
html[data-voice-theme="dark"] .phone-shell .call-actions :is(#mute,#agentTransfer,#clearNumber) { background:rgba(30,41,59,.65); border-color:rgba(255,255,255,.1); color:#dbe8f4; }

/* Assigned: dark-only overrides preserve all light-mode controls. */
html[data-voice-theme="dark"] #assignedView { color:#e7eef7; background:transparent; }
html[data-voice-theme="dark"] :is(.assigned-lead,.assigned-lead.completed,.assigned-lead.active) { background:rgba(15,23,42,.75); border:1px solid rgba(255,255,255,.12); box-shadow:0 4px 16px #0002; color:#e7eef7; }
html[data-voice-theme="dark"] .assigned-lead.completed { border-color:#31685e; }
html[data-voice-theme="dark"] .assigned-number { background:rgba(30,41,59,.65); color:#f1f5f9; border-color:#3c5067; }
html[data-voice-theme="dark"] .assigned-number :is(span,strong) { color:#dce7f5; }
html[data-voice-theme="dark"] .assigned-number b { color:#73e1bc; background:transparent; }
html[data-voice-theme="dark"] .assigned-lead.completed .assigned-number b { color:#73e1bc; }
html[data-voice-theme="dark"] .assigned-lead > div[dir="rtl"] { color:#b7c5d6 !important; }
html[data-voice-theme="dark"] #assignedView [data-autodial-start] { background:#1c354e !important; color:#b4dcff !important; border-color:#3f6589 !important; }
html[data-voice-theme="dark"] #assignedView :is(.lead-result-status,.lead-result-comment) { background:#182538; color:#edf4fc; border-color:#40536b; }
html[data-voice-theme="dark"] #assignedView .lead-result-comment::placeholder { color:#a9b9cc; }
html[data-voice-theme="dark"] #assignedView .lead-result-save { background:#2167cf; color:#fff; border-color:#4787e2; }
html[data-voice-theme="dark"] :is(.autodial-outcome,.lead-result-message,#autodialState,#employeeExportStatus) { color:#bdccdf; }
html[data-voice-theme="dark"] .lead-result-message.success { color:#73e1bc; }
html[data-voice-theme="dark"] .lead-result-message.error { color:#ffadbd; }
html[data-voice-theme="dark"] #employeeExport { background:#193b38; color:#a1f0d2; border:1px solid #3a6e60; }
html[data-voice-theme="dark"] #employeeExport:hover:not(:disabled) { background:#23514a; }
html[data-voice-theme="dark"] #autodialStart { background:#1c354e; color:#b4dcff; border-color:#3f6589; }
html[data-voice-theme="dark"] #autodialPause { background:#453b21; color:#f2d486; border-color:#766236; }
html[data-voice-theme="dark"] #autodialStop { background:#482638; color:#ffafc4; border-color:#84485a; }
html[data-voice-theme="dark"] .assigned-meta { background:transparent; color:#b7c5d6; border-color:#34465b; }
.engine-card { font-family:"Segoe UI",Tahoma,Arial,sans-serif; padding:14px; background:#08465a; }
.engine-card .section-head { margin:0; padding:0 0 10px; gap:7px; }
.engine-card .section-head > span { font-size:14px; font-weight:500; color:#c6e0ed; }
.engine-card .engine-registration { font-size:12px; font-weight:600; }
.engine-card .account-line { border-top:0; padding-top:0; margin:10px 0; align-items:baseline; }
.engine-card :is(.account-line > span,.rail-metrics span) { font-size:13px; font-weight:400; color:#c6e0ed; }
.engine-card .engine-identity { font-size:13px; font-weight:600; }
.engine-card .rail-metrics { margin-top:8px; gap:8px; }
.engine-card .rail-metrics strong { font-size:12px; font-weight:500; }
/* Reference-style engine panel; values and call behavior are unchanged. */
.command-rail .engine-card,
html[data-voice-theme="dark"] .command-rail .engine-card { background:#063e52; border:1px solid #286172; border-radius:8px; padding:14px 12px; box-shadow:none; }
.command-rail .engine-card .section-head { display:flex; flex-wrap:nowrap; align-items:center; justify-content:space-between; gap:6px; padding-bottom:10px; border-bottom:1px solid #285e70; }
.command-rail .engine-card .section-head > span { font-size:12px; font-weight:500; color:#b9d3e3; }
.command-rail .engine-card .engine-registration { font-size:11px; font-weight:600; white-space:nowrap; }
.command-rail .engine-card .engine-registration.registered { color:#2dc99b; }
.command-rail .engine-card .account-line { margin:10px 0; padding:0; border:0; gap:6px; }
.command-rail .engine-card :is(.account-line > span,.rail-metrics span) { font-size:12px; color:#b9d3e3; }
.command-rail .engine-card .engine-identity { font-size:12px; color:#f0f8fc; }
.command-rail .engine-card .rail-metrics strong { color:#64d3bd; }
#clearDialNumber { background:transparent; color:#91a2b8; width:32px; height:32px; }
#clearDialNumber svg { width:23px; height:23px; }
#clearDialNumber:hover:not(:disabled) { background:#e5edf5; color:#607d9d; }
html[data-voice-theme="dark"] #clearDialNumber { background:transparent; color:#a4b7cb; }
html[data-voice-theme="dark"] #clearDialNumber:hover:not(:disabled) { background:#304256; }
@media (min-width:1051px) { .workspace-view { grid-template-columns:240px minmax(0,1fr); } }
@media (max-width:1050px) { .command-rail .engine-card .section-head { flex-wrap:wrap; } }
/* Signed-out view must use a complete palette when the saved theme is dark. */
html[data-voice-theme="dark"] .gateway-login { background-color:#060b16; background-image:none; color:#f8fafc; }
html[data-voice-theme="dark"] .gateway-login .login-card { background:rgba(15,23,42,.94); color:#f8fafc; border-color:rgba(255,255,255,.1); }
html[data-voice-theme="dark"] .gateway-login .login-panel { background:#0c293c; border-color:#25465b; }
html[data-voice-theme="dark"] .gateway-login :is(#loginTitle,.auth-form label,.agent-status > span,.autodial-access h2,.autodial-access h3) { color:#e8f0fa; }
html[data-voice-theme="dark"] .gateway-login :is(.login-card-brand > p,.gateway-footer,.check-row,.auth-form label > span,.autodial-access p) { color:#afc1d5; }
html[data-voice-theme="dark"] .gateway-login :is(.role-switch,.language-switch) { background:#1b2a3d; border-color:#3b526c; }
html[data-voice-theme="dark"] .gateway-login :is(.role-switch,.language-switch) button { color:#c8d8e8; background:transparent; }
html[data-voice-theme="dark"] .gateway-login :is(.role-switch,.language-switch) button.active { background:#0c719d; color:#fff; }
html[data-voice-theme="dark"] .gateway-login .auth-form input:not([type="checkbox"]) { background:#1b2a3d; border-color:#3b526c; color:#f8fafc; }
html[data-voice-theme="dark"] .gateway-login .auth-form input::placeholder { color:#9eb2c8; }
html[data-voice-theme="dark"] .gateway-login .password-toggle { color:#83d6f7; }
html[data-voice-theme="dark"] .gateway-login .login-logo-frame { background:#fff; border-radius:6px; }
html[data-voice-theme="dark"] .gateway-login .auth-error { background:#482638; border-color:#84485a; color:#ffd0db; }