:root{--bg:#0a0a0b;--panel:#111113;--panel2:#161619;--line:#28282d;--text:#f3f3f4;--muted:#92929b;--soft:#1b1b1f;--accent:#fff;--danger:#ff6b6b;--shadow:0 18px 60px rgba(0,0,0,.35)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}body{transition:background .35s,color .35s}body.light{--bg:#f5f5f4;--panel:#fff;--panel2:#f8f8f7;--line:#dededb;--text:#171717;--muted:#707070;--soft:#efefed;--accent:#111;--shadow:0 18px 50px rgba(0,0,0,.08)}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.topbar{height:64px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 22px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(18px);position:fixed;z-index:10;inset:0 0 auto}.brand{display:flex;align-items:center;gap:10px;font-weight:700}.brandmark,.auth-logo{width:34px;height:34px;border:1px solid var(--line);display:grid;place-items:center;border-radius:10px;font-size:12px}.top-actions{display:flex;gap:8px;align-items:center}.credits{padding:8px 12px;border:1px solid var(--line);border-radius:999px;font-size:13px;color:var(--muted)}.credits b{color:var(--text);margin-left:5px}.iconbtn{width:36px;height:36px;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:10px;cursor:pointer;display:grid;place-items:center;transition:background .25s,border-color .25s,transform .2s}.iconbtn:hover{background:var(--soft);transform:translateY(-1px)}.layout{display:grid;grid-template-columns:260px minmax(0,1fr);height:calc(100vh - 64px);min-height:0;padding-top:0;margin-top:64px;overflow:hidden}.sidebar{border-right:1px solid var(--line);padding:22px 14px;display:flex;flex-direction:column;gap:12px;background:var(--panel);height:100%;min-height:0;overflow:hidden}.side-title{font-size:12px;color:var(--muted);padding:0 10px;text-transform:uppercase;letter-spacing:.08em}.newchat{border:1px solid var(--line);background:var(--soft);color:var(--text);padding:11px;border-radius:12px;text-align:left;cursor:pointer}.conv-list{overflow-y:auto;overflow-x:hidden;flex:1;min-height:0;overscroll-behavior:contain;scrollbar-gutter:stable}.conv{padding:10px;border-radius:10px;color:var(--muted);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conv:hover,.conv.active{background:var(--soft);color:var(--text)}.side-user{border-top:1px solid var(--line);padding:14px 8px 0;display:flex;gap:10px;align-items:center}.avatar{width:32px;height:32px;border-radius:50%;background:var(--soft);display:grid;place-items:center;font-size:12px}.side-user small{display:block;color:var(--muted);margin-top:2px}.chat-main{display:flex;flex-direction:column;min-width:0;min-height:0;height:100%;overflow:hidden}.messages{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:32px max(22px,calc((100vw - 900px)/2));padding-bottom:180px}.empty-chat{text-align:center;margin:18vh auto 0;color:var(--muted)}.empty-symbol{font-size:32px;color:var(--text);margin-bottom:10px}.empty-chat h1{color:var(--text);font-size:30px;margin:0 0 8px}.message{display:flex;margin:20px 0;gap:12px}.message.user{justify-content:flex-end}.bubble{max-width:min(760px,86%);padding:12px 15px;border-radius:16px;border:1px solid var(--line);background:var(--panel);line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}.user .bubble{background:var(--soft)}.message .who{width:30px;height:30px;flex:0 0 30px;border:1px solid var(--line);border-radius:9px;display:grid;place-items:center;font-size:11px}.user .who{order:2}.msg-images{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.msg-images img{max-width:180px;max-height:180px;border-radius:10px;border:1px solid var(--line);object-fit:cover}.composer-wrap{position:fixed;left:260px;right:0;bottom:0;padding:16px max(22px,calc((100vw - 900px)/2));background:linear-gradient(transparent,var(--bg) 25%)}.composer{max-width:900px;margin:auto;border:1px solid var(--line);background:var(--panel);border-radius:18px;padding:8px;display:flex;align-items:flex-end;gap:7px;box-shadow:var(--shadow)}textarea{flex:1;resize:none;min-height:42px;max-height:192px;overflow-y:auto;border:0;background:transparent;color:var(--text);outline:0;padding:10px;max-height:180px;line-height:1.5}.attach,.toolbtn,.send{width:38px;height:38px;border-radius:11px;border:1px solid var(--line);background:var(--soft);color:var(--text);display:grid;place-items:center;cursor:pointer}.send{background:var(--accent);color:var(--bg);font-weight:800}.composer-tip{max-width:900px;margin:8px auto 0;text-align:center;font-size:11px;color:var(--muted)}.image-preview{max-width:900px;margin:0 auto 7px;display:flex;gap:8px;flex-wrap:wrap}.preview-item{position:relative}.preview-item img{width:64px;height:64px;object-fit:cover;border-radius:9px;border:1px solid var(--line)}.preview-item button{position:absolute;right:-5px;top:-5px;width:20px;height:20px;border:0;border-radius:50%;background:#111;color:#fff;cursor:pointer}.generated{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}.gen-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--soft)}.gen-card img{display:block;max-width:320px;width:100%;height:auto}.download{display:block;padding:8px 10px;font-size:12px;text-align:center}.auth{display:grid;place-items:center;padding:20px;min-height:100vh}.auth-card{width:min(430px,100%);border:1px solid var(--line);background:var(--panel);border-radius:24px;padding:32px;box-shadow:var(--shadow)}.auth-card h1{margin:18px 0 6px}.auth-card>p{color:var(--muted);margin:0 0 25px}.auth-card label{display:block;font-size:13px;color:var(--muted);margin:15px 0}.auth-card input{display:block;width:100%;margin-top:7px;border:1px solid var(--line);background:var(--soft);color:var(--text);border-radius:11px;padding:12px;outline:0}.fullbtn{width:100%;padding:13px;border:0;border-radius:11px;cursor:pointer}.primary{background:var(--accent);color:var(--bg);font-weight:700}.auth-foot{text-align:center;color:var(--muted);margin-top:18px;font-size:13px}.auth-foot a{color:var(--text)}.error{background:#38191b;color:#ffb4b4;border:1px solid #5c292d;padding:10px;border-radius:10px;font-size:13px}.typing:after{content:'▋';display:inline-block;margin-left:2px;animation:blink 1s infinite}.bubble.typing:after{content:none}@keyframes blink{50%{opacity:0}}@media(max-width:760px){.layout{grid-template-columns:1fr}.sidebar{display:none}.composer-wrap{left:0;padding:10px 12px}.messages{padding:22px 12px 150px}.bubble{max-width:90%}.topbar{padding:0 12px}.brand>span:last-child{display:none}.credits{font-size:12px}.empty-chat{margin-top:15vh}.empty-chat h1{font-size:24px}}


/* 移动端布局修复：禁止页面被顶部工具栏或内容意外撑宽，聊天图片和输入区允许在自身范围内收缩。 */
html,body{max-width:100%;overflow-x:hidden}
.topbar{min-width:0;max-width:100vw}
.top-actions{min-width:0;flex:0 0 auto}
@media(max-width:760px){
  .topbar{height:60px;padding:0 10px;gap:8px}
  .top-actions{gap:5px}
  .credits{padding:7px 9px;white-space:nowrap;max-width:42vw;overflow:hidden;text-overflow:ellipsis}
  .iconbtn{width:34px;height:34px;flex:0 0 34px}
  .composer-wrap{max-width:100vw;overflow:hidden}
  .composer{width:100%;max-width:100%;min-width:0}
  .composer textarea{min-width:0}
  .image-preview{max-width:100%;overflow:hidden}
  .generated{max-width:100%;overflow:hidden}
  .gen-card{max-width:100%}
  .gen-card img{max-width:min(320px,100%)}
}

/* 本次优化：代码块、复制按钮、重新生成、作图进度与对话删除按钮。 */
.msg-content{min-width:0}.plain-text{white-space:pre-wrap;overflow-wrap:anywhere}.code-wrap{margin:10px 0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--soft);white-space:normal}.code-head{height:36px;display:flex;align-items:center;justify-content:space-between;padding:0 9px;border-bottom:1px solid var(--line);font-size:11px;color:var(--muted)}.copy-code,.regen-btn{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:8px;padding:5px 8px;font-size:11px;cursor:pointer}.copy-code:hover,.regen-btn:hover{color:var(--text);background:var(--panel)}.code-wrap pre{margin:0;padding:12px 14px;max-height:460px;overflow:auto;white-space:pre;tab-size:2}.code-wrap code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:12px;line-height:1.6}.message-actions{display:flex;gap:7px;margin-top:9px;flex-wrap:wrap}.typing:after{content:'▋';display:inline-block;margin-left:2px;animation:blink .8s steps(1) infinite}@keyframes blink{50%{opacity:0}}.draw-progress{min-width:260px}.draw-status{display:flex;align-items:center;gap:8px;font-size:13px}.draw-status b{margin-left:auto;font-size:12px;color:var(--muted)}.spinner{width:14px;height:14px;border:2px solid var(--line);border-top-color:var(--text);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.draw-bar{height:5px;background:var(--soft);border-radius:99px;overflow:hidden;margin-top:10px}.draw-bar i{display:block;height:100%;background:var(--text);border-radius:99px;transition:width .3s ease}.conv{display:flex;align-items:center;gap:6px}.conv span{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis}.conv-delete{width:24px;height:24px;flex:0 0 24px;display:grid;place-items:center;border:0;background:transparent;color:var(--muted);border-radius:7px;opacity:0;cursor:pointer}.conv:hover .conv-delete,.conv:focus-within .conv-delete{opacity:1}.conv-delete:hover{background:var(--panel);color:var(--text)}
@media(max-width:760px){.code-wrap pre{max-height:320px}.message-actions{opacity:1}.conv-delete{opacity:1}}

/* 前台聊天区固定在视口内：侧栏和消息区各自滚动，避免整个页面跟随滚动。 */
.message-actions{align-items:center}
.download-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
@media(max-width:760px){.layout{display:block;height:calc(100vh - 60px);margin-top:60px;overflow:hidden}.chat-main{height:100%;overflow:hidden}.messages{min-height:0}.sidebar{display:none}.composer-wrap{max-height:260px}.composer textarea{max-height:192px;overflow-y:auto}}

/* 本次优化：操作按钮统一靠右；图片支持放大预览；手机端增加抽屉式对话列表。 */
.message-actions{justify-content:flex-end;width:100%}
.msg-images img{cursor:zoom-in}
.generated-inline-image{display:block;max-width:100%;height:auto;border-radius:10px;border:1px solid var(--line);cursor:zoom-in}
.image-lightbox[hidden]{display:none}
.image-lightbox{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.82);display:flex;align-items:center;justify-content:center;padding:28px}
.image-lightbox-backdrop{position:absolute;inset:0}
.image-lightbox img{position:relative;z-index:1;max-width:min(94vw,1400px);max-height:92vh;width:auto;height:auto;object-fit:contain;border-radius:12px;box-shadow:0 25px 100px rgba(0,0,0,.5)}
.image-lightbox-close{position:absolute;z-index:2;right:18px;top:18px;width:40px;height:40px;border:1px solid rgba(255,255,255,.3);border-radius:12px;background:rgba(0,0,0,.35);color:#fff;font-size:24px;cursor:pointer}
body.lightbox-open{overflow:hidden}
.mobile-conv-btn{display:none;width:34px;height:34px;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:10px;cursor:pointer;place-items:center;font-size:16px}
.mobile-conv-sheet[hidden]{display:none}
.mobile-conv-sheet{position:fixed;inset:0;z-index:90;pointer-events:none}
.mobile-conv-sheet.open{pointer-events:auto}
.mobile-conv-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45);opacity:0;transition:opacity .25s ease}
.mobile-conv-sheet.open .mobile-conv-backdrop{opacity:1}
.mobile-conv-panel{position:absolute;left:0;right:0;bottom:0;height:70vh;max-height:70vh;background:var(--panel);border:1px solid var(--line);border-bottom:0;border-radius:22px 22px 0 0;padding:14px 14px 18px;display:flex;flex-direction:column;transform:translateY(100%);transition:transform .28s ease;box-shadow:0 -20px 70px rgba(0,0,0,.3)}
.mobile-conv-sheet.open .mobile-conv-panel{transform:translateY(0)}
.mobile-conv-head{display:flex;align-items:center;justify-content:space-between;padding:2px 2px 12px;border-bottom:1px solid var(--line)}
.mobile-newchat{margin:12px 0}
.mobile-conv-list{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}
@media(max-width:760px){
  .mobile-conv-btn{display:grid}
  .brand{min-width:0}
  .brand>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .message-actions{justify-content:flex-end}
}

