:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#0f172a;font-synthesizes:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background:#f8fafc}#root{width:100%;height:100vh;display:flex;justify-content:center;align-items:center}.chat-container{width:100%;max-width:800px;height:90vh;background:#fff;border:1px solid #e2e8f0;border-radius:24px;box-shadow:0 25px 50px -12px #0000001a;display:flex;flex-direction:column;overflow:hidden;position:relative}.chat-header{padding:24px;background:#fff;border-bottom:1px solid #e2e8f0;display:flex;align-items:center;gap:16px}.avatar-container{width:64px;height:64px;border-radius:50%;background:#fff;box-shadow:0 4px 12px #0000001a;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.avatar-img{width:44px;height:44px;object-fit:contain}.header-text h1{margin:0;font-size:1.25rem;font-weight:600;color:#0f172a;letter-spacing:-.025em}.header-text p{margin:0;font-size:.875rem;color:#64748b}.messages-area{flex:1;padding:24px;overflow-y:auto;display:flex;flex-direction:column;gap:16px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.1) transparent}.messages-area::-webkit-scrollbar{width:6px}.messages-area::-webkit-scrollbar-thumb{background-color:#ffffff1a;border-radius:10px}.message-wrapper{display:flex;flex-direction:column;max-width:80%;animation:fadeIn .3s ease-out forwards}.message-wrapper.user{align-self:flex-end}.message-wrapper.bot{align-self:flex-start}.message-bubble{padding:16px 20px;border-radius:20px;font-size:1rem;line-height:1.6}.message-bubble p{margin-top:0;margin-bottom:.75rem}.message-bubble p:last-child{margin-bottom:0}.message-bubble ul,.message-bubble ol{margin-top:0;margin-bottom:.75rem;padding-left:1.5rem}.message-bubble li{margin-bottom:.25rem}.user .message-bubble{background:linear-gradient(135deg,#3b82f6,#6366f1);color:#fff;border-bottom-right-radius:4px;box-shadow:0 4px 12px #3b82f640}.bot .message-bubble{background:#f1f5f9;border:1px solid #e2e8f0;color:#0f172a;border-bottom-left-radius:4px}.input-area{padding:20px 24px;background:#fff;border-top:1px solid #e2e8f0;display:flex;align-items:flex-end;gap:12px}.input-field{flex:1;background:#f8fafc;border:1px solid #e2e8f0;border-radius:24px;padding:14px 24px;color:#0f172a;font-size:1rem;font-family:inherit;transition:all .2s ease;outline:none;resize:none;min-height:24px;max-height:120px;overflow-y:auto;line-height:1.5}.input-field:focus{background:#fff;border-color:#6366f180;box-shadow:0 0 0 2px #6366f133}.input-field::placeholder{color:#94a3b8}.send-button{background:linear-gradient(135deg,#3b82f6,#8b5cf6);border:none;border-radius:50%;width:52px;height:52px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;transition:transform .2s ease,box-shadow .2s ease;box-shadow:0 4px 12px #8b5cf64d}.send-button:hover{transform:scale(1.05);box-shadow:0 6px 16px #8b5cf666}.send-button:active{transform:scale(.95)}.send-button:disabled{opacity:.5;cursor:not-allowed;transform:none}.typing-indicator{display:flex;gap:4px;padding:8px 0}.typing-dot{width:8px;height:8px;background:#94a3b8;border-radius:50%;animation:bounce 1.4s infinite ease-in-out both}.typing-dot:nth-child(1){animation-delay:-.32s}.typing-dot:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(0);opacity:.5}40%{transform:scale(1);opacity:1}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 850px){.chat-container{height:100vh;border-radius:0;border:none}}