:root{--primary-color: #357010;--primary-hover: #397713;--shade-2: #57b41c;--shade-3: #224d0a;--tint-1: #defd96;--tint-2: #c6f2ac;--tint-3: #edfbe5;--bg-color: #fafafa;--text-color: #171717;--text-muted: #6b7280;--border-color: #e5e7eb;--user-bubble: var(--primary-color);--ai-bubble: transparent;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}body{font-family:Arial,Helvetica,sans-serif;font-size:14px;line-height:1.5;color:var(--text-color);background:transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#chat-root{display:flex;flex-direction:column;height:100%;border-radius:16px;overflow:hidden}#chat-header{display:flex;align-items:center;justify-content:space-between;padding:16px;background:var(--primary-color);color:#fff;flex-shrink:0}.header-content{display:flex;align-items:center;gap:12px}.header-logo{width:40px;height:40px;background:#fff3;border-radius:10px;display:flex;align-items:center;justify-content:center;padding:6px}.header-logo img{width:100%;height:100%;object-fit:contain;filter:brightness(0) invert(1)}.header-text h1{font-size:16px;font-weight:600;margin-bottom:2px}.header-text .status{font-size:12px;opacity:.9;display:flex;align-items:center;gap:4px}.header-text .status:before{content:"";width:8px;height:8px;background:#34d399;border-radius:50%}#close-btn{width:32px;height:32px;border:none;background:#ffffff1a;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}#close-btn:hover{background:#fff3}#close-btn svg{width:20px;height:20px;fill:#fff}#chat-messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:16px;background:#f4f4f5}.welcome-message{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 20px;flex:1;animation:fadeIn .6s ease-out}.welcome-icon{width:64px;height:64px;background:var(--primary-color);border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;padding:12px}.welcome-icon img{width:100%;height:100%;object-fit:contain;filter:brightness(0) invert(1)}.welcome-message h2{font-size:20px;font-weight:600;margin-bottom:8px;color:var(--text-color)}.welcome-message p{color:var(--text-muted);max-width:260px;font-size:15px}.message{display:flex;flex-direction:column;max-width:85%;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.message.user{align-self:flex-end}.message.assistant{align-self:flex-start;max-width:100%}.message-bubble{padding:12px 16px;border-radius:16px;word-wrap:break-word}.message.user .message-bubble{background:var(--user-bubble);color:#fff;border-radius:16px 4px 16px 16px}.message.assistant .message-bubble{background:transparent;color:var(--text-color);padding:8px 0;line-height:1.75}.message.assistant .message-bubble strong{font-weight:600;color:var(--text-color)}.message.assistant .message-bubble em{font-style:italic}.message.assistant .message-bubble a{color:var(--primary-color);text-decoration:underline;text-underline-offset:2px}.message.assistant .message-bubble a:hover{text-decoration:none}.message.assistant .message-bubble code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.875em;color:var(--primary-color);background:var(--tint-3);padding:2px 6px;border-radius:4px}.message.assistant .message-bubble ul,.message.assistant .message-bubble ol{margin:.75em 0;padding-left:1.5em}.message.assistant .message-bubble ul{list-style-type:disc}.message.assistant .message-bubble ol{list-style-type:decimal}.message.assistant .message-bubble li{margin:.375em 0;padding-left:.25em}.message.assistant .message-bubble li::marker{color:var(--primary-color)}.message.assistant .message-bubble br{display:block;content:"";margin-top:.75em}.message.assistant .message-bubble h2,.message.assistant .message-bubble h3,.message.assistant .message-bubble h4{font-weight:600;color:var(--text-color);margin:1em 0 .5em;line-height:1.3}.message.assistant .message-bubble h2{font-size:1.25em}.message.assistant .message-bubble h3{font-size:1.1em}.message.assistant .message-bubble h4{font-size:1em}.message.assistant .message-bubble h2:first-child,.message.assistant .message-bubble h3:first-child,.message.assistant .message-bubble h4:first-child{margin-top:0}.message-time{font-size:11px;color:var(--text-muted);margin-top:4px;padding:0 4px;opacity:0;transition:opacity .2s}.message:hover .message-time{opacity:1}.message.user .message-time{text-align:right}.thinking-indicator{display:flex;flex-direction:column;gap:8px;padding:12px 0;width:fit-content}.thinking-dots{display:flex;gap:6px}.thinking-dots span{width:8px;height:8px;background:var(--text-muted);border-radius:50%;animation:breathe 2s infinite ease-in-out}.thinking-dots span:nth-child(1){animation-delay:0s}.thinking-dots span:nth-child(2){animation-delay:.2s}.thinking-dots span:nth-child(3){animation-delay:.4s}@keyframes breathe{0%,to{transform:scale(.8);opacity:.5}50%{transform:scale(1);opacity:1}}.thinking-text{font-size:13px;color:var(--text-muted);animation:fadeInOut 3s infinite ease-in-out}@keyframes fadeInOut{0%,to{opacity:.5}50%{opacity:1}}#chat-input-area{padding:12px 16px 16px;background:var(--bg-color);flex-shrink:0}#chat-form{display:flex;flex-direction:column;gap:12px}.input-container{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border-color);border-radius:12px;transition:border-color .2s,box-shadow .2s;overflow:hidden}.input-container:focus-within{border-color:var(--primary-color);box-shadow:0 0 0 2px #35701026}.file-attachments{display:none;flex-wrap:wrap;gap:8px;padding:12px 12px 0}.file-attachments.has-files{display:flex}.file-chip{display:flex;align-items:center;gap:8px;padding:6px 10px;background:var(--bg-color);border-radius:8px;font-size:13px;color:var(--text-color);max-width:200px;animation:fadeIn .2s ease}.file-chip svg{width:16px;height:16px;fill:var(--text-muted);flex-shrink:0}.file-chip-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.file-chip-remove{width:18px;height:18px;border:none;background:transparent;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;color:var(--text-muted);transition:background .2s,color .2s;flex-shrink:0}.file-chip-remove:hover{background:#ef44441a;color:#ef4444}.file-chip-remove svg{width:14px;height:14px;fill:currentColor}#message-input{border:none;background:transparent;font-size:15px;line-height:1.5;resize:none;outline:none;max-height:100px;min-height:44px;padding:14px 16px 8px;font-family:inherit;color:var(--text-color)}#message-input::placeholder{color:var(--text-muted)}.input-actions{display:flex;align-items:center;justify-content:space-between;padding:6px 8px 8px}.input-actions-left{display:flex;align-items:center;gap:4px}.input-actions-left button{width:32px;height:32px;border:none;background:transparent;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;color:var(--text-muted)}.input-actions-left button:hover{background:var(--bg-color);color:var(--text-color)}.input-actions-left button svg{width:20px;height:20px;fill:currentColor}#send-btn{width:36px;height:36px;border:none;background:var(--primary-color);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,transform .1s,opacity .2s;flex-shrink:0}#send-btn:hover:not(:disabled){background:var(--primary-hover)}#send-btn:active:not(:disabled){transform:scale(.95)}#send-btn:disabled{background:var(--border-color);cursor:not-allowed}#send-btn svg{width:16px;height:16px;fill:#fff;margin-left:1px}.input-footer{font-size:11px;color:var(--text-muted);text-align:center;margin-top:12px;padding:0 8px;line-height:1.4}.input-footer a{color:var(--primary-color);text-decoration:underline}.input-footer a:hover{text-decoration:none}.message.streaming .message-bubble:after{content:"";display:inline-block;width:2px;height:1em;background:var(--primary-color);margin-left:2px;vertical-align:text-bottom;animation:blink .8s infinite}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}#chat-messages::-webkit-scrollbar{width:6px}#chat-messages::-webkit-scrollbar-track{background:transparent}#chat-messages::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}#chat-messages::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}@media (max-width: 480px){#chat-header{padding:12px}.header-logo{width:32px;height:32px;padding:4px}.welcome-message{padding:24px 16px}.welcome-icon{width:48px;height:48px;padding:8px}#chat-messages{padding:12px;gap:12px}#chat-input-area{padding:8px 12px 12px}.file-chip{max-width:160px}}
