body{align-items:center;background-color:#f4f4f4;display:flex;font-family:Arial,sans-serif;height:100vh;justify-content:center;margin:0}.hidden{display:none!important}.modal-overlay{align-items:center;background:rgba(0,0,0,.5);display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1000}.modal{background:#fff;border-radius:10px;box-shadow:0 4px 15px rgba(0,0,0,.2);padding:30px;text-align:center;width:300px}.modal-title{color:#333;margin-bottom:20px;margin-top:0}.nickname-input{border:1px solid #ccc;border-radius:5px;box-sizing:border-box;margin-bottom:10px}.btn,.nickname-input{font-size:16px;padding:10px;width:100%}.btn{background-color:#ff5722;border:none;border-radius:5px;color:#fff;cursor:pointer}.btn:hover{background-color:#e64a19}.error-msg{color:red;font-size:14px;margin-top:10px}.chat-container{background:#fff;border-radius:10px;box-shadow:0 4px 15px rgba(0,0,0,.1);display:flex;height:600px;overflow:hidden;width:800px}.users-panel{background-color:#f0f0f0;border-right:1px solid #ddd;display:flex;flex-direction:column;width:200px}.users-list{list-style:none;margin:0;overflow-y:auto;padding:0}.user-item{align-items:center;border-bottom:1px solid #e0e0e0;display:flex;padding:15px}.user-avatar{background-color:#ddd;border-radius:50%;height:30px;margin-right:10px;width:30px}.user-item.me .user-name{color:#ff5722;font-weight:700}.chat-area,.messages-box{display:flex;flex-direction:column;flex-grow:1}.messages-box{background-color:#fff;gap:10px;overflow-y:auto;padding:20px}.message{border-radius:10px;font-size:14px;line-height:1.4;max-width:70%;padding:10px 15px;position:relative}.message-header{color:#888;font-size:12px;margin-bottom:4px}.message.others{align-self:flex-start;background-color:#f1f0f0;border-bottom-left-radius:0}.message.me{align-self:flex-end;background-color:#ffecb3;border-bottom-right-radius:0;text-align:right}.input-area{background-color:#f9f9f9;border-top:1px solid #ddd;display:flex;gap:10px;padding:15px}.chat-input{border:1px solid #ccc;border-radius:5px;flex-grow:1;outline:none;padding:10px}