:root{--bg-color: #f0f4f8;--text-color: #1a202c;--panel-bg: rgba(255, 255, 255, .85);--border-color: rgba(200, 210, 220, .5);--primary-color: #0078d4;--primary-hover: #106ebe;--accent-color: #e5f1fb;--status-online: #16c60c;--status-away: #fce100;--status-busy: #e81123;--status-offline: #a6a6a6;--glass-blur: blur(12px);--shadow: 0 8px 32px rgba(0, 0, 0, .1)}[data-theme=dark]{--bg-color: #0f172a;--text-color: #f8fafc;--panel-bg: rgba(30, 41, 59, .75);--border-color: rgba(255, 255, 255, .1);--primary-color: #3b82f6;--primary-hover: #60a5fa;--accent-color: #1e3a8a;--shadow: 0 8px 32px rgba(0, 0, 0, .5)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,Inter,system-ui,sans-serif;background:var(--bg-color);background-image:linear-gradient(135deg,var(--bg-color) 0%,var(--accent-color) 100%);color:var(--text-color);height:100vh;display:flex;align-items:center;justify-content:center;transition:background .3s ease,color .3s ease;overflow:hidden}.messenger-container{width:100%;max-width:900px;height:80vh;min-height:600px;display:flex;background:var(--panel-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border-color);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;animation:slideIn .5s cubic-bezier(.16,1,.3,1)}.sidebar{width:300px;border-right:1px solid var(--border-color);display:flex;flex-direction:column}.header{padding:20px;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center}.user-profile{display:flex;align-items:center;gap:12px}.avatar{width:48px;height:48px;border-radius:8px;background:var(--primary-color);border:2px solid var(--border-color);position:relative}.status-indicator{position:absolute;bottom:-4px;right:-4px;width:14px;height:14px;border-radius:50%;border:2px solid var(--panel-bg)}.status-online{background:var(--status-online)}.status-away{background:var(--status-away)}.status-busy{background:var(--status-busy)}.status-offline{background:var(--status-offline)}.contact-list{flex:1;overflow-y:auto;padding:10px}.contact-item{display:flex;align-items:center;gap:12px;padding:10px;border-radius:8px;cursor:pointer;transition:background .2s}.contact-item:hover,.contact-item.active{background:var(--accent-color)}.chat-area{flex:1;display:flex;flex-direction:column}.chat-header{padding:20px;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between}.chat-messages{flex:1;padding:20px;overflow-y:auto;display:flex;flex-direction:column;gap:12px}.message{max-width:70%;padding:12px 16px;border-radius:12px;animation:popIn .3s ease}.message.sent{align-self:flex-end;background:var(--primary-color);color:#fff;border-bottom-right-radius:4px}.message.received{align-self:flex-start;background:var(--accent-color);border-bottom-left-radius:4px}.chat-input{padding:20px;border-top:1px solid var(--border-color);display:flex;gap:10px}.chat-input input{flex:1;padding:12px 16px;border:1px solid var(--border-color);border-radius:8px;background:transparent;color:var(--text-color);font-family:inherit;outline:none;transition:border-color .2s}.chat-input input:focus{border-color:var(--primary-color)}button{padding:10px 20px;border:none;border-radius:8px;background:var(--primary-color);color:#fff;font-weight:600;cursor:pointer;transition:background .2s,transform .1s}button:hover{background:var(--primary-hover)}button:active{transform:scale(.98)}.btn-icon{padding:10px;background:transparent;color:var(--text-color);border:1px solid var(--border-color)}.btn-icon:hover{background:var(--accent-color)}@keyframes slideIn{0%{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes popIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@media(max-width:768px){.messenger-container{height:100vh;min-height:100vh;border-radius:0;border:none;flex-direction:column;width:100vw}.admin-modal{width:100%!important;height:100%!important;border-radius:0!important;max-height:100vh!important;max-width:100vw!important}.sidebar{width:100%;border-right:none;border-bottom:1px solid var(--border-color);flex:.4;min-height:30vh}.chat-area{flex:.6}}