/* 模型切换按钮与弹层：保持桌面端紧凑，移动端也不会撑宽页面。 */
.model-btn{display:inline-flex;align-items:center;gap:6px;max-width:180px;min-height:36px;padding:0 11px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);cursor:pointer;white-space:nowrap;overflow:hidden}
.model-btn span{overflow:hidden;text-overflow:ellipsis}
.model-sheet[hidden]{display:none}.model-sheet{position:fixed;inset:0;z-index:80}.model-sheet.open .model-sheet-backdrop{opacity:1}.model-sheet-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.48);opacity:0;transition:opacity .2s}.model-panel{position:absolute;right:18px;top:74px;width:min(420px,calc(100vw - 24px));max-height:min(70vh,560px);overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:15px;box-shadow:0 24px 70px rgba(0,0,0,.28);transform:translateY(-8px);opacity:0;transition:.22s}.model-sheet.open .model-panel{transform:translateY(0);opacity:1}.model-panel-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}.model-panel-head small{display:block;color:var(--muted);font-size:12px;line-height:1.5;margin-top:4px}.model-list{display:grid;gap:8px}.model-option{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;width:100%;text-align:left;padding:12px 13px;border:1px solid var(--line);border-radius:12px;background:var(--panel2);color:var(--text);cursor:pointer}.model-option:hover,.model-option.active{background:var(--soft);border-color:var(--accent)}.model-option span{font-weight:600}.model-option small{color:var(--muted);font-size:11px;text-align:right;line-height:1.4}
@media(max-width:760px){.model-btn{max-width:120px;padding:0 8px}.model-panel{top:auto;right:12px;bottom:12px;max-height:70vh}.model-sheet.open .model-panel{transform:translateY(0)}}

