.customer-call-dialog{width:min(640px,calc(100vw - 24px));max-height:calc(100dvh - 32px);padding:var(--space-panel);border-radius:24px;color:var(--text-primary);box-sizing:border-box}
.customer-call-dialog.customer-call-room{width:min(1120px,calc(100vw - 24px))}
.customer-call-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-fields);padding:0}
.customer-call-header h2,.customer-call-header .eyebrow{margin:0}.customer-call-header>button{position:static;flex:0 0 44px;width:44px;height:44px;padding:var(--space-inline)}
.customer-call-body{display:grid;gap:var(--space-fields);min-width:0}.customer-call-body p{margin:0;line-height:1.5}.customer-call-body input,.customer-call-body textarea{width:100%;box-sizing:border-box;min-height:44px}.customer-call-body label{display:grid;gap:var(--space-inline)}
.customer-call-identity{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-inline);padding:var(--space-inline) 0}.customer-call-identity>span:not(.customer-call-status){color:var(--muted);font-size:var(--type-meta)}
.customer-call-status{border:1px solid var(--line);padding:4px 8px;border-radius:999px;font-size:var(--type-meta);line-height:1.4}.customer-call-status[data-state=waiting]{color:var(--text-warning);background:var(--surface-warning)}.customer-call-status[data-state=completed]{color:var(--text-success)}
.customer-call-create{border:1px solid var(--line);border-radius:var(--radius-lg,16px);padding:var(--space-fields);display:grid;gap:var(--space-inline);background:var(--surface-field)}.customer-call-create h3{margin:0;font-size:var(--type-body)}
.customer-call-actions{display:flex;gap:var(--space-inline);flex-wrap:wrap;align-items:center}.customer-call-actions button{min-height:44px;max-width:100%;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-inline)}
.customer-call-list{display:grid}.customer-call-row{display:flex;align-items:center;gap:var(--space-inline);padding:var(--space-inline) 0;border-bottom:1px solid var(--line)}.customer-call-row:last-child{border:0}.customer-call-row>div{display:grid;gap:4px;min-width:0;flex:1}.customer-call-row small{color:var(--muted);overflow-wrap:anywhere}.customer-call-row button{width:44px;height:44px;flex:none}
.customer-call-meta,.customer-call-empty,.guest-call-privacy{color:var(--muted);font-size:var(--type-meta);line-height:1.5}.customer-call-empty{padding:var(--space-fields) 0}.customer-call-summary{white-space:pre-wrap;overflow-wrap:anywhere}.customer-call-room-content{display:grid;gap:var(--space-fields);min-width:0}
.customer-call-dialog .customer-dialog-actions{margin-top:var(--space-fields);padding-top:var(--space-fields);display:flex;gap:var(--space-inline);justify-content:flex-end;border-top:1px solid var(--line)}
.customer-call-media{display:grid;gap:var(--space-inline);min-width:0}.customer-call-stage{position:relative;min-height:300px;height:clamp(300px,50dvh,570px);background:#171c21;border-radius:var(--radius-lg,16px);overflow:hidden;isolation:isolate;color:#f7f8fa}.customer-call-remote{width:100%;height:100%;object-fit:contain}.customer-call-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--space-fields);padding:var(--space-fields);text-align:center}.customer-call-placeholder[hidden]{display:none}.customer-call-placeholder>span:last-child{color:#bec8d0;font-size:var(--type-meta)}
.customer-call-avatar{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;font-size:var(--type-dialog-title);font-weight:700;background:#303943;color:#fff}.customer-call-local{position:absolute;z-index:2;right:12px;top:12px;width:clamp(96px,20%,180px);aspect-ratio:4/3;overflow:hidden;border:2px solid #fff;border-radius:12px;box-shadow:0 4px 16px #0006;background:#303943}.customer-call-local[hidden]{display:none}.customer-call-local video{width:100%;height:100%;object-fit:cover;pointer-events:none}
.customer-call-live-state{font-size:var(--type-meta);color:var(--muted);text-align:center;margin:0}.customer-call-controls{display:flex;align-items:center;justify-content:center;gap:var(--space-inline);flex-wrap:wrap}.customer-call-controls button{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:var(--space-inline) var(--space-fields);gap:var(--space-inline)}.customer-call-controls button[aria-pressed=true]{background:var(--surface-pressed)}.customer-call-hangup{border:1px solid transparent;border-radius:12px;background:#b42237;color:#fff}.customer-call-hangup:hover{background:#921b2d}.customer-call-controls .icon{width:20px;height:20px}
.customer-call-media[data-channel=audio] .customer-call-stage{height:220px;min-height:220px;background:var(--surface-field);color:var(--text-primary);border:1px solid var(--line)}.customer-call-media[data-channel=audio] .customer-call-placeholder>span:last-child{color:var(--muted)}.customer-call-media[data-channel=audio] .customer-call-remote{position:absolute;width:1px;height:1px;opacity:0}.customer-call-setting{display:flex!important;align-items:center;justify-content:space-between;gap:var(--space-fields);padding:var(--space-inline) 0;min-height:44px;border-bottom:1px solid var(--line)}.customer-call-setting input{width:22px;height:22px;min-height:0;flex:none}.customer-call-setting-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-fields)}
.customer-call-public{margin:0;min-height:100dvh;color:var(--text-primary);font-family:var(--font-body,system-ui,sans-serif);background:var(--surface-page)}.customer-call-public-header{max-width:1120px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:var(--space-panel);gap:var(--space-fields)}.customer-call-brand{display:flex;align-items:center;gap:var(--space-inline);font-size:var(--type-dialog-title)}.customer-call-public-header>div{display:flex;gap:var(--space-inline)}.customer-call-public-header button{width:44px;height:44px;padding:var(--space-inline)}.customer-call-public-header img{width:24px;height:18px}.customer-call-public .icon{width:20px;height:20px;fill:none;stroke:currentColor}.customer-call-public #customer-call-guest{max-width:1080px;padding:var(--space-panel);margin:4dvh auto;box-sizing:border-box}.guest-welcome{max-width:520px;margin:auto;border-radius:24px;padding:var(--space-section);display:grid;gap:var(--space-panel);box-sizing:border-box}.guest-welcome.guest-live{max-width:100%}.guest-welcome h1,.guest-welcome h2,.guest-welcome p{margin:0}.guest-welcome h1{font-size:var(--type-dialog-title)}.guest-welcome h2{font-size:var(--type-section-title)}.guest-welcome p{line-height:1.6}.guest-call-heading{display:grid;gap:var(--space-inline);padding-bottom:var(--space-fields);border-bottom:1px solid var(--line)}.guest-call-heading>p:last-child{color:var(--muted);font-size:var(--type-meta)}.guest-call-privacy{border-top:1px solid var(--line);padding-top:var(--space-fields)}.guest-waiting-mark{width:36px;height:36px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:customer-call-wait 2s linear infinite}@keyframes customer-call-wait{to{transform:rotate(360deg)}}
@media(max-width:700px){.customer-call-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - var(--mobile-nav-height,0px) - 20px);padding:var(--space-fields);border-radius:20px}.customer-call-dialog.customer-call-room{width:calc(100vw - 16px)}.customer-call-stage{height:clamp(240px,45dvh,440px);min-height:240px}.customer-call-setting-grid{grid-template-columns:1fr}.customer-call-public #customer-call-guest{padding:var(--space-fields);margin:0 auto}.guest-welcome{padding:var(--space-panel)}.customer-call-identity{align-items:flex-start;flex-direction:column}.customer-call-actions>button{flex:1 1 auto}.customer-call-public .guest-live{padding:var(--space-fields)}}
@media(prefers-reduced-motion:reduce){.guest-waiting-mark{animation:none}}

