:root{--bg:#f7f4ee;--paper:#fffdf8;--ink:#2b2621;--ink2:#7a6f63;--line:#e6ddd0;
  --brand:#6b4a2f;--brand2:#8a6239;--side:#f2ece1;--user:#eef3e7;--warn:#7a5a00}
/* hidden 属性必须永远生效：任何自己的 display 都不得盖过它 */
[hidden]{display:none !important}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--ink);
  font:16px/1.75 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif}
button{font:inherit;cursor:pointer}
input,textarea{font:inherit}

/* 登录 */
.login{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg);padding:20px;z-index:50}
.login .card{width:min(360px,100%);background:var(--paper);border:1px solid var(--line);border-radius:12px;
  padding:26px 24px;box-shadow:0 6px 24px rgba(107,74,47,.08)}
.login .brand{font-family:"Songti SC","SimSun",serif;font-size:22px;font-weight:700;color:var(--brand);letter-spacing:.05em}
.login .brand span{margin-left:8px;font-size:12px;font-weight:400;letter-spacing:.18em;color:var(--ink2)}
.login .sub{margin:8px 0 18px;font-size:13px;color:var(--ink2)}
.login label{display:block;margin-bottom:12px;font-size:13px;color:var(--ink2)}
.login input{display:block;width:100%;margin-top:5px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}
.login input:focus{outline:2px solid #f3e2b8;border-color:var(--brand2)}
.login button{width:100%;margin-top:6px;padding:11px;border:1px solid var(--brand);border-radius:8px;background:var(--brand);color:#fff}
.login .err{margin-top:12px;padding:8px 10px;border-left:3px solid #b23b2e;background:#fbeceb;color:#7d2318;font-size:13px}

/* 布局 */
.app{display:flex;height:100%}
.side{width:270px;flex:none;background:var(--side);border-right:1px solid var(--line);display:flex;flex-direction:column}
.side-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line)}
.me{font-size:13px;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-top button{border:1px solid var(--line);background:none;border-radius:6px;color:var(--ink2);font-size:12px;padding:2px 8px}
.new{margin:10px 12px;padding:9px;border:1px dashed #cdbfa9;border-radius:8px;background:transparent;color:var(--brand)}
.new:hover{background:#efe6d6;border-color:var(--brand2)}
.side-list{flex:1;overflow:auto;padding:0 8px 8px}
.item{display:flex;align-items:center;gap:6px;padding:9px 10px;border-radius:8px;cursor:pointer;margin-bottom:3px}
.item:hover{background:#e9dfcc}
.item.on{background:#e3d7bf}
.item .t{flex:1;min-width:0;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.item .d{flex:none;border:0;background:none;color:#b3a797;opacity:0;padding:0 4px}
.item:hover .d{opacity:1}
.side-foot{padding:10px 14px;border-top:1px solid var(--line);font-size:12px;color:#9a8f83}

.chat{flex:1;min-width:0;display:flex;flex-direction:column;position:relative}
.chat-top{display:flex;align-items:center;gap:10px;padding:12px 18px;border-bottom:1px solid var(--line);
  background:rgba(247,244,238,.94);backdrop-filter:blur(6px)}
.chat-top .title{font-family:"Songti SC","SimSun",serif;font-size:17px;color:var(--brand);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.menu{display:none;border:1px solid var(--line);background:var(--paper);border-radius:6px;padding:2px 9px;color:var(--brand)}

.stream{flex:1;overflow:auto;padding:22px 18px 120px;scroll-behavior:smooth}
.msg{max-width:780px;margin:0 auto 18px;display:flex;gap:10px}
.msg .who{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:12px;background:#efe6d6;color:var(--brand)}
.msg.user .who{background:#e3ecd9;color:#4f6b28}
.bubble{padding:11px 15px;border-radius:10px;background:var(--paper);border:1px solid var(--line);
  white-space:pre-wrap;word-break:break-word}
.msg.user .bubble{background:var(--user);border-color:#dbe6cf}
.bubble strong{color:var(--brand)}
.attach{margin-top:7px}
.attach summary{cursor:pointer;font-size:13px;color:var(--ink2);list-style:none}
.attach summary::-webkit-details-marker{display:none}
.attach summary::before{content:"▸ ";color:var(--brand2)}
.attach[open] summary::before{content:"▾ "}
.attach .refs{margin-top:7px;font-size:13px;color:var(--ink2)}
.attach .refs span{display:inline-block;margin:0 8px 6px 0;padding:2px 8px;border:1px solid var(--line);border-radius:20px;background:#faf6ec}
.attach pre{margin:7px 0 0;padding:9px 11px;background:#faf6ec;border:1px solid var(--line);border-radius:6px;
  font:13px/1.7 inherit;white-space:pre-wrap;word-break:break-word;max-height:240px;overflow:auto}
.gate{margin-top:7px;font-size:13px;padding:7px 11px;border-radius:6px;background:#fdf6e3;border-left:3px solid #d9a441;color:var(--warn)}
.gate.bad{background:#fbeceb;border-left-color:#b23b2e;color:#7d2318}
.working{display:flex;align-items:center;gap:9px;color:var(--ink2);font-size:14px}
.spin{width:14px;height:14px;border:2px solid #e0d3bb;border-top-color:var(--brand2);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.secs{font-variant-numeric:tabular-nums}

.composer{position:sticky;bottom:0;padding:10px 18px 6px;background:linear-gradient(rgba(247,244,238,0),var(--bg) 40%);
  display:flex;gap:9px;align-items:flex-end;max-width:820px;margin:0 auto;width:100%}
.composer textarea{flex:1;resize:none;max-height:170px;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:var(--paper)}
.composer textarea:focus{outline:2px solid #f3e2b8;border-color:var(--brand2)}
.composer button{padding:11px 18px;border:1px solid var(--brand);border-radius:10px;background:var(--brand);color:#fff}
.composer button:disabled{opacity:.5;cursor:not-allowed}
.hint{text-align:center;font-size:12px;color:#9a8f83;padding:0 18px 10px}

.welcome{max-width:660px;margin:6vh auto 0;text-align:center}
.welcome h1{font-family:"Songti SC","SimSun",serif;font-size:25px;color:var(--brand);margin:0 0 6px}
.welcome p{color:var(--ink2);margin:0 0 16px}
.chips{display:flex;gap:9px;flex-wrap:wrap;justify-content:center}
.chips button{padding:8px 13px;border:1px solid var(--line);border-radius:20px;background:var(--paper);color:var(--brand)}
.chips button:hover{border-color:var(--brand2);background:#faf6ec}

@media (max-width:820px){
  .side{position:fixed;top:0;bottom:0;left:0;z-index:40;transform:translateX(-100%);transition:transform .25s;box-shadow:8px 0 24px rgba(0,0,0,.08)}
  .side.show{transform:none}
  .menu{display:block}
  .stream{padding:16px 14px 120px}
  .composer{padding:8px 14px 4px}
}