/* 本次优化：模型面板桌面端固定在左上角，手机端固定在顶部偏上位置；移除模型按钮下拉符号。 */
.model-panel{left:18px;right:auto;top:74px}
@media(max-width:760px){.model-panel{left:12px;right:12px;top:72px;bottom:auto;width:auto;max-height:65vh}}

/* 本次优化：对话列表增加悬停编辑按钮，移动端始终显示；按钮只负责改名，不触发切换对话。 */
.conv{position:relative}
.conv-title{min-width:0;flex:1}
.conv-edit{width:24px;height:24px;flex:0 0 24px;display:grid;place-items:center;border:0;background:transparent;color:var(--muted);border-radius:7px;opacity:0;cursor:pointer}
.conv:hover .conv-edit,.conv:focus-within .conv-edit{opacity:1}
.conv-edit:hover{background:var(--panel);color:var(--text)}
@media(max-width:760px){.conv-edit{opacity:1}}

/* 对话名称修改弹窗：与模型弹层保持同一套视觉语言，并适配手机。 */
.rename-sheet[hidden]{display:none}
.rename-sheet{position:fixed;inset:0;z-index:110}
.rename-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5);opacity:0;transition:opacity .2s}
.rename-sheet.open .rename-backdrop{opacity:1}
.rename-panel{position:absolute;left:50%;top:50%;width:min(420px,calc(100vw - 28px));transform:translate(-50%,-46%);opacity:0;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:0 25px 80px rgba(0,0,0,.3);transition:.2s}
.rename-sheet.open .rename-panel{transform:translate(-50%,-50%);opacity:1}
.rename-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.rename-input{width:100%;box-sizing:border-box;border:1px solid var(--line);background:var(--soft);color:var(--text);border-radius:11px;padding:12px 13px;outline:0;font-size:14px}
.rename-input:focus{border-color:var(--accent)}
.rename-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
.rename-cancel,.rename-save{border:1px solid var(--line);border-radius:10px;padding:9px 14px;cursor:pointer;background:var(--soft);color:var(--text)}
.rename-save{background:var(--accent);color:var(--bg);border-color:var(--accent);font-weight:700}
.rename-cancel:hover{background:var(--panel2)}
@media(max-width:760px){.rename-panel{top:25%;transform:translate(-50%,-44%)}.rename-sheet.open .rename-panel{transform:translate(-50%,-50%)}}

