*{margin:0;padding:0;box-sizing:border-box}:root{--primary: #3b82f6;--primary-dark: #2563eb;--primary-light: #dbeafe;--primary-glow: rgba(59, 130, 246, .3);--success: #10b981;--error: #ef4444;--warning: #f59e0b;--bg-gradient-start: #0f172a;--bg-gradient-end: #1e3a5f;--surface: rgba(255, 255, 255, .03);--surface-hover: rgba(255, 255, 255, .06);--glass: rgba(255, 255, 255, .08);--glass-border: rgba(255, 255, 255, .1);--text: #f1f5f9;--text-muted: #94a3b8;--text-dark: #1e293b;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .2);--shadow-md: 0 8px 24px rgba(0, 0, 0, .3);--shadow-glow: 0 0 40px var(--primary-glow)}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(135deg,var(--bg-gradient-start) 0%,var(--bg-gradient-end) 100%);color:var(--text);line-height:1.6;min-height:100vh}.container{max-width:900px;margin:0 auto;height:100vh;display:flex;flex-direction:column;position:relative}.header{padding:1.25rem 1.5rem;background:var(--glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--glass-border);position:relative;z-index:10}.header-content{display:flex;align-items:center;gap:1rem}.avatar{width:50px;height:50px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);border-radius:16px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-glow)}.avatar svg{width:26px;height:26px;color:#fff}.header-info h1{font-size:1.125rem;font-weight:600;letter-spacing:-.025em}.status{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--text-muted);margin-top:.125rem}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--warning);box-shadow:0 0 8px var(--warning);animation:pulse 2s infinite}.status.online .status-dot{background:var(--success);box-shadow:0 0 8px var(--success)}.status.offline .status-dot{background:var(--error);box-shadow:0 0 8px var(--error);animation:none}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.9)}}.chat-container{flex:1;overflow-y:auto;padding:1.5rem;display:flex;flex-direction:column;gap:1.25rem;scrollbar-width:thin;scrollbar-color:var(--glass-border) transparent}.chat-container::-webkit-scrollbar{width:6px}.chat-container::-webkit-scrollbar-track{background:transparent}.chat-container::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:3px}.welcome-message{text-align:center;padding:3rem 2rem;margin:auto 0}.welcome-icon{width:80px;height:80px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);border-radius:24px;display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;box-shadow:var(--shadow-glow);animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.welcome-icon svg{width:40px;height:40px;color:#fff}.welcome-message h2{font-size:1.75rem;font-weight:700;letter-spacing:-.025em;margin-bottom:.5rem;background:linear-gradient(135deg,var(--text) 0%,var(--primary-light) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.welcome-message p{color:var(--text-muted);margin-bottom:2rem}.suggestion-chips{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center}.chip{background:var(--glass);color:var(--text);border:1px solid var(--glass-border);padding:.75rem 1.25rem;border-radius:100px;font-size:.875rem;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.chip:hover{background:var(--primary);border-color:var(--primary);transform:translateY(-2px);box-shadow:var(--shadow-glow)}.message{display:flex;gap:.875rem;max-width:80%;animation:messageIn .4s cubic-bezier(.16,1,.3,1)}@keyframes messageIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.message.user{align-self:flex-end;flex-direction:row-reverse}.message-avatar{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.message.bot .message-avatar{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff}.message.user .message-avatar{background:var(--glass);border:1px solid var(--glass-border);color:var(--text)}.message-avatar svg{width:18px;height:18px}.message-content{padding:1rem 1.25rem;border-radius:20px;position:relative}.message.user .message-content{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;border-bottom-right-radius:6px}.message.bot .message-content{background:var(--glass);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom-left-radius:6px}.message-text{white-space:pre-wrap;word-wrap:break-word;font-size:.9375rem;line-height:1.6}.message-meta{display:flex;align-items:center;gap:.75rem;margin-top:.625rem;font-size:.75rem;color:var(--text-muted)}.message.user .message-meta{color:#ffffffb3}.typing-indicator{display:flex;gap:5px;padding:.5rem 0}.typing-indicator span{width:8px;height:8px;background:var(--primary);border-radius:50%;animation:typingBounce 1.4s infinite ease-in-out}.typing-indicator span:nth-child(1){animation-delay:-.32s}.typing-indicator span:nth-child(2){animation-delay:-.16s}@keyframes typingBounce{0%,80%,to{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}.input-area{padding:1rem 1.5rem 1.5rem;background:var(--glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:1px solid var(--glass-border)}.input-wrapper{display:flex;gap:.75rem;background:var(--surface);border-radius:100px;padding:.5rem .5rem .5rem 1.5rem;border:1px solid var(--glass-border);transition:all .3s ease}.input-wrapper:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow)}.input-wrapper input{flex:1;border:none;background:none;font-size:.9375rem;outline:none;color:var(--text)}.input-wrapper input::placeholder{color:var(--text-muted)}.send-button{width:44px;height:44px;border:none;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.send-button:hover:not(:disabled){transform:scale(1.08);box-shadow:var(--shadow-glow)}.send-button:disabled{opacity:.4;cursor:not-allowed;transform:none}.send-button svg{width:20px;height:20px}.disclaimer{text-align:center;font-size:.7rem;color:var(--text-muted);margin-top:.75rem;opacity:.7}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;align-items:center;justify-content:center;padding:1rem}.modal.show{display:flex}.modal-content{background:var(--bg-gradient-start);border:1px solid var(--glass-border);border-radius:20px;width:100%;max-width:500px;max-height:80vh;overflow:hidden;box-shadow:var(--shadow-md);animation:modalIn .3s cubic-bezier(.16,1,.3,1)}@keyframes modalIn{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;border-bottom:1px solid var(--glass-border)}.modal-header h3{font-size:1rem;font-weight:600}.modal-close{background:var(--surface);border:1px solid var(--glass-border);width:32px;height:32px;border-radius:10px;font-size:1.25rem;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.modal-close:hover{background:var(--error);border-color:var(--error);color:#fff}.modal-body{padding:1.5rem;overflow-y:auto;max-height:60vh}.error-message{background:#f43f5e26;border:1px solid rgba(244,63,94,.3);color:#fda4af;padding:1rem 1.25rem;border-radius:12px;font-size:.875rem;text-align:center;animation:shake .5s ease}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-5px)}40%,80%{transform:translate(5px)}}.typing-cursor{display:inline-block;width:2px;height:1.1em;background:var(--primary);margin-left:2px;vertical-align:text-bottom;animation:cursorBlink .8s infinite}@keyframes cursorBlink{0%,50%{opacity:1}51%,to{opacity:0}}@media(max-width:640px){.container{max-width:100%}.header,.chat-container{padding:1rem}.message{max-width:90%}.suggestion-chips{flex-direction:column}.chip{width:100%;text-align:center}.welcome-message{padding:2rem 1rem}.welcome-icon{width:64px;height:64px;border-radius:18px}.welcome-icon svg{width:32px;height:32px}.welcome-message h2{font-size:1.5rem}}