:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;color:#252525;background:#f8f8fa}*{box-sizing:border-box}html,body{height:100%;overflow:hidden}body{margin:0}.app-shell{display:flex;height:100vh;min-width:800px;min-height:0}.sidebar{width:240px;background:#171717;color:#eee;display:flex;flex-direction:column;padding:8px;min-height:0}.new-chat{height:38px;border:1px solid #404040;border-radius:8px;background:#292929;color:#fff;text-align:left;padding:0 14px;font-size:14px;cursor:pointer}.new-chat span{font-size:20px;margin-right:7px}.sidebar-title{font-size:12px;color:#8d8d8d;padding:21px 9px 8px}.conversation-list{overflow:auto;flex:1;min-height:0}.conversation{display:flex;align-items:center;gap:8px;border-radius:6px;padding:9px 10px;font-size:12px;color:#c6c6c6;cursor:pointer}.conversation:hover,.conversation.active{background:#2a2a2a;color:white}.conversation span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.conversation button{color:#888;background:none;border:0;cursor:pointer}.sidebar-bottom{border-top:1px solid #333;padding:12px 5px 5px}.sidebar-bottom label{display:block;font-size:11px;color:#9a9a9a;margin-bottom:6px}.sidebar-bottom select{width:100%;background:#272727;border:1px solid #4c4c4c;color:#eee;border-radius:6px;padding:7px;font-size:12px}.connection{font-size:11px;color:#999;margin-top:12px;display:flex;align-items:center;gap:6px}.connection i{width:7px;height:7px;border-radius:50%;background:#e3a735}.connection i.ok{background:#42c67a}.connection i.bad{background:#e25c5c}.main-panel{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}.topbar{height:38px;flex:none;border-bottom:1px solid #e8e8e8;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 27px}.brand{font-weight:600;font-size:15px}.brand-mark{color:#7359ff;font-size:25px;vertical-align:-2px;margin-right:7px}.topbar a{color:#fa634e;text-decoration:none;font-size:12px}.topbar b{background:#ff4f87;color:#fff;border-radius:5px;padding:2px 5px;font-size:9px;margin-left:5px}.chat-page{display:flex;flex-direction:column;flex:1;min-height:0;max-width:1000px;width:100%;margin:auto;padding:28px 30px 24px;overflow:hidden}.welcome{text-align:center}.welcome h1{font-size:25px;margin:0 0 7px}.welcome p{font-size:13px;color:#8a8a8a;margin:0}.quick-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin-top:28px}.quick-actions button{background:#fff;border:1px solid #e7e7e7;border-radius:18px;padding:8px 14px;color:#555;cursor:pointer;font-size:12px}.messages{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:28px 10px 18px;scroll-behavior:auto;overscroll-behavior:contain}.message{display:flex;width:100%;margin:14px 0;line-height:1.7;font-size:14px}.message.user{justify-content:flex-end}.bubble{max-width:78%;padding:10px 15px;border-radius:13px;white-space:pre-wrap;word-break:break-word}.user .bubble{background:#7359ff;color:white;border-bottom-right-radius:4px}.assistant .bubble{background:#fff;border:1px solid #eee;border-bottom-left-radius:4px}.message-image{display:block;max-width:min(360px,70vw);max-height:280px;border-radius:8px;margin:4px 0;object-fit:contain}.typing-dots{display:inline-flex;gap:3px;margin-left:4px;vertical-align:middle}.typing-dots i{width:4px;height:4px;border-radius:50%;background:#999;animation:typing-dot 1s infinite ease-in-out}.typing-dots i:nth-child(2){animation-delay:.15s}.typing-dots i:nth-child(3){animation-delay:.3s}@keyframes typing-dot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}.attachment-list{display:flex;flex-wrap:wrap;gap:6px;margin:-4px 0 8px}.attachment-item{display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:5px 8px;border:1px solid #e4e4e8;border-radius:7px;background:#fafafd;color:#666;font-size:12px}.attachment-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attachment-item button{border:0;background:transparent;color:#999;cursor:pointer;font-size:16px;line-height:1}.attach{position:absolute;left:11px;bottom:8px;width:30px;height:30px;border:0;background:transparent;color:#777;font-size:16px;cursor:pointer}.composer{flex:none;position:relative;background:#fff;border:1px solid #dedede;border-radius:14px;box-shadow:0 3px 18px #0000000c;padding:14px 57px 25px 17px}.composer textarea{display:block;width:100%;border:0;resize:none;outline:0;font:inherit;font-size:14px;min-height:24px;max-height:140px}.send{position:absolute;right:11px;top:10px;width:38px;height:38px;border:0;border-radius:11px;background:#7758ff;color:white;font-size:19px;cursor:pointer}.send:disabled{opacity:.5}.composer-hint{position:absolute;bottom:5px;left:48px;color:#aaa;font-size:10px}.hidden{display:none}@media(max-width:700px){.sidebar{width:190px}.chat-page{padding-left:14px;padding-right:14px}}
/* Composer refinements */
.attachment-list{display:flex;flex-wrap:wrap;gap:8px;margin:-2px 0 10px;padding:0 2px}
.attachment-item{display:inline-flex;align-items:center;gap:7px;max-width:min(250px,100%);min-height:34px;padding:4px 7px 4px 5px;border:1px solid #e1e1e8;border-radius:10px;background:#fafafe;color:#454552;font-size:12px;box-shadow:0 2px 7px #20203008}
.attachment-item>img{width:25px;height:25px;flex:none;border-radius:6px;object-fit:cover;background:#f0f0f5}
.attachment-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attachment-icon{display:grid;place-items:center;width:25px;height:25px;flex:none;border-radius:6px;background:#eeeaff;color:#7258ef}
.attachment-icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.attachment-item button{display:grid;place-items:center;width:22px;height:22px;padding:0;border:0;border-radius:6px;background:transparent;color:#92929e;cursor:pointer}
.attachment-item button:hover{background:#ececf2;color:#4c4c58}
.attachment-item button svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.attach,.send{display:grid;place-items:center}
.attach{position:absolute;left:12px;bottom:9px;width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:#797987;cursor:pointer}
.attach:hover{background:#f0eff7;color:#684de4}
.attach:focus-visible,.send:focus-visible,.attachment-item button:focus-visible{outline:2px solid #a99bff;outline-offset:2px}
.attach svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transform:rotate(-10deg)}
.composer{border-color:#dcdce3;border-radius:16px;box-shadow:0 5px 22px #20203010;padding:14px 61px 28px 17px;transition:border-color .2s,box-shadow .2s}
.composer:focus-within{border-color:#b9adff;box-shadow:0 6px 24px #6755d51a,0 0 0 3px #7758ff0d}
.composer textarea{color:#292934}
.composer textarea::placeholder{color:#8c8c98}
.send{border-radius:12px;background:#7659f5;box-shadow:0 4px 10px #7659f52e;transition:background .2s,transform .2s,box-shadow .2s}
.send:hover{background:#6547e9;transform:translateY(-1px);box-shadow:0 6px 13px #7659f545}
.send:active{transform:translateY(0)}
.send:disabled{cursor:not-allowed;box-shadow:none}
.send svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transform:translate(-1px,1px)}
.composer-hint{bottom:6px;left:49px;color:#a0a0aa}
/* Brand and upload button refinements */
.brand{display:flex;align-items:center;gap:7px}
.brand-logo{width:22px;height:22px;display:block;filter:drop-shadow(0 2px 4px #7359ff24)}
.brand-mark{display:none}
.attach{left:14px;bottom:12px;width:32px;height:32px;border:1px solid #ececf4;border-radius:10px;background:#f8f8fc;color:#6c6c78;box-shadow:0 2px 7px #2020300a}
.attach:hover{background:#eeeaff;border-color:#d9d2ff;color:#624be5;box-shadow:0 4px 11px #7359ff18}
.attach svg{width:18px;height:18px;transform:rotate(-12deg)}
.composer{padding-left:18px}
.composer-hint{left:55px}
/* Keep upload and attachments in a separate toolbar above the composer. */
.attachment-toolbar{display:flex;align-items:center;gap:8px;min-height:0;margin:0 0 8px}
.attachment-list{flex:1;min-width:0;width:auto;margin:0;padding:0 2px}
.attachment-list.hidden{display:none}
.attachment-toolbar .attach{position:static;flex:none}
.composer{padding-top:14px}
.composer textarea{padding-left:0}
.composer-hint{left:17px}