/* 附件选择菜单：从左下角附件按钮上方弹出，不影响聊天输入框宽度。 */
.attach-wrap{position:relative;display:flex;align-items:center;flex:0 0 auto}.attach-menu[hidden]{display:none}.attach-menu{position:absolute;left:0;bottom:48px;z-index:35;display:grid;gap:5px;width:92px;padding:6px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 45px rgba(0,0,0,.25)}.attach-menu button{border:0;background:transparent;color:var(--text);text-align:left;padding:9px 10px;border-radius:8px;cursor:pointer;font-size:13px}.attach-menu button:hover{background:var(--soft)}
.msg-files{display:grid;gap:6px;margin-top:10px}.msg-file{display:inline-flex;align-items:center;width:max-content;max-width:100%;padding:7px 10px;border:1px solid var(--line);border-radius:9px;background:var(--soft);color:var(--text);font-size:12px;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.msg-file:hover{text-decoration:none;background:var(--panel2)}
.confirm-sheet[hidden]{display:none}.confirm-sheet{position:fixed;inset:0;z-index:120}.confirm-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.52);opacity:0;transition:opacity .18s}.confirm-sheet.open .confirm-backdrop{opacity:1}.confirm-panel{position:absolute;left:50%;top:50%;width:min(420px,calc(100vw - 28px));transform:translate(-50%,-46%);opacity:0;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:17px;box-shadow:0 25px 80px rgba(0,0,0,.35);transition:.18s}.confirm-sheet.open .confirm-panel{transform:translate(-50%,-50%);opacity:1}.confirm-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.confirm-panel p{margin:14px 0 0;color:var(--muted);font-size:13px;line-height:1.6}.confirm-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.confirm-actions button{border:1px solid var(--line);background:var(--soft);color:var(--text);border-radius:10px;padding:9px 14px;cursor:pointer}.confirm-actions .confirm-danger{background:#3b191c;color:#ffb0b0;border-color:#5c292d}.preview-file{display:flex;align-items:center;gap:8px;max-width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:9px;background:var(--soft);font-size:12px}.preview-file span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preview-file button{width:22px;height:22px;flex:0 0 22px;border:0;background:transparent;color:var(--muted);cursor:pointer;border-radius:6px}.preview-file button:hover{background:var(--panel2);color:var(--text)}
@media(max-width:760px){.attach-menu{bottom:46px;left:-2px;width:90px}.confirm-panel{top:30%}}
.front-toast{position:fixed;left:50%;top:78px;z-index:140;max-width:calc(100vw - 28px);padding:10px 15px;border:1px solid var(--line);border-radius:11px;background:var(--panel);color:var(--text);box-shadow:0 16px 50px rgba(0,0,0,.28);opacity:0;transform:translate(-50%,-8px);transition:.22s;pointer-events:none;font-size:13px}.front-toast.show{opacity:1;transform:translate(-50%,0)}

/* v9：附件菜单始终位于聊天输入框上方，避免移动端被 composer-wrap 裁切。 */
.composer-wrap{overflow:visible!important;z-index:40}
.attach-wrap{z-index:45}
.attach-menu{bottom:calc(100% + 8px)!important;top:auto!important;z-index:200}
.message-loader{height:34px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:12px;position:sticky;top:0;z-index:5;pointer-events:none}

/* 用户头像入口与账户面板。 */
.profile-avatar-btn{width:36px;height:36px;flex:0 0 36px;border:1px solid var(--line);background:var(--soft);color:var(--text);border-radius:50%;display:grid;place-items:center;cursor:pointer;overflow:hidden;padding:0;font-weight:700;font-size:13px}
.profile-avatar-btn img,.profile-avatar-large img{width:100%;height:100%;object-fit:cover;display:block}
.profile-avatar-large{width:92px;height:92px;border-radius:50%;border:1px solid var(--line);background:var(--soft);color:var(--text);display:grid;place-items:center;overflow:hidden;padding:0;font-size:30px;font-weight:700;cursor:pointer}
.profile-sheet[hidden],.password-sheet[hidden]{display:none}
.profile-sheet,.password-sheet{position:fixed;inset:0;z-index:130;pointer-events:none}
.profile-sheet.open,.password-sheet.open{pointer-events:auto}
.profile-backdrop,.password-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5);opacity:0;transition:opacity .22s}
.profile-sheet.open .profile-backdrop,.password-sheet.open .password-backdrop{opacity:1}
.profile-panel{position:absolute;left:0;right:0;bottom:0;height:70vh;max-height:70vh;background:var(--panel);border:1px solid var(--line);border-bottom:0;border-radius:22px 22px 0 0;box-shadow:0 -24px 80px rgba(0,0,0,.3);transform:translateY(100%);transition:transform .25s ease;display:flex;flex-direction:column}
.profile-sheet.open .profile-panel{transform:translateY(0)}
.profile-head{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;border-bottom:1px solid var(--line);flex:0 0 auto}
.profile-body{width:min(620px,100%);margin:0 auto;padding:22px 20px 30px;overflow:auto}
.profile-avatar-wrap{text-align:center;margin-bottom:18px}.profile-avatar-wrap .profile-avatar-large{margin:auto}.profile-avatar-tip{font-size:11px;color:var(--muted);margin-top:7px}
.profile-field{display:block;font-size:12px;color:var(--muted)}
.profile-field input,.password-form input{display:block;width:100%;box-sizing:border-box;margin-top:7px;padding:11px 12px;border:1px solid var(--line);border-radius:11px;background:var(--soft);color:var(--text);outline:0}
.profile-account{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:8px;margin-top:14px}.profile-account>div{border:1px solid var(--line);background:var(--soft);border-radius:12px;padding:11px}.profile-account span{display:block;color:var(--muted);font-size:11px;margin-bottom:4px}.profile-account b{font-size:13px;word-break:break-word}
.profile-toggle-row{display:flex;justify-content:space-between;gap:15px;align-items:center;border:1px solid var(--line);background:var(--soft);border-radius:12px;padding:12px;margin-top:12px}.profile-toggle-row b{font-size:13px}.profile-toggle-row small{display:block;color:var(--muted);font-size:11px;line-height:1.5;margin-top:3px}.switch{position:relative;width:44px;height:24px;flex:0 0 44px}.switch input{opacity:0;width:0;height:0}.switch span{position:absolute;inset:0;background:#777;border-radius:99px;cursor:pointer;transition:.2s}.switch span:before{content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s}.switch input:checked+span{background:var(--accent)}.switch input:checked+span:before{transform:translateX(20px)}
.profile-actions{display:grid;gap:8px;margin-top:18px}.profile-actions button{border:1px solid var(--line);background:var(--soft);color:var(--text);border-radius:11px;padding:11px;cursor:pointer}.profile-actions .profile-logout{background:#3b191c;color:#ffb0b0;border-color:#5c292d}
.recharge-sheet[hidden]{display:none}.recharge-sheet{position:fixed;inset:0;z-index:240;pointer-events:none}.recharge-sheet.open{pointer-events:auto}.recharge-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.52);opacity:0;transition:opacity .18s}.recharge-sheet.open .recharge-backdrop{opacity:1}.recharge-panel{position:absolute;left:50%;top:50%;width:min(430px,calc(100vw - 28px));transform:translate(-50%,-46%);opacity:0;background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:0 25px 80px rgba(0,0,0,.35);transition:.18s}.recharge-sheet.open .recharge-panel{transform:translate(-50%,-50%);opacity:1}.recharge-form{padding:17px}.recharge-form label{display:block;color:var(--muted);font-size:12px}.recharge-form input{display:block;width:100%;box-sizing:border-box;margin-top:7px;padding:11px 12px;border:1px solid var(--line);border-radius:11px;background:var(--soft);color:var(--text);outline:0;text-transform:uppercase}.recharge-form input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(47,128,237,.1)}.recharge-tip{display:block;color:var(--muted);font-size:11px;line-height:1.5;margin-top:8px}.recharge-form .rename-actions{margin-top:14px}.recharge-form .rename-save:disabled{opacity:.6;cursor:not-allowed}.password-panel{position:absolute;left:50%;top:50%;width:min(430px,calc(100vw - 28px));transform:translate(-50%,-46%);opacity:0;background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:0 25px 80px rgba(0,0,0,.35);transition:.18s}.password-sheet.open .password-panel{transform:translate(-50%,-50%);opacity:1}.password-form{padding:17px}.password-form label{display:block;color:var(--muted);font-size:12px;margin-bottom:13px}
@media(max-width:760px){.profile-panel{height:70vh;max-height:70vh}.profile-body{padding:18px 14px 28px}.profile-account{grid-template-columns:1fr}.profile-avatar-btn{width:34px;height:34px;flex-basis:36px}.attach-menu{left:-2px!important;bottom:calc(100% + 8px)!important}}
/* 确认弹窗必须位于账户面板之上，避免退出登录确认框被底部卡片遮住。 */
.confirm-sheet{z-index:220}


