.call-window-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .3s ease-in-out}.call-window{width:100%;height:100%;max-width:1200px;max-height:800px;background:#1a1a1a;border-radius:0;display:flex;flex-direction:column;overflow:hidden}@media (min-width: 768px){.call-window{border-radius:16px;max-width:90vw;max-height:90vh}}.call-window-header{padding:20px;background:#00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between}.call-info h3{margin:0 0 4px;font-size:20px;font-weight:600;color:#fff}.call-status{margin:0;font-size:14px;color:#ffffffb3}.minimize-button{width:40px;height:40px;border-radius:50%;border:none;background:#ffffff1a;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}.minimize-button:hover{background:#fff3;transform:scale(1.05)}.call-display{flex:1;position:relative;background:#000;display:flex;align-items:center;justify-content:center}.remote-video-container{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#000}.remote-video{width:100%;height:100%;object-fit:contain}.local-video-container{position:absolute;top:20px;right:20px;width:200px;height:150px;border-radius:12px;overflow:hidden;box-shadow:0 4px 12px #00000080;border:2px solid rgba(255,255,255,.2);z-index:5}.local-video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.video-placeholder,.video-placeholder-small{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2)}.video-placeholder-small{background:#ffffff1a;color:#ffffff80}.audio-call-display{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;position:relative;width:100%;height:100%}.avatar-container{display:grid;place-items:center;width:100%}.avatar-large{width:150px;height:150px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:grid;place-items:center;font-size:64px;font-weight:700;color:#fff;box-shadow:0 8px 32px #667eea66;line-height:1;flex-shrink:0;transform-origin:center}.avatar-large.pulsing{animation:pulse 2s ease-in-out infinite}.remote-audio{display:none}.call-controls{padding:24px;background:#00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;gap:16px}.call-control-button{width:56px;height:56px;border-radius:50%;border:none;background:#ffffff26;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.call-control-button:hover{background:#ffffff40;transform:scale(1.05)}.call-control-button.disabled{background:#ff44444d}.call-control-button.disabled:hover{background:#f446}.call-control-button.end-call{background:#f44;width:64px;height:64px}.call-control-button.end-call:hover{background:#c00;transform:scale(1.1);box-shadow:0 4px 16px #ff444480}.call-control-button.active{background:#4caf5073}@keyframes pulse{0%,to{transform:scale(1) translateZ(0);box-shadow:0 8px 32px #667eea66}50%{transform:scale(1.05) translateZ(0);box-shadow:0 12px 48px #667eea99}}.avatar{position:relative;display:flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;flex-shrink:0;background:#f0f0f0;aspect-ratio:1 / 1}.avatar-image{width:100%;height:100%;object-fit:cover;display:block;position:absolute;top:0;left:0}.avatar-gradient{color:#fff;font-weight:600;-webkit-user-select:none;user-select:none}.avatar-letter{font-size:inherit;line-height:1;text-align:center}.avatar-small{width:28px;height:28px;min-width:28px;min-height:28px;max-width:28px;max-height:28px;font-size:12px}.avatar-medium{width:40px;height:40px;min-width:40px;min-height:40px;max-width:40px;max-height:40px;font-size:16px}.avatar-large{width:64px;height:64px;min-width:64px;min-height:64px;max-width:64px;max-height:64px;font-size:26px}.avatar-xlarge{width:80px;height:80px;min-width:80px;min-height:80px;max-width:80px;max-height:80px;font-size:32px}.avatar[role=button]{cursor:pointer;transition:opacity .2s ease}.avatar[role=button]:hover{opacity:.9}.avatar[role=button]:active{opacity:.8}.avatar[role=button]:focus-visible{outline:2px solid #667eea;outline-offset:2px}.incoming-call-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:10000;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fadeIn .2s ease-in-out}.incoming-call-modal{background:linear-gradient(135deg,#1a1a2e,#16213e);border-radius:24px;padding:40px 32px;max-width:380px;width:90%;box-shadow:0 20px 60px #00000080;animation:slideUp .3s ease-in-out;border:1px solid rgba(255,255,255,.1)}.incoming-call-header h2{margin:0 0 32px;font-size:18px;font-weight:500;text-align:center;color:#ffffffe6;letter-spacing:.5px}.incoming-call-content{display:flex;flex-direction:column;align-items:center;gap:24px}.caller-avatar{width:120px;height:120px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:grid;place-items:center;animation:pulse 2s ease-in-out infinite;box-shadow:0 8px 32px #667eea66;flex-shrink:0;margin:0 auto;transform-origin:center}.avatar-placeholder{font-size:56px;font-weight:700;color:#fff;display:grid;place-items:center;width:100%;height:100%;line-height:1}.caller-info{text-align:center}.caller-info h3{margin:0 0 8px;font-size:24px;font-weight:600;color:#fff}.call-type{margin:0;font-size:14px;color:#fff9}.incoming-call-actions{display:flex;gap:32px;margin-top:24px}.call-action-button{display:flex;flex-direction:column;align-items:center;gap:12px;padding:0;border:none;background:none;cursor:pointer;transition:all .2s;min-width:80px}.call-action-button:hover{transform:translateY(-4px)}.call-action-button span{font-size:13px;font-weight:500;color:#fff}.call-action-button svg{width:64px;height:64px;padding:18px;border-radius:50%;transition:all .2s}.call-action-button.reject svg{background:#f44;color:#fff;box-shadow:0 4px 16px #f446}.call-action-button.reject:hover svg{background:#c00;box-shadow:0 6px 24px #f449}.call-action-button.accept svg{background:#00c853;color:#fff;box-shadow:0 4px 16px #00c85366}.call-action-button.accept:hover svg{background:#00a843;box-shadow:0 6px 24px #00c85399}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{transform:scale(1) translateZ(0)}50%{transform:scale(1.05) translateZ(0)}}.group-voice-chat{position:fixed;bottom:20px;right:20px;width:400px;max-height:600px;background:#1a1a1a;border-radius:16px;box-shadow:0 10px 40px #00000080;display:flex;flex-direction:column;z-index:99999;overflow:hidden;opacity:1;visibility:visible;pointer-events:auto;border:1px solid #333}.group-voice-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:16px 20px;border-radius:16px 16px 0 0;display:flex;align-items:center;justify-content:space-between}.group-voice-info{display:flex;align-items:center;gap:10px;flex:1}.minimize-button{width:32px;height:32px;border-radius:50%;border:none;background:#fff3;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;flex-shrink:0}.minimize-button:hover{background:#ffffff4d;transform:scale(1.05)}.minimize-button:active{transform:scale(.95)}.group-voice-title{font-weight:600;font-size:16px;flex:1}.participant-count{font-size:13px;opacity:.9;background:#fff3;padding:4px 10px;border-radius:12px}.participants-grid{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;max-height:400px}.participant-card{display:flex;align-items:center;padding:12px;background:#2a2a2a;border-radius:12px;border:2px solid transparent;transition:all .3s ease;position:relative}.participant-card.speaking{border-color:#28a745;background:#1a3a1a;box-shadow:0 0 0 4px #28a74540;transform:scale(1.02)}.participant-card.speaking:before{content:"";position:absolute;left:6px;top:50%;transform:translateY(-50%);width:56px;height:56px;border-radius:50%;background:transparent;border:3px solid rgba(40,167,69,.4);animation:speakingWave 1.5s ease-out infinite}.participant-card.me{background:#1a2a3a;border-color:#2196f3}.participant-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:18px;margin-right:12px;flex-shrink:0;position:relative;z-index:1;transition:all .3s ease}.participant-card.speaking .participant-avatar{animation:avatarPulse 1.5s ease-in-out infinite;box-shadow:0 4px 16px #28a74566}.participant-info{flex:1;min-width:0}.participant-name{font-weight:500;font-size:14px;color:#e0e0e0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px}.participant-status{display:flex;align-items:center;gap:6px;font-size:12px;color:#999}.speaking-indicator{color:#28a745;font-weight:600;animation:pulse-text 1s infinite;display:inline-flex;align-items:center;gap:4px}.speaking-indicator:before{content:"";width:6px;height:6px;border-radius:50%;background:#28a745;animation:blink 1s infinite}@keyframes blink{0%,to{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.8)}}.group-voice-controls{display:flex;justify-content:center;align-items:center;gap:16px;padding:20px;background:#2a2a2a;border-top:1px solid #444}.control-btn{width:56px;height:56px;border-radius:50%;border:none;background:#3a3a3a;color:#e0e0e0;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000004d;transition:all .2s}.control-btn:hover{transform:scale(1.05);box-shadow:0 4px 12px #00000026}.control-btn:active{transform:scale(.95)}.control-btn.muted{background:#dc3545;color:#fff}.control-btn.leave-btn{background:#dc3545;color:#fff;width:64px;height:64px}.control-btn.leave-btn:hover{background:#c82333}.control-btn.end-btn{background:#8b0000;color:#fff;width:56px;height:56px}.control-btn.end-btn:hover{background:#a00000}.control-btn.end-btn:active{background:#6b0000}@keyframes speakingWave{0%{transform:translateY(-50%) scale(1);opacity:.6}50%{transform:translateY(-50%) scale(1.3);opacity:.3}to{transform:translateY(-50%) scale(1.6);opacity:0}}@keyframes avatarPulse{0%,to{transform:scale(1);box-shadow:0 4px 16px #28a74566}50%{transform:scale(1.08);box-shadow:0 6px 24px #28a74599}}@keyframes pulse-text{0%,to{opacity:1}50%{opacity:.6}}.settings-panel{background:#2a2a2a;border-top:1px solid #444;padding:16px 20px;display:flex;flex-direction:column;gap:12px}.settings-title{color:#e0e0e0;font-size:14px;font-weight:600;margin-bottom:4px}.settings-note{color:#888;font-size:11px;margin-bottom:8px;font-style:italic}.setting-item{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.setting-label{color:#b0b0b0;font-size:13px;display:flex;flex-direction:column;gap:2px}.setting-description{font-size:11px;color:#777}.toggle-switch{position:relative;width:44px;height:24px;background:#444;border-radius:12px;cursor:pointer;transition:background .3s}.toggle-switch.active{background:#28a745}.toggle-switch:before{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#fff;top:3px;left:3px;transition:transform .3s}.toggle-switch.active:before{transform:translate(20px)}.latency-info{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#3a3a3a;border-radius:8px;color:#b0b0b0;font-size:12px}.latency-value{color:#28a745;font-weight:600}.latency-value.warning{color:#ffc107}.latency-value.error{color:#dc3545}@media (max-width: 768px){.group-voice-chat{position:fixed;top:auto;left:0;right:0;bottom:0;width:100%;height:50vh;max-height:50vh;border-radius:20px 20px 0 0;z-index:99999;opacity:1;visibility:visible;display:flex;flex-direction:column}.participants-grid{max-height:none;flex:1;overflow-y:auto}.participant-avatar{width:48px;height:48px;font-size:20px}.participant-card.speaking:before{animation:speakingWave 2s ease-out infinite;width:60px;height:60px;left:8px}.settings-panel{max-height:180px;overflow-y:auto;padding:12px 16px;gap:8px}.settings-title{font-size:13px;margin-bottom:4px}.setting-item{padding:6px 0}.setting-label{font-size:12px}.setting-description{font-size:10px}.group-voice-controls{padding:12px;gap:12px;flex-shrink:0}.control-btn{width:48px;height:48px}.control-btn.leave-btn{width:56px;height:56px}.control-btn.end-btn{width:48px;height:48px}}.minimized-voice-chat{position:fixed;background:#1a1a1a;border:1px solid #333;border-radius:30px;padding:8px 16px;display:flex;align-items:center;gap:12px;z-index:99999;box-shadow:0 4px 20px #0006;cursor:move;-webkit-user-select:none;user-select:none;transition:box-shadow .2s}.minimized-voice-chat:hover{box-shadow:0 6px 24px #00000080}.minimized-voice-chat.dragging{box-shadow:0 8px 30px #0009;cursor:grabbing}.minimized-voice-info{display:flex;align-items:center;gap:8px;color:#e0e0e0}.minimized-voice-title{font-size:13px;font-weight:500;max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.minimized-participant-count{background:#ffffff1a;padding:2px 8px;border-radius:10px;font-size:11px;color:#b0b0b0}.minimized-voice-controls{display:flex;align-items:center;gap:8px;padding-left:8px;border-left:1px solid #444}.muted-icon{color:#dc3545}.active-icon{color:#28a745}.minimized-control-btn{width:32px;height:32px;border-radius:50%;border:none;background:#3a3a3a;color:#e0e0e0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}.minimized-control-btn:hover{background:#4a4a4a;transform:scale(1.05)}.minimized-control-btn:active{transform:scale(.95)}.minimized-control-btn.leave-btn{background:#dc3545}.minimized-control-btn.leave-btn:hover{background:#c82333}@media (max-width: 768px){.minimized-voice-chat{cursor:grab;touch-action:none}.minimized-voice-chat.dragging{cursor:grabbing}.minimized-voice-title{max-width:100px}}