*{box-sizing:border-box;font-family:Segoe UI,sans-serif;margin:0;padding:0}body{background:#fff;overflow-x:hidden}#auth{align-items:center;background:rgba(0,0,0,.2);display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1000}.auth-card{background:#fff;max-width:400px;padding:2rem;width:90%}.auth-card h2{color:#252525;margin-bottom:1.5rem;text-align:center}.input-group{display:flex;gap:.5rem;margin-bottom:1rem}.error-message{color:red;display:none;padding:.5rem;text-align:center}.chat-container{background:#fff;display:none;flex-direction:row;height:100vh;width:100vw}.chat-sidebar{background:#fff;border-right:2px solid #252525;color:#fff;display:flex;flex-direction:column;flex-shrink:0;overflow:hidden;padding:1rem;width:300px}.sidebar-header{align-items:center;color:#252525;display:flex;justify-content:space-between;margin-bottom:1rem}.user-list{flex-grow:1;list-style:none;overflow-y:auto;padding-right:.5rem}.user-list li{align-items:center;background:hsla(0,0%,100%,.1);color:#252525;display:flex;margin:.25rem 0;padding:.5rem}.online-dot{background:#27ae60;display:inline-block;height:8px;margin-right:8px;width:8px}.chat-main{min-width:0}.chat-main,.chat-messages{display:flex;flex:1;flex-direction:column}.chat-messages{background:#fff;gap:.5rem;overflow-y:auto;padding:1rem}.message{animation:messageAppear .3s ease;margin:.5rem;max-width:80%;min-width:120px;padding:.75rem 1rem;width:fit-content;word-break:break-word}#messageInput{background:#fff;border:2px solid #e0e0e0;flex-grow:1;font-size:12px;max-height:150px;min-height:48px;overflow-y:auto!important;padding:12px 16px;resize:none;scrollbar-color:gray #f0f0f0;scrollbar-width:thin;transition:all .3s ease;width:100%}#messageInput:focus{border-color:gray;outline:none}#messageInput::placeholder{color:#a0a0a0;opacity:1}#messageInput::-webkit-scrollbar{width:6px}#messageInput::-webkit-scrollbar-track{background:#f0f0f0}#messageInput::-webkit-scrollbar-thumb{background:gray}.self{background:gray;color:#fff;margin-left:auto}.other{background:#fff}.system{background:transparent;color:#666;font-size:.9em;margin:.5rem 0;max-width:none;padding:0;text-align:center;width:100%}.message-header{align-items:baseline;display:flex;gap:1rem;justify-content:space-between;margin-bottom:.5rem}.message-header strong{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.message-time{flex-shrink:0;font-size:.75em;opacity:.8;white-space:nowrap}.message-text{hyphens:auto;line-height:1.4;overflow-wrap:break-word;white-space:pre-wrap}.chat-input{align-items:flex-end;background:#fff;display:flex;flex-shrink:0;gap:.5rem;padding:1rem}input{border:1px solid #ddd;flex-grow:1;outline:none;padding:.75rem}input:focus{border-color:gray}.btn-primary{background:rgba(0,0,255,.63);color:#fff;padding:.75rem 1.5rem;transition:all .3s ease}.btn-icon,.btn-primary{border:none;cursor:pointer}.btn-icon{background:none;color:#252525;padding:.5rem}.btn-primary.danger{background:red}#logoutButton i{font-size:1.5rem;transition:transform .2s}#sendButton{flex-shrink:0;height:40px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:150px}.confirm-modal{align-items:center;background:rgba(0,0,0,.5);display:none;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:2000}.confirm-content{animation:modalAppear .3s ease;background:#fff;max-width:400px;padding:2rem;text-align:center}.confirm-buttons{display:flex;gap:1rem;justify-content:center;margin-top:1.5rem}.user-list::-webkit-scrollbar{width:6px}.user-list::-webkit-scrollbar-track{background:rgba(0,0,0,.1)}.user-list::-webkit-scrollbar-thumb{background:hsla(0,0%,100%,.4)}.chat-messages::-webkit-scrollbar{width:8px}.chat-messages::-webkit-scrollbar-track{background:rgba(0,0,0,.05)}.chat-messages::-webkit-scrollbar-thumb{background:rgba(0,0,0,.2)}@keyframes messageAppear{0%{opacity:0;transform:translateY(10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes modalAppear{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}