/* v10：用户头像图片覆盖在头像容器内，确保始终完整显示；无头像时显示昵称首字。 */
.profile-avatar-btn,.profile-avatar-large{position:relative;isolation:isolate}
.profile-avatar-btn span,.profile-avatar-large span{position:relative;z-index:1;display:grid;place-items:center;width:100%;height:100%}
.profile-avatar-btn img,.profile-avatar-large img{position:absolute;inset:0;z-index:2;width:100%;height:100%;object-fit:cover;border-radius:inherit}

/* v10：不可编辑资料采用只读卡片样式；积分数据增加轻量视觉效果。 */
.profile-readonly{background:var(--soft);border-color:var(--line)}
.profile-stat{position:relative;overflow:hidden;background:var(--soft);border-color:var(--line);transition:transform .18s,box-shadow .18s}
.profile-stat:hover{transform:translateY(-1px)}
.profile-stat-credit{background:linear-gradient(135deg,rgba(72,180,255,.12),var(--soft));box-shadow:inset 0 0 0 1px rgba(72,180,255,.08)}
.profile-stat-credit{display:flex;align-items:center;justify-content:space-between;gap:10px}.profile-stat-main{min-width:0}.profile-recharge-btn{flex:0 0 auto;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));background:var(--panel);color:var(--text);border-radius:9px;padding:7px 11px;font-size:12px;font-weight:700;cursor:pointer;transition:.18s}.profile-recharge-btn:hover{transform:translateY(-1px);border-color:var(--accent);box-shadow:0 6px 18px rgba(0,0,0,.12)}.profile-recharge-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.profile-stat-credit b{font-size:16px;letter-spacing:.2px}
.profile-stat-spent{background:linear-gradient(135deg,rgba(171,124,255,.11),var(--soft));box-shadow:inset 0 0 0 1px rgba(171,124,255,.07)}
.profile-stat-spent b{font-size:16px}

