@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-primary: #ffffff;--bg-secondary: #f8f8f8;--bg-tertiary: #f0f0f0;--bg-elevated: #ffffff;--bg-hover: #ebebeb;--text-primary: #1a1a1a;--text-secondary: #666666;--text-tertiary: #999999;--text-bright: #000000;--border-color: #d0d0d0;--border-light: #b0b0b0;--border-dashed: 1px dashed #c0c0c0;--accent: #1a1a1a;--accent-hover: #000000;--accent-dim: #444444;--success: #22c55e;--warning: #eab308;--error: #ef4444;--font-primary: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "SF Mono", "Consolas", "Monaco", monospace;--text-xs: .6875rem;--text-sm: .8125rem;--text-base: .9375rem;--text-md: 1rem;--text-lg: 1.125rem;--text-xl: 1.5rem;--text-2xl: 2rem;--sp-xs: .25rem;--sp-sm: .5rem;--sp-md: .75rem;--sp-lg: 1rem;--sp-xl: 1.5rem;--sp-2xl: 2rem;--radius-sm: 2px;--radius-md: 3px;--radius-lg: 4px;--shadow-sm: none;--shadow-md: none;--shadow-lg: none;--transition: .15s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;overflow:hidden}body{font-family:var(--font-primary);font-size:var(--text-base);font-weight:400;color:var(--text-primary);background:#fff;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::selection{background:#00000026;color:var(--text-bright)}::-webkit-scrollbar{width:8px;background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:#d0d0d0;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#b0b0b0}h1,h2,h3,h4,h5,h6{font-weight:600;color:var(--text-bright)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.625rem 1.5rem;font-family:var(--font-primary);font-size:var(--text-sm);font-weight:500;border:1px solid #000;border-radius:var(--radius-md);background:#fff;color:var(--text-primary);cursor:pointer;transition:all var(--transition);outline:none}.btn:hover:not(:disabled){background:#000;color:#fff;border-color:#000}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:#000;color:#fff;border-color:#000;font-weight:600}.btn-primary:hover:not(:disabled){background:#333;border-color:#333}.btn-danger{background:transparent;color:var(--error);border-color:var(--error)}.btn-danger:hover:not(:disabled){background:var(--error);color:#fff}.btn-full-width{width:100%}.btn-loading{position:relative;color:transparent}.btn-loading:after{content:"";position:absolute;width:16px;height:16px;border:2px solid transparent;border-top-color:currentColor;border-right-color:currentColor;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.input-group{display:flex;flex-direction:column;gap:var(--sp-xs);margin-bottom:var(--sp-lg)}.input-label{font-size:var(--text-sm);font-weight:500;color:var(--text-secondary)}.input-label .required{color:var(--error);margin-left:var(--sp-xs)}.input{width:100%;padding:.75rem 1rem;font-family:var(--font-primary);font-size:var(--text-base);border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--bg-secondary);color:var(--text-primary);transition:all var(--transition)}.input:focus{outline:none;border-color:var(--border-light);background:var(--bg-tertiary)}.input::placeholder{color:var(--text-tertiary)}.input-error{border-color:var(--error)}.error-text{font-size:var(--text-sm);color:var(--error);margin-top:var(--sp-xs)}.error-message{padding:var(--sp-md);border:1px solid var(--error);border-radius:var(--radius-md);background:#fef2f2;margin-bottom:var(--sp-lg)}.error-message p{color:var(--error);font-size:var(--text-sm);font-weight:500}.error-details{margin-top:var(--sp-sm);padding-left:var(--sp-lg);list-style:disc;font-size:var(--text-sm);color:var(--error)}.spinner{display:flex;align-items:center;justify-content:center}.spinner-circle{width:24px;height:24px;border:2px solid #e0e0e0;border-top-color:#000;border-radius:50%;animation:spin .8s linear infinite}.spinner-small .spinner-circle{width:16px;height:16px;border-width:2px}.spinner-medium .spinner-circle{width:32px;height:32px}.spinner-large .spinner-circle{width:48px;height:48px;border-width:3px}.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:var(--sp-xl);background:#fff}.loading-screen p{font-size:var(--text-lg);font-weight:500;color:var(--text-secondary)}.avatar{width:40px;height:40px;border-radius:50%;overflow:hidden;background:var(--bg-elevated);border:1px solid var(--border-color)}.avatar img{width:100%;height:100%;object-fit:cover}.avatar-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#f0f0f0;color:var(--text-secondary);font-weight:600;font-size:var(--text-md)}.not-found-page{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:var(--sp-xl);background:#fff}.not-found-page h1{font-size:6rem;font-weight:700;color:var(--text-tertiary)}.not-found-page p{font-size:var(--text-xl);color:var(--text-secondary)}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--sp-lg);background:#f5f5f5}.auth-container{width:100%;max-width:420px;background:#fff;border:1px solid #000;border-radius:var(--radius-md);box-shadow:none;overflow:hidden}.auth-brand{padding:var(--sp-lg) var(--sp-lg) var(--sp-sm);background:#fff;border-bottom:none;text-align:center}.brand-logo{font-size:var(--text-2xl);font-weight:600;color:var(--text-bright);margin:0 0 var(--sp-xs) 0;letter-spacing:-.03em}.brand-tagline{font-size:var(--text-sm);color:var(--text-tertiary);margin:0}.auth-form{padding:var(--sp-lg) var(--sp-xl) var(--sp-2xl)}.auth-form h1{font-size:var(--text-xl);font-weight:600;margin-bottom:var(--sp-xs);color:var(--text-bright)}.auth-subtitle{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--sp-2xl)}.auth-footer{margin-top:var(--sp-xl);padding-top:var(--sp-lg);border-top:none;text-align:center;font-size:var(--text-sm);color:var(--text-secondary)}.auth-footer a{color:var(--text-primary);text-decoration:none;font-weight:500;transition:color var(--transition)}.auth-footer a:hover{color:var(--text-bright)}.auth-form .btn-full-width{margin-top:var(--sp-lg)}@media(max-width:640px){.auth-page{padding:0;background:#fff}.auth-container{max-width:100%;min-height:100vh;border-radius:0;border:none;display:flex;flex-direction:column}.auth-form{flex:1;padding:var(--sp-xl) var(--sp-lg);display:flex;flex-direction:column}.auth-brand{padding:var(--sp-xl) var(--sp-lg)}.brand-logo{font-size:var(--text-xl)}}.auth-form .input-group{animation:fade-in .3s ease-out backwards}.auth-form .input-group:nth-child(2){animation-delay:.05s}.auth-form .input-group:nth-child(3){animation-delay:.1s}.auth-form .input-group:nth-child(4){animation-delay:.15s}.auth-form .input-group:nth-child(5){animation-delay:.2s}.auth-form .input-group:nth-child(6){animation-delay:.25s}.auth-form .btn-full-width{animation:fade-in .3s ease-out .3s backwards}.auth-footer{animation:fade-in .3s ease-out .35s backwards}@keyframes fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.auth-checkbox{display:flex;align-items:center;gap:var(--sp-sm);margin-top:var(--sp-md);font-size:var(--text-sm);color:var(--text-secondary);cursor:pointer}.auth-checkbox input{flex-shrink:0;margin:0}.chat-page{display:flex;height:100vh;height:100dvh;overflow:hidden;background:#fff}.sidebar{width:300px;background:var(--bg-secondary);border-right:2px solid #000;display:flex;flex-direction:column;flex-shrink:0}.sidebar-header{padding:var(--sp-lg);border-bottom:var(--border-dashed);background:#fff;display:flex;align-items:center;justify-content:space-between;gap:var(--sp-md)}.user-info{display:flex;align-items:center;gap:var(--sp-md);flex:1;min-width:0}.user-details{flex:1;min-width:0}.user-details h3{font-size:var(--text-base);font-weight:600;color:var(--text-bright);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-details .status{font-size:var(--text-xs);color:var(--text-secondary);text-transform:capitalize;display:flex;align-items:center;gap:var(--sp-xs)}.user-details .status:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--success)}.logout-btn{padding:var(--sp-sm) var(--sp-md);font-size:var(--text-xs);font-weight:500;background:transparent;color:var(--text-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition);white-space:nowrap}.logout-btn:hover{background:var(--bg-hover);color:var(--text-bright);border-color:var(--border-light)}.conversation-list{flex:1;overflow-y:auto;overflow-x:hidden}.conversation-list-loading,.conversation-list-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--sp-2xl);text-align:center;color:var(--text-secondary);gap:var(--sp-sm)}.conversation-list-empty p{margin:0}.empty-subtitle{font-size:var(--text-sm);color:var(--text-tertiary)}.conversation-item{display:flex;align-items:center;gap:var(--sp-md);padding:var(--sp-md);cursor:pointer;border-bottom:var(--border-dashed);transition:background-color var(--transition);position:relative}.conversation-item:hover{background:var(--bg-hover)}.conversation-item.active{background:var(--bg-tertiary)}.conversation-item.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#000}.conversation-avatar{flex-shrink:0}.conversation-content{flex:1;min-width:0}.conversation-header{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-sm);margin-bottom:var(--sp-xs)}.conversation-header h4{font-size:var(--text-base);font-weight:500;color:var(--text-bright);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.timestamp{font-size:var(--text-xs);color:var(--text-tertiary);white-space:nowrap;flex-shrink:0}.conversation-preview{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-sm)}.conversation-preview p{font-size:var(--text-sm);color:var(--text-secondary);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.unread-badge{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;background:#000;color:#fff;font-size:var(--text-xs);font-weight:600;border-radius:9px}.chat-window{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--bg-primary)}.chat-window-empty{flex:1;display:flex;align-items:center;justify-content:center;background:#fff}.empty-state{text-align:center;color:var(--text-secondary);max-width:400px;padding:var(--sp-2xl)}.empty-state h2{font-size:var(--text-xl);font-weight:600;margin:0 0 var(--sp-md) 0;color:var(--text-bright)}.empty-state p{margin:0;font-size:var(--text-base);color:var(--text-tertiary)}.chat-header{display:flex;align-items:center;gap:var(--sp-md);padding:var(--sp-lg);border-bottom:2px solid #000;background:#fff}.chat-header-info h3{font-size:var(--text-lg);font-weight:600;color:var(--text-bright);margin:0 0 var(--sp-xs) 0}.chat-status{font-size:var(--text-sm);color:var(--success);display:flex;align-items:center;gap:var(--sp-xs)}.chat-status:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--success)}.message-list{flex:1;overflow-y:auto;overflow-x:hidden;padding:var(--sp-lg);display:flex;flex-direction:column;gap:var(--sp-md)}.message-list-empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--text-tertiary);font-size:var(--text-base)}.message{display:flex;gap:var(--sp-sm);max-width:70%;animation:fade-in .2s ease-out}.message-own{align-self:flex-end;flex-direction:row-reverse}.message-other{align-self:flex-start}.message-avatar{flex-shrink:0}.message-content{display:flex;flex-direction:column;gap:var(--sp-xs);min-width:0}.message-sender{font-size:var(--text-xs);font-weight:500;color:var(--text-tertiary);padding-left:var(--sp-sm)}.message-bubble{padding:var(--sp-sm) var(--sp-md);border-radius:var(--radius-md);word-wrap:break-word;word-break:break-word;line-height:1.5}.message-own .message-bubble{background:#000;color:#fff;border:1px solid #000}.message-other .message-bubble{background:#f5f5f5;color:#1a1a1a;border:1px solid #d0d0d0}.message-bubble p{margin:0}.message-timestamp{font-size:var(--text-xs);color:var(--text-tertiary);padding-left:var(--sp-sm)}.message-pending .message-bubble{opacity:.6}.message-failed .message-bubble{background:#fff;color:var(--error);border:1px dashed var(--error)}.message-error{color:var(--error)}.load-earlier{align-self:center;padding:var(--sp-xs) var(--sp-md);background:none;border:var(--border-dashed);border-radius:var(--radius-md);color:var(--text-secondary);font-size:var(--text-sm);cursor:pointer;transition:background-color var(--transition)}.load-earlier:hover:not(:disabled){background:var(--bg-hover)}.load-earlier:disabled{cursor:default;color:var(--text-tertiary)}.text-button{padding:0;background:none;border:none;color:inherit;font:inherit;text-decoration:underline;cursor:pointer}.chat-connection{font-size:var(--text-sm);color:var(--warning)}.message-input-form{display:flex;gap:var(--sp-md);padding:var(--sp-lg);border-top:2px solid #000;background:#fff}.message-input{flex:1;padding:var(--sp-md);font-family:var(--font-primary);font-size:var(--text-base);border:1px solid #000;border-radius:var(--radius-md);background:#fff;color:var(--text-primary);transition:all var(--transition);resize:none;min-height:44px;max-height:120px}.message-input:focus{outline:none;border-color:#000;background:#fafafa}.message-input::placeholder{color:var(--text-tertiary)}.message-input:disabled{background:var(--bg-hover);cursor:not-allowed;opacity:.5}.send-button{padding:var(--sp-md) var(--sp-xl);font-size:var(--text-base);font-weight:500;background:#000;color:#fff;border:1px solid #000;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition);white-space:nowrap}.send-button:hover:not(:disabled){background:#333;border-color:#333}.send-button:active:not(:disabled){transform:scale(.98)}.send-button:disabled{opacity:.4;cursor:not-allowed}@media(max-width:768px){.sidebar{width:100%;border-right:none}.chat-page.pane-chat .sidebar,.chat-page.pane-list .chat-window,.chat-page.pane-list .chat-window-empty{display:none}.chat-header .chat-back{display:inline-flex}.message{max-width:85%}.message-input-form{padding:var(--sp-md)}}@media(max-width:640px){.message{max-width:90%}}@keyframes fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.message-avatar.avatar{width:32px;height:32px}.message-avatar .avatar-placeholder{font-size:var(--text-sm)}.user-details .status.status-offline:before{background:var(--text-tertiary)}.chat-status-offline{color:var(--text-tertiary)}.chat-status-offline:before{background:var(--text-tertiary)}.conversation-avatar{position:relative;overflow:visible}.conversation-avatar .avatar-placeholder,.conversation-avatar img{border-radius:50%}.conversation-avatar.avatar-online:after{content:"";position:absolute;right:-1px;bottom:-1px;width:10px;height:10px;border-radius:50%;background:var(--success);border:2px solid #fff}.chat-back{display:none;align-items:center;justify-content:center;width:36px;height:36px;flex-shrink:0;background:none;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:var(--text-lg);cursor:pointer}