.call-overlay[hidden]{display:none!important}.call-overlay{position:fixed;inset:0;z-index:100000;background:#160c1fe8;display:grid;place-items:center;padding:16px}.call-panel{width:min(720px,100%);background:#241b2e;color:white;border:1px solid #ffffff24;border-radius:24px;padding:24px;text-align:center;box-shadow:0 24px 80px #0008}.call-panel h2{margin:0 0 6px}.call-panel p{color:#e4d8e5}.call-videos{position:relative;max-width:680px;min-height:230px;aspect-ratio:16/10;background:#140f19;border-radius:16px;overflow:hidden;margin:16px auto}.call-videos video{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.call-videos #localCallVideo{inset:auto 12px 12px auto;width:28%;height:32%;border:2px solid white;border-radius:12px;background:#241b2e;z-index:2}.call-panel[data-mode="audio"] .call-videos{min-height:140px;aspect-ratio:auto;background:linear-gradient(145deg,#5d375b,#20182e)}.call-panel[data-mode="audio"] video{opacity:0}.call-actions{display:flex;flex-wrap:wrap;gap:9px;justify-content:center}.call-actions button{border:0;background:#ffffff25;border-radius:30px;padding:12px 17px;color:white;cursor:pointer}.call-actions button:disabled{opacity:.4}.call-actions #acceptCall{background:#198754}.call-actions .end-call,.call-actions #declineCall{background:#cf3358}.chat-top-actions{display:flex;align-items:center;flex-wrap:wrap;gap:6px}

/* Explicitly honor hidden state on all call controls */
.call-actions button[hidden]{display:none!important}
.site-exit-fixed{position:fixed;right:max(12px,env(safe-area-inset-right));top:45%;z-index:100005;background:#342537;color:#fff;border:2px solid #fff9;border-radius:15px 0 0 15px;padding:14px 13px;font-size:15px;font-weight:800;box-shadow:0 5px 28px #0008;cursor:pointer}
.site-exit-chat,.call-actions .call-exit{background:#381f39;color:#fff;border:2px solid #ffb4c6;border-radius:12px;padding:9px 13px;font-weight:800;cursor:pointer}
.call-actions .call-exit{background:#62263b}
@media(max-width:600px){.site-exit-fixed{top:auto;bottom:85px;right:0;padding:12px 10px;font-size:14px}.call-actions{padding-right:14px}.call-panel{padding:15px}}

/* Keep the active call unmistakably visible while media connects. */
.call-overlay:not([hidden]){position:fixed!important;inset:auto!important;left:12px;right:12px;top:max(10px,env(safe-area-inset-top));bottom:auto;z-index:100002;background:transparent!important;display:block!important;padding:0!important;pointer-events:none}
.call-overlay .call-panel{width:min(540px,calc(100% - 8px));margin:0 auto;padding:10px 12px;border-radius:16px;background:#241b2ef5;box-shadow:0 8px 30px #0009;pointer-events:auto;text-align:left}
.call-panel h2{font-size:15px;line-height:1.3;margin:0 0 2px}.call-panel p{font-size:12px;line-height:1.3;margin:0 0 7px}
.call-panel[data-mode="audio"] .call-videos{display:none}
.call-panel[data-mode="video"] .call-videos{min-height:0;aspect-ratio:16/7;width:100%;max-height:150px;margin:5px auto}
.call-panel .call-actions{gap:5px;justify-content:flex-start;padding:0;max-height:105px;overflow:auto}
.call-panel .call-actions button{font-size:12px;padding:7px 10px;min-height:32px}
.call-panel .call-actions .call-exit{font-size:11px}
@media(max-width:600px){.call-overlay:not([hidden]){left:5px;right:5px;top:max(5px,env(safe-area-inset-top))}.call-overlay .call-panel{width:100%;padding:8px 10px}.call-panel .call-actions button{padding:7px 9px}.call-panel[data-mode="video"] .call-videos{max-height:105px}}

.call-readiness{font-size:12px;color:inherit;opacity:.8;margin:8px 0}

/* The call UI must remain visible even before a remote track arrives. */
.call-overlay:not([hidden]){inset:0!important;left:0!important;right:0!important;top:0!important;bottom:0!important;display:grid!important;place-items:center!important;padding:16px!important;background:#160c1fe8!important;pointer-events:auto!important}
.call-overlay:not([hidden]) .call-panel{width:min(720px,100%);max-height:calc(100dvh - 32px);overflow:auto;margin:0;padding:24px;border-radius:24px;text-align:center}
.call-panel[data-mode="video"] .call-videos{display:block;min-height:230px;aspect-ratio:16/10;width:100%;max-height:none;margin:16px auto}
.call-panel[data-mode="video"] .call-videos::after{content:'Waiting for the other person to join…';position:absolute;inset:0;display:grid;place-items:center;color:#eadfeb;font-size:14px;pointer-events:none}
.call-panel[data-mode="video"].remote-connected .call-videos::after{display:none}
.call-panel[data-mode="video"] #localCallVideo{display:block!important;visibility:visible!important;opacity:1!important}
@media(max-width:600px){.call-overlay:not([hidden]){padding:8px!important}.call-overlay:not([hidden]) .call-panel{width:100%;padding:15px;max-height:calc(100dvh - 16px)}.call-panel[data-mode="video"] .call-videos{min-height:220px;max-height:none}}

/* Minimized calls keep WebRTC/media alive while returning the chat to the foreground. */
.call-overlay.is-minimized:not([hidden]){inset:0!important;display:block!important;padding:0!important;background:transparent!important;pointer-events:none!important}
.call-overlay.is-minimized .call-panel{position:fixed;right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));left:auto;width:min(260px,calc(100% - 28px));max-height:none;overflow:visible;padding:10px 12px;border-radius:16px;text-align:left;pointer-events:auto;box-shadow:0 10px 35px #000b}
.call-overlay.is-minimized .call-panel h2{font-size:13px;margin:0 0 2px}.call-overlay.is-minimized .call-panel p{font-size:11px;margin:0 0 6px}
.call-overlay.is-minimized .call-videos{display:none!important}.call-overlay.is-minimized .call-actions{max-height:none;overflow:visible;gap:5px}.call-overlay.is-minimized .call-actions button{font-size:11px;padding:6px 8px;min-height:28px}.call-overlay.is-minimized .call-actions button:not(#minimizeCall):not(#endCall){display:none!important}