/* v10：电脑端账户面板为悬浮四圆角卡片，从底部上浮；手机端保持大尺寸底部面板。 */
@media(min-width:761px){
  .profile-panel{left:50%;right:auto;bottom:22px;width:min(430px,calc(100vw - 48px));height:auto;max-height:80vh;border-bottom:1px solid var(--line);border-radius:22px;transform:translateY(calc(100% + 30px));box-shadow:0 24px 80px rgba(0,0,0,.34)}
  .profile-sheet.open .profile-panel{transform:translate(-50%,0)}
  .profile-body{max-height:calc(80vh - 64px);box-sizing:border-box}
}

@media(max-width:760px){
  .profile-panel{height:80vh;max-height:80vh;border-radius:22px 22px 0 0}
  .profile-body{padding:18px 14px 28px}
}

/* v11：修复 hidden 属性被 display:block 覆盖导致无头像时出现破损图片图标。 */
.profile-avatar-btn img[hidden],.profile-avatar-large img[hidden],#sideAvatarImg[hidden],.who-avatar-img[hidden]{display:none!important}
.profile-avatar-btn img,.profile-avatar-large img,#sideAvatarImg{object-fit:cover;object-position:center;border-radius:inherit}
.side-user{cursor:pointer;border-radius:12px;transition:background .2s;padding-left:8px;padding-right:8px}
.side-user:hover{background:var(--soft)}
.avatar{position:relative;overflow:hidden}
.avatar span{display:grid;place-items:center;width:100%;height:100%}
.avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.who{position:relative;overflow:hidden}
.who-avatar-text,.who-avatar-img{width:100%;height:100%;display:grid;place-items:center}
.who-avatar-img{position:absolute;inset:0;object-fit:cover;border-radius:9px}
.who-avatar-text[hidden]{display:none!important}
.profile-account{grid-template-columns:1.2fr 1fr 1fr}
.profile-stat-credit b{color:#2dbb73}.profile-stat-spent b{color:#e35b5b}
.send{background:#2f80ed!important;color:#fff!important;border-color:#2f80ed!important}
@media(max-width:760px){
  .profile-account{grid-template-columns:1fr 1fr;}
  .profile-account .profile-readonly{grid-column:1/-1}
}

/* 附件菜单：统一从输入框上方淡入淡出，避免手机端被视口裁切。 */
.attach-wrap{position:relative;display:flex;align-items:flex-end}
.attach-menu{position:absolute;left:0;bottom:calc(100% + 9px);z-index:40;min-width:132px;padding:6px;border:1px solid var(--line);border-radius:13px;background:var(--panel);box-shadow:0 16px 45px rgba(0,0,0,.24);opacity:1;transform:translateY(0);transition:opacity .18s ease,transform .18s ease;transform-origin:bottom left}
.attach-menu[hidden]{display:block!important;opacity:0;pointer-events:none;transform:translateY(7px)}
.attach-menu button{display:flex;align-items:center;gap:9px;width:100%;padding:9px 11px;border:0;border-radius:9px;background:transparent;color:var(--text);text-align:left;cursor:pointer;font-size:13px}
.attach-menu button:hover{background:var(--soft)}
@media(max-width:760px){.attach-menu{left:0;bottom:calc(100% + 10px);max-width:calc(100vw - 24px)}}

/* 桌面端拖拽上传：拖入聊天窗口但尚未松开时显示半透明蒙层提示。 */
.chat-main{position:relative}
.chat-drop-overlay{position:absolute;inset:0;z-index:35;display:none;align-items:center;justify-content:center;background:rgba(10,10,11,.62);backdrop-filter:blur(4px);border:2px dashed rgba(255,255,255,.3);pointer-events:none}
.chat-drop-overlay.show{display:flex}
.chat-drop-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:22px 28px;border:1px solid var(--line);border-radius:18px;background:var(--panel);box-shadow:0 20px 70px rgba(0,0,0,.28);text-align:center}
.chat-drop-card b{font-size:17px;color:var(--text)}
.chat-drop-card span{font-size:12px;color:var(--muted)}
@media(max-width:760px){.chat-drop-overlay{display:none!important}}
/* 修复移动端图片预览删除按钮被裁切，以及 X 字符未严格居中的问题。 */
.image-preview{padding:5px 7px 3px;overflow:visible!important}
.preview-item{position:relative;margin-right:2px;margin-bottom:2px}
.preview-item button{position:absolute;right:-7px;top:-7px;width:22px;height:22px;min-width:22px;padding:0;margin:0;border:1px solid rgba(255,255,255,.35);border-radius:50%;background:#111;color:#fff;display:flex;align-items:center;justify-content:center;line-height:1;font-size:15px;font-family:Arial,sans-serif;z-index:3;box-shadow:0 2px 8px rgba(0,0,0,.22)}
@media(max-width:760px){.image-preview{max-width:none;width:calc(100% + 14px);margin-left:-7px;padding:7px 10px 5px;overflow:visible!important}.preview-item button{right:-6px;top:-6px}}

/* v16：前台整体视觉微调，保持原有结构与功能，仅提升层次、反馈和现代感。 */
.topbar{box-shadow:0 1px 0 rgba(255,255,255,.025),0 8px 30px rgba(0,0,0,.08)}
.sidebar{background:linear-gradient(180deg,var(--panel),color-mix(in srgb,var(--panel) 88%,var(--bg)));}
.newchat{background:linear-gradient(180deg,var(--soft),color-mix(in srgb,var(--soft) 75%,var(--panel)));font-weight:650;transition:transform .2s,box-shadow .2s,border-color .2s}
.newchat:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,0,0,.12);border-color:color-mix(in srgb,var(--line) 60%,var(--text))}
.conv{transition:background .18s,color .18s,transform .18s;padding:10px 11px}
.conv:hover{transform:translateX(2px)}
.conv.active{box-shadow:inset 3px 0 0 var(--text)}
.bubble{box-shadow:0 6px 22px rgba(0,0,0,.045);transition:border-color .18s,box-shadow .18s}
.user .bubble{box-shadow:none}
.composer-wrap{padding-top:20px}
.composer{box-shadow:0 16px 48px rgba(0,0,0,.16),0 0 0 1px rgba(255,255,255,.015);backdrop-filter:blur(18px);transition:border-color .2s,box-shadow .2s}
.composer:focus-within{border-color:color-mix(in srgb,var(--line) 55%,var(--text));box-shadow:0 18px 55px rgba(0,0,0,.2),0 0 0 3px color-mix(in srgb,var(--text) 7%,transparent)}
.attach,.toolbtn,.send{transition:transform .18s,background .18s,border-color .18s,box-shadow .18s}
.attach:hover,.toolbtn:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--line) 55%,var(--text))}
.send:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(0,0,0,.18)}
.empty-chat{animation:emptyChatIn .28s ease-out both}
@keyframes emptyChatIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.preview-item button{box-sizing:border-box;overflow:visible;text-align:center;text-indent:0;transform:none}
.preview-item button:hover{transform:scale(1.06)}
@media(max-width:760px){
  .topbar{height:60px;padding:0 10px}
  .layout{margin-top:60px;height:calc(100vh - 60px)}
  .top-actions{gap:6px}
  .iconbtn,.profile-avatar-btn{width:36px;height:36px}
  .credits{padding:7px 9px}
  .messages{padding-top:20px}
  .composer-wrap{padding:10px 10px 12px}
  .composer{border-radius:16px;padding:7px}
  .bubble{border-radius:15px;padding:11px 13px}
  .preview-item button{right:-8px;top:-8px;width:23px;height:23px;min-width:23px;font-size:15px}
}


