@import"https://fonts.googleapis.com/css2?family=Tahoma:wght@400;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden}body{font-family:Tahoma,Segoe UI,Geneva,Verdana,sans-serif;font-size:11px;background:#3a6ea5 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Crect fill='%233a6ea5' width='80' height='80'/%3E%3Crect fill='%23356494' x='0' y='0' width='40' height='40'/%3E%3Crect fill='%23356494' x='40' y='40' width='40' height='40'/%3E%3C/svg%3E")}.hidden{display:none!important}.title-bar{background:linear-gradient(180deg,#0a246a,#3a6ea5 8%,#0a246a 10%,#3a6ea5 90%,#0a246a);color:#fff;padding:4px 8px;display:flex;align-items:center;justify-content:space-between;height:30px;cursor:default;-webkit-user-select:none;user-select:none}.title-bar-left{display:flex;align-items:center;gap:6px}.title-bar-icon{width:18px;height:18px}.title-bar-text{font-size:12px;font-weight:700;text-shadow:1px 1px 2px rgba(0,0,0,.6)}.title-bar-buttons{display:flex;gap:2px}.title-btn{width:21px;height:21px;border:1px solid #0a246a;border-radius:3px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:10px;font-weight:700;background:linear-gradient(180deg,#3a8cdc,#26a 50%,#1a5599);color:#fff;padding:0;line-height:1}.title-btn:hover{background:linear-gradient(180deg,#5ab0f0,#38c 50%,#27b)}.title-btn.close{background:linear-gradient(180deg,#e08070,#c43 50%,#a32)}.title-btn.close:hover{background:linear-gradient(180deg,#f09080,#d54 50%,#b43)}.msn-toolbar{background:linear-gradient(180deg,#5a9ed6,#3a7eb6 50%,#2a6ea6);padding:4px 8px;display:flex;align-items:center;gap:6px;border-bottom:1px solid #1a4e85}.msn-toolbar .msn-logo{font-weight:700;font-size:13px;color:#fff}.toolbar-btn{padding:2px 8px;border:1px solid transparent;border-radius:3px;background:transparent;font-family:Tahoma,sans-serif;font-size:11px;color:#fff;cursor:pointer;white-space:nowrap}.toolbar-btn:hover{border-color:#88c0f0;background:#ffffff40}.msn-bottom{background:linear-gradient(180deg,#5a9ed6,#3a7eb6 50%,#2a6ea6);padding:4px 8px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #1a4e85;font-size:11px;color:#fff}.my-status{display:flex;align-items:center;gap:6px}.msn-bottom select{border:1px solid #1a4e85;border-radius:2px;font-family:Tahoma,sans-serif;font-size:11px;padding:1px 4px;background:#b8d8f8;color:#222}#authScreen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:500;display:flex;flex-direction:column;background:linear-gradient(135deg,#2a5e95,#1a3d6e,#3a6ea5)}.auth-content{flex:1;display:flex;align-items:center;justify-content:center;overflow-y:auto;padding:16px}.auth-form{width:100%;max-width:380px;display:flex;flex-direction:column;gap:10px}.auth-form .field{width:100%;display:flex;flex-direction:column;gap:3px}.auth-form .field label{font-size:12px;color:#fff;font-weight:700}.auth-form .field input,.auth-form .field select{padding:6px 8px;border:1px solid #7f9db9;font-family:Tahoma,sans-serif;font-size:13px;background:#fff;color:#222;outline:none}.auth-form .field input:focus{border-color:#3a6ea5;box-shadow:0 0 0 1px #3a6ea5}.auth-form .field input::placeholder{color:#999}.btn-primary{padding:8px 30px;background:linear-gradient(180deg,#5a9ed6,#3a7eb6 50%,#2a6ea6);border:1px solid #1a4e85;border-radius:3px;font-family:Tahoma,sans-serif;font-size:13px;font-weight:700;color:#fff;cursor:pointer;margin-top:4px;width:100%}.btn-primary:hover{background:linear-gradient(180deg,#7ab8f0,#5a9ed6 50%,#4a8ec6)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.link-btn{background:none;border:none;color:#fff;cursor:pointer;font-family:Tahoma,sans-serif;font-size:11px;text-decoration:underline;padding:4px;opacity:.8}.link-btn:hover{opacity:1}.error-msg{color:#faa;font-size:10px;text-align:center;width:100%;min-height:0;overflow:hidden;max-height:0;opacity:0;transition:all .2s}.error-msg.visible{min-height:14px;max-height:40px;opacity:1;padding:3px 6px;background:#00000040;border-radius:2px}.success-msg{color:#afa;font-size:10px;text-align:center;width:100%;min-height:0;overflow:hidden;max-height:0;opacity:0;transition:all .2s}.success-msg.visible{min-height:14px;max-height:40px;opacity:1;padding:3px 6px;background:#00000040;border-radius:2px}#mainApp{display:none;flex-direction:column;height:100vh;height:100dvh}#mainApp.active{display:flex}.main-content{flex:1;display:flex;overflow:hidden;position:relative}.sidebar{width:260px;min-width:200px;background:linear-gradient(180deg,#fff,#e8f0ff);display:flex;flex-direction:column;border-right:2px solid #3a6ea5;overflow:hidden;transition:min-width .2s;z-index:5}.sidebar.collapsed{min-width:0;width:0;border-right:none}.sidebar-toggle{display:none;background:linear-gradient(180deg,#3a6ea5,#2a5e95);color:#fff;border:none;padding:6px 10px;font-size:16px;cursor:pointer;flex-shrink:0}.sidebar-header{background:linear-gradient(180deg,#e8f0ff,#d0d8e8);padding:6px 8px;display:flex;align-items:center;gap:4px;border-bottom:1px solid #c0c8d8}.sidebar-header span{font-size:11px;font-weight:700;color:#3a6ea5}.contact-list{flex:1;overflow-y:auto;padding:4px 0}.group-header{display:flex;align-items:center;gap:4px;padding:4px 8px;background:linear-gradient(180deg,#e8f0ff,#d0d8e8);border-top:1px solid #c0c8d8;border-bottom:1px solid #c0c8d8;cursor:pointer;-webkit-user-select:none;user-select:none;font-weight:700;font-size:11px;color:#3a6ea5}.group-header .arrow{font-size:8px;transition:transform .2s}.group-header .arrow.collapsed{transform:rotate(-90deg)}.contact-group.collapsed .group-contacts{display:none}.contact-item{display:flex;align-items:center;gap:8px;padding:6px 8px;cursor:pointer;-webkit-user-select:none;user-select:none}.contact-item:hover{background:linear-gradient(180deg,#3a6ea5,#2a5e95);color:#fff}.contact-item.active{background:linear-gradient(180deg,#2a5e95,#1a4e85);color:#fff}.contact-avatar{width:34px;height:34px;border-radius:3px;background:linear-gradient(135deg,#5a9ed6,#3a7eb6);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;border:1px solid #2a6ea6;overflow:hidden}.contact-avatar img{width:100%;height:100%;object-fit:cover;display:block}.contact-info{flex:1;min-width:0}.contact-name{font-size:11px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.contact-status-text{font-size:10px;color:#888;font-style:italic}.contact-item:hover .contact-status-text,.contact-item.active .contact-status-text{color:#c0d8f0}.status-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;border:1px solid rgba(0,0,0,.2)}.status-online{background:#4c4}.status-busy{background:#f44}.status-away{background:#fa0}.status-offline{background:#999}.unread-badge{background:#f44;color:#fff;border-radius:50%;min-width:16px;height:16px;font-size:9px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 4px}.desktop-area{flex:1;display:flex;flex-direction:column;background:#fff;overflow:hidden;min-width:0;position:relative}.welcome-panel{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(180deg,#fff,#e8f0ff);gap:12px;color:#666;padding:20px}.welcome-panel .big-icon{font-size:64px;opacity:.7}.welcome-panel h2{font-size:16px;color:#3a6ea5;font-weight:700;text-align:center}.welcome-panel p{font-size:11px;max-width:340px;text-align:center;line-height:1.6}.chat-window{position:absolute;background:#fff;border:2px solid #3a6ea5;border-radius:6px 6px 2px 2px;box-shadow:2px 4px 16px #00000059;display:flex;flex-direction:column;overflow:hidden;z-index:10;min-width:320px;min-height:200px;resize:both}.chat-window.maximized{top:0!important;left:0!important;width:100%!important;height:100%!important;border-radius:0;z-index:20;min-width:0}.chat-window .chat-header{cursor:move;background:linear-gradient(180deg,#3a6ea5,#2a5e95);color:#fff;padding:6px 10px;display:flex;align-items:center;justify-content:space-between;height:34px;flex-shrink:0;-webkit-user-select:none;user-select:none}.chat-window .chat-header-left{display:flex;align-items:center;gap:6px;min-width:0}.chat-header-avatar{width:22px;height:22px;border-radius:3px;object-fit:cover;flex-shrink:0;border:1px solid rgba(255,255,255,.3)}.chat-header-text{font-size:12px;font-weight:700;text-shadow:1px 1px 2px rgba(0,0,0,.5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-window .title-btn{width:20px;height:20px;font-size:9px;background:linear-gradient(180deg,#5a9ed6,#3a7eb6 50%,#2a6ea6)}.chat-window .title-btn.close{background:linear-gradient(180deg,#e08070,#c43 50%,#a32)}.chat-win-body{flex:1;display:flex;flex-direction:column;overflow:hidden}.chat-toolbar{background:linear-gradient(180deg,#5a9ed6,#3a7eb6 50%,#2a6ea6);padding:2px 6px;display:flex;gap:2px;border-bottom:1px solid #1a4e85;flex-shrink:0}.chat-toolbar-btn{padding:2px 8px;border:1px solid transparent;border-radius:2px;background:transparent;font-family:Tahoma,sans-serif;font-size:10px;cursor:pointer;color:#fff;white-space:nowrap}.chat-toolbar-btn:hover{border-color:#88c0f0;background:#ffffff40}.chat-messages{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:6px}.chat-msg{max-width:75%;display:flex;flex-direction:column}.chat-msg.sent{align-self:flex-end}.chat-msg.received{align-self:flex-start}.chat-msg-header{font-size:10px;font-weight:700;color:#3a6ea5;margin-bottom:2px;display:flex;align-items:baseline;gap:4px}.chat-msg.sent .chat-msg-header{text-align:right;flex-direction:row-reverse}.chat-msg-time{font-size:9px;color:#999;font-weight:400}.chat-msg-bubble{padding:6px 12px;border-radius:10px;font-size:12px;line-height:1.5;word-wrap:break-word;overflow-wrap:break-word}.chat-msg.sent .chat-msg-bubble{background:linear-gradient(135deg,#b8d8f8,#88b8e8);border:1px solid #6698cc;border-bottom-right-radius:2px;color:#1a3a5a}.chat-msg.received .chat-msg-bubble{background:linear-gradient(135deg,#f0f0f0,#e0e0e0);border:1px solid #c0c0c0;border-bottom-left-radius:2px;color:#333}.typing-indicator{font-size:10px;color:#888;font-style:italic;padding:2px 12px;display:none;min-height:18px;flex-shrink:0}.typing-indicator.visible{display:block}.system-msg{text-align:center;font-size:10px;color:#888;font-style:italic;padding:6px 0}.nudge-flash{animation:nudge .5s ease-in-out}@keyframes nudge{0%,to{transform:translate(0)}10%{transform:translate(-5px)}20%{transform:translate(5px)}30%{transform:translate(-5px)}40%{transform:translate(5px)}50%{transform:translate(-3px)}60%{transform:translate(3px)}70%{transform:translate(-1px)}80%{transform:translate(1px)}}.chat-input-area{border-top:1px solid #c0c8d8;padding:8px;display:flex;gap:6px;align-items:flex-end;position:relative;background:#fff;flex-shrink:0}.emoticon-toggle{width:34px;height:34px;border:1px solid #7f9db9;border-radius:3px;background:#fff;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0;padding:0}.emoticon-toggle:hover{background:#e8f0ff;border-color:#3a6ea5}.chat-input{flex:1;border:1px solid #7f9db9;border-radius:0;font-family:Tahoma,sans-serif;font-size:12px;padding:6px 8px;resize:none;min-height:34px;max-height:120px;outline:none;background:#fff}.chat-input:focus{border-color:#3a6ea5}.send-btn{padding:6px 16px;background:linear-gradient(180deg,#5a9ed6,#3a7eb6 50%,#2a6ea6);border:1px solid #1a4e85;border-radius:3px;font-family:Tahoma,sans-serif;font-size:12px;font-weight:700;color:#fff;cursor:pointer;height:34px;white-space:nowrap}.send-btn:hover{background:linear-gradient(180deg,#7ab8f0,#5a9ed6 50%,#4a8ec6)}.emoticon-picker{position:absolute;bottom:50px;left:8px;background:#fff;border:1px solid #7f9db9;border-radius:3px;padding:6px;display:none;grid-template-columns:repeat(6,1fr);gap:2px;box-shadow:2px 2px 8px #00000040;z-index:200}.emoticon-picker.open{display:grid}.emoticon-btn{width:30px;height:30px;border:none;background:transparent;cursor:pointer;font-size:18px;border-radius:2px;display:flex;align-items:center;justify-content:center}.emoticon-btn:hover{background:#e8f0ff}.profile-win-body{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;background:#fff}.profile-section{border:1px solid #c0c8d8;border-radius:4px;padding:12px;display:flex;flex-direction:column;gap:8px}.profile-section h4{font-size:11px;color:#3a6ea5;font-weight:700;border-bottom:1px solid #e0e0e0;padding-bottom:4px}.profile-field{display:flex;flex-direction:column;gap:2px}.profile-field label{font-size:10px;color:#666;font-weight:700}.profile-field input{padding:4px 6px;border:1px solid #7f9db9;font-family:Tahoma,sans-serif;font-size:11px;outline:none}.profile-field input:focus{border-color:#3a6ea5}.profile-field input:disabled{background:#f0f0f0;color:#888}.avatar-preview{width:80px;height:80px;border-radius:6px;border:2px solid #3a6ea5;object-fit:cover;background:linear-gradient(135deg,#5a9ed6,#3a7eb6);display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;position:relative}.avatar-preview img{width:100%;height:100%;object-fit:cover}.avatar-preview .overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;font-weight:700;opacity:0;transition:opacity .2s}.avatar-preview:hover .overlay{opacity:1}.search-results{max-height:300px;overflow-y:auto;display:flex;flex-direction:column;gap:4px}.search-result{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;border-radius:3px}.search-result:hover{background:#e8f0ff}.search-result-info{display:flex;align-items:center;gap:8px;min-width:0}.search-result-avatar{width:28px;height:28px;border-radius:3px;overflow:hidden;background:linear-gradient(135deg,#5a9ed6,#3a7eb6);flex-shrink:0}.search-result-avatar img{width:100%;height:100%;object-fit:cover}.search-result-name{font-size:11px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn-sm{padding:3px 12px;border:1px solid #7f9db9;border-radius:2px;background:#f0f0f0;font-family:Tahoma,sans-serif;font-size:10px;cursor:pointer;flex-shrink:0}.btn-sm:hover{background:#e0e0e0}.btn-sm:disabled{opacity:.4;cursor:not-allowed}.btn-sm.green{background:linear-gradient(180deg,#4c4,#3a3);border-color:#282;color:#fff;font-weight:700}.btn-sm.green:hover{background:linear-gradient(180deg,#5d5,#4b4)}.btn-sm.red{background:linear-gradient(180deg,#e08070,#c43);border-color:#a32;color:#fff;font-weight:700}.request-item{display:flex;align-items:center;gap:8px;padding:8px;border-radius:4px;background:#f8f8f8;border:1px solid #e0e0e0}.request-item-info{flex:1;min-width:0;display:flex;align-items:center;gap:8px}.request-item-avatar{width:30px;height:30px;border-radius:3px;overflow:hidden;background:linear-gradient(135deg,#5a9ed6,#3a7eb6);flex-shrink:0}.request-item-avatar img{width:100%;height:100%;object-fit:cover}.request-item-name{font-size:11px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.request-item-actions{display:flex;gap:4px;flex-shrink:0}.empty-msg{text-align:center;color:#888;font-size:10px;padding:16px}::-webkit-scrollbar{width:16px}::-webkit-scrollbar-track{background:#f0f0f0;border:1px solid #c0c0c0}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#5a9ed6,#3a7eb6 50%,#2a6ea6);border:1px solid #1a4e85;border-radius:0}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#7ab8f0,#5a9ed6 50%,#4a8ec6)}.mobile-app{display:flex;flex-direction:column;height:100vh;height:100dvh}.mobile-title-bar{background:linear-gradient(180deg,#0a246a,#3a6ea5 8%,#0a246a 10%,#3a6ea5 90%,#0a246a);color:#fff;padding:6px 12px;display:flex;align-items:center;justify-content:center;height:36px;flex-shrink:0}.mobile-title-bar .msn-logo{font-weight:700;font-size:14px;color:#fff;text-shadow:1px 1px 2px rgba(0,0,0,.6)}.mobile-bottom-bar{background:linear-gradient(180deg,#5a9ed6,#3a7eb6 50%,#2a6ea6);padding:6px 8px;display:flex;gap:4px;flex-shrink:0;border-top:1px solid #1a4e85}.mobile-bottom-btn{flex:1;padding:8px 4px;background:transparent;border:1px solid rgba(255,255,255,.3);border-radius:4px;font-family:Tahoma,sans-serif;font-size:11px;color:#fff;cursor:pointer;text-align:center}.mobile-bottom-btn:active{background:#fff3}.mobile-view{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;background:#fff;z-index:20}.mobile-header{background:linear-gradient(180deg,#3a6ea5,#2a5e95);color:#fff;padding:8px 10px;display:flex;align-items:center;gap:8px;height:44px;flex-shrink:0}.mobile-back-btn{width:32px;height:32px;border:1px solid rgba(255,255,255,.3);border-radius:4px;background:transparent;color:#fff;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}.mobile-back-btn:active{background:#fff3}.mobile-header-info{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.mobile-header-info .chat-header-avatar{width:30px;height:30px}.mobile-header-name{font-size:13px;font-weight:700;text-shadow:1px 1px 2px rgba(0,0,0,.5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-header-status{display:flex;align-items:center;gap:4px;font-size:10px;color:#fffc}.mobile-header-action{width:32px;height:32px;border:1px solid rgba(255,255,255,.3);border-radius:4px;background:transparent;color:#fff;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}.mobile-header-action:active{background:#fff3}.mobile-messages{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:6px}.mobile-input-area{border-top:1px solid #c0c8d8;padding:6px 8px;display:flex;gap:4px;align-items:flex-end;position:relative;background:#fff;flex-shrink:0}.mobile-scroll{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:8px}@media (max-width:700px){.sidebar{position:relative;width:100%;min-width:100%;border-right:none;flex:1;overflow-y:auto}.sidebar-toggle{display:none!important}.chat-msg{max-width:88%}.emoticon-picker{grid-template-columns:repeat(6,1fr);left:0;right:0;position:fixed;bottom:60px}.chat-input-area{padding:6px}.send-btn{padding:6px 12px}.welcome-panel .big-icon{font-size:48px}.welcome-panel h2{font-size:14px}.chat-window{min-width:280px;min-height:180px}.chat-window.maximized{min-width:0}}@media (max-width:400px){.chat-msg{max-width:92%}.msn-bottom{font-size:10px;padding:3px 6px}.title-bar-text,.chat-header-text{font-size:11px}.auth-form{max-width:100%}.chat-window{min-width:240px}}@media (min-width:701px){.sidebar-toggle{display:none!important}}