.auth-page{min-height:100%;display:flex;align-items:center;justify-content:center;background:var(--bg-primary);padding:20px}.auth-container{width:100%;max-width:400px;animation:scaleIn .3s ease}.auth-logo{text-align:center;margin-bottom:32px}.auth-logo-icon{width:80px;height:80px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;box-shadow:0 4px 20px #2aabee66}.auth-logo-icon svg{width:44px;height:44px;color:#fff}.auth-logo h1{font-size:28px;font-weight:700;color:var(--text-primary);margin-bottom:8px}.auth-logo p{font-size:var(--font-size-sm);color:var(--text-secondary)}.auth-card{background:var(--bg-secondary);border-radius:var(--radius-lg);padding:32px;box-shadow:var(--shadow-lg)}.auth-card h2{font-size:var(--font-size-xl);font-weight:600;margin-bottom:24px;color:var(--text-primary);text-align:center}.auth-form .form-group{margin-bottom:16px}.auth-submit-btn{width:100%;height:48px;margin-top:8px;font-size:var(--font-size-md);font-weight:600;border-radius:24px}.auth-divider{text-align:center;margin-top:20px;font-size:var(--font-size-sm);color:var(--text-secondary)}.auth-divider a{color:var(--accent);font-weight:500}.auth-divider a:hover{text-decoration:underline}.auth-error{background:#e573731a;border:1px solid rgba(229,115,115,.3);border-radius:var(--radius-md);padding:10px 14px;font-size:var(--font-size-sm);color:var(--text-danger);margin-bottom:16px}.form-input-icon-wrapper{position:relative}.form-input-icon-wrapper .form-input{padding-left:40px}.form-input-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-hint);display:flex;align-items:center}.form-input-icon svg{width:16px;height:16px}.settings-modal .modal{max-width:480px}.settings-section{margin-bottom:24px}.settings-section:last-child{margin-bottom:0}.settings-section-title{font-size:var(--font-size-sm);color:var(--accent);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px}.settings-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--border)}.settings-row:last-child{border-bottom:none}.settings-row-label{font-size:var(--font-size-md);color:var(--text-primary)}.settings-row-hint{font-size:var(--font-size-xs);color:var(--text-hint);margin-top:2px}.settings-row-control{min-width:140px}.toggle-switch{position:relative;width:44px;height:24px;cursor:pointer}.toggle-switch input{opacity:0;width:0;height:0;position:absolute}.toggle-slider{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--border-light);border-radius:12px;transition:var(--transition)}.toggle-slider:before{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#fff;top:3px;left:3px;transition:var(--transition)}.toggle-switch input:checked+.toggle-slider{background:var(--accent)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(20px)}.settings-profile{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--border);margin-bottom:16px}.settings-profile-avatar{position:relative;cursor:pointer}.settings-profile-avatar-overlay{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:#0006;display:flex;align-items:center;justify-content:center;opacity:0;transition:var(--transition)}.settings-profile-avatar:hover .settings-profile-avatar-overlay{opacity:1}.settings-profile-avatar-overlay svg{width:20px;height:20px;color:#fff}.settings-profile-info{flex:1;min-width:0}.settings-profile-name{font-size:var(--font-size-lg);font-weight:600;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.settings-profile-username{font-size:var(--font-size-sm);color:var(--text-secondary);margin-top:2px}.volume-display{display:flex;align-items:center;gap:8px}.volume-display svg{width:16px;height:16px;color:var(--text-secondary);flex-shrink:0}.volume-slider-wrapper{flex:1}.test-sound-btn{display:flex;align-items:center;gap:8px;padding:8px 16px;border-radius:var(--radius-md);background:var(--bg-hover);color:var(--text-primary);font-size:var(--font-size-sm);transition:var(--transition)}.test-sound-btn:hover{background:var(--border-light)}.test-sound-btn svg{width:16px;height:16px;color:var(--accent)}.mic-selector{display:flex;flex-direction:column;gap:6px}.mic-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition);background:var(--bg-hover)}.mic-item:hover{background:var(--border-light)}.mic-item.selected{background:#2aabee26;border:1px solid rgba(42,171,238,.3)}.mic-item-icon{color:var(--text-secondary);display:flex;align-items:center}.mic-item-icon svg{width:16px;height:16px}.mic-item.selected .mic-item-icon{color:var(--accent)}.mic-item-name{flex:1;font-size:var(--font-size-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mic-item-check{color:var(--accent);display:flex;align-items:center}.chat-info-panel{width:340px;min-width:340px;height:100%;background:var(--bg-secondary);border-left:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;animation:slideInRight .25s ease}.chat-info-header{height:var(--header-height);display:flex;align-items:center;padding:0 8px 0 16px;border-bottom:1px solid var(--border);gap:8px;flex-shrink:0}.chat-info-header h3{flex:1;font-size:var(--font-size-lg);font-weight:600}.chat-info-body{flex:1;overflow-y:auto}.chat-info-profile{display:flex;flex-direction:column;align-items:center;padding:24px 20px;gap:8px;border-bottom:1px solid var(--border)}.chat-info-name{font-size:var(--font-size-xl);font-weight:700;text-align:center}.chat-info-status{font-size:var(--font-size-sm);color:var(--text-secondary)}.chat-info-status.online{color:var(--accent)}.chat-info-actions{display:flex;gap:24px;margin-top:8px}.chat-info-action{display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;color:var(--accent)}.chat-info-action-icon{width:44px;height:44px;border-radius:50%;background:#2aabee1a;display:flex;align-items:center;justify-content:center;transition:background var(--transition)}.chat-info-action:hover .chat-info-action-icon{background:#2aabee33}.chat-info-action-label{font-size:var(--font-size-xs);color:var(--text-secondary)}.media-tabs{display:flex;border-bottom:1px solid var(--border);flex-shrink:0}.media-tab{flex:1;padding:10px 0;font-size:var(--font-size-sm);color:var(--text-secondary);text-align:center;cursor:pointer;transition:var(--transition);border-bottom:2px solid transparent;margin-bottom:-1px;font-weight:500}.media-tab.active{color:var(--accent);border-bottom-color:var(--accent)}.media-tab:hover:not(.active){color:var(--text-primary)}.shared-media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:2px}.shared-media-item{aspect-ratio:1;overflow:hidden;cursor:pointer;position:relative;background:var(--bg-tertiary)}.shared-media-item img,.shared-media-item video{width:100%;height:100%;object-fit:cover;transition:transform var(--transition)}.shared-media-item:hover img,.shared-media-item:hover video{transform:scale(1.05)}.shared-media-item.circle{border-radius:50%;overflow:hidden}.shared-files-list{padding:8px 0}.shared-file-item{display:flex;align-items:center;gap:12px;padding:10px 16px;cursor:pointer;transition:background var(--transition)}.shared-file-item:hover{background:var(--bg-hover)}.shared-file-icon{width:40px;height:40px;border-radius:50%;background:#2aabee1a;display:flex;align-items:center;justify-content:center;color:var(--accent);flex-shrink:0}.shared-file-name{font-size:var(--font-size-sm);color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.shared-file-meta{font-size:var(--font-size-xs);color:var(--text-hint);margin-top:2px}.sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);height:100%;background:var(--bg-secondary);display:flex;flex-direction:column;border-right:1px solid var(--border);overflow:hidden}.sidebar-header{height:var(--header-height);padding:0 8px;display:flex;align-items:center;gap:4px;border-bottom:1px solid var(--border);flex-shrink:0;background:var(--bg-secondary)}.sidebar-search{flex:1;display:flex;align-items:center;gap:8px;background:var(--bg-input);border-radius:20px;padding:0 12px;height:36px}.sidebar-search input{flex:1;background:none;color:var(--text-primary);font-size:var(--font-size-md);caret-color:var(--accent)}.sidebar-search input::placeholder{color:var(--text-hint)}.sidebar-search-icon{color:var(--text-hint);display:flex;align-items:center;flex-shrink:0}.sidebar-search-icon svg{width:16px;height:16px}.sidebar-search-clear{display:flex;align-items:center;color:var(--text-hint);cursor:pointer;flex-shrink:0}.sidebar-search-clear:hover{color:var(--text-primary)}.sidebar-content{flex:1;overflow-y:auto;overflow-x:hidden}.chat-list{display:flex;flex-direction:column}.chat-item{display:flex;align-items:center;gap:12px;padding:8px 16px;cursor:pointer;transition:background var(--transition);position:relative;min-height:72px}.chat-item:hover{background:var(--bg-hover)}.chat-item.active{background:var(--bg-selected)}.chat-item-avatar{position:relative;flex-shrink:0}.chat-item-avatar .status-dot{position:absolute;bottom:1px;right:1px;border-color:var(--bg-secondary);border-width:2px}.chat-item.active .chat-item-avatar .status-dot{border-color:var(--bg-selected)}.chat-item-content{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.chat-item-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.chat-item-name{font-size:var(--font-size-md);font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.chat-item-time{font-size:var(--font-size-xs);color:var(--text-hint);flex-shrink:0}.chat-item-preview{font-size:var(--font-size-sm);color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;display:flex;align-items:center;gap:4px}.chat-item-preview .sender-name{color:var(--text-secondary);font-weight:500}.chat-item-meta{display:flex;align-items:center;gap:6px;flex-shrink:0}.new-chat-modal .modal{max-width:400px}.new-chat-modal .user-list{max-height:320px;overflow-y:auto;margin:0 -20px}.new-chat-modal .user-item{display:flex;align-items:center;gap:12px;padding:10px 20px;cursor:pointer;transition:background var(--transition)}.new-chat-modal .user-item:hover{background:var(--bg-hover)}.new-chat-modal .user-item.selected{background:#2aabee1a}.new-chat-modal .user-info{flex:1}.new-chat-modal .user-name{font-size:var(--font-size-md);color:var(--text-primary);font-weight:500}.new-chat-modal .user-username{font-size:var(--font-size-sm);color:var(--text-secondary)}.new-chat-modal .check-icon{color:var(--accent)}.new-chat-tabs{display:flex;gap:8px;margin-bottom:16px}.new-chat-tab{flex:1;padding:8px;border-radius:var(--radius-md);background:var(--bg-hover);color:var(--text-secondary);font-size:var(--font-size-sm);font-weight:500;text-align:center;cursor:pointer;transition:var(--transition)}.new-chat-tab.active{background:var(--accent);color:#fff}.search-results{border-top:1px solid var(--border);padding-top:8px}.search-section-title{font-size:var(--font-size-xs);color:var(--text-hint);text-transform:uppercase;letter-spacing:.5px;padding:4px 16px 8px;font-weight:600}.chat-container{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative;background:var(--bg-primary)}.chat-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:var(--text-hint)}.chat-empty svg{width:64px;height:64px;opacity:.2}.chat-empty p{font-size:var(--font-size-lg);opacity:.6}.chat-header{height:var(--header-height);padding:0 8px 0 16px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--border);background:var(--bg-secondary);flex-shrink:0;z-index:10}.chat-header-info{flex:1;min-width:0;cursor:pointer}.chat-header-name{font-size:var(--font-size-md);font-weight:600;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-header-status{font-size:var(--font-size-xs);color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-header-status.online,.chat-header-status.typing{color:var(--accent)}.chat-header-actions{display:flex;align-items:center;gap:0;flex-shrink:0}.message-search-bar{padding:8px 12px;background:var(--bg-secondary);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;animation:slideDown .2s ease;flex-shrink:0}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.message-search-bar input{flex:1;background:var(--bg-input);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-md);padding:7px 12px;font-size:var(--font-size-sm)}.message-search-bar input:focus{border-color:var(--accent)}.message-search-nav{display:flex;align-items:center;gap:4px;font-size:var(--font-size-xs);color:var(--text-secondary)}.message-list{flex:1;overflow-y:auto;overflow-x:hidden;padding:8px 0;display:flex;flex-direction:column}.message-list-inner{display:flex;flex-direction:column;padding:4px 0;min-height:100%;justify-content:flex-end}.message-date-divider{display:flex;align-items:center;justify-content:center;padding:8px 0;position:sticky;top:8px;z-index:1}.message-date-divider span{background:#17212be6;color:var(--text-secondary);font-size:var(--font-size-xs);padding:4px 12px;border-radius:12px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.message-wrapper{display:flex;flex-direction:column;padding:2px 16px;position:relative}.message-wrapper.out{align-items:flex-end}.message-wrapper.in{align-items:flex-start}.message-wrapper.highlighted .message-bubble{animation:highlightPulse 1s ease}@keyframes highlightPulse{0%,to{opacity:1}50%{opacity:.5;background:var(--accent)!important}}.message-group-start{margin-top:8px}.message-bubble{max-width:65%;min-width:60px;border-radius:var(--radius-xl);padding:8px 12px;position:relative;word-break:break-word}.message-wrapper.out .message-bubble{background:var(--bubble-out-bg);border-bottom-right-radius:4px}.message-wrapper.in .message-bubble{background:var(--bubble-in-bg);border-bottom-left-radius:4px}.message-sender-name{font-size:var(--font-size-xs);font-weight:600;color:var(--accent);margin-bottom:2px}.message-text{font-size:var(--font-size-md);line-height:1.5;color:var(--text-primary);white-space:pre-wrap}.message-text .highlight{background:#2aabee4d;border-radius:2px;padding:0 2px}.message-footer{display:flex;align-items:center;justify-content:flex-end;gap:4px;margin-top:4px}.message-footer .msg-time{font-size:11px;color:#a1aab3cc}.message-wrapper.out .message-footer .msg-time{color:#a1aab3cc}.message-image{max-width:320px;border-radius:var(--radius-lg);overflow:hidden;cursor:pointer}.message-image img{width:100%;max-height:320px;object-fit:cover;display:block}.message-bubble.media-bubble{padding:4px;background:transparent}.message-bubble.media-bubble .message-footer{position:absolute;bottom:8px;right:10px;background:#0006;border-radius:10px;padding:2px 6px}.video-circle-wrapper{width:200px;height:200px;position:relative;cursor:pointer}.video-circle{width:200px;height:200px;border-radius:50%;overflow:hidden;background:#000;border:3px solid var(--border)}.video-circle video{width:100%;height:100%;object-fit:cover}.video-circle-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;background:#00000080;border-radius:50%;display:flex;align-items:center;justify-content:center;pointer-events:none;transition:opacity var(--transition)}.video-circle-wrapper:hover .video-circle-play{opacity:0}.video-circle-wrapper:hover video{cursor:pointer}.video-circle-footer{display:flex;align-items:center;justify-content:flex-end;padding:4px 8px 0;gap:4px}.voice-message{display:flex;align-items:center;gap:10px;padding:4px 0;min-width:200px;max-width:280px}.voice-play-btn{width:36px;height:36px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:var(--transition)}.voice-play-btn:hover{background:var(--accent-dark)}.voice-play-btn svg{width:16px;height:16px}.voice-waveform{flex:1;height:32px;display:flex;align-items:center;gap:2px;cursor:pointer}.voice-waveform-bar{flex:1;background:#a1aab366;border-radius:2px;transition:background var(--transition)}.voice-waveform-bar.played{background:var(--accent)}.voice-duration{font-size:var(--font-size-xs);color:var(--text-secondary);flex-shrink:0;min-width:32px;text-align:right}.file-message{display:flex;align-items:center;gap:12px;padding:4px 0;min-width:220px;cursor:pointer}.file-icon{width:40px;height:40px;border-radius:50%;background:#2aabee33;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--accent)}.file-icon svg{width:20px;height:20px}.file-info{flex:1;min-width:0}.file-name{font-size:var(--font-size-sm);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-primary)}.file-meta{font-size:var(--font-size-xs);color:var(--text-secondary);margin-top:2px}.call-message{display:flex;align-items:center;gap:10px;padding:4px 0}.call-icon{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.call-icon.ended{background:#4caf5033;color:#4caf50}.call-icon.missed,.call-icon.declined{background:#e5737333;color:var(--text-danger)}.call-icon svg{width:18px;height:18px}.call-info{flex:1}.call-label{font-size:var(--font-size-sm);font-weight:500}.call-duration{font-size:var(--font-size-xs);color:var(--text-secondary);margin-top:2px}.message-input-area{background:var(--bg-secondary);border-top:1px solid var(--border);padding:8px;display:flex;align-items:flex-end;gap:4px;flex-shrink:0}.message-input-wrapper{flex:1;display:flex;align-items:flex-end;background:var(--bg-input);border-radius:24px;padding:4px 4px 4px 16px;gap:4px;min-height:48px;max-height:160px}.message-input{flex:1;background:none;color:var(--text-primary);font-size:var(--font-size-md);resize:none;max-height:120px;min-height:28px;line-height:1.5;padding:4px 0;caret-color:var(--accent);overflow-y:auto}.message-input::placeholder{color:var(--text-hint)}.message-input-actions{display:flex;align-items:center;gap:0;flex-shrink:0}.send-btn{width:48px;height:48px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:var(--transition);box-shadow:0 2px 8px #2aabee4d}.send-btn:hover:not(:disabled){background:var(--accent-dark);transform:scale(1.05)}.send-btn svg{width:22px;height:22px}.voice-recorder{flex:1;display:flex;align-items:center;gap:12px;padding:8px 12px;background:var(--bg-input);border-radius:24px;animation:fadeIn .2s ease}.voice-recorder-timer{font-size:var(--font-size-sm);color:var(--text-danger);font-variant-numeric:tabular-nums;min-width:40px}.voice-recorder-waveform{flex:1;height:32px;display:flex;align-items:center;gap:2px;overflow:hidden}.voice-recorder-bar{width:3px;background:var(--accent);border-radius:2px;transition:height .1s ease}.voice-recorder-cancel{color:var(--text-danger);font-size:var(--font-size-sm);font-weight:500;cursor:pointer}.video-circle-recorder{position:fixed;bottom:80px;right:20px;z-index:500;display:flex;flex-direction:column;align-items:center;gap:12px;animation:scaleIn .2s ease}.video-circle-preview{width:200px;height:200px;border-radius:50%;overflow:hidden;background:#000;border:3px solid var(--accent);box-shadow:0 0 0 3px #2aabee4d}.video-circle-preview video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.video-circle-timer{font-size:var(--font-size-sm);color:var(--text-danger);font-variant-numeric:tabular-nums;font-weight:500}.video-circle-controls{display:flex;gap:12px}.video-circle-controls button{width:48px;height:48px;border-radius:50%;font-size:20px;display:flex;align-items:center;justify-content:center}.video-circle-controls .btn-send{background:var(--accent);color:#fff}.video-circle-controls .btn-cancel{background:var(--bg-hover);color:var(--text-danger)}.reply-preview{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--bg-secondary);border-top:1px solid var(--border);animation:slideDown .2s ease}.reply-preview-bar{width:3px;height:100%;min-height:36px;background:var(--accent);border-radius:2px;flex-shrink:0}.reply-preview-content{flex:1;min-width:0}.reply-preview-sender{font-size:var(--font-size-xs);color:var(--accent);font-weight:600;margin-bottom:2px}.reply-preview-text{font-size:var(--font-size-sm);color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.message-reply-ref{border-left:2px solid var(--accent);padding-left:8px;margin-bottom:6px;cursor:pointer}.message-reply-ref:hover{opacity:.8}.message-reply-ref-sender{font-size:var(--font-size-xs);color:var(--accent);font-weight:600}.message-reply-ref-text{font-size:var(--font-size-xs);color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}.call-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#0d1117;z-index:2000;display:flex;flex-direction:column;align-items:center;justify-content:center;animation:fadeIn .3s ease}.call-modal-video{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;background:#000}.call-remote-video{width:100%;height:100%;object-fit:cover;display:block}.call-remote-video.hidden{display:none}.call-local-video-wrapper{position:absolute;bottom:100px;right:20px;width:120px;height:160px;border-radius:12px;overflow:hidden;box-shadow:var(--shadow-lg);border:2px solid rgba(255,255,255,.2);cursor:move;z-index:10}.call-local-video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.call-audio-ui{display:flex;flex-direction:column;align-items:center;gap:16px;z-index:5}.call-avatar-ring{position:relative;width:100px;height:100px}.call-avatar-ring:before,.call-avatar-ring:after{content:"";position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;border-radius:50%;border:2px solid rgba(42,171,238,.4);animation:callRing 2s ease-in-out infinite}.call-avatar-ring:after{top:-18px;right:-18px;bottom:-18px;left:-18px;border-color:#2aabee33;animation-delay:.5s}@keyframes callRing{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.5}}.call-caller-name{font-size:24px;font-weight:600;color:#fff;text-align:center}.call-status{font-size:var(--font-size-md);color:#fff9;text-align:center}.call-duration-display{font-size:var(--font-size-xl);color:#ffffffe6;font-variant-numeric:tabular-nums;font-weight:500}.call-controls{position:absolute;bottom:0;left:0;right:0;padding:20px;background:linear-gradient(transparent,#000c);display:flex;align-items:center;justify-content:center;gap:16px;z-index:10}.call-controls-audio{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:32px}.call-control-btn{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer}.call-control-btn-circle{width:56px;height:56px;border-radius:50%;background:#ffffff26;display:flex;align-items:center;justify-content:center;transition:background var(--transition);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.call-control-btn:hover .call-control-btn-circle{background:#ffffff40}.call-control-btn.active .call-control-btn-circle{background:var(--accent)}.call-control-btn.danger .call-control-btn-circle{background:#e53935}.call-control-btn:hover.danger .call-control-btn-circle{background:#c62828}.call-control-btn-circle svg{width:24px;height:24px;color:#fff}.call-control-label{font-size:var(--font-size-xs);color:#ffffffb3;text-align:center}.incoming-call-overlay{position:fixed;top:0;left:0;right:0;z-index:3000;display:flex;justify-content:center;padding-top:20px;pointer-events:none}.incoming-call-card{background:var(--bg-secondary);border-radius:var(--radius-lg);padding:16px 20px;width:320px;box-shadow:var(--shadow-lg);border:1px solid var(--border);animation:slideDown .3s ease;pointer-events:all}.incoming-call-header{font-size:var(--font-size-xs);color:var(--accent);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px}.incoming-call-user{display:flex;align-items:center;gap:12px;margin-bottom:16px}.incoming-call-name{font-size:var(--font-size-lg);font-weight:600;color:var(--text-primary)}.incoming-call-type{font-size:var(--font-size-sm);color:var(--text-secondary)}.incoming-call-actions{display:flex;gap:12px}.incoming-call-actions button{flex:1;height:44px;border-radius:22px;font-size:var(--font-size-md);font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;transition:var(--transition)}.incoming-call-accept{background:#4caf50;color:#fff}.incoming-call-accept:hover{background:#43a047}.incoming-call-decline{background:#e53935;color:#fff}.incoming-call-decline:hover{background:#c62828}.screen-share-indicator{position:absolute;top:60px;left:50%;transform:translate(-50%);background:#2aabeee6;color:#fff;padding:6px 16px;border-radius:20px;font-size:var(--font-size-sm);font-weight:500;z-index:15;display:flex;align-items:center;gap:8px}:root{--bg-primary: #17212b;--bg-secondary: #232e3c;--bg-tertiary: #1c2733;--bg-message-out: #2b5278;--bg-message-in: #182533;--bg-hover: #2b3c4e;--bg-selected: #2b5278;--bg-input: #1c2733;--bg-modal: #1c2733;--bg-overlay: rgba(0, 0, 0, .7);--accent: #2aabee;--accent-dark: #1a8fd1;--accent-light: #5bc8ff;--text-primary: #e8eaf0;--text-secondary: #a1aab3;--text-hint: #6c7883;--text-accent: #2aabee;--text-danger: #e57373;--text-success: #66bb6a;--border: #2b3c4e;--border-light: #394e63;--bubble-out-bg: #2b5278;--bubble-in-bg: #182533;--sidebar-width: 360px;--header-height: 56px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 18px;--radius-round: 50%;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif;--font-size-xs: 11px;--font-size-sm: 13px;--font-size-md: 15px;--font-size-lg: 17px;--font-size-xl: 20px;--shadow-sm: 0 1px 4px rgba(0, 0, 0, .3);--shadow-md: 0 2px 8px rgba(0, 0, 0, .4);--shadow-lg: 0 4px 24px rgba(0, 0, 0, .5);--transition: .15s ease;--transition-slow: .3s ease}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden}body{font-family:var(--font-family);font-size:var(--font-size-md);background-color:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{height:100%;display:flex;flex-direction:column}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#394e63;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#4a6380}.app-loading{display:flex;align-items:center;justify-content:center;height:100%;background:var(--bg-primary)}.app-loading-spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}button{font-family:var(--font-family);cursor:pointer;border:none;outline:none;background:none;transition:var(--transition)}button:disabled{opacity:.5;cursor:not-allowed}input,textarea{font-family:var(--font-family);outline:none;border:none}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.avatar{display:flex;align-items:center;justify-content:center;border-radius:50%;font-weight:600;color:#fff;flex-shrink:0;overflow:hidden;background:var(--accent);-webkit-user-select:none;user-select:none}.avatar img{width:100%;height:100%;object-fit:cover}.avatar-sm{width:32px;height:32px;font-size:13px}.avatar-md{width:40px;height:40px;font-size:16px}.avatar-lg{width:48px;height:48px;font-size:18px}.avatar-xl{width:64px;height:64px;font-size:24px}.avatar-xxl{width:80px;height:80px;font-size:30px}.icon-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;color:var(--text-secondary);transition:var(--transition);flex-shrink:0}.icon-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.icon-btn.active{color:var(--accent)}.icon-btn svg{width:22px;height:22px}.btn-primary{background:var(--accent);color:#fff;font-size:var(--font-size-md);font-weight:500;padding:10px 24px;border-radius:var(--radius-lg);transition:var(--transition)}.btn-primary:hover:not(:disabled){background:var(--accent-dark)}.btn-secondary{background:var(--bg-hover);color:var(--text-primary);font-size:var(--font-size-md);font-weight:500;padding:10px 24px;border-radius:var(--radius-lg);transition:var(--transition)}.btn-secondary:hover:not(:disabled){background:var(--border-light)}.btn-danger{background:var(--text-danger);color:#fff;font-size:var(--font-size-md);font-weight:500;padding:10px 24px;border-radius:var(--radius-lg);transition:var(--transition)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg-overlay);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal{background:var(--bg-modal);border-radius:var(--radius-lg);width:100%;max-width:420px;box-shadow:var(--shadow-lg);overflow:hidden}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border)}.modal-header h2{font-size:var(--font-size-lg);font-weight:600}.modal-body{padding:20px}.modal-footer{padding:16px 20px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:12px}.form-group{margin-bottom:16px}.form-label{display:block;font-size:var(--font-size-sm);color:var(--text-secondary);margin-bottom:6px;font-weight:500}.form-input{width:100%;background:var(--bg-input);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-md);padding:10px 14px;font-size:var(--font-size-md);transition:var(--transition)}.form-input:focus{border-color:var(--accent)}.form-input::placeholder{color:var(--text-hint)}.status-dot{width:10px;height:10px;border-radius:50%;border:2px solid var(--bg-secondary)}.status-dot.online{background:#4caf50}.status-dot.offline{background:var(--text-hint)}.checkmarks{display:inline-flex;align-items:center;color:var(--text-hint);margin-left:4px}.checkmarks.read{color:var(--accent)}.msg-time{font-size:var(--font-size-xs);color:var(--text-hint);white-space:nowrap}.unread-badge{background:var(--accent);color:#fff;font-size:11px;font-weight:600;min-width:20px;height:20px;border-radius:10px;display:flex;align-items:center;justify-content:center;padding:0 5px}.typing-dots{display:inline-flex;align-items:center;gap:3px;padding:2px 0}.typing-dots span{width:6px;height:6px;border-radius:50%;background:var(--accent);animation:typingBounce 1.2s ease-in-out infinite}.typing-dots span:nth-child(2){animation-delay:.2s}.typing-dots span:nth-child(3){animation-delay:.4s}@keyframes typingBounce{0%,60%,to{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}.file-size{font-size:var(--font-size-xs);color:var(--text-hint)}select{background:var(--bg-input);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-md);padding:8px 32px 8px 12px;font-size:var(--font-size-md);font-family:var(--font-family);cursor:pointer;width:100%;outline:none;transition:var(--transition);-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23a1aab3' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}select:focus{border-color:var(--accent)}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:4px;background:var(--border);border-radius:2px;outline:none;cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 0 0 3px #2aabee33}.divider{height:1px;background:var(--border);margin:8px 0}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;gap:12px;color:var(--text-hint);text-align:center}.empty-state svg{opacity:.3;width:48px;height:48px}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideInLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}@media (max-width: 768px){:root{--sidebar-width: 100%}}