/* v16：前台整体视觉微调，保持原有结构与功能，仅提升层次、反馈和现代感。 */
.topbar{box-shadow:0 1px 0 rgba(255,255,255,.025),0 8px 30px rgba(0,0,0,.08)}
.sidebar{background:linear-gradient(180deg,var(--panel),color-mix(in srgb,var(--panel) 88%,var(--bg)))}
.newchat{background:linear-gradient(180deg,var(--soft),color-mix(in srgb,var(--soft) 75%,var(--panel)));font-weight:650;transition:transform .2s,box-shadow .2s,border-color .2s}
.newchat:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,0,0,.12);border-color:color-mix(in srgb,var(--line) 60%,var(--text))}
.conv{transition:background .18s,color .18s,transform .18s;padding:10px 11px}
.conv:hover{transform:translateX(2px)}
.conv.active{box-shadow:inset 3px 0 0 var(--text)}
.bubble{box-shadow:0 6px 22px rgba(0,0,0,.045);transition:border-color .18s,box-shadow .18s}
.user .bubble{box-shadow:none}
.composer-wrap{padding-top:20px}
.composer{box-shadow:0 16px 48px rgba(0,0,0,.16),0 0 0 1px rgba(255,255,255,.015);backdrop-filter:blur(18px);transition:border-color .2s,box-shadow .2s}
.composer:focus-within{border-color:color-mix(in srgb,var(--line) 55%,var(--text));box-shadow:0 18px 55px rgba(0,0,0,.2),0 0 0 3px color-mix(in srgb,var(--text) 7%,transparent)}
.attach,.toolbtn,.send{transition:transform .18s,background .18s,border-color .18s,box-shadow .18s}
.attach:hover,.toolbtn:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--line) 55%,var(--text))}
.send:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(0,0,0,.18)}
.empty-chat{animation:emptyChatIn .28s ease-out both}
@keyframes emptyChatIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.preview-item button{box-sizing:border-box;overflow:visible;text-align:center;text-indent:0;transform:none}
.preview-item button:hover{transform:scale(1.06)}
@media(max-width:760px){
  .topbar{height:60px;padding:0 10px}
  .layout{margin-top:60px;height:calc(100vh - 60px)}
  .top-actions{gap:6px}
  .iconbtn,.profile-avatar-btn{width:36px;height:36px}
  .credits{padding:7px 9px}
  .messages{padding-top:20px}
  .composer-wrap{padding:10px 10px 12px}
  .composer{border-radius:16px;padding:7px}
  .bubble{border-radius:15px;padding:11px 13px}
  .preview-item button{right:-8px;top:-8px;width:23px;height:23px;min-width:23px;font-size:15px}
}

