:root { color-scheme: light; --bg:#fff; --side:#f8f8f8; --text:#202123; --muted:#71747a; --line:#e9e9e9; --hover:#ebebeb; --bubble:#f4f4f4; --accent:#202123; --on-accent:#fff; --danger:#b42330; }
:root[data-theme=dark] { color-scheme: dark; --bg:#212121; --side:#171717; --text:#f5f5f5; --muted:#aaa; --line:#393939; --hover:#2b2b2b; --bubble:#303030; --accent:#f5f5f5; --on-accent:#202123; --danger:#ff777e; }
* { box-sizing:border-box; }
html, body { margin:0; height:100%; }
body { font:14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; color:var(--text); background:var(--bg); }
button,input,textarea,select { font:inherit; }
button { cursor:pointer; }
.app { display:flex; width:100%; height:100dvh; overflow:hidden; }
.sidebar { width:265px; flex:none; background:var(--side); display:flex; flex-direction:column; padding:16px 12px 10px; border-right:1px solid var(--line); }
.sidebar-top,.brand { display:flex; align-items:center; gap:10px; }
.sidebar-top { justify-content:space-between; padding:0 8px 16px; }
.sidebar-collapse { margin-left:auto; flex:none; display:grid; place-items:center; }
.sidebar-collapsed .sidebar { display:none; }
.brand { font-size:16px; font-weight:700; letter-spacing:-.02em; }
.brand-mark { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; color:#fff; background:#222; font-size:14px; }
.new-chat,.search-box { width:100%; display:flex; align-items:center; gap:10px; border:0; border-radius:9px; padding:10px 12px; color:var(--text); background:transparent; text-align:left; }
.new-chat { font-weight:600; }
.new-chat:hover,.session:hover,.account-button:hover,.account-menu>*:hover { background:var(--hover); }
.new-chat span { font-size:22px; line-height:16px; font-weight:400; }
.search-box { color:var(--muted); margin:2px 0 18px; }
.search-box input { min-width:0; width:100%; border:0; outline:0; background:transparent; color:var(--text); }
.sidebar-label { color:var(--muted); font-size:12px; padding:4px 12px 8px; }
.sessions { overflow:auto; flex:1; min-height:0; }
.session { display:flex; align-items:center; gap:4px; border-radius:9px; min-height:38px; padding:2px 6px 2px 12px; }
.session.active { background:var(--hover); }
.session-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; background:none; border:0; color:var(--text); text-align:left; padding:7px 0; }
.session-running { color:var(--muted); font-size:11px; }
.session-delete { border:0; background:none; color:var(--muted); padding:4px 7px; border-radius:6px; visibility:hidden; }
.session:hover .session-delete,.session:focus-within .session-delete { visibility:visible; }
.session-delete:hover { color:var(--danger); background:var(--bg); }
.session-empty { color:var(--muted); font-size:13px; padding:6px 12px; }
.sidebar-bottom { position:relative; border-top:1px solid var(--line); padding-top:10px; }
.account-button { display:flex; align-items:center; gap:10px; width:100%; border:0; background:transparent; color:var(--text); padding:7px 8px; border-radius:9px; text-align:left; }
.avatar { display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:#746bd9; color:white; font-weight:700; }
.account-chevron { margin-left:auto; color:var(--muted); }
.account-menu { position:absolute; bottom:52px; left:0; right:0; padding:5px; background:var(--bg); border:1px solid var(--line); border-radius:10px; box-shadow:0 8px 30px #0002; }
.account-menu[hidden],.account-menu > [hidden] { display:none; }
.account-menu>* { display:block; width:100%; color:var(--text); text-decoration:none; background:none; border:0; text-align:left; border-radius:7px; padding:9px 10px; }
.main { min-width:0; flex:1; display:flex; flex-direction:column; }
.desktop-chat-header { flex:none; min-height:58px; display:flex; align-items:center; gap:12px; padding:8px 24px; border-bottom:1px solid var(--line); }
.desktop-session-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; font-size:15px; }
.desktop-sidebar-toggle { display:none; flex:none; }
.sidebar-collapsed .desktop-sidebar-toggle,.preview-open .desktop-sidebar-toggle { display:grid; place-items:center; }
.preview-open .desktop-chat-header { padding:8px 12px; gap:8px; }
.composer-spacer { flex:1; }
.text-button,.icon-button { border:0; background:transparent; color:var(--muted); padding:8px; border-radius:8px; }
.text-button[hidden] { display:none; }
.icon-button { width:34px; height:34px; font-size:18px; }
.text-button:hover,.icon-button:hover { color:var(--text); background:var(--hover); }
.mobile-close { display:none; }
.messages { flex:1; overflow-y:auto; min-height:0; padding:24px max(24px,calc((100% - 800px)/2)) 12px; display:flex; flex-direction:column; gap:26px; }
.welcome { margin:auto; width:100%; text-align:center; }
.welcome-mark { width:46px; height:46px; margin:0 auto 14px; border-radius:14px; display:grid; place-items:center; background:#222; color:white; font-size:20px; font-weight:700; }
.welcome h1 { font-size:28px; letter-spacing:-.03em; margin:0 0 6px; }
.welcome p { color:var(--muted); margin:0 0 28px; }
.suggestions { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; max-width:550px; margin:0 auto; }
.suggestions button { text-align:left; background:var(--bg); border:1px solid var(--line); border-radius:12px; color:var(--text); padding:13px 15px; }
.suggestions button:hover { border-color:var(--muted); }
.message { width:100%; min-width:0; }
.message.user { display:flex; justify-content:flex-end; }
.user-body { display:flex; flex-direction:column; align-items:flex-end; max-width:min(82%,650px); min-width:0; }
.message.assistant { display:flex; align-items:flex-start; gap:12px; }
.assistant-avatar { display:block; flex:none; width:26px; height:26px; margin:2px 2px 0; background:var(--text); -webkit-mask:url('../assets/chatgpt-symbol.png') center/contain no-repeat; mask:url('../assets/chatgpt-symbol.png') center/contain no-repeat; }
.assistant-body { flex:1; min-width:0; }
.user-content { background:var(--bubble); border-radius:20px; padding:10px 16px; max-width:100%; white-space:pre-wrap; overflow-wrap:anywhere; }
.user-files { font-size:12px; color:var(--muted); margin-top:7px; }
.assistant-content { overflow-wrap:anywhere; font-size:15px; line-height:1.75; }
.assistant-content p { margin:0 0 14px; }
.assistant-content > :first-child { margin-top:0; }
.assistant-content > :last-child { margin-bottom:0; }
.assistant-content ul,.assistant-content ol { margin:8px 0 14px; padding-left:24px; }
.assistant-content li { margin:4px 0; }
.assistant-content blockquote { margin:10px 0; padding:6px 13px; border-left:3px solid var(--muted); color:var(--muted); background:var(--side); border-radius:0 8px 8px 0; }
.assistant-content a { color:var(--text); text-decoration:underline; text-decoration-color:var(--muted); text-underline-offset:2px; }
.assistant-content code.inline { padding:1px 5px; border-radius:5px; background:var(--side); border:1px solid var(--line); font-size:.88em; }
.assistant-content img { max-width:100%; height:auto; border-radius:8px; }
.assistant-content h1,.assistant-content h2,.assistant-content h3 { line-height:1.3; margin:22px 0 10px; }
.assistant-content h1 { font-size:22px; }.assistant-content h2 { font-size:19px; }.assistant-content h3 { font-size:16px; }
.assistant-content pre { max-width:100%; overflow:auto; background:var(--side); border:1px solid var(--line); padding:14px; border-radius:10px; }
.assistant-content pre.code-fence code { font:12.5px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace; white-space:pre; }
.assistant-content table { display:block; max-width:100%; overflow:auto; border-collapse:collapse; }.assistant-content th,.assistant-content td { border:1px solid var(--line); padding:6px 10px; }
/* R148：正文按自身结构调整信息层级，简单问答保持普通段落。 */
.assistant-content h2 { padding-bottom:7px; border-bottom:1px solid var(--line); }
.assistant-content h3 { color:var(--text); }
.assistant-content .answer-highlight-heading { border-bottom:0; margin-bottom:7px; }
.assistant-content .answer-highlight-heading + p { padding:12px 15px; border-left:3px solid var(--accent); border-radius:0 9px 9px 0; background:var(--side); }
.assistant-content .answer-steps { padding-left:0; list-style:none; counter-reset:answer-step; display:grid; gap:9px; }
.assistant-content .answer-steps > li { counter-increment:answer-step; position:relative; min-height:42px; margin:0; padding:9px 12px 9px 43px; border:1px solid var(--line); border-radius:10px; background:var(--side); }
.assistant-content .answer-steps > li::before { content:counter(answer-step); position:absolute; left:12px; top:9px; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; background:var(--accent); color:var(--on-accent); font-size:11px; font-weight:700; }
.assistant-content pre.code-fence[data-lang]:not([data-lang=""])::before { content:attr(data-lang); display:block; margin:-4px 0 10px; color:var(--muted); font:600 11px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace; text-transform:uppercase; }
.assistant-content table.md-table { width:max-content; min-width:min(100%,280px); margin:12px 0 16px; border:1px solid var(--line); border-radius:10px; border-collapse:separate; border-spacing:0; font-size:13px; line-height:1.5; }
.assistant-content table.md-table th,.assistant-content table.md-table td { border:0; border-bottom:1px solid var(--line); padding:9px 12px; text-align:left; }
.assistant-content table.md-table th { background:var(--side); font-weight:650; }
.assistant-content table.md-table tr:last-child td { border-bottom:0; }
.answer-chart { margin:14px 0 8px; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--side); }
.answer-chart figcaption { margin-bottom:12px; font-size:13px; font-weight:650; }
.answer-chart-bars { display:grid; gap:9px; }
.answer-chart-row { display:grid; grid-template-columns:minmax(72px,130px) minmax(40px,1fr) max-content; align-items:center; gap:10px; min-width:0; }
.answer-chart-label { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); font-size:12px; }
.answer-chart-track { height:12px; border-radius:6px; background:var(--hover); overflow:hidden; }
.answer-chart-bar { display:block; height:100%; border-radius:6px; background:var(--accent); }
.answer-chart-value { font-size:12px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.answer-chart-note { margin:10px 0 0 !important; color:var(--muted); font-size:11px; }
.assistant-content table.answer-chart-source { margin-top:7px; }
.assistant-artifacts { display:flex; flex-wrap:wrap; gap:9px; margin-top:11px; }
.assistant-artifacts:empty { display:none; }
.assistant-image { flex-basis:100%; width:min(100%,560px); margin:0; padding:10px; border:1px solid var(--line); border-radius:12px; background:var(--side); }
.assistant-image img { display:block; width:100%; max-height:440px; object-fit:contain; border-radius:6px; }
.assistant-image-missing { margin:8px 0 0; color:var(--danger); font-size:12px; }
.artifact-card { display:flex; align-items:center; gap:11px; width:min(100%,280px); padding:11px 12px; border:1px solid var(--line); border-radius:11px; color:var(--text); background:var(--side); text-align:left; }
.artifact-card:hover { border-color:var(--muted); background:var(--hover); }.artifact-card > svg { flex:none; color:var(--muted); }
.artifact-card-copy { flex:1; min-width:0; }.artifact-card-copy strong,.artifact-card-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.artifact-card-copy strong { font-size:12px; }.artifact-card-copy small { margin-top:3px; color:var(--muted); font-size:10px; }.artifact-card-arrow { flex:none; color:var(--muted); }
.mermaid-block { margin:12px 0; padding:12px; overflow:auto; border:1px solid var(--line); border-radius:10px; background:var(--side); text-align:center; }
.mermaid-block svg { max-width:100%; height:auto; }
.mermaid-block.error { text-align:left; }
.mermaid-err { color:var(--danger); font-size:12px; }
.html-block { margin:12px 0; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.html-bar { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:6px 10px; background:var(--side); border-bottom:1px solid var(--line); }
.html-tag { color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.04em; }
.html-preview-btn { border:1px solid var(--line); border-radius:6px; padding:3px 10px; background:var(--bg); color:var(--text); font-size:12px; }
.html-preview-btn:hover { background:var(--hover); }
.html-block pre.code-fence { margin:0; border:0; border-radius:0; }
.html-frame { display:block; width:100%; height:320px; border:0; background:white; }
.message-tools { display:flex; align-items:center; gap:2px; margin-top:5px; min-height:28px; }
.message-tools[hidden],.accepted-label[hidden] { display:none; }
.message-action { display:grid; place-items:center; width:29px; height:29px; color:var(--muted); border:0; background:transparent; border-radius:7px; padding:0; }
.message-action:hover { background:var(--hover); color:var(--text); }
.message-action.is-accepted { color:var(--text); background:var(--hover); }
.message-action:focus-visible { outline:2px solid var(--text); outline-offset:1px; }
.message-time { font-size:12px; color:var(--muted); margin-right:8px; }
.assistant-footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 14px; margin-top:7px; }
.assistant-metrics { color:var(--muted); font-size:11px; line-height:1.4; }
.assistant-tools { margin-top:0; }
.accepted-label { color:var(--muted); font-size:11px; margin-right:4px; }
.message-editor { width:min(100%,650px); min-width:min(80vw,380px); margin-top:6px; padding:12px; border:1px solid var(--line); border-radius:14px; background:var(--side); }
.message-editor textarea { display:block; width:100%; min-height:90px; resize:vertical; padding:10px; border:1px solid var(--line); border-radius:9px; background:var(--bg); color:var(--text); outline:none; }
.message-editor textarea:focus { border-color:var(--muted); }
.message-editor p { margin:8px 0 4px; color:var(--muted); font-size:11px; }
.editor-actions { display:flex; justify-content:flex-end; gap:5px; }
.editor-actions .message-action:last-child { background:var(--accent); color:var(--on-accent); }
.assistant-process { width:100%; margin:0 0 10px; border:1px solid var(--line); border-radius:11px; color:var(--muted); background:var(--side); font-size:12px; }
.assistant-process:not(.running) { background:transparent; }
.process-head { display:flex; align-items:center; gap:7px; min-height:34px; padding:6px 10px; cursor:pointer; list-style:none; user-select:none; }
.process-head::-webkit-details-marker { display:none; }
.process-head:focus-visible { outline:2px solid var(--text); outline-offset:2px; border-radius:9px; }
.process-signal { width:7px; height:7px; border-radius:50%; flex:none; background:var(--muted); opacity:.55; }
.assistant-process.running .process-signal { background:var(--text); opacity:1; animation:pulse 1s ease-in-out infinite alternate; }
.process-label { color:var(--text); font-weight:600; white-space:nowrap; }
.process-phase { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.process-count { flex:none; white-space:nowrap; }
.process-elapsed { flex:none; margin-left:auto; font-variant-numeric:tabular-nums; }
.process-arrow { display:grid; place-items:center; flex:none; transition:transform .16s; }
.assistant-process[open] .process-arrow { transform:rotate(90deg); }
.process-content { margin:0 10px 9px 13px; padding:4px 0 0 13px; border-left:1px solid var(--line); max-height:210px; overflow-y:auto; }
.process-list { list-style:none; margin:0; padding:0; }
.process-step { position:relative; margin:0 0 10px; padding:0 4px; line-height:1.55; }
.process-step::before { content:""; position:absolute; left:-17px; top:6px; width:6px; height:6px; border-radius:50%; background:var(--muted); }
.process-step.running::before { animation:pulse 1s ease-in-out infinite alternate; }
.process-step.failed::before { background:var(--danger); }
.process-step-title { color:var(--text); font-weight:500; overflow-wrap:anywhere; }
.process-step.status .process-step-title { color:var(--muted); font-weight:400; }
.process-step.status::before { width:4px; height:4px; left:-16px; top:8px; opacity:.65; }
.process-step-state { color:var(--muted); font-size:11px; margin-left:8px; font-weight:400; }
.process-step.failed .process-step-state { color:var(--danger); }
.process-thinking-text { white-space:pre-wrap; overflow-wrap:anywhere; margin:3px 0 0; color:var(--muted); }
.process-step-details { margin-top:3px; }
.process-step-details summary { cursor:pointer; width:max-content; max-width:100%; }
.process-step-details pre { max-height:125px; overflow:auto; margin:5px 0 0; padding:7px 9px; border-radius:6px; background:var(--bubble); color:var(--muted); font:11px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace; white-space:pre-wrap; overflow-wrap:anywhere; }
.process-plan { margin:4px 0 0; padding:0 0 0 16px; }
.process-plan li { margin:2px 0; }
.process-plan li.done { text-decoration:line-through; opacity:.65; }
.process-empty { margin:0 0 4px; color:var(--muted); font-size:11px; }
.process-empty[hidden] { display:none; }
@keyframes pulse { to { opacity:.25; } }
@media (prefers-reduced-motion:reduce) { .assistant-process.running .process-signal,.process-step.running::before { animation:none; } .process-arrow { transition:none; } }
.bottom-area { width:100%; flex:none; padding:0 24px 10px; }
.bottom-area>* { max-width:800px; margin-left:auto; margin-right:auto; }
.status { color:var(--muted); font-size:12px; min-height:22px; padding-left:4px; }.status.error { color:var(--danger); }
.attachments { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:6px; }
.attachment { display:flex; gap:7px; align-items:center; padding:5px 9px; border:1px solid var(--line); border-radius:8px; background:var(--side); font-size:12px; max-width:100%; }
.attachment span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.attachment button { border:0; background:none; color:var(--muted); }
.composer { border:1px solid var(--line); border-radius:22px; padding:12px 14px 9px; box-shadow:0 2px 9px #0000000d; }
.composer:focus-within { border-color:#aaa; }
.composer textarea { display:block; width:100%; min-height:30px; max-height:180px; resize:none; border:0; background:transparent; color:var(--text); outline:0; padding:2px 4px; }
.composer-actions { display:flex; align-items:center; gap:8px; padding-top:7px; }
.attach-button { border:0; background:transparent; color:var(--text); border-radius:8px; padding:7px 8px; }.attach-button:hover { background:var(--hover); }
.file-hint { color:var(--muted); font-size:11px; }
.model-picker { position:relative; flex:none; }
.model-picker-button { display:flex; align-items:center; gap:7px; max-width:min(42vw,285px); min-height:32px; padding:5px 8px; border:0; border-radius:9px; color:var(--text); background:transparent; font-size:12px; }
.model-picker-button:hover,.model-picker-button[aria-expanded=true] { background:var(--side); }
.model-picker-button:disabled { color:var(--muted); cursor:default; }
.model-picker-current-model { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.model-picker-current-effort { flex:none; padding:1px 6px; border-radius:5px; background:var(--side); color:var(--muted); font-size:11px; }
.model-picker-current-fast { flex:none; color:#bd5521; font-size:11px; font-weight:700; }
:root[data-theme=dark] .model-picker-current-fast { color:#ffae77; }
.model-picker-button [hidden] { display:none; }
.model-picker-chevron { flex:none; width:6px; height:6px; margin:0 2px 3px 0; border-right:1.5px solid var(--muted); border-bottom:1.5px solid var(--muted); transform:rotate(45deg); }
.model-picker-menu { position:absolute; right:0; bottom:calc(100% + 12px); z-index:10; width:min(358px,calc(100vw - 28px)); max-height:min(510px,calc(100dvh - 130px)); overflow:auto; padding:16px; border:1px solid var(--line); border-radius:17px; background:var(--bg); box-shadow:0 16px 42px #0003; }
.model-picker-menu[hidden] { display:none; }
.model-picker-heading { display:flex; align-items:baseline; justify-content:space-between; gap:8px; padding:0 2px 8px; }
.model-picker-heading strong { font-size:15px; }
.model-picker-heading span { color:var(--muted); font-size:11px; }
.model-picker-section { padding:10px 0 13px; border-bottom:1px solid var(--line); }
.model-picker-section h3 { margin:0 0 9px; color:var(--muted); font-size:11px; font-weight:600; }
.model-option-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.model-option { display:flex; align-items:center; justify-content:space-between; gap:4px; min-height:41px; min-width:0; padding:7px 9px; border:1px solid var(--line); border-radius:9px; background:var(--bg); color:var(--text); text-align:left; font-size:12px; }
.model-option:hover,.effort-option:hover { background:var(--side); }
.model-option[aria-checked=true],.effort-option[aria-checked=true] { border-color:var(--text); background:var(--side); font-weight:650; }
.model-option span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.model-option small { flex:none; color:var(--muted); font-size:10px; font-weight:400; }
.effort-option-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
.effort-option { min-height:34px; padding:5px 8px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--text); font-size:12px; }
.speed-option { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; margin-top:12px; padding:5px 2px; border:0; background:transparent; color:var(--text); text-align:left; }
.speed-option-copy { display:grid; gap:1px; }
.speed-option-copy strong { font-size:12px; }
.speed-option-copy small { color:var(--muted); font-size:11px; }
.speed-option-switch { flex:none; width:35px; height:21px; padding:2px; border-radius:12px; background:#c4c7ca; transition:background .15s; }
.speed-option-switch::after { content:""; display:block; width:17px; height:17px; border-radius:50%; background:#fff; box-shadow:0 1px 3px #0003; transition:transform .15s; }
.speed-option[aria-checked=true] .speed-option-switch { background:var(--text); }
.speed-option[aria-checked=true] .speed-option-switch::after { transform:translateX(14px); }
.speed-option:disabled { opacity:.5; cursor:not-allowed; }
.model-picker-menu button:focus-visible,.model-picker-button:focus-visible { outline:2px solid var(--text); outline-offset:2px; }
.voice-button { width:32px; height:32px; display:grid; place-items:center; border:0; border-radius:50%; background:transparent; color:var(--text); }
.voice-button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.voice-button:hover { background:var(--hover); }
.voice-button.recording { background:var(--danger); color:#fff; animation:pulse .8s infinite alternate; }
.voice-button:disabled,.message-tools button:disabled { opacity:.45; cursor:not-allowed; }
.send-button { width:32px; height:32px; border:0; border-radius:50%; background:var(--accent); color:var(--on-accent); font-size:20px; line-height:1; }
.send-button:disabled { opacity:.4; cursor:default; }
.footer-note { text-align:center; color:var(--muted); font-size:11px; margin-top:0; margin-bottom:6px; }
.mobile-shade { display:none; }
.profile-dialog { width:min(620px,calc(100vw - 24px)); max-height:min(82dvh,760px); padding:0; border:1px solid var(--line); border-radius:16px; color:var(--text); background:var(--bg); box-shadow:0 20px 60px #0004; }
.profile-dialog::backdrop { background:#0008; }
.profile-header { display:flex; align-items:center; justify-content:space-between; padding:14px 18px; border-bottom:1px solid var(--line); }
.profile-header h2 { margin:0; font-size:18px; }
.profile-body { max-height:calc(min(82dvh,760px) - 64px); overflow:auto; padding:4px 20px 20px; }
.profile-section { padding:15px 0; border-bottom:1px solid var(--line); }
.profile-section:last-child { border-bottom:0; }
.profile-section h3 { margin:0 0 12px; font-size:15px; }
.profile-section h4 { margin:18px 0 8px; font-size:13px; }
.profile-account { display:flex; align-items:center; gap:12px; }
.profile-account div { display:flex; flex-direction:column; }
.profile-account span:last-child { color:var(--muted); font-size:12px; }
.usage-cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.usage-card { display:flex; flex-direction:column; padding:11px; border:1px solid var(--line); border-radius:10px; background:var(--side); }
.usage-card strong { font-size:17px; overflow-wrap:anywhere; }.usage-card span { color:var(--muted); font-size:11px; }
.usage-empty { color:var(--muted); font-size:13px; }
.usage-table { width:100%; border-collapse:collapse; font-size:12px; }.usage-table th,.usage-table td { padding:7px 4px; border-bottom:1px solid var(--line); text-align:right; }.usage-table th:first-child,.usage-table td:first-child { text-align:left; }
.profile-form { display:grid; gap:10px; }.profile-form label { display:grid; gap:4px; color:var(--muted); font-size:12px; }.profile-form input { width:100%; padding:9px 10px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--text); }
.profile-feedback { min-height:18px; color:var(--danger); font-size:12px; }.profile-submit { justify-self:start; padding:9px 16px; border:0; border-radius:8px; background:var(--accent); color:var(--on-accent); }.profile-submit:disabled { opacity:.5; }
.profile-section summary { cursor:pointer; font-size:15px; font-weight:600; }
.profile-memory-note { margin:10px 0; color:var(--muted); font-size:12px; }
#profile-memory-content { display:block; width:100%; min-height:180px; padding:12px; border:1px solid var(--line); border-radius:9px; background:var(--side); color:var(--text); font:12px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace; resize:vertical; }
.profile-memory-actions { display:flex; align-items:center; gap:12px; margin-top:10px; }.profile-memory-actions span { color:var(--muted); font-size:12px; }
/* R149：窄边主导航、个人空间与共用文档预览。 */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.app-rail { z-index:35; width:62px; flex:none; display:flex; flex-direction:column; align-items:center; gap:7px; padding:14px 7px 10px; background:var(--side); border-right:1px solid var(--line); }
.rail-logo { display:grid; place-items:center; width:32px; height:32px; margin-bottom:23px; border-radius:9px; color:var(--on-accent); background:var(--accent); font-weight:700; }
.mobile-header { display:none; }
.rail-action,.rail-account { display:grid; place-items:center; width:42px; height:42px; border:0; border-radius:11px; background:transparent; color:var(--muted); }
.rail-action:hover,.rail-action.active,.rail-account:hover { background:var(--hover); color:var(--text); }
.rail-action { position:relative; }
.rail-action:is(:hover,:focus-visible)::after { content:attr(data-label); position:absolute; z-index:50; left:51px; top:50%; transform:translateY(-50%); padding:5px 8px; border-radius:6px; background:var(--text); color:var(--bg); font-size:11px; font-weight:600; white-space:nowrap; pointer-events:none; box-shadow:0 3px 10px #0002; }
.rail-peek-home #nav-home::after,.rail-peek-space #nav-space::after,.space-view #nav-space::after { display:none; }
.rail-action:focus-visible,.rail-account:focus-visible,.preview-tool:focus-visible { outline:2px solid var(--text); outline-offset:2px; }
.rail-bottom { width:100%; margin-top:auto; padding-top:10px; display:grid; place-items:center; }
.rail-account .avatar { width:31px; height:31px; }
.rail-bottom .account-menu { left:54px; right:auto; bottom:4px; width:200px; z-index:45; }
.workbench { flex:1; min-width:0; min-height:0; display:flex; overflow:hidden; }
.workbench > .sidebar { width:255px; }
.workbench > .main { flex:1; min-width:0; }
@media (min-width:761px) {
  .rail-peek-home .workbench > .sidebar,.rail-peek-space:not(.space-view) .workbench > .space-tree-panel { display:flex; position:fixed; z-index:30; top:0; bottom:0; left:62px; box-shadow:12px 0 28px #0002; }
  .rail-peek-home .workbench > .sidebar { width:255px; }
  .rail-peek-space:not(.space-view) .workbench > .space-tree-panel { width:min(var(--space-tree-pane,290px), min(480px,65vw)); }
}
.preview-panel { display:none; flex:1; min-width:0; min-height:0; background:var(--bg); border-left:1px solid var(--line); }
.preview-resizer { display:none; position:relative; width:12px; flex:none; background:var(--bg); cursor:col-resize; touch-action:none; }
.preview-resizer::before { content:""; position:absolute; width:1px; inset:0 auto 0 5px; background:var(--line); }
.preview-resizer:hover::before,.preview-resizer.dragging::before { width:3px; left:4px; background:var(--muted); }
.preview-swap { position:absolute; z-index:2; top:50%; left:50%; transform:translate(-50%,-50%); display:grid; place-items:center; width:30px; height:30px; border:1px solid var(--line); border-radius:9px; color:var(--muted); background:var(--bg); box-shadow:0 3px 14px #0002; opacity:0; pointer-events:none; }
.preview-resizer:hover .preview-swap,.preview-resizer:focus-within .preview-swap { opacity:1; pointer-events:auto; }
.preview-swap:hover { color:var(--text); border-color:var(--muted); }
.preview-open:not(.space-view) .workbench > .sidebar,.space-view .workbench > .sidebar,.space-view .chat-pane { display:none; }
@media (min-width:761px) {
  .rail-peek-home:is(.space-view,.preview-open) .workbench > .sidebar { display:flex; position:fixed; z-index:30; top:0; bottom:0; left:62px; width:255px; box-shadow:12px 0 28px #0002; }
}
.preview-open:not(.space-view) .chat-pane { flex:none; width:var(--chat-pane,20%); min-width:190px; order:1; }
.preview-open:not(.space-view) .preview-resizer { display:block; order:2; }
.preview-open:not(.space-view) .preview-panel { display:flex; flex-direction:column; order:3; }
.preview-open.preview-swapped:not(.space-view) .chat-pane { order:3; }
.preview-open.preview-swapped:not(.space-view) .preview-panel { order:1; }
.preview-open.preview-swapped:not(.space-view) .preview-resizer { order:2; }
.preview-open .chat-pane .messages { padding:18px 13px 9px; gap:18px; }
.preview-open .chat-pane .bottom-area { padding:0 10px 8px; }
.preview-open .chat-pane .message.assistant { gap:6px; }
.preview-open .chat-pane .assistant-avatar { width:20px; height:20px; }
.preview-open .chat-pane .assistant-content { font-size:13px; }
.preview-open .chat-pane .file-hint { display:none; }
.preview-open .chat-pane .attach-button span { display:none; }
.preview-open .chat-pane .attach-button { display:grid; place-items:center; width:28px; height:28px; padding:0; flex:none; }
.preview-open .chat-pane .composer-actions { gap:3px; }
.preview-open .chat-pane .voice-button,.preview-open .chat-pane .send-button { flex:none; width:28px; height:28px; }
.preview-open .chat-pane .composer { padding:8px; border-radius:15px; }
.preview-open .chat-pane .model-picker-button { max-width:100px; }
.preview-open .chat-pane .message-tools { flex-wrap:wrap; }
.preview-open .chat-pane .user-body { max-width:96%; }
.space-view .space-tree-panel { display:flex; width:var(--space-tree-pane,290px); max-width:calc(100% - 280px); }
.space-view .space-resizer { display:block; }
.space-view .preview-panel { display:flex; flex-direction:column; }
.space-view .preview-resizer { display:none; }
.space-tree-panel { display:none; width:290px; flex:none; min-width:0; flex-direction:column; border-right:1px solid var(--line); background:var(--side); }
.space-resizer { display:none; position:relative; width:10px; flex:none; background:var(--bg); cursor:col-resize; touch-action:none; }
.space-resizer::before { content:""; position:absolute; inset:0 auto 0 4px; width:1px; background:var(--line); }
.space-resizer:is(:hover,:focus-visible,.dragging)::before { left:3px; width:3px; background:var(--muted); }
.space-resizer:focus-visible { outline:2px solid var(--text); outline-offset:-2px; }
.space-tree-head { padding:22px 18px 13px; }
.space-tree-head strong,.space-tree-head small { display:block; }
.space-tree-head strong { font-size:17px; }.space-tree-head small { margin-top:2px; color:var(--muted); font-size:11px; }
.space-tree-tools { display:flex; gap:3px; padding:2px 12px 10px; }
.space-tree-tools button { display:grid; place-items:center; width:32px; height:32px; border:0; border-radius:8px; color:var(--muted); background:transparent; }
.space-tree-tools button:hover { background:var(--hover); color:var(--text); }
.space-location { width:100%; padding:8px 16px; border:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:transparent; text-align:left; font-size:11px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.space-location:hover { color:var(--text); background:var(--hover); }
.space-tree { flex:1; min-height:0; overflow:auto; padding:10px 8px 20px; }
.space-row { display:flex; align-items:center; gap:7px; width:100%; min-width:0; height:34px; padding:0 6px; border:0; border-radius:7px; background:transparent; color:var(--text); text-align:left; }
.space-row:hover,.space-row.selected { background:var(--hover); }
.space-row svg { flex:none; color:var(--muted); }.space-row .space-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }
.space-row .space-arrow { width:13px; flex:none; transition:transform .15s; }.space-row.expanded .space-arrow { transform:rotate(90deg); }
.space-row .space-delete { display:grid; place-items:center; flex:none; width:24px; height:24px; padding:0; border:0; border-radius:5px; color:var(--muted); background:transparent; opacity:0; }
.space-row:hover .space-delete,.space-row:focus-within .space-delete { opacity:1; }.space-row .space-delete:hover { color:var(--danger); background:var(--bg); }
.space-status { min-height:25px; padding:5px 15px; margin:0; color:var(--muted); font-size:11px; }.space-status.error { color:var(--danger); }
.preview-toolbar { min-height:57px; flex:none; display:flex; align-items:center; gap:10px; padding:7px 13px 7px 20px; border-bottom:1px solid var(--line); }
.preview-title { display:flex; align-items:center; gap:9px; flex:1; min-width:0; }.preview-title svg { flex:none; color:var(--muted); }.preview-title strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }.preview-title small { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); font-size:10px; }
.preview-actions { display:flex; align-items:center; gap:3px; flex:none; }.preview-tool { display:grid; place-items:center; width:31px; height:31px; border:0; border-radius:7px; color:var(--muted); background:transparent; }.preview-tool:hover,.preview-tool.active { color:var(--text); background:var(--hover); }.preview-tool[hidden] { display:none; }.preview-tool:disabled { opacity:.4; cursor:default; }.preview-tool-divider { width:1px; height:18px; background:var(--line); margin:0 3px; }
.preview-content { flex:1; min-height:0; overflow:auto; background:var(--bg); }.preview-empty { display:grid; place-items:center; height:100%; padding:24px; color:var(--muted); text-align:center; font-size:13px; }
.preview-md { max-width:940px; margin:0 auto; padding:42px 54px 80px; }.preview-md h1:first-child { font-size:30px; margin:0 0 25px; letter-spacing:-.03em; }.preview-md h2 { margin-top:36px; }.preview-md table { display:block; max-width:100%; overflow:auto; border-collapse:collapse; }.preview-md th,.preview-md td { border:1px solid var(--line); padding:8px 11px; }.preview-md th { background:var(--side); }
.preview-frame { width:100%; height:100%; border:0; background:white; }.preview-source { width:100%; height:100%; padding:27px 34px; margin:0; overflow:auto; border:0; background:var(--bg); color:var(--text); font:12.5px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace; white-space:pre-wrap; overflow-wrap:anywhere; resize:none; outline:none; }
.image-viewer { position:relative; height:100%; min-height:0; overflow:hidden; background:var(--side); }
.image-stage { position:absolute; inset:0; overflow:hidden; touch-action:none; }
.image-stage.can-pan { cursor:grab; }.image-stage.dragging { cursor:grabbing; }
.image-stage img { position:absolute; transform:translate(-50%,-50%); max-width:none; max-height:none; user-select:none; pointer-events:none; }
.image-loading { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); color:var(--muted); font-size:12px; }
.image-zoom-tools { position:absolute; right:18px; bottom:18px; z-index:1; display:flex; align-items:center; gap:2px; padding:5px; border:1px solid var(--line); border-radius:10px; background:var(--bg); box-shadow:0 4px 18px #0002; }
.image-zoom-tools button,.pdf-controls button { display:grid; place-items:center; width:30px; height:30px; border:0; border-radius:6px; color:var(--text); background:transparent; cursor:pointer; }
.image-zoom-tools button:hover,.pdf-controls button:hover { background:var(--hover); }.image-zoom-tools button:disabled,.pdf-controls button:disabled { opacity:.35; cursor:default; }
.image-zoom-tools button:focus-visible,.pdf-controls button:focus-visible { outline:2px solid var(--text); outline-offset:1px; }
.image-zoom-percent,.pdf-zoom-label,.pdf-page-label { min-width:42px; color:var(--muted); font-size:11px; text-align:center; font-variant-numeric:tabular-nums; }
.pdf-viewer { display:flex; flex-direction:column; height:100%; min-height:0; background:var(--side); }
.pdf-controls { display:flex; align-items:center; gap:3px; flex:none; min-height:43px; padding:5px 12px; border-bottom:1px solid var(--line); background:var(--bg); }
.pdf-controls[hidden] { display:none; }.pdf-controls-spacer { flex:1; }.pdf-prev svg { transform:rotate(180deg); }
.pdf-stage { flex:1; min-height:0; overflow:auto; padding:18px; }.pdf-stage canvas { display:block; margin:0 auto; max-width:none; box-shadow:0 5px 20px #0002; background:white; }
.pdf-stage canvas[hidden],.pdf-stage .preview-empty[hidden] { display:none; }
.space-create-dialog { width:min(420px,calc(100vw - 24px)); border:1px solid var(--line); border-radius:15px; padding:23px; color:var(--text); background:var(--bg); box-shadow:0 18px 48px #0003; }.space-create-dialog::backdrop { background:#0008; }.space-create-dialog h2 { margin:0 0 5px; font-size:18px; }.space-create-dialog p { margin:0 0 16px; color:var(--muted); font-size:12px; }.space-create-dialog label { display:grid; gap:6px; font-size:12px; }.space-create-dialog input { width:100%; padding:10px; border:1px solid var(--line); border-radius:8px; outline:none; color:var(--text); background:var(--bg); }.space-create-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:18px; }.space-create-actions button { padding:8px 15px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--text); }.space-create-actions button:last-child { background:var(--accent); color:var(--on-accent); border-color:var(--accent); }
@media (max-width:760px) {
  .app { flex-direction:column; }
  .desktop-chat-header { display:none; }
  .mobile-header { display:grid; grid-template-columns:72px minmax(0,1fr) 72px; flex:none; height:56px; align-items:center; padding:0 12px; background:var(--side); border-bottom:1px solid var(--line); z-index:40; }
  .mobile-brand { display:flex; align-items:center; gap:8px; min-height:44px; width:72px; border:0; padding:0; color:var(--text); background:transparent; font-weight:600; }
  .mobile-brand .rail-logo { margin:0; flex:none; }
  .mobile-session-title { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center; font-weight:600; font-size:15px; }
  .mobile-menu-icon { display:grid; place-items:center; width:20px; height:20px; flex:none; }
  .app-rail { position:fixed; inset:56px 0 auto; width:100%; height:68px; flex-direction:row; align-items:center; gap:6px; padding:8px 12px; border-right:0; border-bottom:1px solid var(--line); }
  .app-rail > .rail-logo { display:none; }
  .rail-action { display:flex; flex-direction:column; gap:2px; width:64px; height:48px; }
  .rail-action::after,.rail-action:is(:hover,:focus-visible)::after { display:block !important; content:attr(data-label); position:static; padding:0; transform:none; color:inherit; background:transparent; font-size:11px; box-shadow:none; }
  .rail-bottom { width:auto; margin:0 0 0 auto; padding:0; border:0; }
  .rail-bottom .account-menu { left:auto; right:0; top:48px; bottom:auto; max-width:calc(100vw - 24px); }
  .app .workbench > .sidebar { display:flex; position:fixed; z-index:30; inset:124px 0 auto; width:100%; height:min(60dvh,480px); max-height:calc(100dvh - 148px); border-right:0; border-bottom:1px solid var(--line); box-shadow:0 12px 24px #0002; }
  .app-rail,.app .workbench > .sidebar { visibility:hidden; opacity:0; pointer-events:none; transform:translateY(-12px); transition:transform .2s,opacity .2s,visibility .2s; }
  body.mobile-menu-open .app-rail,body.mobile-menu-open .app .workbench > .sidebar { visibility:visible; opacity:1; pointer-events:auto; transform:translateY(0); }
  body.mobile-menu-open .mobile-shade { display:block; position:fixed; inset:56px 0 0; z-index:20; background:#0008; }
  .sidebar-collapse,.mobile-close { display:none; }
  .messages { padding:20px 18px 12px; }
  .message.assistant { gap:10px; }
  .assistant-avatar { width:24px; height:24px; }
  .bottom-area { padding:0 12px 10px; }
  .suggestions { grid-template-columns:1fr; }
  .welcome h1 { font-size:23px; }
  .file-hint { display:none; }
  .model-picker-button { max-width:min(55vw,240px); }
  .model-picker-menu { right:-94px; }
  .user-body { max-width:90%; }
  .message-editor { min-width:min(76vw,380px); }
  .usage-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .answer-chart-row { grid-template-columns:minmax(60px,90px) minmax(24px,1fr) max-content; gap:7px; }
  .preview-open:not(.space-view) .chat-pane { display:none; }
  .preview-open:not(.space-view) .preview-resizer { display:none; }
  .space-view .space-tree-panel { width:38%; min-width:135px; }
  .space-view .space-tree-panel { width:var(--space-tree-pane,38%); max-width:calc(100% - 165px); }
  .preview-toolbar { padding:6px; }.preview-title small { display:none; }.preview-actions { gap:0; }.preview-tool { width:28px; }
  .preview-md { padding:24px 20px 55px; }
}
@media (prefers-reduced-motion:reduce) { .app-rail,.app .workbench > .sidebar { transition:none; } }
@media (max-width:420px) {
  .attach-button span { display:none; }
  .attach-button { width:32px; height:32px; padding:0; font-size:22px; }
  .model-picker-button { max-width:min(53vw,200px); }
  .composer-actions { gap:5px; }
  .assistant-footer { align-items:flex-start; }
}

/* R170 终局错误常显，历史仍可查看。 */
.assistant-process.failed { border-color:var(--danger); }
.assistant-process.failed .process-signal { background:var(--danger); opacity:1; }
.assistant-process.failed .process-phase, .process-error { color:var(--danger); }
.process-error { margin:6px 0 0; white-space:pre-wrap; overflow-wrap:anywhere; }

/* 当前选中会话的命名入口常显，手机不依赖悬停。 */
.session-rename { flex:none; display:grid; place-items:center; width:36px; height:36px; border:0; border-radius:7px; background:transparent; color:var(--muted); }
.session-rename:hover,.session-rename:focus-visible { background:var(--bg); color:var(--text); }
.session-rename-dialog { width:min(420px,calc(100vw - 32px)); padding:24px; border:1px solid var(--line); border-radius:14px; background:var(--bg); color:var(--text); box-shadow:0 20px 70px #0003; }
.session-rename-dialog::backdrop { background:#0008; }
.session-rename-dialog h2 { font-size:20px; margin:0 0 18px; }
.session-rename-dialog label { display:block; margin-bottom:6px; }
.session-rename-dialog input { width:100%; padding:10px 12px; font-size:16px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--text); }
.rename-error { min-height:22px; margin:8px 0; color:var(--danger); }
.rename-actions { display:flex; justify-content:flex-end; gap:8px; }
.rename-actions button { min-height:44px; padding:8px 18px; border:1px solid var(--line); border-radius:8px; background:var(--side); color:var(--text); }
.rename-actions button[type=submit] { background:var(--accent); color:var(--on-accent); }
.rename-actions button:disabled { opacity:.55; cursor:wait; }

.message-recover { min-width:36px; min-height:36px; color:var(--text); }
