body{margin:0;font-family:Arial,sans-serif;background:#f0f2f5}h4{margin-top:50px}label{font-weight:700}.logo{height:200px;width:200px;margin:auto}.center-wrapper{display:flex;justify-content:center;align-items:center;height:100vh}.box{width:500px;min-height:300px;background:#fff;border-radius:10px;padding:20px;box-shadow:0 4px 10px #0000001a;display:flex;flex-direction:column;gap:10px}.split-container{display:flex;gap:20px;margin-top:10px}.panel{width:500px;height:750px;background:#fff;border-radius:10px;padding:20px;box-shadow:0 4px 10px #0000001a;display:flex;flex-direction:column}input{padding:8px;border-radius:5px;border:1px solid #ccc;margin-bottom:5px}.user-info-box{margin-top:10px;padding:10px;border-radius:12px;background:#f2f2f7;font-size:14px}button{padding:8px;border:none;border-radius:5px;background:#3b82f6;color:#fff;box-shadow:0 5px 2px #0003;cursor:pointer}button:hover{background:#2c73e6}button:disabled{background:#aaa;cursor:not-allowed}.grey{padding:8px;border:none;border-radius:5px;background:#e5e5ea;color:#000;box-shadow:0 5px 2px #0003;cursor:pointer}.grey:hover{background:#d2d2d8}.remove-btn{background:#ff3b30;color:#fff;border:none;padding:4px 10px;margin-left:10px;border-radius:10px;cursor:pointer;font-size:12px}.remove-btn:hover{background:#d9362b}.chat-input{display:flex;gap:10px;padding:10px;border-top:1px solid #ddd}.chat-input input{flex:1;border-radius:20px;padding:10px}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background:#0000004d;z-index:1000}.modal-box{background:#fff;padding:25px;border-radius:12px;width:300px;text-align:center;box-shadow:0 10px 25px #0003}.modal-actions{display:flex;justify-content:center;gap:20px;margin-top:15px}.error{color:#ff3b30;font-size:14px;margin-top:5px}.success{color:#34c759;font-size:14px;margin-bottom:10px}.chat-panel[data-v-c207b166]{display:flex;flex-direction:column;height:750px;overflow:hidden}.chat-header[data-v-c207b166]{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px;border-bottom:1px solid #e0e0e0;flex-shrink:0}.chat-header h3[data-v-c207b166]{margin:0;font-size:18px}.header-actions[data-v-c207b166]{display:flex;gap:6px}.small-btn[data-v-c207b166]{padding:5px 10px;font-size:12px;border-radius:8px}.members-list[data-v-c207b166]{display:flex;flex-direction:column;gap:8px;margin:10px;max-height:300px;overflow-y:auto}.member-row[data-v-c207b166]{display:flex;align-items:center}.member-avatar[data-v-c207b166]{width:32px;height:32px;font-size:13px;flex-shrink:0;min-width:32px}.member-username[data-v-c207b166]{margin:10px;font-size:14px}.owner-badge[data-v-c207b166]{font-size:11px;background:#e0eaff;color:#3b82f6;padding:2px 8px;border-radius:10px;font-weight:600}.invite-section[data-v-c207b166]{flex-shrink:0;margin-bottom:8px}.invite-row[data-v-c207b166]{display:flex;justify-content:space-between;align-items:center;padding:8px;background:#f0f4ff;border-radius:8px;margin-bottom:6px}.invite-info[data-v-c207b166]{display:flex;flex-direction:column}.invite-chat-name[data-v-c207b166]{font-weight:600;font-size:14px}.invite-from[data-v-c207b166]{font-size:12px;color:#888}.invite-actions[data-v-c207b166]{display:flex;gap:6px}.chat-list-view[data-v-c207b166]{flex:1;overflow-y:auto}.search-row[data-v-c207b166]{display:flex;gap:8px;margin-bottom:8px}.search-row input[data-v-c207b166]{flex:1;margin-bottom:0}.search-results[data-v-c207b166]{margin-bottom:10px}.search-result-row[data-v-c207b166]{display:flex;justify-content:space-between;align-items:center;padding:6px 8px;background:#f9f9f9;border-radius:8px;margin-bottom:4px;font-size:14px}.chat-list-row[data-v-c207b166]{display:flex;align-items:center;gap:12px;padding:10px 8px;border-radius:10px;cursor:pointer;transition:background .15s;margin-bottom:4px}.chat-list-row[data-v-c207b166]:hover{background:#f0f4ff}.chat-avatar[data-v-c207b166]{width:40px;height:40px;border-radius:50%;background:#3b82f6;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;flex-shrink:0}.chat-list-info[data-v-c207b166]{display:flex;flex-direction:column;flex:1}.chat-list-name[data-v-c207b166]{font-weight:600;font-size:15px}.chat-member-count[data-v-c207b166]{font-size:12px;color:#888}.chat-arrow[data-v-c207b166]{font-size:20px;color:#aaa}.message-view[data-v-c207b166]{flex:1;display:flex;flex-direction:column;overflow:hidden}.chat-messages[data-v-c207b166]{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:4px}.no-messages[data-v-c207b166]{margin:auto;color:#aaa;font-size:14px}.received-wrapper[data-v-c207b166]{display:flex;flex-direction:column;max-width:85%;margin-bottom:5px;gap:2px}.sender-label[data-v-c207b166]{font-size:12px;font-weight:600;color:#555;white-space:nowrap;flex-shrink:0}.message-row[data-v-c207b166]{display:flex;flex-direction:column;margin-bottom:6px}.sent[data-v-c207b166]{align-items:flex-end}.received[data-v-c207b166]{align-items:flex-start}.bubble[data-v-c207b166]{max-width:70%;padding:10px 14px;border-radius:20px;font-size:14px;position:relative}.bubble-sent[data-v-c207b166]{background:#007aff;color:#fff;border-bottom-right-radius:5px}.bubble-received[data-v-c207b166]{background:#e5e5ea;color:#000;border-bottom-left-radius:5px}.msg-time[data-v-c207b166]{display:block;font-size:10px;opacity:.65;margin-top:4px;text-align:right}