:root{--bg-gradient-start: #0f172a;--bg-gradient-end: #1e1b4b;--text-primary: #e2e8f0;--text-secondary: #94a3b8;--accent-color: #818cf8;--message-user-bg: #4f46e5;--message-bot-bg: #1e293b;--input-bg: rgba(30, 41, 59, .7)}body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,sans-serif;background:linear-gradient(135deg,var(--bg-gradient-start),var(--bg-gradient-end));color:var(--text-primary);min-height:100vh;display:flex;justify-content:center;align-items:center;overflow:hidden}#root{width:100%;height:100vh;display:flex;flex-direction:column}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#334155;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#475569}.app-container{display:flex;flex-direction:column;height:100vh;max-width:800px;margin:0 auto;width:100%;position:relative;background:#0f172a66;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-left:1px solid rgba(255,255,255,.05);border-right:1px solid rgba(255,255,255,.05)}.header{padding:20px;text-align:center;border-bottom:1px solid rgba(255,255,255,.05);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10}.header h1{margin:0;font-weight:300;letter-spacing:2px;color:var(--text-primary);opacity:.9}.header p{margin:5px 0 0;font-size:.85rem;color:var(--text-secondary)}.chat-window{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:15px}.message{display:flex;max-width:80%;animation:fadeIn .3s ease-out}.message.user{align-self:flex-end;justify-content:flex-end}.message.model{align-self:flex-start;justify-content:flex-start}.message-content{padding:12px 18px;border-radius:18px;font-size:1rem;line-height:1.5;box-shadow:0 4px 6px #0000001a}.message.user .message-content{background:var(--message-user-bg);color:#fff;border-bottom-right-radius:4px}.message.model .message-content{background:var(--message-bot-bg);color:var(--text-primary);border-bottom-left-radius:4px;border:1px solid rgba(255,255,255,.05)}.input-area{padding:20px;border-top:1px solid rgba(255,255,255,.05);display:flex;gap:10px;align-items:center;background:#0f172acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}textarea{flex:1;background:var(--input-bg);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:12px 20px;color:#fff;font-family:inherit;font-size:1rem;resize:none;outline:none;transition:border-color .2s;max-height:100px}textarea:focus{border-color:var(--accent-color)}button{background:var(--accent-color);border:none;border-radius:50%;width:45px;height:45px;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:transform .2s,opacity .2s;color:#fff}button:hover:not(:disabled){transform:scale(1.05)}button:disabled{opacity:.5;cursor:not-allowed;background:#4b5563}.send-icon{width:20px;height:20px}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.typing-indicator span{display:inline-block;font-size:24px;line-height:10px;animation:bounce 1.4s infinite ease-in-out both}.typing-indicator span:nth-child(1){animation-delay:-.32s}.typing-indicator span:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}