/* v17：输入区按钮与输入框布局优化，按钮垂直居中，文本框多行时仍保持底部对齐。 */
.composer{align-items:flex-end;position:relative}.composer .attach-wrap,.composer .toolbtn,.composer .send{align-self:center;flex:0 0 auto}.composer textarea{align-self:flex-end}.composer-tip{display:none}

@media(max-width:430px){.profile-stat-credit{align-items:center}.profile-recharge-btn{padding:7px 10px}}


/* V19：输入框高度增长时，附件、作图、发送按钮始终固定在输入框底部。 */
.composer{position:relative;align-items:stretch;padding-left:53px;padding-right:99px;min-height:54px}
.composer textarea{width:100%;align-self:stretch;margin:0;min-height:42px}
.composer .attach-wrap,.composer .toolbtn,.composer .send{position:absolute;bottom:8px;align-self:auto}
.composer .attach-wrap{left:8px}
.composer .toolbtn{right:53px}
.composer .send{right:8px}

/* V19：电脑端账户面板水平居中，账户信息排列与手机端一致。 */
@media(min-width:761px){
  .profile-panel{left:50%;right:auto;bottom:22px;width:min(430px,calc(100vw - 48px));height:auto;max-height:80vh;border-bottom:1px solid var(--line);border-radius:22px;transform:translate(-50%,calc(100% + 30px));box-shadow:0 24px 80px rgba(0,0,0,.34)}
  .profile-sheet.open .profile-panel{transform:translate(-50%,0)}
}
.profile-account{grid-template-columns:1fr 1fr}
.profile-account .profile-readonly{grid-column:1/-1}
@media(max-width:760px){
  .profile-account{grid-template-columns:1fr 1fr}
  .profile-account .profile-readonly{grid-column:1/-1}
  .profile-stat-credit,.profile-stat-spent{min-width:0}
}

/* V20：电脑端账户信息与手机端一致：账号独占一行，积分与今日消耗并排。 */
@media(min-width:761px){.profile-account{grid-template-columns:1fr 1fr}.profile-account .profile-readonly{grid-column:1/-1}}
/* V21：电脑端账户信息与手机端保持一致。 */
/* V20：输入框变高时，附件、作图、发送按钮始终固定在 composer 底部。 */
.composer{position:relative}.composer .attach-wrap,.composer .toolbtn,.composer .send{position:absolute;bottom:8px;align-self:auto}.composer .attach-wrap{left:8px}.composer .toolbtn{right:53px}.composer .send{right:8px}.composer textarea{align-self:stretch}
