:root{--primary-color: #353261ff;--secondary-color: #9d50bb;--user-message: #6e48aa;--bot-message: #f1f1f1;--text-dark: #333;--text-light: #777;--bg-color: #a1a1a1ff;--chat-bg: #ffffffff;--shadow: 0 4px 20px rgba(0, 0, 0, .08)}*{box-sizing:border-box;margin:0;padding:0;font-family:Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}body{background-color:var(--bg-color)}.app{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:20px}.chat-window{width:100%;max-width:500px;height:80vh;background:var(--chat-bg);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow)}.chat-header{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:#fff;padding:16px 20px;display:flex;justify-content:space-between;align-items:center}.header-content{display:flex;align-items:center;gap:12px}.bot-avatar{width:40px;height:40px;background:#fff3;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:20px}.bot-avatar.small{width:32px;height:32px;font-size:16px;margin-right:10px;flex-shrink:0}.header-text h2{font-size:18px;font-weight:600;margin-bottom:2px}.header-text p{font-size:12px;opacity:.8}.header-actions .icon-button{background:none;border:none;color:#fff;font-size:20px;cursor:pointer}.message-container{flex:1;padding:20px;overflow-y:auto;background-color:var(--chat-bg);display:flex;flex-direction:column;gap:15px}.message{display:flex;max-width:80%;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message.user{align-self:flex-end;flex-direction:row-reverse}.message.bot{align-self:flex-start}.message-content{display:flex;flex-direction:column}.message-text{padding:12px 16px;border-radius:18px;line-height:1.4;font-size:15px;position:relative}.message.user .message-text{background:var(--user-message);color:#fff;border-bottom-right-radius:4px}.message.bot .message-text{background:var(--bot-message);color:var(--text-dark);border-bottom-left-radius:4px}.message-time{font-size:11px;color:var(--text-light);margin-top:4px;padding:0 8px}.message.user .message-time{text-align:right}.message.bot .message-time{text-align:left}.typing-indicator{display:flex;padding:12px 16px;gap:4px}.typing-indicator span{width:8px;height:8px;background:#ccc;border-radius:50%;display:inline-block;animation:bounce 1.4s infinite ease-in-out}.typing-indicator span:nth-child(1){animation-delay:0s}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}@keyframes bounce{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-5px)}}.input-container{padding:12px;border-top:1px solid #eee;background:#fff}.input-box{display:flex;background:#f5f5f5;border-radius:24px;padding:8px 12px;align-items:center}.input-box input{flex:1;border:none;background:transparent;padding:8px 12px;font-size:15px;outline:none}.send-button{width:36px;height:36px;border-radius:50%;background:var(--primary-color);color:#fff;border:none;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:all .2s}.send-button:hover{background:var(--secondary-color);transform:scale(1.05)}.send-button:active{transform:scale(.95)}.input-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}.action-button{background:none;border:none;color:var(--primary-color);font-size:20px;cursor:pointer;opacity:.7;transition:opacity .2s}.action-button:hover{opacity:1}.message-container::-webkit-scrollbar{width:6px}.message-container::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.message-container::-webkit-scrollbar-thumb{background:#ccc;border-radius:10px}.message-container::-webkit-scrollbar-thumb:hover{background:#aaa}