.customer-call-header h2{font-size:var(--type-dialog-title);line-height:1.3}.customer-call-header .eyebrow{font-size:var(--type-eyebrow)}.customer-call-dialog input,.customer-call-dialog textarea,.customer-call-public input,.customer-call-public textarea{font:inherit;font-size:var(--type-control);padding:var(--space-inline) var(--space-fields);border:1px solid var(--line);border-radius:var(--action-radius);background:var(--surface-field);color:var(--text-primary)}.customer-call-public button{font-size:var(--type-action);min-height:var(--control-target)}.customer-call-public .guest-welcome>button{justify-self:start}.customer-call-public #customer-call-guest{display:block;flex:1}.customer-call-public .eyebrow{font-size:var(--type-eyebrow);letter-spacing:1.2px}.customer-call-public .guest-welcome{font-size:var(--type-body)}

.customer-call-public-header{width:100%;box-sizing:border-box}.customer-call-create>p{color:var(--muted);font-size:var(--type-description)}.customer-call-dialog .customer-call-room-content h3{margin:0}

/* Compact invitation shell: heading grouped at left, close aligned inside the frame. */
:root body.in-workspace dialog.customer-call-dialog:not(.settings-panel):not(.customer-call-room){width:min(600px,calc(100vw - 24px));height:fit-content;min-height:0}
:root dialog.customer-call-dialog.mobile-scroll-shell .customer-call-header{margin:0;padding:0;align-items:flex-start}
.customer-call-header .modal-heading-copy{display:grid;gap:4px;min-width:0}
:root dialog.customer-call-dialog .customer-call-header .eyebrow{margin:0}
.customer-call-list-identity{align-items:flex-start;flex-direction:column;gap:4px;padding:0 0 var(--space-fields);border-bottom:1px solid var(--line)}
.customer-call-list-identity>span{overflow-wrap:anywhere}
.customer-call-create{gap:var(--space-fields)}
.customer-call-create .customer-call-channels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-inline)}
:root body.in-workspace dialog.customer-call-dialog .customer-call-channels>button{width:100%;margin:0;min-height:var(--control-target);padding:var(--action-padding-block) var(--action-padding-inline);box-shadow:none}
.customer-call-channels .icon{width:20px;height:20px}
.customer-call-empty{margin:0;padding:var(--space-inline) 0;font-size:var(--type-meta)}
@media(max-width:700px){:root body.in-workspace dialog.customer-call-dialog:not(.settings-panel):not(.customer-call-room){width:calc(100vw - 20px)}.customer-call-header .modal-heading-copy{gap:4px}}