:root{color-scheme:light;--bg:#f3f6f5;--panel:#fff;--text:#203432;--muted:#7b8b89;--line:#e6eeeb;--brand:#0f766e;--app-height:100dvh}
*{box-sizing:border-box} [hidden]{display:none!important}
html,body{margin:0;height:100%;overflow:hidden}body{background:var(--bg);color:var(--text);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
button,textarea{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.45;cursor:wait}button:focus-visible,summary:focus-visible,.upload-button:focus-visible{outline:3px solid #86d4c4;outline-offset:3px}
.shell{width:min(900px,calc(100% - 48px));height:calc(var(--app-height) - 48px);margin:24px auto}
.workspace{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:var(--panel);box-shadow:0 12px 60px #153b3010}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:22px 26px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-mark{display:grid;place-items:center;flex-shrink:0;width:42px;height:42px;border-radius:13px;background:var(--brand);color:white;font-size:20px;font-weight:700}
h1{margin:0;font-size:23px;font-weight:700;letter-spacing:.02em}.subtitle{margin:6px 0 0;font-size:12px;color:var(--muted)}.status{display:inline-flex;align-items:center;gap:5px;margin-left:8px;color:var(--brand)}.status:before{content:"";width:5px;height:5px;background:currentColor;border-radius:50%}.status.offline{color:#b16f36}
.top-actions{display:flex;gap:7px;flex-shrink:0}.secondary-button{border:1px solid var(--line);min-height:42px;padding:0 12px;border-radius:11px;background:white;color:#4d6360;font-size:13px;font-weight:500}.secondary-button:hover{background:#f3f8f6}
.chat{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:26px;scroll-padding-bottom:12px}.welcome{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:18px 0 40px}.welcome-mark{display:grid;place-items:center;width:62px;height:62px;border-radius:20px;background:#e8f5ef;color:var(--brand);font-size:28px;font-weight:600;margin-bottom:22px}.welcome h2{margin:0;font-size:25px;letter-spacing:.02em}.welcome p{margin:12px 0 25px;color:var(--muted);font-size:14px;line-height:1.8}.suggestions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.suggestions button{min-height:42px;padding:0 15px;border:1px solid var(--line);border-radius:22px;background:white;color:#51716b;font-size:13px}.suggestions button:hover{border-color:#9cc6bb;background:#f4fbf8}
.message{display:flex;align-items:flex-start;gap:9px;margin-bottom:22px}.avatar{flex:0 0 28px;width:28px;height:28px;display:grid;place-items:center;margin-top:4px;border-radius:10px;background:#edf6f2;color:var(--brand);font-size:12px;font-weight:600}.bubble{min-width:0;max-width:86%;padding:12px 16px;border-radius:4px 17px 17px 17px;background:#f1f6f4;font-size:15px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}.message.user{justify-content:flex-end}.user .avatar{display:none}.user .bubble{border-radius:17px 4px 17px 17px;background:var(--brand);color:white}.typing-bubble{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}.typing-dots{display:inline-flex;gap:4px}.typing-dots i{height:4px;width:4px;background:currentColor;border-radius:50%;animation:pulse 1.2s infinite}.typing-dots i:nth-child(2){animation-delay:.15s}.typing-dots i:nth-child(3){animation-delay:.3s}@keyframes pulse{0%,60%,100%{opacity:.3}30%{opacity:1}}
.knowledge{border-top:1px solid var(--line);background:#fbfdfc}.knowledge summary{padding:12px 26px;font-size:12px;color:#6c817b;cursor:pointer;min-height:42px;list-style:none}.knowledge summary:after{content:"＋";float:right}.knowledge[open] summary:after{content:"−"}.knowledge summary::-webkit-details-marker{display:none}.knowledge summary span{margin-left:6px;color:#97a9a2}.sources{max-height:min(150px,calc(var(--app-height) * .2));overflow-y:auto;padding:0 26px 12px}.source{padding:9px 0;border-top:1px solid var(--line);font-size:12px;line-height:1.6}.source strong{font-weight:500;overflow-wrap:anywhere}.source small,.source p{display:block;color:var(--muted);font-size:12px}.human{color:#a36835;font-size:13px}.muted{color:var(--muted);font-size:13px}.knowledge>button{margin:0 26px 12px}
.composer{padding:14px 26px 17px;background:#fff;border-top:1px solid var(--line)}.compose-row{display:flex;align-items:flex-end;gap:8px;padding:6px;background:#f7faf8;border:1px solid #dce8e2;border-radius:16px}.compose-row:focus-within{border-color:#6faf9f;box-shadow:0 0 0 2px #0f766e0a}.upload-button{display:grid;place-items:center;flex:0 0 42px;height:44px;color:#6e8b83;cursor:pointer;border-radius:10px;touch-action:manipulation}.upload-button:hover{background:#eaf3ef}.upload-button input{display:none}textarea{min-width:0;flex:1;display:block;width:100%;border:0;outline:none;background:transparent;resize:none;min-height:44px;max-height:120px;padding:11px 5px;font-size:16px;line-height:22px;color:var(--text)}textarea::placeholder{color:#9caea7}.send-button{height:44px;min-width:64px;flex-shrink:0;border:0;border-radius:11px;background:var(--brand);color:white;font-size:14px;font-weight:600;padding:0 15px}.send-button:hover{background:#0b665e}.input-hint{margin:9px 0 0;text-align:center;font-size:11px;color:#97a8a0}
.image-preview{margin-bottom:10px}.preview-images{display:flex;gap:10px;overflow-x:auto;padding:5px 5px 2px}.preview-item{position:relative;flex:0 0 64px;width:64px;height:64px}.preview-item img{width:100%;height:100%;object-fit:cover;border-radius:10px;border:1px solid var(--line)}.icon-button{position:absolute;top:-5px;right:-5px;display:grid;place-items:center;width:28px;height:28px;border:0;border-radius:50%;background:#375c50;color:white;padding:0;font-size:19px}
@media(max-width:640px){body{background:white}.shell{width:100%;height:var(--app-height);margin:0}.workspace{border:0;border-radius:0;box-shadow:none}.topbar{padding:calc(14px + env(safe-area-inset-top)) 14px 13px;gap:8px}.brand{gap:9px}.brand-mark{width:33px;height:33px;border-radius:10px;font-size:16px}h1{font-size:18px;letter-spacing:0}.subtitle{font-size:11px;margin-top:4px}.status{margin-left:5px}.top-actions{gap:4px}.secondary-button{padding:0 8px;min-height:42px;font-size:12px;border-color:transparent;background:#f5f8f6}.chat{padding:20px 14px}.welcome{padding-bottom:22px}.welcome h2{font-size:23px}.welcome p{font-size:13px}.suggestions{gap:7px}.suggestions button{padding:0 12px;font-size:12px}.message{gap:7px;margin-bottom:18px}.avatar{width:25px;height:25px;flex-basis:25px;font-size:11px}.bubble{max-width:calc(100% - 32px);padding:10px 13px;font-size:15px;line-height:1.75}.knowledge summary{padding:11px 16px}.sources{padding:0 16px 8px;max-height:min(110px,calc(var(--app-height) * .16))}.composer{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}.compose-row{gap:4px;padding:5px;border-radius:15px}.upload-button{flex-basis:36px}.send-button{min-width:56px;padding:0 11px}.input-hint{font-size:10px;margin-top:7px}}
@media(max-width:350px){.brand-mark{display:none}.topbar{padding-left:12px;padding-right:12px}h1{font-size:17px}.suggestions button{padding:0 9px}}
@media(prefers-reduced-motion:reduce){.typing-dots i{animation:none}}