/* ccboard 视觉系统 —— token 化（参考 REVERSE-REPORT.md §2：语义 token + 灰紫 brand + 12/16px 圆角 + 极轻阴影）
   默认暗色；<html data-theme="light"> 切换浅色。 */
:root, [data-theme="dark"] {
  color-scheme: dark;
  --page: #0f0e13;
  --page-2: #15141b;
  --surface: #1b1a22;
  --surface-2: #23212c;
  --surface-3: #2c2a37;
  --foreground: #ecebf2;
  --muted-foreground: #a8a3b8;
  --hint: #77728a;
  --border: #2b2936;
  --border-strong: #3a3747;
  --brand: #a99dd6;          /* 暗底提亮的灰紫 */
  --brand-strong: #8e83b0;
  --brand-ink: #d9d2f2;
  --brand-soft: rgba(142, 131, 176, .16);
  --brand-soft-2: rgba(142, 131, 176, .28);
  --on-brand: #120f1c;
  --danger: #f2555a;
  --danger-soft: rgba(242, 85, 90, .14);
  --ok: #3cc97e;
  --warn: #f0a23b;
  --warn-soft: rgba(240, 162, 59, .12);
  --code-bg: #121119;
  --term-bg: #121119;
  --term-fg: #e6e4ee;
  --overlay: rgba(6, 5, 10, .62);
  --shadow-card: 0 1px 2px rgba(0, 0, 0, .35);
  --shadow-pop: 0 18px 60px rgba(0, 0, 0, .55);
}
[data-theme="light"] {
  color-scheme: light;
  --page: #f7f7f8;
  --page-2: #f0f0f2;
  --surface: #ffffff;
  --surface-2: #f6f5f9;
  --surface-3: #eeecf4;
  --foreground: #1b1e28;
  --muted-foreground: #6e7385;
  --hint: #a9a4ae;
  --border: #ececf0;
  --border-strong: #dcdae3;
  --brand: #8e83b0;
  --brand-strong: #6f6392;
  --brand-ink: #4c4370;
  --brand-soft: rgba(142, 131, 176, .12);
  --brand-soft-2: rgba(142, 131, 176, .22);
  --on-brand: #ffffff;
  --danger: #e5484d;
  --danger-soft: rgba(229, 72, 77, .10);
  --ok: #1f9d5a;
  --warn: #c27a12;
  --warn-soft: rgba(240, 162, 59, .14);
  --code-bg: #f3f2f7;
  --term-bg: #1b1a22;
  --term-fg: #ecebf2;
  --overlay: rgba(20, 18, 30, .38);
  --shadow-card: 0 1px 2px rgba(0, 0, 0, .04);
  --shadow-pop: 0 18px 60px rgba(30, 25, 50, .18);
}
:root {
  --radius: 12px;
  --radius-lg: 16px;
  --radius-sm: 8px;
  --font: -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, "Segoe UI", sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, Monaco, monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  background: var(--page); color: var(--foreground); font-family: var(--font);
  display: flex; flex-direction: column; -webkit-font-smoothing: antialiased;
}
.hidden { display: none !important; }
button { cursor: pointer; font-family: inherit; }
input, textarea { outline: none; font-family: inherit; }
svg { display: block; }

/* ---------- 通用按钮 ---------- */
.btn {
  height: 32px; padding: 0 14px; border-radius: var(--radius-sm); border: 1px solid var(--border);
  background: var(--surface); color: var(--foreground); font-size: 13px;
  display: inline-flex; align-items: center; gap: 6px; transition: background .15s, border-color .15s;
}
.btn:hover { background: var(--surface-2); border-color: var(--border-strong); }
.btn.primary { background: var(--brand); border-color: transparent; color: var(--on-brand); font-weight: 600; }
.btn.primary:hover { filter: brightness(1.06); background: var(--brand); }
.btn.danger { color: var(--danger); }
.btn.danger:hover { background: var(--danger-soft); border-color: transparent; }
.btn:disabled { opacity: .55; cursor: default; }
.icon-btn {
  width: 34px; height: 34px; border-radius: 10px; border: 1px solid var(--border);
  background: var(--surface); color: var(--muted-foreground);
  display: inline-flex; align-items: center; justify-content: center;
}
.icon-btn:hover { color: var(--foreground); background: var(--surface-2); }
.icon-btn svg { width: 17px; height: 17px; }

/* ---------- 登录（结构参考 auth-shell：420/480/560 容器 → 品牌区 → 三卡 → 操作区） ---------- */
.login {
  min-height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 32px 0; position: relative;
  background:
    radial-gradient(900px 420px at 50% -10%, var(--brand-soft), transparent 70%),
    var(--page);
}
.login .theme-corner { position: absolute; top: 16px; right: 16px; }
.auth-wrap {
  width: 100%; max-width: 420px; padding: 0 20px;
  display: flex; flex-direction: column; align-items: center; gap: 28px;
}
@media (min-width: 768px) { .auth-wrap { max-width: 480px; padding: 0 24px; gap: 32px; } }
@media (min-width: 1280px) { .auth-wrap { max-width: 560px; } }

.brand { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.brand-mark { display: flex; align-items: center; gap: 12px; }
.brand-mark svg { width: clamp(38px, 8vw, 50px); height: auto; }
.wordmark { font-size: clamp(28px, 6vw, 38px); font-weight: 700; letter-spacing: .5px; color: var(--foreground); }
.wordmark span { color: var(--brand); }
.tagline { font-size: 17px; font-weight: 600; letter-spacing: 3px; color: var(--brand-ink); margin-top: 4px; }
.tagline-en { font-size: 11px; letter-spacing: 2px; color: var(--hint); text-transform: none; }
.brand-desc { font-size: 13px; color: var(--hint); margin-top: 2px; }

.features { width: 100%; display: flex; flex-direction: column; gap: 10px; }
@media (min-width: 768px) { .features { flex-direction: row; gap: 12px; } }
.feature {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px;
  padding: 14px 16px; border-radius: var(--radius); background: var(--surface);
  border: 1px solid var(--border); box-shadow: var(--shadow-card);
}
@media (min-width: 768px) {
  .feature { flex-direction: column; gap: 6px; padding: 18px 8px; text-align: center; }
}
.feature svg { width: 24px; height: 24px; color: var(--brand); flex-shrink: 0; }
.feature .f-name { flex: 1; font-size: 15px; font-weight: 600; color: var(--foreground); }
.feature .f-desc { font-size: 12px; color: var(--hint); }
@media (min-width: 768px) { .feature .f-name { flex: none; font-size: 14px; } }

.auth-card {
  width: 100%; background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 22px 22px 18px; box-shadow: var(--shadow-card);
}
.auth-label { font-size: 13px; color: var(--muted-foreground); margin-bottom: 10px; display: block; }
.pair-row { display: flex; gap: 8px; }
.pair-row input {
  flex: 1; min-width: 0; height: 48px; padding: 0 14px; border-radius: var(--radius);
  border: 1px solid var(--border-strong); background: var(--page-2); color: var(--foreground);
  font-size: 20px; font-family: var(--mono); letter-spacing: 3px; text-align: center;
  -webkit-user-select: text; user-select: text;   /* Safari 下确保可选中/粘贴；不做 text-transform，显示=实际值 */
  transition: border-color .15s, box-shadow .15s;
}
.pair-row input::placeholder { font-family: var(--font); font-size: 14px; letter-spacing: 0; color: var(--hint); }
.pair-row input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft-2); }
.pair-paste {
  height: 48px; padding: 0 16px; border-radius: var(--radius); white-space: nowrap;
  border: 1px solid var(--border-strong); background: var(--surface-2); color: var(--foreground); font-size: 14px;
}
.pair-paste:hover { background: var(--surface-3); }
#pair-btn {
  width: 100%; height: 50px; margin-top: 12px; border: 0; border-radius: var(--radius);
  background: var(--brand); color: var(--on-brand); font-size: 16px; font-weight: 600; letter-spacing: 2px;
  transition: filter .15s, opacity .15s;
}
#pair-btn:hover { filter: brightness(1.07); }
#pair-btn:disabled, .pair-paste:disabled { opacity: .55; cursor: default; }
.err { color: var(--danger); font-size: 13px; margin-top: 10px; min-height: 18px; line-height: 1.5; text-align: center; }
.err:empty { margin-top: 4px; }
.pair-hint {
  color: var(--warn); background: var(--warn-soft); border-radius: var(--radius-sm);
  font-size: 12px; margin-top: 8px; padding: 8px 10px; line-height: 1.55; text-align: left;
}
.auth-foot {
  margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border);
  font-size: 12px; color: var(--hint); text-align: center; line-height: 1.6;
}
.auth-foot code { font-family: var(--mono); color: var(--muted-foreground); background: var(--page-2); padding: 1px 6px; border-radius: 5px; }

/* ---------- 主界面 ---------- */
.main { flex: 1; display: flex; min-height: 0; }
.rail {
  width: 64px; background: var(--page-2); border-right: 1px solid var(--border);
  display: flex; flex-direction: column; align-items: center; padding: 12px 0;
}
.rail-head { display: flex; flex-direction: column; gap: 10px; align-items: center; margin-bottom: 10px; }
.rail-logo { width: 32px; height: 32px; margin-bottom: 6px; }
.rail-btn {
  width: 40px; height: 40px; border-radius: var(--radius); border: 1px solid transparent;
  background: transparent; color: var(--muted-foreground);
  display: flex; align-items: center; justify-content: center; transition: background .15s, color .15s;
}
.rail-btn svg { width: 20px; height: 20px; }
.rail-btn:hover { background: var(--surface-2); color: var(--foreground); }
.rail-btn.active { background: var(--brand-soft); color: var(--brand); }
.rail-sep { width: 28px; height: 1px; background: var(--border); margin: 4px 0; }
.session-list {
  flex: 1; width: 100%; overflow-y: auto; display: flex; flex-direction: column; align-items: center;
  gap: 6px; padding-top: 4px;
}
.session-item {
  position: relative; width: 40px; height: 40px; border-radius: var(--radius); border: 1px solid var(--border);
  background: var(--surface); color: var(--muted-foreground); font-size: 12px; font-weight: 600;
  font-family: var(--mono); display: flex; align-items: center; justify-content: center;
}
.session-item svg { width: 18px; height: 18px; }
.session-item.claude { color: var(--brand); }
.session-item:hover { border-color: var(--border-strong); color: var(--foreground); }
.session-item.active { background: var(--brand-soft); border-color: var(--brand); color: var(--brand); }
.session-item.need-perm::after {
  content: ""; position: absolute; top: -3px; right: -3px; width: 10px; height: 10px;
  border-radius: 50%; background: var(--danger); border: 2px solid var(--page-2);
}
.session-item.gone { opacity: .45; }
.rail-foot { margin-top: auto; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--danger); box-shadow: 0 0 0 3px var(--danger-soft); }
.dot.on { background: var(--ok); box-shadow: 0 0 0 3px rgba(60, 201, 126, .16); }

.content { flex: 1; display: flex; flex-direction: column; min-width: 0; min-height: 0; background: var(--page); }
.term-area { flex: 1; position: relative; min-height: 0; }
.term-instance {
  position: absolute; inset: 10px; padding: 10px 6px 6px 12px;
  background: var(--term-bg); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}
.term-instance.hidden { display: none; }
.xterm .xterm-viewport { background: transparent !important; }

/* 空状态 */
.empty-state {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; color: var(--hint); font-size: 13px; pointer-events: none;
}
.empty-state svg { width: 44px; height: 44px; color: var(--brand); opacity: .6; }

/* 面板头部（文件 / 聊天共用气质） */
.file-bar, .chat-head {
  display: flex; align-items: center; gap: 10px; padding: 0 18px; height: 52px; flex-shrink: 0;
  border-bottom: 1px solid var(--border); background: var(--page-2);
}

/* ---------- 文件区 ---------- */
.file-area { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.crumb { color: var(--hint); font-size: 13px; font-family: var(--mono); overflow-x: auto; white-space: nowrap; }
.crumb b { color: var(--foreground); cursor: pointer; font-weight: 500; padding: 2px 4px; border-radius: 5px; }
.crumb b:hover { background: var(--brand-soft); color: var(--brand); }
.spacer { flex: 1; }
.file-list { flex: 1; overflow-y: auto; padding: 12px; }
.file-row {
  display: flex; align-items: center; gap: 12px; padding: 0 12px; height: 42px;
  border-radius: var(--radius-sm); font-size: 14px; cursor: pointer; border: 1px solid transparent;
}
.file-row:hover { background: var(--surface); border-color: var(--border); }
.file-row .icon { width: 22px; text-align: center; font-size: 16px; }
.file-row .name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-row .meta { color: var(--hint); font-size: 12px; min-width: 90px; text-align: right; font-family: var(--mono); }
.file-row .act {
  visibility: hidden; border: 0; background: transparent; color: var(--hint);
  font-size: 12px; padding: 4px 8px; border-radius: 6px;
}
.file-row:hover .act { visibility: visible; }
.file-row .act:hover { background: var(--danger-soft); color: var(--danger); }

/* ---------- Claude 聊天区 ---------- */
.claude-area { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.chat-head { font-size: 14px; font-weight: 600; }
:is(#chat-title, [data-pid="chat-title"]) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 50%; }
.chat-status {
  color: var(--muted-foreground); font-size: 12px; font-weight: 500; padding: 2px 10px;
  border-radius: 999px; background: var(--surface-2);
}
.chat-status.run { color: var(--brand); background: var(--brand-soft); }
.chat-msgs {
  flex: 1; overflow-y: auto; padding: 22px max(18px, calc((100% - 880px) / 2));
  display: flex; flex-direction: column; gap: 14px;
}
.msg { max-width: 880px; }
.msg.user { align-self: flex-end; max-width: min(720px, 85%); }
.msg.assistant { align-self: flex-start; width: 100%; }
.msg .bubble { padding: 11px 15px; border-radius: var(--radius); font-size: 14px; line-height: 1.7; word-break: break-word; }
.msg.user .bubble { background: var(--brand-soft-2); color: var(--foreground); border-bottom-right-radius: 4px; white-space: pre-wrap; }
.msg.assistant .bubble {
  background: var(--surface); border: 1px solid var(--border); border-bottom-left-radius: 4px; box-shadow: var(--shadow-card);
}
.msg.assistant.live .bubble { opacity: .88; white-space: pre-wrap; }
.msg .bubble p + p, .msg .bubble ul, .msg .bubble ol { margin-top: 6px; }
.msg .bubble ul, .msg .bubble ol { padding-left: 20px; }
.msg .bubble a { color: var(--brand); }
.msg .bubble pre { background: var(--code-bg); border: 1px solid var(--border); padding: 12px; border-radius: var(--radius-sm); overflow-x: auto; margin: 8px 0; }
.msg .bubble code { font-family: var(--mono); font-size: 12.5px; background: var(--code-bg); padding: 1px 6px; border-radius: 5px; }
code.fp, a.fp { cursor: pointer; text-decoration: underline dotted; text-underline-offset: 3px; text-decoration-thickness: 1px; }
code.fp { color: var(--brand); }
@media (hover: hover) { code.fp:hover, a.fp:hover { text-decoration-style: solid; } }
.msg.user .bubble code.fp { color: inherit; }
.msg .bubble pre code { background: none; padding: 0; }
.msg .bubble table { border-collapse: collapse; margin: 8px 0; font-size: 13px; }
.msg .bubble th, .msg .bubble td { border: 1px solid var(--border); padding: 4px 10px; }
.tool-card {
  border: 1px solid var(--border); border-radius: var(--radius-sm); overflow: hidden;
  background: var(--page-2); max-width: 880px; width: 100%;
}
.tool-card .tc-head {
  padding: 8px 12px; font-size: 12.5px; cursor: pointer; display: flex; gap: 8px; align-items: center;
  color: var(--muted-foreground); font-family: var(--mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.tool-card .tc-head:hover { color: var(--brand); }
.tool-card .tc-body {
  padding: 10px 12px; border-top: 1px solid var(--border); font-family: var(--mono); font-size: 12px;
  white-space: pre-wrap; word-break: break-all; max-height: 280px; overflow-y: auto; color: var(--muted-foreground);
}
.tool-card .tc-body.collapsed { display: none; }
.sys-line { color: var(--hint); font-size: 12px; text-align: center; }
.chat-input-row {
  display: flex; gap: 10px; padding: 14px max(18px, calc((100% - 880px) / 2)) 18px; align-items: flex-end;
  border-top: 1px solid var(--border); background: var(--page-2);
}
.chat-input-row textarea {
  flex: 1; resize: none; min-height: 48px; max-height: 220px; background: var(--surface);
  border: 1px solid var(--border-strong); border-radius: var(--radius); color: var(--foreground);
  font-size: 14px; line-height: 1.55; padding: 12px 14px; transition: border-color .15s, box-shadow .15s;
}
.chat-input-row textarea:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft-2); }
.chat-input-row .btn.primary { height: 48px; padding: 0 22px; border-radius: var(--radius); }
.typing { color: var(--hint); font-size: 13px; }

/* ---------- 权限弹窗 ---------- */
.perm-modal {
  position: fixed; inset: 0; background: var(--overlay); z-index: 50; backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center;
}
.perm-card {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg);
  padding: 22px; width: 560px; max-width: 92vw; box-shadow: var(--shadow-pop);
}
.perm-title { font-size: 16px; font-weight: 700; margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
.perm-title::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--warn); box-shadow: 0 0 0 4px var(--warn-soft); }
.perm-tool { color: var(--brand); font-size: 14px; font-weight: 600; margin-bottom: 6px; font-family: var(--mono); }
.perm-desc { color: var(--muted-foreground); font-size: 13px; margin-bottom: 10px; }
.perm-input {
  background: var(--code-bg); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px;
  font-size: 12px; font-family: var(--mono); white-space: pre-wrap; word-break: break-all;
  max-height: 300px; overflow-y: auto; color: var(--foreground); margin-bottom: 16px;
}
.perm-actions { display: flex; justify-content: flex-end; gap: 10px; }
.perm-actions .btn { height: 38px; padding: 0 20px; }

/* 滚动条 */
* { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }

/* 窄屏 */
@media (max-width: 640px) {
  .rail { width: 56px; }
  .chat-head :is(#chat-title, [data-pid="chat-title"]) { max-width: 35%; }
  .chat-head .btn { padding: 0 10px; }
}

/* 面板覆盖在空状态之上 */
.term-area, .file-area, .claude-area { position: relative; z-index: 1; background: var(--page); }
.theme-switching *, .theme-switching *::before, .theme-switching *::after { transition: none !important; }

/* =====================  第五轮：智能体对话 + 余量  ===================== */
/* 内容区 = 标签栏 + 舞台 */
.content { display: flex; flex-direction: column; }
.stage { flex: 1; min-height: 0; position: relative; display: flex; flex-direction: column; }
.tabbar {
  height: 46px; flex-shrink: 0; display: flex; align-items: flex-end; gap: 6px; padding: 0 10px 0 8px;
  background: var(--page-2); border-bottom: 1px solid var(--border);
}
.tabs { flex: 1; min-width: 0; display: flex; align-items: flex-end; gap: 4px; overflow-x: auto; scrollbar-width: none; height: 100%; }
.tabs::-webkit-scrollbar { display: none; }
.tabs .tab {
  position: relative; flex-shrink: 0; width: auto; height: 36px; max-width: 220px; min-width: 96px;
  display: flex; align-items: center; gap: 7px; padding: 0 8px 0 12px; margin: 0;
  border: 1px solid transparent; border-bottom: 0; border-radius: 10px 10px 0 0;
  background: transparent; color: var(--muted-foreground); font: 500 13px var(--font); cursor: pointer;
}
.tabs .tab:hover { background: var(--surface-2); color: var(--foreground); border-color: transparent; }
.tabs .tab.active { background: var(--page); color: var(--foreground); border-color: var(--border); }
.tabs .tab.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--page); }
.tab-ico { width: 15px; height: 15px; flex-shrink: 0; }
.tabs .tab.claude .tab-ico { color: var(--brand); }
.tab-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tab-x {
  width: 20px; height: 20px; border: 0; border-radius: 6px; background: transparent; color: var(--hint);
  display: flex; align-items: center; justify-content: center; opacity: 0; flex-shrink: 0;
}
.tab-x svg { width: 13px; height: 13px; }
.tabs .tab:hover .tab-x, .tabs .tab.active .tab-x { opacity: 1; }
.tab-x:hover { background: var(--danger-soft); color: var(--danger); }
.tabs .tab.running .tab-ico { animation: pulse 1.4s ease-in-out infinite; }
.tabs .tab.need-perm::after { content: ""; position: absolute; top: 6px; right: 6px; width: 8px; height: 8px; border-radius: 50%; background: var(--danger); border: 0; }
.tabs .tab.gone { opacity: .5; }
@keyframes pulse { 50% { opacity: .35; } }
.tab-add {
  width: 32px; height: 32px; margin-bottom: 7px; border-radius: 9px; border: 1px solid var(--border);
  background: var(--surface); color: var(--muted-foreground); display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.tab-add:hover { color: var(--brand); border-color: var(--brand); }
.tab-add svg { width: 16px; height: 16px; }

/* 欢迎页 */
.welcome { position: absolute; inset: 0; z-index: 1; display: flex; align-items: center; justify-content: center; background: var(--page); overflow-y: auto; }
.welcome-inner { width: 100%; max-width: 560px; padding: 32px 20px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.welcome-logo { width: 54px; height: 54px; margin-bottom: 16px; }
.welcome-title { font-size: 22px; font-weight: 700; }
.welcome-sub { color: var(--hint); font-size: 13px; margin-top: 8px; line-height: 1.6; }
.quick { display: flex; gap: 22px; margin: 30px 0 8px; }
.quick-btn { display: flex; flex-direction: column; align-items: center; gap: 9px; border: 0; background: transparent; color: var(--muted-foreground); font-size: 13px; }
.quick-btn:hover { color: var(--foreground); }
.q-ico {
  width: 60px; height: 60px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: var(--surface); border: 1px solid var(--border); color: var(--foreground); box-shadow: var(--shadow-card); transition: transform .15s;
}
.q-ico.brand { background: var(--brand); border-color: transparent; color: var(--on-brand); }
.quick-btn:hover .q-ico { transform: translateY(-2px); }
.q-ico svg { width: 26px; height: 26px; }
.recent { width: 100%; margin-top: 26px; display: flex; flex-direction: column; gap: 6px; text-align: left; }
.recent-title { font-size: 12px; color: var(--hint); margin: 0 0 4px 4px; }
.recent-row {
  display: grid; grid-template-columns: 18px 1fr auto; grid-template-rows: auto auto; column-gap: 10px; row-gap: 2px; align-items: center;
  padding: 10px 14px; border-radius: var(--radius); border: 1px solid var(--border); background: var(--surface); color: var(--foreground); text-align: left;
}
.recent-row:hover { border-color: var(--brand); }
.recent-row svg { width: 16px; height: 16px; color: var(--brand); grid-row: 1 / 3; }
.r-label { font-size: 14px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.r-cwd { grid-column: 2; font-size: 12px; color: var(--hint); font-family: var(--mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.r-time { grid-column: 3; grid-row: 1 / 3; font-size: 12px; color: var(--hint); }

/* 侧栏额度圆环 */
.quota { flex: 1; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 10px; padding-bottom: 8px; }
.quota-item { border: 0; background: transparent; display: flex; flex-direction: column; align-items: center; gap: 2px; color: var(--muted-foreground); padding: 2px; border-radius: 10px; }
.quota-item:hover { background: var(--surface-2); }
.ring { width: 38px; height: 38px; }
.ring-bg { fill: none; stroke: var(--border-strong); stroke-width: 3.2; }
.ring-fg { fill: none; stroke-width: 3.2; stroke-linecap: round; transition: stroke-dasharray .4s; }
.ring.ok .ring-fg { stroke: var(--brand); }
.ring.warn .ring-fg { stroke: var(--warn); }
.ring.bad .ring-fg { stroke: var(--danger); }
.ring text { font: 600 10.5px var(--font); fill: var(--foreground); }
.quota-sub { font-size: 10px; color: var(--hint); font-family: var(--mono); }
.quota-cost { font-size: 11px; font-weight: 600; color: var(--foreground); font-family: var(--mono); }

/* 聊天头部用量 */
.chat-usage { font-size: 12px; color: var(--hint); font-family: var(--mono); white-space: nowrap; font-weight: 400; margin-right: 4px; }
:is(#chat-title, [data-pid="chat-title"]) { cursor: text; }

/* 消息区 */
.chat-scroll-wrap { flex: 1; min-height: 0; position: relative; display: flex; flex-direction: column; }
.chat-msgs { gap: 18px; }
/* r136：居中贴在输入框正上方（原来贴整块最右边，宽屏下落在留白里、白底白圆看不出来）；深色实心圆，上翻时一眼能看到 */
.to-bottom {
  position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); width: 40px; height: 40px; border-radius: 50%;
  border: 0; background: var(--foreground); color: var(--page); box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
  display: flex; align-items: center; justify-content: center; z-index: 2; cursor: pointer; opacity: .88; transition: opacity .15s;
}
.to-bottom:hover { opacity: 1; }
.to-bottom svg { width: 20px; height: 20px; }
.to-bottom.has-new::after { content: ""; position: absolute; top: 0; right: 0; width: 11px; height: 11px; border-radius: 50%; background: var(--brand); border: 2px solid var(--page); }
.msg.user { display: flex; align-items: flex-start; gap: 6px; }
.copy-btn {
  width: 26px; height: 26px; border: 0; border-radius: 7px; background: transparent; color: var(--hint);
  display: inline-flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .15s; flex-shrink: 0;
}
.copy-btn svg { width: 15px; height: 15px; }
.copy-btn:hover { background: var(--surface-2); color: var(--foreground); }
.copy-btn.done { color: var(--ok); opacity: 1; background: color-mix(in srgb, var(--ok) 14%, transparent); position: relative; }
.copy-btn.done svg { width: 16px; height: 16px; animation: copy-pop .25s ease-out; }
.copy-tip { position: absolute; right: calc(100% + 4px); top: 50%; transform: translateY(-50%); padding: 2px 7px; border-radius: 6px; background: var(--ok); color: #fff; font-size: 12px; line-height: 18px; white-space: nowrap; pointer-events: none; animation: copy-tip-in .15s ease-out; }
@keyframes copy-pop { from { transform: scale(.5); } 60% { transform: scale(1.2); } to { transform: scale(1); } }
@keyframes copy-tip-in { from { opacity: 0; transform: translate(4px, -50%); } }
.msg.user:hover .copy-btn, .turn:hover .copy-btn { opacity: 1; }
/* 代码块复制按钮：常显，不随横向滚动走 */
.pre-wrap { position: relative; }
.pre-wrap pre { padding-right: 76px !important; }
.copy-btn.pre-copy {
  position: absolute; top: 6px; right: 6px; z-index: 1; width: auto; padding: 0 8px; gap: 4px;
  opacity: 1; font-size: 12px; background: var(--surface); border: 1px solid var(--border); color: var(--muted-foreground);
}
.copy-btn.pre-copy svg { width: 13px; height: 13px; }
.turn { display: flex; gap: 12px; align-items: flex-start; max-width: 880px; width: 100%; align-self: flex-start; }
.avatar {
  width: 30px; height: 30px; border-radius: 9px; flex-shrink: 0; margin-top: 2px;
  background: var(--brand-soft-2); color: var(--brand); display: flex; align-items: center; justify-content: center;
}
.avatar svg { width: 17px; height: 17px; }
.turn-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.turn-body .msg.assistant { width: 100%; max-width: none; }
.turn-body .msg.assistant .bubble { border-bottom-left-radius: var(--radius); }
.msg.assistant.live .bubble { white-space: normal; opacity: 1; }
.msg.assistant.live .bubble > :last-child::after {
  content: ""; display: inline-block; width: 7px; height: 1.05em; margin-left: 3px; vertical-align: -2px;
  background: var(--brand); border-radius: 2px; animation: blink 1s steps(2) infinite;
}
.msg.assistant.live .bubble:empty::after { content: ""; display: inline-block; width: 7px; height: 1.05em; background: var(--brand); border-radius: 2px; animation: blink 1s steps(2) infinite; }
@keyframes blink { 50% { opacity: 0; } }
.turn-foot { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--hint); padding-left: 2px; }

/* 思考卡片 */
.think-card { border: 1px dashed var(--border-strong); border-radius: var(--radius-sm); background: transparent; }
.think-head { display: flex; align-items: center; gap: 8px; padding: 7px 12px; font-size: 12.5px; color: var(--muted-foreground); cursor: pointer; user-select: none; }
.think-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--hint); }
.think-card.running .think-dot { background: var(--brand); animation: pulse 1s ease-in-out infinite; }
.think-caret { width: 14px; height: 14px; margin-left: auto; color: var(--hint); }
.think-body { padding: 0 12px 10px 27px; font-size: 13px; color: var(--muted-foreground); white-space: pre-wrap; line-height: 1.6; max-height: 320px; overflow-y: auto; }
.think-body.collapsed { display: none; }

/* 工具卡片（调用 + 结果合并） */
.tool-card .tc-head { color: var(--muted-foreground); }
.tc-state { width: 16px; height: 16px; border-radius: 50%; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; font-size: 10px; }
.tool-card.pending .tc-state { border: 2px solid var(--brand-soft-2); border-top-color: var(--brand); animation: spin .8s linear infinite; }
.tool-card.ok .tc-state { background: rgba(60, 201, 126, .16); color: var(--ok); }
.tool-card.ok .tc-state::before { content: "✓"; }
.tool-card.error .tc-state { background: var(--danger-soft); color: var(--danger); }
.tool-card.error .tc-state::before { content: "✗"; }
@keyframes spin { to { transform: rotate(360deg); } }
.tc-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tool-card .tc-body { padding: 0; }
.tc-sec { padding: 10px 12px; white-space: pre-wrap; word-break: break-all; }
.tc-sec:empty { display: none; }
.tc-out { border-top: 1px dashed var(--border); color: var(--foreground); opacity: .85; }
.tool-card.error .tc-out { color: var(--danger); }

/* 输入区 + 状态条 */
.composer { border-top: 1px solid var(--border); background: var(--page-2); padding: 10px max(18px, calc((100% - 880px) / 2)) 16px; }
.composer .chat-input-row { border: 0; padding: 0; background: transparent; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.chips:empty { display: none; }
.chip {
  display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px; border-radius: 999px;
  border: 1px solid var(--border); background: var(--surface); color: var(--muted-foreground); font-size: 12px; font-family: var(--mono);
}
.chip svg { width: 13px; height: 13px; }
.chip.static { cursor: default; }
button.chip:hover { border-color: var(--brand); color: var(--brand); }
.chip.warn { color: var(--warn); border-color: var(--warn); }

/* 弹窗：新建会话 / 用量 */
.modal-title { font-size: 16px; font-weight: 700; margin-bottom: 14px; }
.text-input {
  width: 100%; height: 42px; padding: 0 12px; border-radius: var(--radius-sm); border: 1px solid var(--border-strong);
  background: var(--page-2); color: var(--foreground); font: 14px var(--mono);
}
.text-input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft-2); }
.chip-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.chip-row .chip { cursor: pointer; }
.usage-card { width: 600px; }
.usage-sec { margin-bottom: 16px; }
.usage-h { font-size: 12px; color: var(--hint); margin-bottom: 10px; }
.bar-row { display: grid; grid-template-columns: 90px 1fr auto; align-items: center; gap: 12px; margin-bottom: 8px; font-size: 13px; }
.bar { height: 8px; border-radius: 99px; background: var(--surface-3); overflow: hidden; }
.bar-fill { display: block; height: 100%; border-radius: 99px; background: var(--brand); }
.bar-fill.warn { background: var(--warn); }
.bar-fill.bad { background: var(--danger); }
.bar-val { font-size: 12px; color: var(--muted-foreground); font-family: var(--mono); }
.usage-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 12px; }
.usage-cell { border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; background: var(--page-2); }
.uc-name { font-size: 12px; color: var(--hint); }
.uc-cost { font-size: 20px; font-weight: 700; margin: 4px 0; font-family: var(--mono); }
.uc-meta { font-size: 11.5px; color: var(--muted-foreground); line-height: 1.5; }
.usage-note { font-size: 12px; color: var(--hint); line-height: 1.6; margin-bottom: 8px; }
@media (max-width: 640px) {
  .usage-grid { grid-template-columns: 1fr; }
  .chat-usage { display: none; }
  .tabs .tab { min-width: 72px; }
}

/* =====================  第六轮：历史对话栏  ===================== */
.history {
  width: 248px; flex-shrink: 0; display: flex; flex-direction: column; min-height: 0;
  background: var(--page-2); border-right: 1px solid var(--border);
}
.history.collapsed { display: none; }
.history-head {
  height: 46px; flex-shrink: 0; display: flex; align-items: center; justify-content: space-between;
  padding: 0 10px 0 16px; border-bottom: 1px solid var(--border); font-size: 13px; font-weight: 600; color: var(--muted-foreground);
}
.btn.small { height: 28px; padding: 0 10px; font-size: 12px; border-radius: 8px; }
.btn.small svg { width: 13px; height: 13px; }
.history-list { flex: 1; overflow-y: auto; padding: 8px; display: flex; flex-direction: column; gap: 2px; }
.h-group { font-size: 11px; color: var(--hint); padding: 10px 8px 4px; }
.h-item {
  position: relative; display: flex; flex-direction: column; gap: 2px; padding: 8px 30px 8px 10px; border-radius: 9px;
  cursor: pointer; border: 1px solid transparent;
}
.h-item:hover { background: var(--surface); }
.h-item.active { background: var(--brand-soft); border-color: var(--brand-soft-2); }
.h-label { font-size: 13px; color: var(--foreground); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; align-items: center; gap: 6px; }
.h-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; background: transparent; }
.h-item.live .h-dot { background: var(--ok); }
.h-item.running .h-dot { width: 11px; height: 11px; margin: 0 -2px 0 -3px; background: transparent; border: 2px solid var(--brand-soft-2); border-top-color: var(--brand); animation: spin .8s linear infinite; }   /* 正在干活：转圈 */
.h-meta { font-size: 11px; color: var(--hint); font-family: var(--mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-left: 12px; }
.h-del {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 22px; height: 22px; border: 0; border-radius: 6px;
  background: transparent; color: var(--hint); display: none; align-items: center; justify-content: center;
}
.h-del svg { width: 14px; height: 14px; }
.h-item:hover .h-del { display: flex; }
.h-del:hover { background: var(--danger-soft); color: var(--danger); }
.h-empty { font-size: 12px; color: var(--hint); padding: 16px 10px; text-align: center; }
.rail-btn.on { background: var(--brand-soft); color: var(--brand); }
.tabs .tab.stopped .tab-ico { opacity: .45; }
@media (max-width: 900px) { .history { position: absolute; left: 64px; top: 0; bottom: 0; z-index: 20; box-shadow: var(--shadow-pop); } }
@media (max-width: 640px) { .history { left: 56px; width: 220px; } }
.main { position: relative; }

/* =====================  第七轮：对照参考图打磨  ===================== */
:root, [data-theme="dark"] { --tabbar-bg: #1b1a22; --tabbar-fg: #a8a3b8; --tabbar-active: #2c2a37; --bubble-ai: #1d1c25; --bubble-user: rgba(142,131,176,.26); }
[data-theme="light"] { --tabbar-bg: #57536a; --tabbar-fg: #d9d6e3; --tabbar-active: rgba(255,255,255,.16); --bubble-ai: #f1f1f3; --bubble-user: #e6e3f0; }

/* 侧栏移到右侧：额度在上，带文字的导航在下 */
.rail { order: 3; border-right: 0; border-left: 1px solid var(--border); width: 72px; padding: 14px 0 12px; }
.history { order: 0; }
.content { order: 1; }
.quota { flex: none; justify-content: flex-start; padding: 0 0 8px; gap: 12px; }
.rail-nav { margin-top: auto; display: flex; flex-direction: column; align-items: center; gap: 4px; padding-bottom: 10px; }
.rail-btn.labeled { width: 58px; height: 52px; flex-direction: column; gap: 3px; font-size: 11px; border-radius: 10px; }
.rail-btn.labeled svg { width: 20px; height: 20px; }
.rail-btn.labeled.on, .rail-btn.labeled.current { color: var(--brand); background: var(--brand-soft); }
.rail-foot { margin-top: 0; gap: 8px; padding-top: 10px; border-top: 1px solid var(--border); width: 44px; }
@media (max-width: 900px) { .history { left: auto; right: 72px; } }
@media (max-width: 640px) { .rail { width: 60px; } .rail-btn.labeled { width: 50px; } .history { right: 60px; left: auto; } }

/* 标签栏：深色条 + 浅色文字 */
.tabbar { background: var(--tabbar-bg); border-bottom: 0; height: 48px; padding: 0 8px; align-items: center; }
.tabs { align-items: center; gap: 2px; }
.tabs .tab { height: 36px; border-radius: 9px; border: 0; color: var(--tabbar-fg); font-size: 14px; padding: 0 8px 0 14px; }
.tabs .tab:hover { background: rgba(255,255,255,.07); color: #fff; }
.tabs .tab.active { background: var(--tabbar-active); color: #fff; font-weight: 600; }
.tabs .tab.active::after { display: none; }
.tabs .tab.claude .tab-ico { color: inherit; opacity: .85; }
.tab-x { color: inherit; opacity: 0; }
.tab-x:hover { background: rgba(255,255,255,.14); color: #fff; }
.tab-add { margin: 0; border: 0; background: rgba(255,255,255,.1); color: #fff; width: 34px; height: 34px; }
.tab-add:hover { background: rgba(255,255,255,.2); color: #fff; }

/* 对话：更大的字号与留白；用户头像 + 复制/编辑；页脚居中 */
.chat-msgs { gap: 22px; padding-top: 26px; }
.msg .bubble { font-size: 15px; line-height: 1.8; padding: 14px 18px; border-radius: 14px; }
.msg.assistant .bubble { background: var(--bubble-ai); border: 0; box-shadow: none; }
.msg.user .bubble { background: var(--bubble-user); border-radius: 14px; }
.msg.user { align-items: flex-start; gap: 10px; max-width: min(760px, 88%); }
.msg.user .u-tools { display: flex; flex-direction: column; gap: 2px; padding-top: 4px; }   /* r78：复制和小笔常显 */
.msg.user .u-tools .copy-btn { opacity: 1; }
.u-avatar, .avatar {
  width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  font-size: 15px; font-weight: 700;
}
.u-avatar { background: var(--surface-3); color: var(--foreground); }
.avatar { background: var(--brand); color: var(--on-brand); margin-top: 0; }
.avatar svg { width: 20px; height: 20px; }
.turn { gap: 14px; max-width: 920px; }
.turn-foot { justify-content: center; font-size: 12.5px; padding: 6px 0 0; margin-left: -50px; }
.turn-foot .copy-btn { margin-left: 4px; }
.chat-msgs, .chat-input-row, .composer { --chat-max: 920px; }
.chat-msgs { padding-left: max(18px, calc((100% - 920px) / 2)); padding-right: max(18px, calc((100% - 920px) / 2)); }

/* 输入区：工具栏标签（胶囊） + 附件/清空 */
.composer { padding: 10px max(18px, calc((100% - 920px) / 2)) 14px; }
.chips { gap: 8px; margin-bottom: 10px; }
.chip {
  height: 32px; padding: 0 12px; border: 0; background: var(--surface-2); color: var(--foreground);
  font: 500 13px var(--font); gap: 6px; border-radius: 999px;
}
.chip svg { width: 14px; height: 14px; color: var(--muted-foreground); }
.chip .badge { font: 600 11px var(--mono); padding: 1px 6px; border-radius: 6px; background: var(--surface-3); color: var(--muted-foreground); }
.chip .caret { width: 12px; height: 12px; color: var(--hint); }
.chip.folder svg { color: var(--warn); }
button.chip:hover { background: var(--surface-3); color: var(--foreground); }
.chip.danger { color: var(--danger); }
.batt { width: 26px; height: 12px; border-radius: 3px; border: 1.5px solid var(--muted-foreground); padding: 1px; position: relative; }
.batt::after { content: ""; position: absolute; right: -4px; top: 3px; width: 2px; height: 4px; border-radius: 1px; background: var(--muted-foreground); }
.batt i { display: block; height: 100%; border-radius: 1px; background: var(--brand); }
.chip.warn .batt i { background: var(--warn); }
.chat-input-row { align-items: center; gap: 8px; }
.input-wrap { flex: 1; min-width: 0; display: flex; }
.input-wrap textarea { flex: 1; }
.icon-btn.ghost { border: 0; background: transparent; }
.chat-input-row .icon-btn { width: 44px; height: 44px; border-radius: 12px; flex-shrink: 0; }
.chat-input-row .icon-btn svg { width: 19px; height: 19px; }
.chat-input-row .btn.primary { height: 48px; padding: 0 24px; font-size: 15px; }

/* 终端分屏 */
.tui-pane { height: var(--tui-h, 42%); min-height: 120px; flex-shrink: 0; background: var(--term-bg); padding: 8px 6px 4px 10px; position: relative; }
.tui-host { position: absolute; inset: 8px 6px 4px 10px; }
.tui-split { height: 10px; flex-shrink: 0; cursor: row-resize; background: var(--page-2); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); position: relative; }
.tui-split::after { content: ""; position: absolute; left: 50%; top: 3px; width: 40px; height: 3px; margin-left: -20px; border-radius: 3px; background: var(--border-strong); }
.tui-split.folded { cursor: default; }
.tui-split.folded::after { display: none; }
.tui-fold { position: absolute; right: 48px; top: 100%; margin-top: -1px; z-index: 5; width: 44px; height: 22px; display: flex; align-items: center; justify-content: center; padding: 0; cursor: pointer;
  background: var(--page-2); color: var(--muted-foreground); border: 1px solid var(--border); border-top: 0; border-radius: 0 0 9px 9px; }
.tui-fold:hover { color: var(--brand); }
.tui-fold svg { width: 16px; height: 16px; transform: rotate(180deg); transition: transform .18s; }
.tui-split.folded .tui-fold svg { transform: none; }
#chat-term svg { width: 15px; height: 15px; }
#chat-term.on { background: var(--brand-soft); color: var(--brand); border-color: var(--brand); }

/* 下拉菜单 */
.menu {
  position: fixed; z-index: 60; min-width: 200px; padding: 6px; border-radius: 12px; background: var(--surface);
  border: 1px solid var(--border); box-shadow: var(--shadow-pop);
}
.menu-h { font-size: 11px; color: var(--hint); padding: 6px 10px 4px; }
.menu-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border: 0; border-radius: 8px; background: transparent; color: var(--foreground); font-size: 13px; text-align: left; }
.menu-item:hover { background: var(--surface-2); }
.menu-item .mi-sub { margin-left: auto; font-size: 11.5px; color: var(--hint); }
.menu-item.sel { color: var(--brand); font-weight: 600; }
.menu-item.sel::before { content: "✓"; width: 12px; }
.menu-item:not(.sel)::before { content: ""; width: 12px; }

/* 配置（只读） */
.config-area { flex: 1; min-height: 0; overflow-y: auto; padding: 18px; }
.config-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 1100px) { .config-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .config-grid { grid-template-columns: 1fr; } }
.cfg-card { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; max-height: 520px; }
.cfg-head { background: var(--tabbar-bg); color: #fff; display: flex; align-items: center; gap: 10px; padding: 12px 16px; }
.cfg-head b { font-size: 16px; }
.cfg-head span { font-size: 12px; color: var(--tabbar-fg); }
.cfg-head .cnt { margin-left: auto; background: rgba(255,255,255,.14); padding: 2px 10px; border-radius: 7px; font: 600 13px var(--mono); color: #fff; }
.cfg-list { overflow-y: auto; }
.cfg-item { padding: 12px 16px; border-bottom: 1px solid var(--border); }
.cfg-item:last-child { border-bottom: 0; }
.cfg-row { display: flex; align-items: center; gap: 8px; }
.cfg-name { font-size: 14.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cfg-tag { margin-left: auto; flex-shrink: 0; font-size: 11.5px; padding: 2px 8px; border-radius: 6px; background: var(--surface-2); color: var(--muted-foreground); }
.cfg-desc { margin-top: 4px; font-size: 12.5px; color: var(--hint); line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; word-break: break-all; }
.cfg-mono { font-family: var(--mono); font-size: 12px; }
.cfg-empty { padding: 18px 16px; font-size: 12.5px; color: var(--hint); }

/* 头部：按钮与状态不换行，由标题/用量文字省略截断 */
.chat-head .btn, .chat-head .chat-status { white-space: nowrap; flex-shrink: 0; }
:is(#chat-title, [data-pid="chat-title"]) { flex: 0 1 auto; min-width: 60px; max-width: none; }
.chat-head .spacer { flex: 1 1 0; min-width: 8px; }
.chat-usage { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1100px) { .chat-head .btn svg { display: none; } }

/* =====================  第八轮：网页丢图 + 按新参考图调优  ===================== */
/* 图片托盘 */
.img-tray { margin-bottom: 10px; }
.img-list { display: flex; flex-wrap: wrap; gap: 8px; }
.img-thumb { position: relative; width: 72px; height: 72px; border-radius: 10px; overflow: hidden; border: 1px solid var(--border); background: var(--surface-2); }
.img-thumb img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; display: block; }
.img-thumb.uploading img { opacity: .45; }
.img-thumb.err { border-color: var(--danger); }
.img-x { position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; border-radius: 50%; border: 0; background: rgba(0,0,0,.6); color: #fff; display: flex; align-items: center; justify-content: center; }
.img-x svg { width: 12px; height: 12px; }
.img-spin { position: absolute; left: 50%; top: 50%; width: 22px; height: 22px; margin: -11px; border-radius: 50%; border: 2.5px solid rgba(255,255,255,.4); border-top-color: var(--brand); animation: spin .8s linear infinite; }
.img-err { position: absolute; left: 4px; bottom: 4px; width: 18px; height: 18px; border-radius: 50%; background: var(--danger); color: #fff; font: 700 12px/18px var(--font); text-align: center; }
.img-note { margin-top: 6px; font-size: 11.5px; color: var(--hint); line-height: 1.5; }
.img-note b { color: var(--warn); font-weight: 600; }
/* 气泡里的图片 */
.msg-imgs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.msg-imgs:only-child { margin-bottom: 0; }
.msg-img { max-width: 220px; max-height: 180px; border-radius: 10px; cursor: zoom-in; display: block; background: var(--surface-3); object-fit: cover; }
.msg-img.loading { width: 120px; height: 90px; }
.msg-img.gone { width: 120px; height: 60px; cursor: default; opacity: .5; }
.lightbox { position: fixed; inset: 0; z-index: 80; background: rgba(0,0,0,.82); display: flex; align-items: center; justify-content: center; cursor: zoom-out; padding: 24px; }
.lightbox img { max-width: 100%; max-height: 100%; border-radius: 8px; box-shadow: 0 20px 80px rgba(0,0,0,.6); }
/* 拖拽遮罩 */
.chat-scroll-wrap { position: relative; }
.drop-hint {
  position: absolute; inset: 10px; z-index: 5; border: 2px dashed var(--brand); border-radius: 16px; background: var(--brand-soft);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--brand); font-size: 15px; pointer-events: none;
}
.drop-hint svg { width: 40px; height: 40px; }

/* 运行指示：永远排在消息流最后 */
.run-ind { order: 9999; display: flex; align-items: center; gap: 12px; max-width: 920px; }
.run-pill { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 14px; background: var(--bubble-ai); font-size: 14px; color: var(--muted-foreground); }
.run-time { font-family: var(--mono); color: var(--hint); }
.run-dots { display: inline-flex; gap: 4px; }
.run-dots i { width: 5px; height: 5px; border-radius: 50%; background: var(--hint); animation: pulse 1.2s ease-in-out infinite; }
.run-dots i:nth-child(2) { animation-delay: .2s; } .run-dots i:nth-child(3) { animation-delay: .4s; }
.run-stop { border: 0; border-radius: 999px; padding: 8px 14px; background: var(--danger-soft); color: var(--danger); font-size: 13.5px; font-weight: 500; }
.run-stop:hover { filter: brightness(1.1); }
.load-more { order: -1; align-self: center; border: 0; border-radius: 999px; padding: 7px 16px; background: var(--surface-2); color: var(--muted-foreground); font-size: 12.5px; }
.load-more:hover { color: var(--foreground); }
.tab-spin { width: 14px; height: 14px; flex-shrink: 0; border-radius: 50%; border: 2px solid rgba(255,255,255,.25); border-top-color: currentColor; animation: spin .9s linear infinite; }

/* 历史栏：按项目分组 */
.history { width: 280px; }
.history-tools { display: flex; gap: 6px; padding: 8px 8px 4px; }
.search-box { flex: 1; min-width: 0; display: flex; align-items: center; gap: 6px; height: 32px; padding: 0 10px; border-radius: 9px; border: 1px solid var(--border); background: var(--surface); }
.search-box svg { width: 14px; height: 14px; color: var(--hint); flex-shrink: 0; }
.search-box input { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--foreground); font-size: 12.5px; }
.search-box.small { flex: 0 1 200px; }
.h-proj { display: flex; align-items: center; gap: 6px; padding: 9px 8px 5px; cursor: pointer; user-select: none; }
.h-proj:hover .h-pname { color: var(--foreground); }
.h-caret { width: 12px; height: 12px; color: var(--hint); transition: transform .15s; flex-shrink: 0; }
.h-proj.closed .h-caret { transform: rotate(-90deg); }
.h-pname { font-size: 12.5px; font-weight: 600; color: var(--muted-foreground); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.h-pbase { font: 11px var(--mono); color: var(--hint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* r137：改名会和别的卡重名时，在卡片头下面问一句 */
.h-merge { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0 8px 6px; padding: 7px 9px; border-radius: 8px; background: var(--warn-soft); font-size: 12.5px; color: var(--foreground); }
.h-merge-text { flex: 1 1 100%; min-width: 0; }
.h-merge button { border: 1px solid var(--border); border-radius: 6px; padding: 3px 9px; background: var(--surface); color: var(--foreground); font-size: 12px; cursor: pointer; }
.h-merge .h-merge-ok { background: var(--brand); border-color: var(--brand); color: var(--on-brand); }
.h-pcount { margin-left: auto; font: 10.5px var(--mono); color: var(--hint); }
.h-padd { width: 22px; height: 22px; border: 0; border-radius: 6px; background: transparent; color: var(--brand); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.h-padd svg { width: 14px; height: 14px; }
.h-padd:hover { background: var(--brand-soft); }
.h-pren { width: 22px; height: 22px; border: 0; border-radius: 6px; background: transparent; color: var(--muted-foreground); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.h-pren svg { width: 13px; height: 13px; }
.h-pren:hover { background: var(--page-2); color: var(--brand); }
.h-item { padding: 8px 10px 8px 12px; }
.h-label { gap: 6px; }
.h-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.h-ctx, .h-time { font: 10.5px var(--mono); color: var(--hint); flex-shrink: 0; }
.h-ctx.warn { color: var(--warn); }
.h-meta { padding-left: 12px; font-family: var(--font); font-size: 11.5px; }
.h-acts { position: absolute; right: 6px; bottom: 5px; display: none; gap: 2px; background: var(--surface); border-radius: 7px; padding: 1px; }
.h-item:hover .h-acts { display: flex; }
.h-item:has(.h-acts):hover .h-time, .h-item:has(.h-acts):hover .h-ctx { visibility: hidden; }
.h-acts button { width: 22px; height: 22px; border: 0; border-radius: 6px; background: transparent; color: var(--hint); display: flex; align-items: center; justify-content: center; }
.h-acts svg { width: 13px; height: 13px; }
.h-acts button:hover { background: var(--surface-2); color: var(--foreground); }
.h-acts .h-del:hover { background: var(--danger-soft); color: var(--danger); }
.h-acts .h-del { position: static; transform: none; display: flex; }

/* 菜单：圆点表示选中 + 容量徽标 */
.menu-item.sel::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--brand); margin: 0 2.5px; }
.menu-item:not(.sel)::before { width: 12px; }
.menu-item .badge { font: 600 10.5px var(--mono); padding: 1px 6px; border-radius: 5px; background: var(--surface-2); color: var(--muted-foreground); }
.mi-label { white-space: nowrap; }

/* 分段按钮 */
.seg { display: inline-flex; padding: 2px; border-radius: 9px; background: var(--surface-2); gap: 2px; }
.seg.wide { display: flex; margin-bottom: 14px; }
.seg.wide .seg-btn { flex: 1; }
.seg-btn { border: 0; border-radius: 7px; padding: 6px 12px; background: transparent; color: var(--muted-foreground); font-size: 13px; display: flex; align-items: center; justify-content: center; }
.seg-btn svg { width: 15px; height: 15px; }
.seg-btn.on { background: var(--surface); color: var(--foreground); box-shadow: var(--shadow-card); }

/* 文件面板 */
.file-head { padding: 14px 18px 10px; border-bottom: 1px solid var(--border); background: var(--page-2); display: flex; flex-direction: column; gap: 8px; }
.file-title-row { display: flex; align-items: center; gap: 6px; }
.file-title-row .crumb { font: 600 16px var(--font); color: var(--foreground); }
.file-title-row .crumb b { font-weight: 600; }
.file-sub-row { display: flex; align-items: center; gap: 12px; font-size: 12.5px; color: var(--hint); }
.link-btn { border: 0; background: transparent; color: var(--hint); font-size: 12.5px; display: inline-flex; align-items: center; gap: 4px; padding: 0; }
.link-btn svg { width: 13px; height: 13px; }
.link-btn:hover { color: var(--brand); }
.link-btn.done { color: var(--ok); }
.disk-info { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--muted-foreground); font-family: var(--mono); }
.disk-info.warn { color: var(--warn); } .disk-info.bad { color: var(--danger); }
.disk-bar { width: 80px; height: 5px; border-radius: 5px; background: var(--surface-3); overflow: hidden; }
.disk-bar i { display: block; height: 100%; background: var(--brand); }
.disk-bar.warn i { background: var(--warn); } .disk-bar.bad i { background: var(--danger); }
.file-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.file-toolbar .btn { height: 32px; }
.file-toolbar .btn svg { width: 14px; height: 14px; }
.file-toolbar .btn.on { background: var(--brand-soft); color: var(--brand); border-color: var(--brand-soft-2); }
.tb-sep { width: 1px; height: 20px; background: var(--border); margin: 0 4px; }
.f-ico { width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; color: var(--hint); flex-shrink: 0; }
.f-ico svg { width: 18px; height: 18px; }
.f-ico.dir { color: #d7a83f; }
.file-row .mtime { color: var(--hint); font: 12px var(--mono); min-width: 52px; text-align: right; }
.file-row .act svg { width: 14px; height: 14px; }
.file-list.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; align-content: start; }
.file-list.grid .file-row { height: 64px; border: 1px solid var(--border); background: var(--surface); }
.file-list.grid .f-ico { width: 40px; height: 40px; border-radius: 9px; background: var(--surface-2); }
.file-list.grid .f-ico svg { width: 22px; height: 22px; }
.file-list.grid .meta, .file-list.grid .mtime { display: none; }

/* =====================  第九轮：微信登录  ===================== */
.wx-btn {
  width: 100%; height: 50px; border: 0; border-radius: var(--radius); background: #07c160; color: #fff;
  font-size: 16px; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 8px;
}
.wx-btn svg { width: 22px; height: 22px; }
.wx-btn:hover { filter: brightness(1.05); }
.wx-panel { margin-top: 14px; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.wx-qr { width: 208px; height: 208px; padding: 8px; background: #fff; border-radius: 12px; border: 1px solid var(--border); position: relative; }
.wx-qr svg, .wx-qr img { width: 100%; height: 100%; display: block; }
.wx-qr.dim svg, .wx-qr.dim img { opacity: .15; }
.wx-qr .wx-over { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; font-size: 14px; color: #1b1e28; font-weight: 600; cursor: pointer; }
.wx-msg { font-size: 13.5px; color: var(--muted-foreground); text-align: center; line-height: 1.6; }
.wx-msg.ok { color: var(--ok); } .wx-msg.bad { color: var(--danger); }
.wx-mobile { display: flex; flex-direction: column; gap: 8px; width: 100%; }
.wx-mobile .btn { height: 42px; justify-content: center; }
.wx-tip { font-size: 12px; color: var(--hint); line-height: 1.6; text-align: center; }
.auth-or { display: flex; align-items: center; gap: 10px; color: var(--hint); font-size: 12px; margin: 16px 0 12px; }
.auth-or::before, .auth-or::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.pair-box summary { cursor: pointer; list-style: none; }
.pair-box summary::-webkit-details-marker { display: none; }
.pair-box:not([open]) summary::after { content: " ›"; }
.wx-card { width: 440px; }
.wx-state { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: var(--radius); background: var(--page-2); font-size: 13.5px; line-height: 1.6; margin-bottom: 12px; }
.wx-state svg { width: 26px; height: 26px; color: #07c160; flex-shrink: 0; }
.wx-bind-qr { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 8px 0 4px; }

/* =====================  第十轮：新视觉（己何 · 藏青 + 米金）+ 手机端  ===================== */
/* 浅色：暖米白纸面 + 藏青主色 + 米金点缀；暗色：深藏青底 + 米金主色 */
:root, [data-theme="dark"] {
  --page: #131a26; --page-2: #182030; --surface: #1d2638; --surface-2: #243046; --surface-3: #2d3a52;
  --foreground: #ebe6dc; --muted-foreground: #a3abba; --hint: #6f7a8e;
  --border: #253046; --border-strong: #34425c;
  --brand: #d8bf98; --brand-strong: #c9ab7d; --brand-ink: #f1e4cc;
  --brand-soft: rgba(216, 191, 152, .12); --brand-soft-2: rgba(216, 191, 152, .22); --on-brand: #1b2538;
  --code-bg: #0f1520; --term-bg: #0f1520; --term-fg: #e6e2da; --overlay: rgba(5, 8, 14, .6);
  --tabbar-bg: #182030; --tabbar-fg: #a3abba; --tabbar-active: #243046;
  --bubble-ai: transparent; --bubble-user: #26324a;
}
[data-theme="light"] {
  --page: #f6f3ed; --page-2: #efeae1; --surface: #ffffff; --surface-2: #f2eee6; --surface-3: #e7e1d5;
  --foreground: #1e2636; --muted-foreground: #5c6577; --hint: #9a9a98;
  --border: #e5dfd3; --border-strong: #d4ccbc;
  --brand: #24324c; --brand-strong: #24324c; --brand-ink: #1a2438;
  --brand-soft: rgba(36, 50, 76, .07); --brand-soft-2: rgba(36, 50, 76, .15); --on-brand: #f3e7d2;
  --code-bg: #f1ece3; --term-bg: #1d2638; --term-fg: #ebe6dc; --overlay: rgba(20, 26, 40, .34);
  --shadow-card: 0 1px 2px rgba(36, 40, 50, .05); --shadow-pop: 0 16px 48px rgba(36, 40, 60, .16);
  --tabbar-bg: #efeae1; --tabbar-fg: #5c6577; --tabbar-active: #ffffff;
  --bubble-ai: transparent; --bubble-user: #e9e3d6;
}
:root { --radius: 10px; --radius-lg: 14px; --radius-sm: 7px; }

/* 布局：窄导航栏回到左侧 → 对话列表 → 内容；顶部标签栏取消（会话都在左侧列表里） */
.rail { order: 0; width: 64px; border-left: 0; border-right: 1px solid var(--border); background: var(--page-2); padding: 12px 0; }
.history { order: 1; background: var(--page); }
.content { order: 2; }
.tabbar { display: none; }
.rail-logo { width: 30px; height: 30px; margin: 2px 0 14px; flex-shrink: 0; }
.quota { order: 3; flex: 0 0 auto; padding: 10px 0 6px; margin-top: auto; border-top: 1px solid var(--border); width: 48px; gap: 8px; }
.rail-nav { order: 1; margin-top: 0; gap: 2px; padding: 0; }
.rail-foot { order: 4; border-top: 0; padding-top: 6px; }
.rail-btn.labeled { width: 52px; height: 50px; border-radius: 9px; font-size: 10.5px; }
.rail-btn.labeled.on, .rail-btn.labeled.current { color: var(--brand); background: var(--brand-soft); }
.rail-btn.labeled.current::before { content: ""; position: absolute; left: -6px; top: 14px; bottom: 14px; width: 3px; border-radius: 2px; background: var(--brand); }
.rail-btn { position: relative; }
#new-claude { color: var(--brand); }
.ring { width: 34px; height: 34px; }
/* r148：额度圈多了（副号 5 小时、7 天），窗口矮时圈区自己滚，导航和「更新」不被挤出屏；上下边的淡影提示还能滚。再矮一点圈缩小 */
.quota-sub { white-space: pre-line; text-align: center; line-height: 1.2; }
.quota-item.stale { opacity: .5; }
@media (min-width: 761px) {
  .rail { min-height: 0; overflow: hidden; }
  .rail-logo, .rail-nav, .rail-foot { flex-shrink: 0; }
  .quota { flex: 0 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none;
    background: linear-gradient(var(--page-2) 30%, transparent) center top / 100% 14px no-repeat local,
      linear-gradient(transparent, var(--page-2) 70%) center bottom / 100% 14px no-repeat local,
      radial-gradient(farthest-side at 50% 0, var(--border-strong), transparent) center top / 100% 7px no-repeat scroll,
      radial-gradient(farthest-side at 50% 100%, var(--border-strong), transparent) center bottom / 100% 7px no-repeat scroll; }
  .quota::-webkit-scrollbar { display: none; }
}
@media (min-width: 761px) and (max-height: 760px) { .quota { gap: 4px; } .ring { width: 28px; height: 28px; } .quota-sub { font-size: 9.5px; } }
/* r149：再矮（高 500 时额度区只剩 54px），副号圈（圈 + 两行字）要能整个露出来 */
@media (min-width: 761px) and (max-height: 560px) { .ring { width: 24px; height: 24px; } .quota-sub { font-size: 9px; line-height: 1.05; } .quota-item { padding: 1px; gap: 1px; } }
@media (max-width: 900px) { .history { left: 64px; right: auto; } }

/* 对话列表 */
.history-head { border-bottom: 0; height: 52px; font-size: 15px; color: var(--foreground); }
.history-tools { padding: 0 10px 6px; }
.history-list { padding: 4px 8px 12px; }
.search-box { background: var(--surface-2); border-color: transparent; }
.search-box:focus-within { border-color: var(--brand); background: var(--surface); }
.h-item { border-radius: 8px; }
.h-item:hover { background: var(--surface-2); }
.h-item.active { background: var(--surface); border-color: var(--border); box-shadow: var(--shadow-card); }
.h-item.active .h-text { color: var(--brand); font-weight: 600; }
.h-item.term { padding-top: 7px; padding-bottom: 7px; }
.h-ico { width: 14px; height: 14px; color: var(--hint); flex-shrink: 0; }
.h-item.term.active .h-ico { color: var(--brand); }
.h-item.term .h-acts { bottom: auto; top: 50%; transform: translateY(-50%); }
.h-item.gone { opacity: .5; }
.h-pname { text-transform: none; letter-spacing: .02em; }
/* 项目是一层、对话是一层：项目行加底色和图标，对话往里缩、左边一条竖线 */
.h-proj { margin-top: 12px; padding: 7px 8px; background: var(--surface-2); border-radius: 8px; }
.h-proj:first-child { margin-top: 0; }
.h-proj .h-pname { font-size: 13.5px; font-weight: 700; color: var(--foreground); }
.h-pico { width: 15px; height: 15px; color: var(--brand); flex-shrink: 0; }
.h-item { margin-left: 12px; }
.h-pcard { margin-top: 14px; border: 1px solid var(--border); border-radius: 12px; overflow: hidden; padding-bottom: 4px; }
.h-pcard:first-child { margin-top: 0; }
.h-pcard > .h-proj { margin: 0 0 4px; border-radius: 0; padding: 10px 10px; background: var(--brand-soft-2); border-bottom: 1px solid var(--border); }
.h-pcard > .h-proj .h-pname { font-size: 14px; }
.h-pcard > .h-proj.closed { margin-bottom: 0; border-bottom: 0; }
.h-pcard:has(> .h-proj.closed) { padding-bottom: 0; }
.h-pcard > .h-item { margin: 0 4px 0 16px; }
.h-item::before { content: ""; position: absolute; left: -8px; top: 6px; bottom: 6px; border-left: 2px solid var(--border); border-radius: 2px; }
.h-item.active::before { border-color: var(--brand); }
.history-foot { display: none; }
.drawer-mask { display: none; }

/* 按钮 */
.btn.primary { background: var(--brand-strong); }
[data-theme="dark"] .btn.primary { background: var(--brand); }
.icon-btn.ghost { border-color: transparent; background: transparent; }
.icon-btn.ghost:hover { background: var(--surface-2); }
#chat-more { display: none; }

/* 聊天头：干净的白底 + 细分隔线 */
.chat-head, .file-head { background: var(--page); }
.chat-head { height: 54px; padding: 0 20px; }
:is(#chat-title, [data-pid="chat-title"]) { font-size: 15px; }
.chat-status { background: transparent; border: 1px solid var(--border); }
.chat-status.run { border-color: var(--brand-soft-2); }

/* 消息：助手回复不再套气泡，像文档一样平铺；用户消息用浅青底 */
.msg.assistant .bubble { padding: 2px 0; background: transparent; }
.msg.user .bubble { background: var(--bubble-user); border-radius: 16px 16px 4px 16px; padding: 11px 16px; }
.avatar { width: 28px; height: 28px; border-radius: 50%; background: var(--brand-soft-2); color: var(--brand); }
.avatar svg { width: 16px; height: 16px; }
.u-avatar { width: 28px; height: 28px; border-radius: 50%; font-size: 13px; }
.turn-foot { justify-content: flex-start; margin-left: 0; color: var(--hint); }
.msg .bubble pre { border-radius: 8px; }

/* 工具调用：一行一步，安静地列出；原始命令点开才看 */
.tool-card { border: 0; background: transparent; border-radius: 6px; }
.tool-card .tc-head { padding: 4px 6px; font-family: var(--font); font-size: 13px; border-radius: 6px; }
.tool-card .tc-head:hover { background: var(--surface-2); color: var(--foreground); }
.tool-card .tc-body { border: 1px solid var(--border); border-radius: 8px; margin: 2px 0 6px 28px; background: var(--code-bg); }
.tc-state { width: 14px; height: 14px; }
.tool-group { display: flex; flex-direction: column; gap: 0; }
.tg-head { align-self: flex-start; display: flex; align-items: center; gap: 6px; border: 0; background: transparent; color: var(--hint); font-size: 12.5px; padding: 3px 6px; border-radius: 6px; }
.tg-head:hover { color: var(--foreground); background: var(--surface-2); }
.tg-head svg { width: 13px; height: 13px; transform: rotate(-90deg); transition: transform .15s; }
.tool-group.open .tg-head svg { transform: none; }
.tool-group:not(.open) > .tool-card:not(:last-child) { display: none; }
.think-card { border: 0; }
.think-head { padding: 4px 6px; border-radius: 6px; }
.think-head:hover { background: var(--surface-2); }
.think-body { border-left: 2px solid var(--border); margin: 2px 0 6px 10px; padding: 4px 12px; }

/* 输入区：悬浮的圆角输入卡 */
.composer { border-top: 0; background: var(--page); padding-top: 4px; }
.composer .chat-input-row {
  background: var(--surface); border: 1px solid var(--border-strong); border-radius: 16px; padding: 6px 6px 6px 8px;
  box-shadow: var(--shadow-card); align-items: flex-end;
}
.composer .chat-input-row:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.composer .chat-input-row textarea { border: 0; box-shadow: none !important; background: transparent; min-height: 40px; padding: 9px 6px; }
.composer .chat-input-row .btn.primary { height: 38px; border-radius: 11px; padding: 0 18px; }
.composer .chat-input-row .icon-btn { border-color: transparent; background: transparent; width: 36px; height: 38px; }
.chip { background: transparent; }

/* 弹窗 / 菜单 */
.perm-card { border-radius: 16px; }
.cfg-head { background: var(--surface-2); color: var(--foreground); }
.cfg-head .cnt { background: var(--surface); color: var(--muted-foreground); }

/* 登录页 */
.login { background: radial-gradient(800px 380px at 50% -8%, var(--brand-soft-2), transparent 70%), var(--page); }

/* ---------- 平板：列表浮层 ---------- */
@media (max-width: 900px) {
  .history { position: absolute; top: 0; bottom: 0; left: 64px; z-index: 30; }
  .drawer-mask.show { display: block; position: absolute; inset: 0; z-index: 25; background: var(--overlay); }
}

/* ---------- 手机 ---------- */
@media (max-width: 760px) {
  html, body { height: 100%; height: 100dvh; overflow: hidden; }
  .main { flex-direction: column; }
  .content { order: 1; flex: 1; min-height: 0; }

  /* 导航栏变成底部标签栏 */
  .rail {
    order: 2; width: 100%; height: auto; flex-direction: row; justify-content: space-around; align-items: stretch;
    padding: 4px 4px calc(4px + env(safe-area-inset-bottom)); border-right: 0; border-top: 1px solid var(--border);
    background: var(--page); position: relative; z-index: 40;
  }
  body.kb-open .rail { display: none; }
  .rail-logo, .quota, .rail-foot, #new-claude { display: none; }
  .rail-nav { flex-direction: row; width: 100%; justify-content: space-around; gap: 0; padding: 0; }
  .rail-nav .rail-btn.labeled { flex: 1; width: auto; max-width: 80px; height: 52px; font-size: 11px; background: transparent; }
  .rail-btn.labeled.on, .rail-btn.labeled.current { background: transparent; }
  .rail-btn.labeled.current::before { display: none; }
  .rail-btn.labeled svg { width: 22px; height: 22px; }
  #go-chat { order: 1; } #toggle-history { order: 2; } #new-term { order: 3; } #open-files { order: 4; } #open-config { order: 5; } #open-nuan { order: 6; }

  /* 对话列表：左侧抽屉 */
  .history {
    position: fixed; top: 0; bottom: 0; left: 0; z-index: 60; width: min(86vw, 340px);
    display: flex !important; transform: translateX(0); transition: transform .22s ease;
    padding-top: env(safe-area-inset-top); box-shadow: var(--shadow-pop); border-right: 0;
  }
  .history.collapsed { transform: translateX(-105%); box-shadow: none; }
  .drawer-mask.show { position: fixed; z-index: 55; }
  .history-foot {
    display: flex; align-items: center; gap: 6px; padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--border);
  }
  .history-foot .dot { margin: 0 6px 0 4px; }
  .history-foot .icon-btn { width: 40px; height: 40px; }
  .h-item { padding: 11px 12px; }
  .h-label { font-size: 15px; }
  .h-proj { padding: 9px 10px; }
  .h-pcard > .h-proj .h-pname { font-size: 16px; }
  .h-meta { font-size: 12.5px; }

  /* 触屏没有 hover：操作按钮常显，时间让位 */
  .h-acts { display: flex; position: static; background: transparent; margin-top: 4px; padding-left: 8px; }
  .h-item.term .h-acts { position: absolute; transform: translateY(-50%); }
  .h-time { display: none; }
  .h-acts button { width: 32px; height: 32px; }
  .h-acts svg { width: 15px; height: 15px; }

  /* 聊天头：只留标题、状态和「更多」 */
  .chat-head { height: 50px; padding: 0 6px 0 14px; padding-top: env(safe-area-inset-top); height: calc(50px + env(safe-area-inset-top)); gap: 8px; }
  :is(#chat-title, [data-pid="chat-title"]) { font-size: 16px; max-width: none; flex: 1 1 auto; }
  .chat-head .spacer, .chat-usage, #chat-term, :is(#chat-interrupt, [data-pid="chat-interrupt"]), :is(#chat-delete, [data-pid="chat-delete"]) { display: none; }
  #chat-more { display: inline-flex; width: 40px; height: 40px; }
  #chat-more svg { width: 22px; height: 22px; }

  /* 消息区 */
  .chat-msgs { padding: 14px 14px 10px; gap: 16px; }
  .msg .bubble { font-size: 15.5px; line-height: 1.7; }
  .msg.user { max-width: 88%; }
  .msg.user .u-avatar, .msg.user .u-tools { display: none; }
  .turn { gap: 0; }
  .turn > .avatar { display: none; }
  .copy-btn { opacity: 1; }
  .to-bottom { bottom: 10px; }

  /* 输入区：贴底、16px 防止 iOS 自动放大 */
  .composer { padding: 6px 10px 8px; }
  body.kb-open .composer { padding-bottom: 8px; }
  .chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -10px 6px; padding: 0 10px; }
  .chips::-webkit-scrollbar { display: none; }
  .chip { flex-shrink: 0; height: 30px; }
  .chat-input-row textarea, input, .text-input, .search-box input { font-size: 16px !important; }
  :is(#chat-clear, [data-pid="chat-clear"]) { display: none; }
  .composer .chat-input-row { gap: 2px; border-radius: 22px; padding: 4px 4px 4px 4px; }
  .composer .chat-input-row .btn.primary { height: 40px; border-radius: 20px; padding: 0 16px; }
  .composer .chat-input-row .icon-btn { width: 38px; height: 40px; }
  .img-note { font-size: 11px; }

  /* 文件面板：工具条横向滑动，删除按钮常显 */
  .file-head { padding: calc(10px + env(safe-area-inset-top)) 12px 8px; }
  .file-toolbar { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -12px; padding: 0 12px 2px; }
  .file-toolbar::-webkit-scrollbar { display: none; }
  .file-toolbar > * { flex-shrink: 0; }
  .file-toolbar .btn { height: 36px; }
  .disk-info .disk-bar { display: none; }
  .file-list { padding: 6px 8px; }
  .file-row { height: 52px; font-size: 15px; }
  .file-row .meta { display: none; }
  .file-row .act { visibility: visible; }
  .file-list.grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* 终端：贴边 */
  .term-instance { inset: 0; border-radius: 0; border: 0; padding-top: calc(8px + env(safe-area-inset-top)); }

  /* 弹窗、菜单：从底部升起 */
  .perm-modal { align-items: flex-end; }
  .perm-card { width: 100%; max-width: 100%; border-radius: 18px 18px 0 0; padding: 20px 16px calc(16px + env(safe-area-inset-bottom)); max-height: 88dvh; overflow-y: auto; }
  .perm-actions .btn { flex: 1; height: 46px; justify-content: center; }
  .menu:not(.pop) {
    position: fixed !important; left: 0 !important; right: 0; top: auto !important; bottom: 0;
    width: 100%; max-width: none; border-radius: 18px 18px 0 0; padding-bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 90;
  }
  .menu-item { min-height: 48px; font-size: 15px; }
  .usage-card { width: 100%; }
}
@media (max-width: 760px) {
  :is(#chat-title, [data-pid="chat-title"]) { flex: 0 1 auto; min-width: 0; }
  #chat-more { margin-left: auto; }
}
.f-ico.dir { color: #c4a272; }
[data-theme="dark"] .rail-logo, [data-theme="dark"] .welcome-logo { filter: drop-shadow(0 0 0 1px rgba(216,191,152,.25)); }
/* 聊天头部只留标题和状态：中断用对话里的「停止回复」；终端的显示 / 收起在分隔条右边的小按钮（手机「…」菜单里也有） */
:is(#chat-interrupt, [data-pid="chat-interrupt"]), :is(#chat-delete, [data-pid="chat-delete"]), #chat-term { display: none !important; }
@media (max-width: 760px) { .tui-pane { height: var(--tui-h, 38%); padding: 4px 2px 2px 6px; } .tui-host { inset: 4px 2px 2px 6px; } .tui-split { height: 14px; } .tui-fold { right: 16px; width: 54px; height: 26px; } }

/* =====================  第十一轮：交互优化  ===================== */
/* 导航只留 对话 / 终端 / 文件 / 配置；列表的收起展开放到列表和聊天头部自己身上 */
#new-claude, #toggle-history { display: none !important; }
.history-head { gap: 6px; padding-right: 8px; }
#history-hide { width: 30px; height: 30px; }
#history-hide svg { width: 17px; height: 17px; }
#chat-list { display: none; width: 34px; height: 34px; margin-left: -8px; }
body.hist-closed #chat-list { display: inline-flex; }
@media (max-width: 900px) { #chat-list { display: inline-flex; } }

/* 断线提示条 */
.net-banner {
  flex-shrink: 0; display: flex; align-items: center; justify-content: center; gap: 8px; height: 32px;
  font-size: 13px; background: var(--warn-soft); color: var(--warn); border-bottom: 1px solid var(--border);
}
.net-banner .nb-dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; animation: pulse 1s ease-in-out infinite; }
.net-banner.ok { background: rgba(31, 157, 90, .1); color: var(--ok); }
.net-banner.ok .nb-dot { animation: none; }

/* 终端快捷键（只在触屏设备出现） */
.term-keys { display: none; }
@media (hover: none) {
  .term-keys {
    display: flex; position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; gap: 6px; padding: 6px 8px;
    overflow-x: auto; scrollbar-width: none; background: var(--page); border-top: 1px solid var(--border);
  }
  .term-keys::-webkit-scrollbar { display: none; }
  .term-keys button {
    flex-shrink: 0; min-width: 46px; height: 36px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--border-strong);
    background: var(--surface); color: var(--foreground); font: 500 14px var(--mono);
  }
  .term-keys button:active { background: var(--brand); color: var(--on-brand); }
  .term-instance { bottom: 49px !important; }
}

/* 新建对话：项目列表 */
.proj-list { display: flex; flex-direction: column; gap: 4px; max-height: 300px; overflow-y: auto; }
.proj-row {
  display: grid; grid-template-columns: 20px 1fr auto; grid-template-rows: auto auto; column-gap: 10px; align-items: center;
  padding: 10px 12px; border-radius: 10px; border: 1px solid var(--border); background: var(--surface); color: var(--foreground); text-align: left;
}
.proj-row:hover { border-color: var(--brand); background: var(--brand-soft); }
.proj-row.cur { border-color: var(--brand-soft-2); }
.proj-row svg { width: 18px; height: 18px; color: #c4a272; grid-row: 1 / 3; }
.pr-name { font-size: 14.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pr-path { grid-column: 2; font: 12px var(--mono); color: var(--hint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pr-tag { grid-column: 3; grid-row: 1 / 3; font-size: 11.5px; color: var(--brand); }
.pr-tag:empty { display: none; }

/* 余量弹窗：两条额度 */
.usage-card { width: 440px; }
.quota-row { margin-bottom: 18px; }
.qr-top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; }
.qr-name { font-size: 14.5px; font-weight: 600; }
.qr-left { font: 600 15px var(--mono); }
.quota-row .bar { display: block; height: 10px; }
.qr-sub { margin-top: 6px; font-size: 12.5px; color: var(--hint); }

/* 配置页：去掉英文副标题和命令行 */
.cfg-head span:empty { display: none; }

/* 文件预览 */
.preview-card { width: min(900px, 94vw); height: min(80vh, 900px); display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.pv-head { display: flex; align-items: center; gap: 10px; padding: 12px 12px 12px 18px; border-bottom: 1px solid var(--border); }
.pv-name { font-weight: 600; font-size: 14.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-meta { font: 12px var(--mono); color: var(--hint); flex-shrink: 0; }
.pv-body { flex: 1; overflow: auto; margin: 0; padding: 14px 18px; font: 12.5px/1.6 var(--mono); white-space: pre-wrap; word-break: break-word; background: var(--code-bg); color: var(--foreground); }

/* 对话里的图片：缩略图，点开看大图 */
.msg-img { max-width: 160px; max-height: 120px; }

/* 登录页：只留品牌和输入框 */
.login .features, .login .tagline-en, .login .brand-desc { display: none; }
.login { background: radial-gradient(760px 360px at 50% -10%, rgba(216, 191, 152, .28), transparent 70%), var(--page); }

@media (max-width: 760px) {
  #go-chat { order: 1; } #new-term { order: 2; } #open-files { order: 3; } #open-config { order: 4; }
  .chat-head { padding-left: 6px; }
  #chat-list { margin-left: 0; width: 40px; height: 40px; }
  .preview-card { width: 100%; height: 88dvh; border-radius: 18px 18px 0 0; padding: 0; }
  .pv-body { padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
}

/* =====================  第十二轮：我的 + 进入对话直接到底  ===================== */
/* 回放历史时隐藏消息区，渲染完一次定位到底再显示 */
.chat-msgs.syncing { visibility: hidden; }
.chat-scroll-wrap:has(.chat-msgs.syncing)::after {
  content: ""; position: absolute; left: 50%; top: 40%; width: 22px; height: 22px; margin-left: -11px; border-radius: 50%;
  border: 2.5px solid var(--border-strong); border-top-color: var(--brand); animation: spin .8s linear infinite;
}

/* 导航：「我的」显示头像；底部只留连接状态 */
.rail-avatar { width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; border-radius: 50%; overflow: hidden; }
.rail-avatar svg { width: 20px; height: 20px; }
.rail-avatar.has-img { width: 24px; height: 24px; }
.rail-avatar img, .u-avatar img, #me-avatar-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.u-avatar { overflow: hidden; }
#open-me { order: 9; }
.rail-foot { gap: 0; padding-top: 8px; }
.history-foot { display: none !important; }

/* 我的 */
.me-area { flex: 1; min-height: 0; overflow-y: auto; }
/* 微信：小暖收件箱整页嵌入 */
.nuan-area { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.nuan-area iframe { flex: 1; width: 100%; min-height: 0; border: 0; background: var(--page); }
.me-wrap { max-width: 720px; margin: 0 auto; padding: 28px 20px 40px; display: flex; flex-direction: column; gap: 14px; }
.me-head { display: flex; align-items: center; gap: 16px; padding: 4px 4px 10px; }
.me-avatar {
  position: relative; width: 72px; height: 72px; border-radius: 50%; overflow: hidden; flex-shrink: 0; border: 0; padding: 0;
  background: var(--brand); color: var(--on-brand); font-size: 28px; font-weight: 700;
}
#me-avatar-img { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.me-avatar i { position: absolute; left: 0; right: 0; bottom: 0; height: 22px; font: 500 11px/22px var(--font); font-style: normal; background: rgba(0,0,0,.45); color: #fff; opacity: 0; transition: opacity .15s; }
.me-avatar:hover i { opacity: 1; }
.me-id { flex: 1; min-width: 0; }
.me-name-row { display: flex; align-items: center; gap: 2px; }
.me-name { font-size: 22px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.me-name-row .icon-btn { width: 30px; height: 30px; }
.me-name-row .icon-btn svg { width: 15px; height: 15px; }
.me-sub { margin-top: 4px; font-size: 13px; color: var(--hint); }
.me-card { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 18px 20px; box-shadow: var(--shadow-card); }
.me-h { font-size: 15px; font-weight: 700; margin-bottom: 14px; display: flex; align-items: baseline; gap: 10px; }
.me-hint { font-size: 12px; font-weight: 400; color: var(--hint); }
#me-quota .quota-row:last-child { margin-bottom: 0; }
.me-kv { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px 20px; }
.me-kv div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.me-kv span { font-size: 12px; color: var(--hint); }
.me-kv b { font: 500 14px var(--font); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.theme-opts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.theme-opt {
  display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 10px 10px 12px; border-radius: 12px;
  border: 1.5px solid var(--border); background: var(--page); color: var(--muted-foreground); font-size: 13px;
}
.theme-opt.on { border-color: var(--brand); color: var(--foreground); font-weight: 600; }
.to-pv { width: 100%; height: 54px; border-radius: 8px; overflow: hidden; display: flex; border: 1px solid var(--border); }
.to-pv i { flex: 1; }
.to-pv.light i, .to-pv.sys i:first-child { background: linear-gradient(#24324c 0 8px, #f6f3ed 8px); }
.to-pv.dark i, .to-pv.sys i:last-child { background: linear-gradient(#d8bf98 0 8px, #131a26 8px); }
.me-row { display: flex; align-items: center; gap: 16px; padding: 10px 0; }
.me-row + .me-row { border-top: 1px solid var(--border); }
.me-row > div { flex: 1; min-width: 0; }
.me-t { font-size: 14px; font-weight: 600; }
.me-d { margin-top: 3px; font-size: 12.5px; color: var(--hint); line-height: 1.6; }
.me-row .btn { flex-shrink: 0; }
.me-foot { text-align: center; font-size: 12px; color: var(--hint); padding-top: 6px; }

@media (max-width: 760px) {
  #go-chat { order: 1; } #new-term { order: 2; } #open-files { order: 3; } #open-config { order: 4; } #open-me { order: 5; }
  .me-wrap { padding: calc(16px + env(safe-area-inset-top)) 12px 24px; gap: 12px; }
  .me-avatar { width: 60px; height: 60px; font-size: 24px; }
  .me-avatar i { opacity: 1; height: 18px; line-height: 18px; font-size: 10px; }
  .me-name { font-size: 19px; }
  .me-head .btn { height: 34px; padding: 0 12px; }
  .me-card { padding: 16px; }
  .theme-opts { gap: 8px; }
  .to-pv { height: 44px; }
}
/* 输入框：文字区独占第一行，附件 / 图片 / 发送放第二行（提示文字不再被挤到右边） */
.composer .chat-input-row { flex-wrap: wrap; align-items: center; row-gap: 0; padding: 4px 6px 6px; }
.composer .input-wrap { order: -1; flex: 1 0 100%; }
.composer .chat-input-row textarea { min-height: 44px; padding: 10px 10px 4px; }
.composer :is(#chat-clear, [data-pid="chat-clear"]) { margin-left: auto; }
/* 手机上不需要终端 */
@media (max-width: 760px) {
  #new-term { display: none !important; }
  .composer :is(#chat-send, [data-pid="chat-send"]) { margin-left: auto; }
  .composer .chat-input-row { border-radius: 20px; padding: 2px 4px 4px; }
}
/* 省 token 开关 */
.chip.eco.on { color: var(--ok); border-color: var(--ok); background: rgba(31, 157, 90, .08); }
.eco-tag { font: 600 10.5px var(--font); padding: 1px 6px; border-radius: 5px; background: rgba(31, 157, 90, .14); color: var(--ok); }
.chip.bad { color: var(--danger); border-color: var(--danger); }
.chip.bad .batt i { background: var(--danger); }
.h-ctx.bad { color: var(--danger); }
/* 自动衔接倒计时 */
.handoff-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; padding: 8px 10px 8px 14px; border-radius: 12px; background: var(--warn-soft); color: var(--foreground); font-size: 13px; }
.handoff-bar :is(#handoff-text, [data-pid="handoff-text"]) { flex: 1 1 auto; min-width: 0; }
.handoff-bar .spacer { display: none; }
@media (max-width: 760px) { .handoff-bar { flex-wrap: wrap; } .handoff-bar :is(#handoff-text, [data-pid="handoff-text"]) { flex-basis: 100%; } .handoff-bar .btn { flex: 1; justify-content: center; height: 34px; } }
/* 前序对话 */
.chain-bar { flex-shrink: 0; border-bottom: 1px solid var(--border); background: var(--page); padding: 6px 16px; }
.cb-row { display: flex; align-items: center; gap: 8px; width: 100%; font-size: 13px; color: var(--muted-foreground); }
.cb-toggle { border: 0; background: transparent; padding: 4px 2px; cursor: pointer; }
.cb-toggle:hover { color: var(--foreground); }
.cb-toggle svg { width: 15px; height: 15px; }
.cb-caret { margin-left: 2px; transition: transform .15s; transform: rotate(-90deg); }
.chain-bar.open .cb-caret { transform: none; }
.cb-list { display: none; flex-direction: column; gap: 2px; padding: 4px 0 6px; }
.chain-bar.open .cb-list { display: flex; }
.cb-item { display: flex; align-items: center; gap: 10px; border: 0; background: transparent; border-radius: 8px; padding: 8px 10px; text-align: left; color: var(--foreground); font-size: 13.5px; }
.cb-item:hover:not(:disabled) { background: var(--surface-2); }
.cb-item:disabled { opacity: .5; cursor: default; }
.cb-no { font: 600 12px var(--mono); color: var(--brand); flex-shrink: 0; }
.cb-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cb-time, .cb-txt { font-size: 12px; color: var(--hint); flex-shrink: 0; }
.cb-old { padding: 4px 0; }
.cb-old .cb-txt { flex-shrink: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chain-prev { order: -2; display: flex; flex-direction: column; gap: inherit; }
.chain-prev > .msg, .chain-prev > .turn { opacity: .72; }
.cp-head { align-self: center; display: flex; align-items: center; gap: 6px; border: 0; background: var(--surface-2); color: var(--muted-foreground); border-radius: 999px; padding: 6px 14px; font-size: 12.5px; cursor: pointer; }
.cp-head:hover { color: var(--foreground); }
.cp-head svg { width: 14px; height: 14px; }
.cp-line { display: flex; align-items: center; gap: 12px; color: var(--hint); font-size: 12px; }
.cp-line::before, .cp-line::after { content: ""; flex: 1; border-top: 1px dashed var(--border); }
.claude-area.readonly .composer { display: none; }
.h-chain { flex-shrink: 0; font: 500 10.5px var(--font); padding: 1px 6px; border-radius: 5px; background: var(--surface-2); color: var(--muted-foreground); }
@media (max-width: 760px) { .chain-bar { padding: 4px 12px; } .cb-time { display: none; } }
/* 菜单里的说明块 + 推荐项 */
.menu { max-width: min(420px, 94vw); }
.menu-note { margin: 2px 6px 6px; padding: 10px 12px; border-radius: 10px; background: var(--page-2); font-size: 12.5px; line-height: 1.6; color: var(--foreground); display: flex; flex-direction: column; gap: 4px; }
.menu-note .bad { color: var(--danger); }
.menu-note .warn { color: var(--warn); }
.menu-note .dim { color: var(--hint); font-size: 11.5px; }
.menu-item.rec .mi-label { color: var(--brand); font-weight: 700; }
.menu-item.rec .mi-label::after { content: " 推荐"; font-size: 11px; font-weight: 600; color: var(--on-brand); background: var(--brand); padding: 1px 6px; border-radius: 5px; margin-left: 6px; }
@media (max-width: 760px) { .menu { max-width: none; max-height: 80dvh; overflow-y: auto; } .menu-note { font-size: 13.5px; } }

/* ---------- 第十九轮：菜单里的开关 ---------- */
.menu-item.mi-toggle::before { display: none; }
.mi-toggle { padding-left: 32px; }   /* 和其他项的文字对齐（左侧圆点位 12px + 间距 10px） */
.mi-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mi-toggle .mi-sub { margin-left: 0; white-space: normal; line-height: 1.35; }
.sw { position: relative; flex: none; margin-left: auto; width: 40px; height: 24px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--border-strong); transition: background .15s, border-color .15s; }
.sw i { position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); transition: transform .15s; }
.mi-toggle.on .sw { background: var(--brand); border-color: var(--brand); }
.mi-toggle.on .sw i { transform: translateX(16px); }

/* ---------- 第二十一轮：打开即显示（本地快照 + 更新提示） ---------- */
.chat-snap { position: absolute; inset: 0; z-index: 1; background: var(--page); }
.chat-scroll-wrap:has(.chat-snap)::after { display: none; }
.update-pill {
  position: fixed; top: calc(10px + env(safe-area-inset-top)); left: 50%; transform: translateX(-50%); z-index: 90;
  border: 0; border-radius: 999px; padding: 8px 16px; font-size: 13px; font-weight: 600;
  background: var(--brand); color: var(--on-brand); box-shadow: var(--shadow-pop);
}

/* ---------- 第二十七轮：草稿 / 折叠 / 卡住提示 / 放大编写 / 下拉刷新 / 晚上深色 ---------- */
.theme-opts { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 520px) { .theme-opts { grid-template-columns: repeat(2, 1fr); } }
/* 长回复折叠 */
.msg.assistant.folded .bubble { max-height: 280px; overflow: hidden; -webkit-mask-image: linear-gradient(#000 65%, transparent); mask-image: linear-gradient(#000 65%, transparent); }
.fold-btn { align-self: flex-start; margin: 6px 0 2px; border: 1px solid var(--border); border-radius: 999px; padding: 6px 14px; background: var(--surface); color: var(--brand); font-size: 13px; font-weight: 500; }
.fold-btn:hover { border-color: var(--brand); }
/* 卡住提示 */
.run-ind { flex-wrap: wrap; }
.run-stuck { flex-basis: 100%; margin-left: 48px; padding: 8px 12px; border-radius: 10px; background: var(--warn-soft, rgba(216,160,60,.14)); color: var(--foreground); font-size: 13px; line-height: 1.5; }
/* 放大编写 */
.input-wrap { position: relative; }
.max-btn { position: absolute; top: 4px; right: 4px; width: 26px; height: 26px; border: 0; border-radius: 7px; background: transparent; color: var(--hint); display: grid; place-items: center; opacity: .75; }
.max-btn:hover { background: var(--brand-soft-2); color: var(--brand); opacity: 1; }
.max-btn svg { width: 15px; height: 15px; }
.input-wrap textarea { padding-right: 30px !important; }
.composer.max .chat-input-row { align-items: stretch; }
.composer.max .chat-input-row textarea { height: min(62vh, 560px) !important; max-height: none; }

/* ---------- 第二十八轮：发送回执 / 预览编辑 / 上传进度 / 搜索 / 配置可编辑 / 机器状态 ---------- */
.send-state { margin-top: 6px; font-size: 12px; color: var(--hint); display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.msg.user.send-sending .bubble { opacity: .75; }
.msg.user.send-failed .send-state { color: var(--danger); }
.send-state button { border: 1px solid var(--border); border-radius: 999px; padding: 3px 10px; background: var(--surface); color: var(--brand); font-size: 12px; }
/* 预览 / 编辑 */
.pv-note { padding: 10px 18px; font-size: 13px; line-height: 1.6; background: var(--warn-soft); border-bottom: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pv-rich { flex: 1; overflow: auto; background: var(--surface); display: flex; flex-direction: column; }
.pv-rich .md-doc { padding: 18px 22px; max-width: 860px; font-size: 14.5px; line-height: 1.75; }
.pv-frame { flex: 1; width: 100%; border: 0; background: #fff; }
.pv-media { margin: auto; max-width: 100%; max-height: 100%; }
audio.pv-media { width: min(520px, 92%); }
.pv-edit { flex: 1; resize: none; border: 0; outline: none; padding: 14px 18px; font: 13px/1.6 var(--mono); background: var(--code-bg); color: var(--foreground); }
.zip-list { padding: 12px 18px; font-size: 13px; }
.zip-h { color: var(--hint); margin-bottom: 8px; }
.zip-row { display: flex; gap: 12px; padding: 5px 0; border-bottom: 1px solid var(--border); }
.zip-row span:first-child { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--mono); }
.zip-row span:last-child { color: var(--hint); font-family: var(--mono); }
/* 上传进度 */
.up-panel { position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 80; width: min(340px, calc(100vw - 32px)); display: flex; flex-direction: column; gap: 8px; }
.up-row { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px; box-shadow: var(--shadow-pop); font-size: 13px; }
.up-top { display: flex; gap: 8px; margin-bottom: 6px; }
.up-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.up-pct { font-family: var(--mono); color: var(--brand); }
.up-sub { margin-top: 5px; color: var(--hint); font-size: 12px; }
.up-row.bad .up-sub { color: var(--danger); }
@media (max-width: 900px) { .up-panel { bottom: calc(76px + env(safe-area-inset-bottom)); } }
/* 搜索结果 */
.search-head { display: flex; align-items: center; gap: 12px; padding: 10px 14px; font-size: 13px; color: var(--muted-foreground); }
.search-row .name { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.search-row .name b { font-weight: 500; }
.search-row .name small { color: var(--hint); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--mono); }
/* 配置可点开 */
.cfg-item.editable { cursor: pointer; }
.cfg-item.editable:hover { background: var(--brand-soft-2); }
.cfg-item.warn .cfg-tag { color: var(--warn, #c98a2b); }
/* 机器状态 */
.me-sys .sys-verdict { font-size: 14px; font-weight: 600; margin-bottom: 12px; color: var(--foreground); }
.me-sys .sys-verdict.hot { color: var(--danger); }
@media (max-width: 900px) {
  /* 手机：搜索框放工具栏最前面，别被挤没了 */
  .file-toolbar .search-box.small { order: -1; flex: 0 0 min(52vw, 220px); }
  .file-toolbar .search-box.small input { width: 100%; }
}

/* ---------- 第二十九轮：任务清单 / 转交 / 连接电脑 / 小提示 / 更新记录 ---------- */
/* 第八十三轮 / 第八十七轮：对话里派出去的任务小卡片（任务页拿掉了） */
@keyframes tn-blink { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }
.task-st { flex-shrink: 0; font-size: 12px; padding: 2px 9px; border-radius: 999px; background: var(--page-2); color: var(--muted-foreground); white-space: nowrap; }
.st-running .task-st { background: var(--brand-soft-2); color: var(--brand); }
.st-waiting .task-st, .st-ask .task-st { background: var(--warn-soft); color: var(--warn); }
.st-stuck .task-st { background: rgba(229,72,77,.12); color: var(--danger, #d9424a); }
.st-review .task-st { background: rgba(63,155,106,.14); color: var(--ok, #3f9b6a); }
.task-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; }
.task-steps i { height: 4px; border-radius: 2px; background: var(--page-2); }
.task-steps i.d { background: var(--brand); }
.task-steps i.w { background: var(--warn); }
.task-steps i.r { background: var(--danger, #d9424a); }
.task-steps i.g { background: var(--ok, #3f9b6a); }
.task-steps i.live { animation: tn-blink 1.2s infinite; }
.task-path { font-family: var(--mono); font-size: 12.5px; color: var(--brand); word-break: break-all; }
.task-quick { display: flex; gap: 6px; flex-wrap: wrap; }
.task-reply { display: flex; gap: 6px; }
.task-reply .text-input { flex: 1; min-width: 0; }
.task-acts { display: flex; flex-wrap: wrap; gap: 6px; }
.msg.task-out { align-self: stretch; max-width: none; margin: 6px 0; border: 1px solid var(--border-strong); background: var(--surface); border-radius: 12px; padding: 9px 12px; display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.to-top { display: flex; gap: 8px; align-items: center; }
.to-top b { flex: 1; min-width: 0; font-size: 13.5px; }
.to-line { color: var(--muted-foreground); display: flex; flex-direction: column; gap: 6px; }
.to-line.q { color: var(--foreground); }
.msg.task-out .task-acts .btn { padding: 3px 9px; font-size: 12px; }
@media (prefers-reduced-motion: reduce) { .task-steps i.live { animation: none; } }
.rail-btn { position: relative; }
/* 连接电脑 */
.cn-intro { margin-bottom: 10px; line-height: 1.6; }
.cn-step { display: flex; gap: 12px; padding: 12px 0; border-top: 1px solid var(--border); }
.cn-n { flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 600; background: var(--page-2); color: var(--muted-foreground); }
.cn-step.done .cn-n { background: rgba(63,155,106,.16); color: var(--ok, #3f9b6a); }
.cn-c { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.cn-t { font-weight: 600; font-size: 14px; }
.cn-c .text-input { width: 100%; box-sizing: border-box; font-family: var(--mono); font-size: 12px; }
.cn-c > .btn { align-self: flex-start; }
.cmd { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 9px; background: var(--code-bg); }
.cmd code { flex: 1; min-width: 0; font: 12px/1.5 var(--mono); word-break: break-all; }
.cn-link { font: 12px var(--mono); word-break: break-all; color: var(--brand); }
.cn-peers { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.cn-peers > div { display: flex; align-items: center; gap: 8px; }
.cn-peers small { color: var(--hint); font-family: var(--mono); }
.cn-peers .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--hint); }
.cn-peers .dot.on { background: var(--ok, #3f9b6a); }
/* 小提示 */
.tip-card { border: 1px solid var(--brand-soft-2); background: var(--brand-soft, rgba(120,110,170,.08)); border-radius: 12px; padding: 10px 14px; margin: 0 0 12px; font-size: 13px; line-height: 1.6; }
.tip-h { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2px; }
.tip-card ul { margin: 0; padding-left: 18px; color: var(--muted-foreground); }
.file-area > .tip-card { margin: 12px 16px 0; }
.me-area > .tip-card { margin: 0 auto 12px; max-width: 760px; }
/* 更新记录 */
.me-changes { display: flex; flex-direction: column; gap: 12px; margin-bottom: 8px; }
.chg-h { display: flex; align-items: baseline; gap: 10px; }
.chg-h span { font-size: 12px; color: var(--hint); font-family: var(--mono); }
.chg ul { margin: 4px 0 0; padding-left: 18px; font-size: 13px; color: var(--muted-foreground); line-height: 1.6; }
#whatsnew-pill { cursor: pointer; max-width: calc(100vw - 32px); }
@media (max-width: 900px) { #go-chat { order: 0 !important; } }

/* 第二十七轮：自己发的消息和背景拉开对比——浅色用藏青底米白字，深色用米金底藏青字 */
:root, [data-theme="dark"] { --bubble-user: #cdb48c; --bubble-user-fg: #1b2538; }
[data-theme="light"] { --bubble-user: #24324c; --bubble-user-fg: #f3e7d2; }
.msg.user .bubble { color: var(--bubble-user-fg); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.msg.user .bubble a { color: inherit; text-decoration: underline; }
.msg.user .bubble code, .msg.user .bubble pre { background: rgba(127, 127, 127, .18); color: inherit; }
.msg.user .bubble ::selection { background: rgba(127, 127, 127, .4); }

/* 第三十一轮：对话之间转交 / 回报的消息卡片 */
.msg.relay { align-self: stretch; max-width: 880px; width: 100%; margin: 4px auto; border: 1px solid var(--border); border-left: 3px solid var(--brand); border-radius: 12px; background: var(--surface); padding: 10px 14px; box-sizing: border-box; }
.msg.relay.reply { border-left-color: var(--ok); background: var(--surface-2); }
.relay-head { display: flex; align-items: center; gap: 4px; font-size: 12px; color: var(--muted-foreground); margin-bottom: 6px; }
.relay-head svg { width: 14px; height: 14px; }
.relay-go-btn { border: 0; background: none; padding: 0; color: var(--brand); font: inherit; font-weight: 600; cursor: pointer; }
.relay-tag { margin-left: auto; color: var(--hint); }
.relay-body { font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.relay-body > :first-child { margin-top: 0; } .relay-body > :last-child { margin-bottom: 0; }
/* @ 交给其他对话的面板 */
.relay-card { width: min(520px, 94vw); }
.relay-text { font-size: 13px; color: var(--muted-foreground); background: var(--surface-2); border-radius: 8px; padding: 8px 10px; margin: 8px 0 12px; white-space: pre-wrap; max-height: 96px; overflow: auto; }
.relay-h { font-size: 12px; color: var(--hint); margin-bottom: 4px; }
.relay-list { max-height: 34dvh; overflow-y: auto; border: 1px solid var(--border); border-radius: 10px; margin-bottom: 10px; }
.relay-row, .relay-opt { display: flex; gap: 10px; align-items: flex-start; padding: 9px 12px; cursor: pointer; }
.relay-row + .relay-row { border-top: 1px solid var(--border); }
.relay-row input, .relay-opt input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--brand); flex: none; }
.rr-txt { display: flex; flex-direction: column; min-width: 0; }
.rr-txt b { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rr-txt small, .relay-opt small { color: var(--hint); font-size: 12px; }
.relay-opt { padding: 6px 2px; font-size: 13px; }
.relay-opt b { font-weight: 600; }
.relay-foot { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.relay-foot .spacer { flex: 1; }
/* Claude 的选择题（AskUserQuestion） */
.perm-ask { display: flex; flex-direction: column; gap: 16px; margin: 6px 0 4px; }
.ask-h { display: flex; gap: 8px; align-items: center; margin-bottom: 4px; }
.ask-chip { font-size: 11px; padding: 2px 8px; border-radius: 999px; background: var(--brand-soft); color: var(--brand-ink); }
.ask-multi { font-size: 11px; color: var(--hint); }
.ask-text { font-size: 15px; font-weight: 600; margin-bottom: 8px; }
.ask-opts { display: flex; flex-direction: column; gap: 6px; }
.ask-opt { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); color: var(--foreground); font: inherit; cursor: pointer; }
.ask-opt b { font-size: 14px; font-weight: 600; } .ask-opt small { font-size: 12px; color: var(--muted-foreground); }
.ask-opt.on { border-color: var(--brand); background: var(--brand-soft); box-shadow: inset 0 0 0 1px var(--brand); }
.ask-other { margin-top: 6px; width: 100%; box-sizing: border-box; padding: 9px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); color: var(--foreground); font-size: 16px; }
/* 代码高亮编辑器 */
.pv-cm { flex: 1; min-height: 0; overflow: hidden; display: flex; background: var(--code-bg); }
.pv-cm .cm-editor { flex: 1; height: 100%; font-size: 13px; }
.pv-cm .cm-scroller { font-family: var(--mono); line-height: 1.6; }
.pv-cm .cm-editor.cm-focused { outline: none; }
@media (max-width: 760px) { .pv-cm .cm-content { font-size: 16px; } }
.me-btns { display: flex; gap: 8px; flex: none; }

/* =====================  r43：交出去的活 + 侧栏接力关系 + 递送动效  ===================== */
.msg.relay-out { border-left-color: var(--warn); }
.turn-body > .msg.relay-out { max-width: none; margin: 6px 0; }
.ro-text { font-size: 13px; color: var(--muted-foreground); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; margin-bottom: 8px; }
.ro-jobs { display: flex; flex-direction: column; gap: 6px; }
.ro-job { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; }
.ro-st { display: inline-flex; align-items: center; gap: 5px; padding: 1px 8px; border-radius: 999px; background: var(--surface-2); color: var(--muted-foreground); font-size: 12px; }
.ro-st b { font-weight: 600; }
.ro-st i { width: 7px; height: 7px; border-radius: 50%; background: var(--hint); flex: none; }
.ro-job small { color: var(--hint); font-size: 12px; }
.ro-job[data-state="queued"] .ro-st { color: var(--warn); }
.ro-job[data-state="queued"] .ro-st i { background: var(--warn); animation: ro-blink 1.4s ease-in-out infinite; }
.ro-job[data-state="doing"] .ro-st { color: var(--brand); background: var(--brand-soft); }
.ro-job[data-state="doing"] .ro-st i { width: 9px; height: 9px; background: transparent; border: 2px solid var(--brand-soft-2); border-top-color: var(--brand); box-sizing: border-box; animation: spin .8s linear infinite; }
.ro-job[data-state="replied"] .ro-st, .ro-job[data-state="done"] .ro-st { color: var(--ok); }
.ro-job[data-state="replied"] .ro-st i, .ro-job[data-state="done"] .ro-st i { background: var(--ok); }
.ro-job[data-state="error"] .ro-st { color: var(--danger); }
.ro-job[data-state="error"] .ro-st i { background: var(--danger); }
@keyframes ro-blink { 50% { opacity: .3; } }
.h-relay { font-size: 11.5px; color: var(--warn); padding-left: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.relay-fly { position: fixed; left: 0; top: 0; z-index: 9999; width: 26px; height: 26px; border-radius: 8px; background: var(--brand); color: #fff; display: flex; align-items: center; justify-content: center; pointer-events: none; box-shadow: 0 4px 14px rgba(0,0,0,.25); }
.relay-fly svg { width: 16px; height: 16px; }
.relay-hit { animation: relay-hit .7s ease-out; }
@keyframes relay-hit { 0% { box-shadow: 0 0 0 0 var(--brand); } 100% { box-shadow: 0 0 0 10px transparent; } }
@media (max-width: 760px) { .h-relay { font-size: 12.5px; } }

/* r47：做完的一轮，过程收成一行 */
.turn-proc { display: flex; flex-direction: column; }
.tp-head { align-self: flex-start; display: flex; align-items: center; gap: 6px; border: 0; background: transparent; color: var(--hint); font-size: 12.5px; padding: 3px 6px; border-radius: 6px; }
.tp-head:hover { color: var(--foreground); background: var(--surface-2); }
.tp-head svg { width: 13px; height: 13px; transform: rotate(-90deg); transition: transform .15s; }
.turn-proc.open .tp-head svg { transform: none; }
.turn-proc:not(.open) > .tp-body { display: none; }
.tp-body { display: flex; flex-direction: column; gap: 8px; border-left: 2px solid var(--border); margin: 2px 0 4px 6px; padding-left: 10px; }
/* r56：项目卡片 + 旁边的小箭头（选用别的 AI），菜单里没登录的灰着，我的页工具卡的状态点 */
.h-peng { width: 16px; height: 22px; margin-left: -4px; border: 0; border-radius: 6px; background: transparent; color: var(--brand); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.h-peng svg { width: 11px; height: 11px; }
.h-peng:hover { background: var(--brand-soft); }
.menu-item.dis .mi-label { opacity: .45; }
#me-engines .me-t { display: flex; align-items: center; gap: 8px; }
#me-engines .dot { flex: none; }
#me-engines .dot:not(.on) { background: var(--hint); box-shadow: none; }
/* r57：我的页卡片折叠 */
#me-area .me-card:not(.me-fixed) > .me-h { cursor: pointer; user-select: none; }
.me-caret { width: 16px; height: 16px; margin-left: auto; align-self: center; flex: none; color: var(--hint); transition: transform .15s; }
.me-card.folded .me-caret { transform: rotate(-90deg); }
.me-card.folded > .me-h { margin-bottom: 0; }
.me-card.folded > :not(.me-h) { display: none !important; }
/* r58：其他 AI 工具「连接」：验证码 + 授权按钮 */
.en-job:empty { display: none; }
.en-job { margin-top: 10px; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.en-step { font-size: 13px; font-weight: 600; }
.en-code { display: flex; align-items: center; gap: 10px; }
.en-code b { font: 700 22px/1.2 Menlo, Monaco, monospace; letter-spacing: 2px; padding: 6px 12px; border-radius: 8px; background: var(--page-2); user-select: all; }
a.en-go { text-decoration: none; }
.en-err { color: var(--danger); }
.en-row .me-btns:empty { display: none; }
.en-code b { white-space: nowrap; }

/* r62 参数胶囊：灰底圆角，点开贴着胶囊弹小菜单；档位用信号格 */
.chip.pill { background: var(--surface-2); }
button.chip.pill:hover { background: var(--surface-3); }
.chip.pill .caret { display: none; }
.chip .bars { display: inline-flex; align-items: center; gap: 2.5px; }
.chip .bars i { width: 3.5px; height: 14px; border-radius: 2px; background: var(--hint); opacity: .35; }
.chip .bars i.on { background: var(--foreground); opacity: 1; }
.menu.pop { min-width: 190px; border-radius: 14px; z-index: 90; }
.menu.pop .menu-item { gap: 12px; }
.menu.pop .menu-item .mi-label, .menu.pop .menu-item .mi-sub { white-space: nowrap; }
.menu.pop .menu-item .mi-sub { padding-left: 16px; }
@media (max-width: 760px) { .menu.pop { max-width: calc(100vw - 16px); } .menu.pop .menu-item { min-height: 44px; } }

/* r64 手机：顶部对话标签条；自己发的消息常显复制 / 编辑 */
.m-tabs, .m-tab-new { display: none; }
@media (max-width: 760px) {
  :is(#chat-title, [data-pid="chat-title"]), :is(#chat-status, [data-pid="chat-status"]) { display: none; }
  .m-tabs { display: flex; flex: 1 1 auto; min-width: 0; align-items: center; gap: 4px; overflow-x: auto; scrollbar-width: none; }
  .m-tabs::-webkit-scrollbar { display: none; }
  .m-tab { flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; height: 36px; max-width: 58vw; padding: 0 12px; border-radius: 10px; font: 500 15px var(--font); color: var(--muted-foreground); }
  .m-tab-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .m-tab.active { background: var(--surface-2); color: var(--foreground); font-weight: 600; padding-right: 2px; }
  .m-tab.need-perm .m-tab-label::after { content: ""; display: inline-block; width: 6px; height: 6px; margin-left: 5px; border-radius: 50%; background: var(--warn); vertical-align: middle; }
  .m-tab .tab-spin { border-color: var(--border); border-top-color: var(--brand); }
  .m-tab-btn { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 32px; padding: 0; border: 0; background: transparent; color: var(--hint); }
  .m-tab-btn svg { width: 14px; height: 14px; }
  .m-tab-new { display: inline-flex; flex-shrink: 0; width: 36px; height: 36px; }
  .msg.user .u-tools { display: flex; opacity: 1; padding-top: 2px; }
  .msg.user { gap: 4px; }
}

/* r67 手机：当前标签用「发送」按钮的颜色；额度长条放在标签上面一行（替换 r66 的蓝色和圆环） */
.m-quota { display: none; }
@media (max-width: 760px) {
  .m-tab.active { background: var(--brand-strong); color: var(--on-brand); }
  [data-theme="dark"] .m-tab.active { background: var(--brand); }
  .m-tab.active .m-tab-btn { color: var(--on-brand); opacity: .7; }
  .m-tab.active .tab-spin { border-color: rgba(128, 128, 128, .45); border-top-color: var(--on-brand); }
  .chat-head { position: relative; padding-top: calc(24px + env(safe-area-inset-top)); height: calc(74px + env(safe-area-inset-top)); }
  .m-quota { display: flex; position: absolute; left: 14px; right: 14px; top: calc(6px + env(safe-area-inset-top)); height: 16px; align-items: center; gap: 16px; cursor: pointer; }
  .mq-item { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 6px; font: 500 11px var(--font); color: var(--muted-foreground); white-space: nowrap; }
  .mq-bar { flex: 1; min-width: 24px; height: 5px; border-radius: 3px; background: var(--border-strong); overflow: hidden; }
  .mq-bar i { display: block; height: 100%; border-radius: 3px; background: var(--brand-strong); }
  [data-theme="dark"] .mq-bar i { background: var(--brand); }
  .mq-item.warn .mq-bar i { background: var(--warn); }
  .mq-item.bad .mq-bar i { background: var(--danger); }
  .mq-pct { font-family: var(--mono); color: var(--foreground); }
}

/* r69 电脑：左侧栏底部加「更新」按钮（手机上侧栏变底栏，rail-foot 本来就藏起来） */
.rail-foot #rail-update { width: 52px; }

/* r70 对话摘要浮窗：电脑端聊天区左上角，半透明，鼠标移上去变实 */
.digest { position: absolute; top: 10px; left: 12px; z-index: 6; width: 290px; max-width: calc(100% - 24px); padding: 8px 10px; border: 1px solid var(--border); border-radius: 12px; background: color-mix(in srgb, var(--surface) 55%, transparent); -webkit-backdrop-filter: blur(1.5px); backdrop-filter: blur(1.5px); box-shadow: var(--shadow-card); font-size: 12.5px; color: var(--foreground); transition: background .15s; }
.digest:hover { background: color-mix(in srgb, var(--surface) 96%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.dg-head { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.dg-title { font-weight: 600; }
.dg-count { color: var(--hint); }
.dg-btn { border: 0; background: none; color: var(--muted-foreground); font: inherit; font-size: 12px; padding: 2px 6px; border-radius: 6px; cursor: pointer; }
.dg-btn:hover { background: var(--surface-3); color: var(--foreground); }
.dg-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.digest.open .dg-list { max-height: min(60vh, 520px); overflow-y: auto; }
.dg-list li { display: flex; gap: 6px; line-height: 1.45; }
.dg-no { flex: none; min-width: 2em; text-align: right; color: var(--hint); font-variant-numeric: tabular-nums; }
.dg-wait { color: var(--hint); }
.dg-ico, .dg-caret { display: none; width: 15px; height: 15px; flex: none; }
.digest.min { width: auto; padding: 6px 10px 6px 11px; cursor: pointer; border-color: color-mix(in srgb, var(--brand) 55%, transparent); background: color-mix(in srgb, var(--brand) 12%, var(--surface)); color: var(--brand-ink); -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: 0 2px 10px rgba(0,0,0,.12); }
.digest.min:hover { background: color-mix(in srgb, var(--brand) 22%, var(--surface)); -webkit-backdrop-filter: none; backdrop-filter: none; }
.digest.min .dg-head { margin: 0; gap: 5px; }
.digest.min .dg-count { color: inherit; opacity: .7; }
.digest.min .dg-ico, .digest.min .dg-caret { display: block; }
.digest.min .dg-list, .digest.min .dg-btn, .digest.min .spacer { display: none; }
@media (max-width: 760px) { .digest { display: none !important; } }
/* r81：「下载」链接前面加个下载箭头 */
.fp-dl::before { content: "↓ "; font-weight: 700; }

/* 第八十七轮：输入框上的「开新项目」「派个新活」和提示条 */
.chip.compose { color: var(--brand-strong, var(--brand)); font-weight: 600; }
[data-theme="dark"] .chip.compose { color: var(--brand); }
.chip.compose svg { color: currentColor; }
.chip.compose.on, button.chip.compose.on:hover { background: var(--brand-strong, var(--brand)); color: var(--on-brand, #fff); }
[data-theme="dark"] .chip.compose.on, [data-theme="dark"] button.chip.compose.on:hover { background: var(--brand); }
.compose-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; padding: 7px 8px 7px 14px; border-radius: 12px; background: var(--brand-soft-2); font-size: 13px; }
.compose-bar.hidden { display: none; }
.compose-bar .cb-text { flex: 1 1 auto; min-width: 0; }
.compose-bar .cb-cheap { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; cursor: pointer; color: var(--muted-foreground); }
.howto-tag { font-size: 11.5px; opacity: .7; margin-bottom: 2px; }
@media (max-width: 760px) {
  .chip.compose { order: -1; }
  .compose-bar { flex-wrap: wrap; }
  .compose-bar .cb-text { flex-basis: 100%; }
}

/* 第八十八轮：置顶卡片 */
.h-pins > .h-proj .h-pico { color: var(--brand); }
/* 拖动排序 */
#history-list .h-item, #history-list .h-proj { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.h-drag { position: relative; z-index: 5; box-shadow: 0 8px 24px rgba(0, 0, 0, .18); background: var(--surface); transition: none; pointer-events: none; }
body.h-dragging, body.h-dragging * { cursor: grabbing !important; }
.h-drop { position: fixed; z-index: 50; height: 3px; border-radius: 2px; background: var(--brand); pointer-events: none; }

/* ========== 第八十九轮：额度重置按钮 ========== */
.quota-reset { border: 0; border-radius: 999px; padding: 4px 10px; font: 600 12px var(--font); background: var(--brand-strong); color: var(--on-brand); cursor: pointer; }
[data-theme="dark"] .quota-reset { background: var(--brand); }
.quota-reset:hover { filter: brightness(1.1); }
.quota-reset.off, .mq-reset.off, [data-theme="dark"] .quota-reset.off, [data-theme="dark"] .mq-reset.off { background: var(--border-strong); color: var(--hint); filter: none; }
.mq-reset { display: none; }
.qr-reset { width: 100%; height: 40px; margin: 0 0 14px; justify-content: center; font-size: 14px; }
@media (max-width: 760px) {
  .mq-reset { display: inline-flex; flex: none; align-items: center; height: 18px; padding: 0 9px; border: 0; border-radius: 999px; font: 600 11px var(--font); background: var(--brand-strong); color: var(--on-brand); }
  [data-theme="dark"] .mq-reset { background: var(--brand); }
}

/* 第九十二轮：对话多了卡片不被压扁，列表照常上下滑 */
.history-list > * { flex-shrink: 0; }

/* 第九十八轮：后台任务卡片（消息流最下面，排在「思考中」后面） */
.bg-card { order: 10000; display: flex; align-items: flex-start; gap: 12px; max-width: 920px; }
.bg-box { flex: 0 1 480px; min-width: 0; padding: 11px 14px; border-radius: 14px; border: 1px solid var(--border); background: var(--surface-2); font-size: 13.5px; color: var(--muted-foreground); }
.bg-head { display: flex; align-items: center; gap: 8px; width: 100%; padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.bg-title { color: var(--foreground); font-weight: 500; }
.bg-total, .bg-time { font-family: var(--mono); font-size: 12px; color: var(--hint); }
.bg-caret { width: 14px; height: 14px; margin-left: auto; flex: none; transform: rotate(180deg); transition: transform .15s; }
.bg-card.fold .bg-caret { transform: none; }
.bg-card.fold .bg-list, .bg-card.fold .bg-note, .bg-card.fold .bg-idle { display: none; }   /* r122：收起时只剩头部一行 */
.bg-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--brand); flex: none; animation: pulse 1.6s ease-in-out infinite; }
.bg-list { margin-top: 9px; padding-top: 9px; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 9px; }
.bg-row-top { display: flex; align-items: center; gap: 8px; }
.bg-kind { color: var(--foreground); }
.bg-time { margin-left: auto; }
.bg-desc { margin-top: 2px; padding-left: 14px; font-size: 12.5px; line-height: 1.5; overflow-wrap: anywhere; }
.bg-note { margin-top: 9px; font-size: 12px; color: var(--hint); }
.bg-idle { margin-top: 9px; padding-top: 9px; border-top: 1px solid var(--border); font-size: 12px; color: var(--hint); }
@media (max-width: 760px) { .bg-box { flex: 1 1 auto; } .bg-card > .avatar { display: none; } }   /* 手机上对话里不显示头像，卡片也一样 */
/* Claude 的头像换成 Claude 图标：橙底白芒、圆角方块 */
.avatar { border-radius: 8px; background: #D97757; color: #fff; }
.avatar svg { width: 18px; height: 18px; }
/* ---------- 第九十九轮：头像裁切框 ---------- */
.crop-card { width: 360px; }
.crop-stage {
  position: relative; width: min(296px, 72vw); aspect-ratio: 1; margin: 0 auto; overflow: hidden;
  border-radius: var(--radius); background: #111; touch-action: none; cursor: grab; user-select: none; -webkit-user-select: none;
}
.crop-stage.dragging { cursor: grabbing; }
.crop-stage img { position: absolute; left: 50%; top: 50%; max-width: none; transform-origin: center; pointer-events: none; }
.crop-ring { position: absolute; inset: 0; border-radius: 50%; box-shadow: 0 0 0 999px rgba(0,0,0,.55); outline: 2px solid rgba(255,255,255,.85); outline-offset: -2px; pointer-events: none; }
.crop-zoom { display: flex; align-items: center; gap: 10px; width: min(296px, 72vw); margin: 16px auto 6px; color: var(--muted-foreground); font-size: 18px; line-height: 1; }
.crop-zoom input { flex: 1; accent-color: var(--brand); }
.crop-tip { text-align: center; margin-bottom: 16px; }
/* ---------- 第一百轮：侧栏对话只显示名字；全站文字加深 ---------- */
.h-item .h-dot, .h-item .h-chain, .h-item .h-ctx, .h-item .h-time, .h-item .h-meta, .h-item .h-relay { display: none; }
:root, [data-theme="dark"] { --foreground: #f6f2ea; --muted-foreground: #c0c6d2; --hint: #8d97aa; }
[data-theme="light"] { --foreground: #0e1420; --muted-foreground: #414a5a; --hint: #737370; }
/* ---------- 第一百零一轮：原地改名 + 右键菜单 ---------- */
.inline-edit { width: 100%; min-width: 0; font: inherit; color: var(--foreground); background: var(--surface); border: 1px solid var(--brand); border-radius: 6px; padding: 1px 6px; margin: -2px 0; outline: none; box-shadow: 0 0 0 3px var(--brand-soft); }
.editing { display: block; overflow: visible !important; flex: 1; min-width: 0; }
.h-item:has(.editing) .h-acts, .h-proj:has(.editing) .h-pbase, .h-proj:has(.editing) .h-pcount, .h-proj:has(.editing) button { display: none !important; }
.menu-item.danger .mi-label { color: var(--danger); }
/* ---------- 第一百零二轮：侧栏分割线可拖 ---------- */
@media (min-width: 901px) {
  .history { position: relative; width: var(--hist-w, 280px); }
  .hist-resize { position: absolute; top: 0; bottom: 0; right: -4px; width: 8px; z-index: 5; cursor: col-resize; touch-action: none; }
  .hist-resize::after { content: ""; position: absolute; top: 0; bottom: 0; left: 3px; width: 2px; background: transparent; transition: background .15s; }
  .hist-resize:hover::after, .hist-resizing .hist-resize::after { background: var(--brand); }
  .hist-resizing, .hist-resizing * { cursor: col-resize !important; user-select: none !important; }
}
@media (max-width: 900px) { .hist-resize { display: none; } }
/* ---------- 第一百零三轮：正在做的对话，名字后面转圈 ---------- */
.h-item.running .h-dot { display: block; order: 9; width: 12px; height: 12px; margin: 0 2px 0 4px; border-width: 2px; }
/* ---------- 第一百零四轮：接力状态挂在名字后面（帮谁做 / 等回报） ---------- */
.h-rtag { flex-shrink: 0; font-size: 11px; line-height: 17px; padding: 0 6px; border-radius: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.h-rtag.help { max-width: 8em; color: var(--brand); background: var(--brand-soft-2); }
.h-rtag.wait { color: var(--warn); background: var(--warn-soft); }
@media (max-width: 900px) { .h-rtag { font-size: 12px; line-height: 19px; } }
/* ---------- 第一百零五轮：轮到你了 / 选中引用 / 改文件红绿对比 ---------- */
.your-turn { display: inline-flex; align-items: center; gap: 5px; margin-left: 8px; height: 24px; padding: 0 9px; border: 0; border-radius: 12px; background: var(--brand-soft-2); color: var(--brand); font: 600 12px var(--font); cursor: pointer; }
.your-turn span { min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--brand); color: var(--on-brand); font-size: 11px; line-height: 16px; text-align: center; }
.your-turn.ask { background: var(--warn-soft); color: var(--warn); }
.your-turn.ask span { background: var(--warn); color: #fff; }
.your-turn.hidden { display: none; }
.quote-btn { position: fixed; z-index: 70; display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 12px; border: 1px solid var(--border-strong); border-radius: 15px; background: var(--surface); color: var(--foreground); font: 600 13px var(--font); box-shadow: var(--shadow-pop); cursor: pointer; }
.quote-btn svg { width: 14px; height: 14px; }
.quote-btn.hidden { display: none; }
.tc-diffn { flex-shrink: 0; display: inline-flex; gap: 6px; margin-left: 8px; font: 600 11.5px var(--mono); }
.tc-diffn .add, .diff .d-add { color: var(--ok); }
.tc-diffn .del, .diff .d-del { color: var(--danger); }
.tc-in:has(.diff) { white-space: normal; padding: 0; }
.d-path { padding: 6px 12px; font: 11.5px var(--mono); color: var(--muted-foreground); border-bottom: 1px solid var(--border); word-break: break-all; }
.diff { font: 12px/1.55 var(--mono); overflow-x: auto; max-height: 420px; overflow-y: auto; }
.diff > div { white-space: pre; padding: 0 12px; min-width: max-content; }
.diff .d-add { background: rgba(31, 157, 90, .10); }
.diff .d-del { background: rgba(229, 72, 77, .09); }
.diff .d-ctx { color: var(--muted-foreground); }
.diff .d-gap { color: var(--hint); text-align: center; white-space: normal; padding: 2px 12px; }
/* ---------- 第一百零六轮：手机侧栏瘦身（一行一条、操作收进「⋯」、抽屉变窄、字号跟电脑对齐） ---------- */
.h-more { display: none; }
@media (max-width: 760px) {
  .history { width: min(80vw, 304px); }
  .history-head { height: 48px; font-size: 16px; }
  .history-tools { padding: 0 8px 6px; gap: 6px; }
  .history-tools .search-box { height: 36px; }
  .search-box input::placeholder { font-size: 14px; }
  .history-tools .btn.small { height: 36px; padding: 0 10px; font-size: 13px; }
  .history-list { padding: 4px 8px 12px; }
  .h-pcard { margin-top: 10px; border-radius: 10px; }
  .h-pcard > .h-proj { padding: 4px 2px 4px 10px; margin-bottom: 2px; background: var(--surface-2); }   /* 金色半透明叠在深蓝上发灰，换成同色系 */
  .h-pcard > .h-proj .h-pname { font-size: 14.5px; }
  .h-pbase { display: none; }
  .h-pcount { font-size: 12px; }
  .h-pren, .h-padd { width: 34px; height: 34px; }
  .h-pcard > .h-item { margin: 0 2px 0 14px; }
  .h-item, .h-item.term { padding: 0 38px 0 10px; min-height: 42px; justify-content: center; }
  .h-label { font-size: 14.5px; }
  .h-item .h-acts, .h-item.term .h-acts { display: none !important; }
  .h-more { display: flex; position: absolute; right: 1px; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; border: 0; border-radius: 8px; background: transparent; color: var(--hint); align-items: center; justify-content: center; }
  .h-more svg { width: 17px; height: 17px; }
  .h-more:active { background: var(--surface-2); color: var(--foreground); }
  .h-item:has(.editing) .h-more { display: none; }
}
/* ---------- 第一百零八轮：侧栏状态标签补齐（等批准 / 值守中 / 后台 N / 等你回复 / 已完成） ---------- */
.h-rtag.ask { color: #fff; background: var(--warn); font-weight: 600; }
.h-rtag.duty, .h-rtag.done { color: var(--ok); background: color-mix(in srgb, var(--ok) 14%, transparent); }
.h-rtag.duty::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 4px 1px 0; border-radius: 50%; background: var(--ok); vertical-align: middle; animation: h-breathe 1.6s ease-in-out infinite; }
.h-rtag.bg { color: var(--muted-foreground); background: var(--surface-3); }
.h-rtag.reply { color: var(--on-brand); background: var(--brand); font-weight: 600; }
@keyframes h-breathe { 50% { opacity: .25; } }
/* ---------- 第一百一十轮：「新对话」右边连一个小三角，点开是开新项目 / 派个新活 ---------- */
.new-split { display: inline-flex; flex-shrink: 0; }
.new-split #history-new { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.new-split #history-new-more { border-top-left-radius: 0; border-bottom-left-radius: 0; padding: 0 7px; box-shadow: inset 1px 0 0 rgba(255, 255, 255, .28); }
.menu.pop .menu-item.mi-stack { flex-direction: column; align-items: flex-start; gap: 2px; padding-top: 8px; padding-bottom: 8px; }
.menu.pop .menu-item.mi-stack .mi-sub { margin-left: 0; padding-left: 0; white-space: normal; line-height: 1.4; }
/* ---------- 第一百一十五轮：「我的」页昵称原地改，改的时候小笔先藏起来 ---------- */
.me-name-row:has(.editing) #me-rename { display: none; }
/* ---------- 第一百一十三轮：后台任务卡片每一项都能「停止」 ---------- */
.bg-stop { flex: none; padding: 1px 10px; border-radius: 999px; border: 1px solid var(--border-strong); background: transparent; color: var(--muted-foreground); font: inherit; font-size: 12px; line-height: 20px; cursor: pointer; }
.bg-stop:hover:not(:disabled), .bg-stop:active:not(:disabled) { border-color: var(--danger); color: var(--danger); background: var(--danger-soft); }
.bg-stop:disabled { opacity: .55; cursor: default; }
@media (max-width: 760px) { .bg-stop { padding: 4px 12px; } }   /* 手机上手指好按 */
/* ---------- 第一百一十八轮：侧栏顶部不折行，窄了按顺序收文字（先「轮到你」只留数字，再「新对话」只留加号） ---------- */
.history-head { container-type: inline-size; gap: 4px; padding-left: 12px; padding-right: 6px; }
.history-head > *, .history-tools > * { flex-shrink: 0; white-space: nowrap; }
.history-head > .spacer { flex-shrink: 1; min-width: 0; }
.history-tools > .search-box { flex-shrink: 1; }
.history-head .your-turn { margin-left: 0; padding: 0 7px; gap: 4px; }
.new-split #history-new { padding: 0 8px; gap: 4px; }
@container (max-width: 257px) { .history-head .your-turn { font-size: 0; gap: 0; padding: 0 4px; } }
@container (max-width: 211px) { .history-head:has(.your-turn:not(.hidden)) #history-new { font-size: 0; gap: 0; padding: 0 8px; } }
@container (max-width: 179px) { .history-head #history-new { font-size: 0; gap: 0; padding: 0 8px; } }
/* ---------- 第一百二十一轮：置顶只在自己项目里置顶，名字前面一个小图钉 ---------- */
.h-pin { width: 12px; height: 12px; flex-shrink: 0; color: var(--brand); }
/* ---------- 第一百二十三轮：两个以上状态换成小圆灯 + 侧栏底部图例（有灯才出现） ---------- */
.h-lamp { flex-shrink: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--muted-foreground); }
.h-lamp + .h-lamp { margin-left: -2px; }
.h-lamp.ask, .h-lamp.wait { background: var(--warn); }
.h-lamp.duty, .h-lamp.done { background: var(--ok); }
.h-lamp.reply, .h-lamp.help { background: var(--brand); }
.h-lamp.ask, .h-lamp.duty, .h-lamp.bg, .h-lamp.help { animation: h-breathe 1.4s ease-in-out infinite; }
.h-label:has(.h-lamp) .h-text { min-width: 5em; }
.hist-legend { flex-shrink: 0; display: flex; flex-wrap: wrap; gap: 3px 10px; padding: 7px 14px 8px; border-top: 1px solid var(--border); font-size: 11px; line-height: 15px; color: var(--muted-foreground); opacity: .55; transition: opacity .15s; }
.hist-legend:hover { opacity: 1; }
.hist-legend span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.hist-legend .h-lamp { animation-name: h-lamp-soft; }   /* 图例本身半透明，灯闪得浅一点，免得暗下去看不见 */
@keyframes h-lamp-soft { 50% { opacity: .45; } }
.history:not(:has(#history-list .h-lamp, #history-list .turn-badge)) .hist-legend { display: none; }   /* r215：有红圈也露出图例，说明红圈什么时候消 */
@media (max-width: 900px) { .hist-legend { padding-bottom: calc(8px + env(safe-area-inset-bottom)); } }
/* ---------- 第一百二十四轮：灯 7 种状态 7 种颜色、10px、带描边；图例默认清楚、灯常亮 ---------- */
:root, [data-theme="dark"] { --lamp-ask: #ff5f5f; --lamp-reply: #ff8c28; --lamp-wait: #f5d63c; --lamp-duty: #3ed98a; --lamp-bg: #5ba3ff; --lamp-help: #b98bff; --lamp-done: #98a1b0; --lamp-ring: rgba(255, 255, 255, .3); }
[data-theme="light"] { --lamp-ask: #d92d2d; --lamp-reply: #f06a00; --lamp-wait: #e0b400; --lamp-duty: #17a157; --lamp-bg: #2a72d6; --lamp-help: #8a46d6; --lamp-done: #8c919b; --lamp-ring: rgba(0, 0, 0, .22); }
.h-lamps { flex-shrink: 0; display: inline-flex; align-items: center; gap: 4px; }
.h-lamp { width: 10px; height: 10px; box-sizing: border-box; border: 1px solid var(--lamp-ring); }
.h-lamp + .h-lamp { margin-left: 0; }
.h-lamp.ask { background: var(--lamp-ask); }
.h-lamp.reply { background: var(--lamp-reply); }
.h-lamp.wait { background: var(--lamp-wait); }
.h-lamp.duty { background: var(--lamp-duty); }
.h-lamp.bg { background: var(--lamp-bg); }
.h-lamp.help { background: var(--lamp-help); }
.h-lamp.done { background: var(--lamp-done); }
.hist-legend { opacity: 1; font-size: 12px; line-height: 16px; color: var(--foreground); }
.hist-legend .h-lamp { animation: none; }
/* ---------- 第一百二十五轮：轮到你的对话挂微信式红圈数字 ---------- */
:root { --turn-red: #f23c3c; }
.turn-badge { flex-shrink: 0; box-sizing: border-box; min-width: 17px; height: 17px; padding: 0 5px; border-radius: 9px; background: var(--turn-red); color: #fff; font: 600 11px/17px var(--font); text-align: center; font-variant-numeric: tabular-nums; }
.h-label:has(.turn-badge) .h-text { min-width: 5em; }
.h-label .h-text + .turn-badge { margin-left: -2px; }   /* 紧挨名字 */
.h-label:has(.turn-badge) .h-rtag { flex-shrink: 1; min-width: 0; }   /* 侧栏太窄时文字标签先缩成省略号，名字、红圈、灯、转圈不让 */
.h-item.running .h-label:has(.turn-badge) .h-dot { margin-left: 0; }
.your-turn, .your-turn.ask { background: color-mix(in srgb, var(--turn-red) 12%, transparent); color: var(--turn-red); }
.your-turn span, .your-turn.ask span { min-width: 17px; height: 17px; padding: 0 5px; border-radius: 9px; background: var(--turn-red); color: #fff; line-height: 17px; }
#chat-list { position: relative; }
#chat-list .turn-badge { position: absolute; top: -3px; right: -5px; box-shadow: 0 0 0 2px var(--page); pointer-events: none; }
.m-tab:has(.turn-badge) .m-tab-label::after { display: none; }
@media (max-width: 900px) { .turn-badge { min-width: 18px; height: 18px; font-size: 11.5px; line-height: 18px; } }
.hist-legend .legend-turn { white-space: normal; }   /* r215：图例里红圈那句长，窄了能折行 */
.hist-legend .turn-badge { min-width: 10px; width: 10px; height: 10px; padding: 0; }

/* 第一百二十七轮：项目卡片名字优先，文件夹名只拿剩下的空位，不够就先缩成「…」 */
.h-proj .h-pname { flex: 0 1 auto; min-width: 0; }
.h-proj .h-pbase { flex: 1 1 0; min-width: 0; }
/* ---------- 第一百三十一轮：文字标签跟彩灯同色（浅底 + 同色字 + 同色小圆点；等批准 / 等你回复实心醒目）；底部后台卡片点分值守绿 / 后台蓝 ---------- */
:root, [data-theme="dark"] { --on-lamp: #172033; }
[data-theme="light"] { --on-lamp: #fff; }
.h-rtag[class] { --tag-c: var(--lamp-done); --tag-ink: var(--tag-c); color: var(--tag-ink); background: color-mix(in srgb, var(--tag-c) 15%, transparent); font-weight: 500; }
.h-rtag[class]::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 4px 1px 0; border-radius: 50%; background: var(--tag-c); vertical-align: middle; }
.h-rtag.ask { --tag-c: var(--lamp-ask); }
.h-rtag.reply { --tag-c: var(--lamp-reply); }
.h-rtag.wait { --tag-c: var(--lamp-wait); }
.h-rtag.duty { --tag-c: var(--lamp-duty); }
.h-rtag.bg { --tag-c: var(--lamp-bg); }
.h-rtag.help { --tag-c: var(--lamp-help); }
.h-rtag.done { --tag-c: var(--lamp-done); }
.h-rtag.ask, .h-rtag.reply { color: var(--on-lamp); background: var(--tag-c); font-weight: 600; }
.h-rtag.ask::before, .h-rtag.reply::before { display: none; }
[data-theme="light"] .h-rtag.wait { --tag-ink: color-mix(in srgb, var(--lamp-wait) 55%, #000); }   /* 浅色底上黄、绿、灰字太浅，字加深一点，小圆点仍是灯的颜色 */
[data-theme="light"] .h-rtag.duty { --tag-ink: color-mix(in srgb, var(--lamp-duty) 68%, #000); }
[data-theme="light"] .h-rtag.done { --tag-ink: color-mix(in srgb, var(--lamp-done) 68%, #000); }
.bg-dot.duty { background: var(--lamp-duty); }
.bg-dot.bg { background: var(--lamp-bg); }
/* ---------- 第一百八十轮：对话的项目目录在这台机器上不在：侧栏灰色「目录不在」（灯是空心圈）、对话头同色、输入框上面灰色实底提示条 ---------- */
:root, [data-theme="dark"] { --lamp-nocwd: #a3acba; }
[data-theme="light"] { --lamp-nocwd: #6b7280; }
.h-lamp.nocwd { background: var(--page); border: 2px solid var(--lamp-nocwd); }
.h-rtag.nocwd { --tag-c: var(--lamp-nocwd); }
[data-theme="light"] .h-rtag.nocwd { --tag-ink: color-mix(in srgb, var(--lamp-nocwd) 75%, #000); }
.chat-status.nocwd { color: var(--foreground); border-color: var(--lamp-nocwd); }
.cwd-bar { display: flex; flex-direction: column; margin-bottom: 8px; padding: 9px 10px 9px 12px; border-radius: 12px; border: 1px solid var(--lamp-nocwd); border-left-width: 4px; background: color-mix(in srgb, var(--lamp-nocwd) 12%, var(--page)); color: var(--foreground); font-size: 13px; line-height: 1.5; }
.cwd-bar .cb-main { font-weight: 600; overflow-wrap: anywhere; }
.cwd-bar .cb-sub { font-size: 12px; color: var(--muted-foreground); overflow-wrap: anywhere; }
@media (max-width: 760px) { .cwd-bar { padding: 10px 10px 10px 12px; } }
/* ---------- 第一百三十二轮：批准 / 选择题弹框不超过屏幕，中间滚、按钮常在；右上角能先收起，输入框上面留「打开」 ---------- */
#perm-modal .perm-card { position: relative; display: flex; flex-direction: column; box-sizing: border-box; max-height: calc(100vh - 40px); max-height: calc(100dvh - 40px); overflow: hidden; }
#perm-modal .perm-title { flex-shrink: 0; padding-right: 36px; }
.perm-close { position: absolute; top: 14px; right: 14px; }
#perm-modal .perm-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; margin: 0 -22px; padding: 0 22px 4px; }
#perm-modal .perm-actions { flex-shrink: 0; align-items: center; margin-top: 4px; padding-top: 12px; border-top: 1px solid var(--border); }
#perm-modal .perm-actions .spacer { flex: 1; }
#perm-modal .perm-input { margin-bottom: 8px; }
.perm-later > span { flex: 1 1 auto; min-width: 0; }
@media (max-width: 760px) {
  #perm-modal .perm-card { max-height: 88vh; max-height: 88dvh; }
  #perm-modal .perm-body { margin: 0 -16px; padding: 0 16px 4px; }
  #perm-modal .perm-actions .spacer { display: none; }
  .perm-close { top: 12px; right: 10px; }
  .perm-later { flex-wrap: nowrap; }
  .perm-later .btn { flex: none; padding: 0 16px; }
}
/* ---------- r138：对话换底色。深色主题叠得多一点（暗色调）、浅色主题叠得少一点（浅色调），左边竖条用原色；选中加边框和阴影 ---------- */
.h-item.tinted { background: color-mix(in srgb, var(--hc) 24%, transparent); }
.h-item.tinted:hover { background: color-mix(in srgb, var(--hc) 33%, transparent); }
.h-item.tinted.active { background: color-mix(in srgb, var(--hc) 30%, var(--surface)); border-color: var(--hc); box-shadow: var(--shadow-card); }
[data-theme="light"] .h-item.tinted { background: color-mix(in srgb, var(--hc) 14%, transparent); }
[data-theme="light"] .h-item.tinted:hover { background: color-mix(in srgb, var(--hc) 22%, transparent); }
[data-theme="light"] .h-item.tinted.active { background: color-mix(in srgb, var(--hc) 18%, var(--surface)); }
.h-item.tinted::before { left: -10px; border-left: 4px solid var(--hc); }
/* ---------- r182：侧栏选中另叠一层：里面一圈 2px 主色框（浅色藏青、暗色米金），名字加粗加深；r138 的底色和左边色条照旧 ---------- */
#history-list .h-item.active { border-color: transparent; box-shadow: inset 0 0 0 2px var(--brand); }
#history-list .h-item.active .h-text { color: var(--foreground); font-weight: 700; }
.menu-swatches { display: grid; grid-template-columns: repeat(5, 28px); gap: 8px; padding: 2px 10px 10px 32px; }
.menu-swatch { width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: var(--hc); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15); cursor: pointer; }
.menu-swatch:hover { transform: scale(1.1); }
.menu-swatch.sel { outline: 2px solid var(--foreground); outline-offset: 2px; }
.menu-swatch.none { grid-column: span 2; width: auto; border-radius: 14px; background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--border-strong); color: var(--muted-foreground); font-size: 12px; white-space: nowrap; }
.menu-swatch.none:hover { transform: none; color: var(--foreground); }
@media (max-width: 760px) { .menu-swatches { grid-template-columns: repeat(5, 36px); gap: 10px; padding-left: 34px; } .menu-swatch { width: 36px; height: 36px; } .menu-swatch.none { border-radius: 18px; font-size: 13px; } }
.chat-head.tinted { box-shadow: inset 0 -3px 0 var(--hc); }
.chat-head.tinted :is(#chat-title, [data-pid="chat-title"])::before { content: ""; display: inline-block; width: 10px; height: 10px; margin: 0 8px 1px 0; border-radius: 50%; background: var(--hc); vertical-align: middle; }
.m-tab.tinted .m-tab-label::before { content: ""; display: inline-block; width: 9px; height: 9px; margin: 0 6px 2px 0; border-radius: 50%; background: var(--hc); box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .7); vertical-align: middle; }

/* ---------- 第一百三十五轮：侧栏搜索也搜聊过的内容（名字结果下面一段「对话内容」，同一对话收拢；点了跳到那条闪一下） ---------- */
.cs-sec { margin: 4px 0 10px; }
.cs-h { display: flex; align-items: center; gap: 6px; padding: 10px 6px 6px; font-size: 12.5px; font-weight: 600; color: var(--muted-foreground); }
.cs-h svg { width: 14px; height: 14px; }
.cs-n { font-weight: 400; color: var(--hint); }
.cs-group { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 8px; overflow: hidden; }
.cs-gh { display: flex; align-items: baseline; gap: 8px; padding: 9px 12px 3px; }
.cs-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; font-size: 13.5px; color: var(--foreground); }
.cs-proj { margin-left: auto; flex-shrink: 0; font-size: 11.5px; color: var(--hint); }
.cs-hit { display: block; width: 100%; padding: 6px 12px 8px; border: 0; border-top: 1px solid var(--border); background: transparent; color: var(--foreground); font: inherit; text-align: left; cursor: pointer; }
.cs-gh + .cs-hit { border-top: 0; }
.cs-hit:hover { background: var(--surface-2); }
.cs-meta { display: block; margin-bottom: 2px; font-size: 11.5px; color: var(--muted-foreground); }
.cs-snip { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font-size: 13px; line-height: 1.55; overflow-wrap: anywhere; }
.cs-snip mark { padding: 0 1px; border-radius: 3px; background: color-mix(in srgb, var(--lamp-wait) 55%, var(--surface)); color: inherit; }
/* ---------- r183：无感换段：那几步收成的一行、换段中那行用深一点的灰字；侧栏「换段中」青色（灯慢慢呼吸） ---------- */
.sys-line.seam-fold, .sys-line.seam-wait { color: var(--muted-foreground); }
:root, [data-theme="dark"] { --lamp-seam: #2cc4b4; }
[data-theme="light"] { --lamp-seam: #0f8f83; }
.h-lamp.seam { background: var(--lamp-seam); }
#history-list .h-lamp.seam { animation: h-breathe 1.4s ease-in-out infinite; }
.h-rtag.seam[class] { --tag-c: var(--lamp-seam); }
[data-theme="light"] .h-rtag.seam[class] { --tag-ink: color-mix(in srgb, var(--lamp-seam) 70%, #000); }
.cs-more { display: block; width: 100%; padding: 6px 12px 8px; border: 0; border-top: 1px solid var(--border); background: transparent; color: var(--brand-ink); font: inherit; font-size: 12.5px; text-align: left; cursor: pointer; }
.cs-more:hover { background: var(--surface-2); }
.cs-note { padding: 10px; }
.msg.cs-flash, .tool-card.cs-flash { border-radius: 8px; outline: 2px solid transparent; outline-offset: 6px; animation: cs-flash 2.4s ease-out; }
@keyframes cs-flash { 0%, 45% { outline-color: var(--brand); background-color: var(--brand-soft); } 100% { outline-color: transparent; background-color: transparent; } }

/* r141：GPT 对话 */
/* r141-2：GPT 小标记和头像用 OpenAI 的标（单色，侧栏、胶囊里跟着字色走） */
:root { --gpt-logo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22.2819 9.8211a5.9847 5.9847 0 0 0-.5157-4.9108 6.0462 6.0462 0 0 0-6.5098-2.9A6.0651 6.0651 0 0 0 4.9807 4.1818a5.9847 5.9847 0 0 0-3.9977 2.9 6.0462 6.0462 0 0 0 .7427 7.0966 5.98 5.98 0 0 0 .511 4.9107 6.051 6.051 0 0 0 6.5146 2.9001A5.9847 5.9847 0 0 0 13.2599 24a6.0557 6.0557 0 0 0 5.7718-4.2058 5.9894 5.9894 0 0 0 3.9977-2.9001 6.0557 6.0557 0 0 0-.7475-7.0729zm-9.022 12.6081a4.4755 4.4755 0 0 1-2.8764-1.0408l.1419-.0804 4.7783-2.7582a.7948.7948 0 0 0 .3927-.6813v-6.7369l2.02 1.1686a.071.071 0 0 1 .038.052v5.5826a4.504 4.504 0 0 1-4.4945 4.4944zm-9.6607-4.1254a4.4708 4.4708 0 0 1-.5346-3.0137l.142.0852 4.783 2.7582a.7712.7712 0 0 0 .7806 0l5.8428-3.3685v2.3324a.0804.0804 0 0 1-.0332.0615L9.74 19.9502a4.4992 4.4992 0 0 1-6.1408-1.6464zM2.3408 7.8956a4.485 4.485 0 0 1 2.3655-1.9728V11.6a.7664.7664 0 0 0 .3879.6765l5.8144 3.3543-2.0201 1.1685a.0757.0757 0 0 1-.071 0l-4.8303-2.7865A4.504 4.504 0 0 1 2.3408 7.872zm16.5963 3.8558L13.1038 8.364 15.1192 7.2a.0757.0757 0 0 1 .071 0l4.8303 2.7913a4.4944 4.4944 0 0 1-.6765 8.1042v-5.6772a.79.79 0 0 0-.407-.667zm2.0107-3.0231l-.142-.0852-4.7735-2.7818a.7759.7759 0 0 0-.7854 0L9.409 9.2297V6.8974a.0662.0662 0 0 1 .0284-.0615l4.8303-2.7866a4.4992 4.4992 0 0 1 6.6802 4.66zM8.3065 12.863l-2.02-1.1638a.0804.0804 0 0 1-.038-.0567V6.0742a4.4992 4.4992 0 0 1 7.3757-3.4537l-.142.0805L8.704 5.459a.7948.7948 0 0 0-.3927.6813zm1.0976-2.3654l2.602-1.4998 2.6069 1.4998v2.9994l-2.5974 1.4997-2.6067-1.4997Z'/%3E%3C/svg%3E"); }
.h-gpt, .chip .gpt-tag { flex: none; width: 13px; height: 13px; background: currentColor; -webkit-mask: var(--gpt-logo) center / contain no-repeat; mask: var(--gpt-logo) center / contain no-repeat; }
.chip .gpt-tag { width: 12px; height: 12px; margin-right: 4px; }
.h-aws { flex: none; font-size: 10px; line-height: 14px; padding: 0 4px; border-radius: 4px; color: var(--muted-foreground); border: 1px solid var(--border-strong); }   /* r149：副号对话 */
.nm-eng { margin-bottom: 6px; }
.nm-eng-note { margin: 0 0 10px; min-height: 0; }
.nm-eng-note:empty { display: none; }
.nm-acct { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: 13px; color: var(--muted-foreground); }   /* r209：新建云机对话挑号 */
.nm-acct.hidden { display: none; }
.nm-acct > span { flex: none; white-space: nowrap; }
.h-aws { max-width: 7em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }   /* r209：小标写号名，太长省略 */
.nm-acct select { flex: 1 1 auto; min-width: 0; height: 34px; padding: 0 8px; }
.msg.assistant.gpt-img .msg-img { max-width: min(360px, 100%); max-height: 360px; object-fit: contain; }
:is(#chat-msgs, [data-pid="chat-msgs"]).gpt .avatar { background: #0d0d0d; }   /* r141-2：浅色黑底白标，深色白底黑标 */
:is(#chat-msgs, [data-pid="chat-msgs"]).gpt .avatar svg { display: none; }
:is(#chat-msgs, [data-pid="chat-msgs"]).gpt .avatar::after { content: ""; display: block; width: 18px; height: 18px; background: #fff; -webkit-mask: var(--gpt-logo) center / contain no-repeat; mask: var(--gpt-logo) center / contain no-repeat; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) :is(#chat-msgs, [data-pid="chat-msgs"]).gpt .avatar { background: #fff; } :root:not([data-theme="light"]) :is(#chat-msgs, [data-pid="chat-msgs"]).gpt .avatar::after { background: #0d0d0d; } }
:root[data-theme="dark"] :is(#chat-msgs, [data-pid="chat-msgs"]).gpt .avatar { background: #fff; }
:root[data-theme="dark"] :is(#chat-msgs, [data-pid="chat-msgs"]).gpt .avatar::after { background: #0d0d0d; }

/* r140：问了你还没回的消息 —— 黄色虚线框（不铺底）+「等你回」字签 + 引用回复 / 不用回了；输入框上方「没回 N」 */
:root, [data-theme="dark"] { --ask-line: #b9ab4c; --ask-tag-bg: #cfc052; --ask-tag-fg: #1d1a00; --ask-flash: rgba(207, 192, 82, .08); }
[data-theme="light"] { --ask-line: #e2c51c; --ask-tag-bg: #f7e35a; --ask-tag-fg: #3b3300; --ask-flash: rgba(233, 207, 28, .09); }
.ask-carried { display: flex; gap: 14px; align-items: flex-start; max-width: 920px; width: 100%; align-self: flex-start; }
.ask-carried .turn-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
[data-ask-id].ask-open { outline: 2px dashed var(--ask-line); outline-offset: 8px; border-radius: 14px; margin-top: 8px; margin-bottom: 8px; }
[data-ask-id].ask-flash { animation: ask-flash 1.4s ease-out; }
@keyframes ask-flash { 0%, 35% { background-color: var(--ask-flash); } 100% { background-color: transparent; } }
.ask-tag { display: inline-flex; align-items: center; gap: 5px; align-self: flex-start; font-size: 12px; font-weight: 600; line-height: 1.6; background: var(--ask-tag-bg); color: var(--ask-tag-fg); border-radius: 999px; padding: 1px 9px 1px 7px; margin-bottom: 4px; }
.ask-tag svg, .to-ask svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ask-acts { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 2px; }
.ask-acts button { border-radius: 999px; font-size: 13px; padding: 5px 13px; line-height: 1.4; }
.ask-acts .ask-quote { border: 0; background: var(--brand); color: var(--on-brand); font-weight: 600; }
.ask-acts .ask-dismiss { border: 1px solid var(--border-strong); background: var(--surface); color: var(--muted-foreground); }
.ask-acts button:hover { filter: brightness(1.06); }
.ask-from { font-size: 12.5px; color: var(--muted-foreground); margin-bottom: 2px; }
.ask-carried:not(.ask-open) { display: none; }   /* r222：换段带过来的已经回了 / 点了不用回了，不再画（点「不是回这条」撤回来会重新亮） */
.ask-more { align-self: flex-start; border: 0; background: none; padding: 2px 0; font-size: 12.5px; color: var(--muted-foreground); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.ask-more:hover { color: var(--foreground); }
.to-ask {
  position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); height: 40px; border-radius: 999px; border: 0; z-index: 2;
  background: var(--foreground); color: var(--page); box-shadow: 0 4px 14px rgba(0, 0, 0, .25); opacity: .92;
  display: inline-flex; align-items: center; gap: 7px; padding: 0 8px 0 13px; font-size: 13.5px; font-weight: 600; white-space: nowrap; cursor: pointer;
}
.to-ask:hover { opacity: 1; }
.to-ask svg { width: 17px; height: 17px; stroke-width: 1.9; }
.to-ask .n { min-width: 24px; height: 24px; border-radius: 999px; background: var(--ask-tag-bg); color: var(--ask-tag-fg); display: grid; place-items: center; font-size: 12.5px; padding: 0 6px; }
.to-bottom:not(.hidden) + .to-ask { transform: translateX(calc(-100% - 30px)); }   /* 回到底部箭头在的时候，挪到它左边 */
@media (max-width: 760px) { .to-ask { bottom: 10px; } }
.ask-chip { display: flex; align-items: center; gap: 8px; border: 1.5px dashed var(--ask-line); border-radius: 9px; padding: 4px 6px 4px 10px; margin: 0 0 6px; font-size: 12.5px; color: var(--muted-foreground); }
.ask-chip .tx { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ask-chip b { color: var(--foreground); font-weight: 600; }
.ask-chip button { border: 0; background: none; color: var(--hint); padding: 2px 6px; font-size: 16px; line-height: 1; }
.ask-tip { align-self: flex-end; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; max-width: min(720px, 92%); margin-top: -10px; font-size: 12.5px; color: var(--muted-foreground); background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 6px 10px; }
.ask-tip span:first-child { color: var(--ok); }
.ask-tip button { border: 0; background: none; padding: 0; color: var(--brand); font: inherit; font-weight: 600; }
/* r198：「翻不到了」这类提示一栏只留一条，再点闪一下；没回那条自己带两个按钮 */
.sys-line.once-line { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 12px; border-radius: 8px; padding: 4px 8px; }
.sys-line.once-line button { border: 0; background: none; padding: 0; color: var(--brand); font: inherit; font-weight: 600; cursor: pointer; }
.sys-line.once-flash { animation: ask-flash 1.4s ease-out; }
.sys-line.once-line:last-child { margin-bottom: 56px; }   /* 在最底下时让开浮着的「没回」胶囊 */

/* r151：多栏布局（电脑 1 / 2 / 3 栏并排；手机不分栏） */
.pane-no, .pane-tools, .pane-empty, .pane-pick, .rail-n:empty { display: none; }
body.multi .pane-row > .claude-area { position: relative; }
body.multi .chat-head { padding: 0 10px 0 14px; border-top: 2px solid transparent; }
body.multi .claude-area.cur-pane .chat-head { border-top-color: var(--brand); }
body.multi .pane-no { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 20px; height: 20px; margin-right: 8px; border-radius: 6px; border: 1px solid var(--border); background: var(--surface-2); color: var(--muted-foreground); font-size: 12px; font-weight: 600; }
body.multi .claude-area.cur-pane .pane-no { border-color: var(--brand); background: var(--brand-soft-2); color: var(--brand-ink); }
body.multi .pane-tools { display: inline-flex; gap: 2px; flex-shrink: 0; margin-left: 6px; }
body.multi .pane-tools .icon-btn { width: 26px; height: 26px; font-size: 16px; font-weight: 500; line-height: 1; }
body.multi .pane-tools .icon-btn:disabled { visibility: hidden; }
body.multi .pane-tools svg { width: 14px; height: 14px; }
body.multi .claude-area.cur-pane .composer .chat-input-row { border-color: var(--brand); }
body.multi .claude-area:not(.cur-pane) .chat-input-row .btn.primary { background: var(--surface-2); border-color: var(--border-strong); color: var(--muted-foreground); box-shadow: none; }
body.multi .claude-area.empty > .pane-empty { display: flex; position: absolute; inset: 0; z-index: 25; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 20px; background: var(--page); }
.pane-empty .pe-no { font-size: 13px; color: var(--muted-foreground); }
.pane-empty .pe-add { height: 40px; padding: 0 18px; gap: 6px; font-size: 14px; }
.pane-empty .pe-add svg { width: 16px; height: 16px; }
.pane-empty .pe-tip { max-width: 260px; font-size: 12px; line-height: 1.6; color: var(--hint); text-align: center; }
body.multi .pane-pick { display: flex; flex-direction: column; position: absolute; z-index: 30; top: 60px; left: 50%; transform: translateX(-50%); width: min(340px, calc(100% - 24px)); max-height: min(440px, calc(100% - 80px)); border: 1px solid var(--border-strong); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow-pop); overflow: hidden; }
.pane-pick .pp-q { flex-shrink: 0; margin: 10px; height: 34px; padding: 0 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-2); color: var(--foreground); font: inherit; font-size: 13px; outline: none; }
.pane-pick .pp-q:focus { border-color: var(--brand); }
.pane-pick .pp-list { overflow-y: auto; padding: 0 6px 8px; }
.pane-pick .pp-item { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; padding: 7px 10px; border: 0; border-radius: 8px; background: none; color: var(--foreground); font: inherit; text-align: left; cursor: pointer; }
.pane-pick .pp-item:hover { background: var(--surface-2); }
.pane-pick .pp-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; font-weight: 500; }
.pane-pick .pp-sub, .pane-pick .pp-none { font-size: 12px; color: var(--muted-foreground); }
.pane-pick .pp-none { padding: 14px 10px; }
body.multi .claude-area.pane-drop::after { content: attr(data-drop); position: absolute; inset: 10px; z-index: 40; display: flex; align-items: center; justify-content: center; padding: 20px; border: 2px dashed var(--brand); border-radius: 14px; background: var(--surface-2); color: var(--brand-ink); font-size: 14px; font-weight: 600; text-align: center; pointer-events: none; }
.h-pane { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; min-width: 16px; height: 16px; margin-left: 5px; padding: 0 3px; border-radius: 4px; background: var(--brand-soft-2); color: var(--brand-ink); font-size: 10.5px; font-weight: 600; }
.rail-n { position: absolute; top: 3px; right: 5px; min-width: 15px; height: 15px; padding: 0 3px; border-radius: 8px; background: var(--brand-strong); color: #fff; font-size: 10px; font-style: normal; font-weight: 700; line-height: 15px; text-align: center; }
@media (max-width: 760px) { #rail-layout { display: none; } }
.pane-narrow { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 6px 14px; border-bottom: 1px solid var(--border); background: var(--surface-2); color: var(--muted-foreground); font-size: 12.5px; }
.pane-narrow .pn-btns { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.pane-narrow .pn-btn { max-width: 200px; height: 24px; padding: 0 9px; border: 1px solid var(--border-strong); border-radius: 7px; background: var(--surface); color: var(--foreground); font: inherit; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.pane-narrow .pn-btn.on { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-ink); }
body.pane-tight .history { position: absolute; left: 64px; top: 0; bottom: 0; z-index: 20; box-shadow: var(--shadow-pop); }
.history.h-yield { transform: translateX(-110%); pointer-events: none; }
body.pane-tight .rail { position: relative; z-index: 21; }   /* 浮着的侧栏让开时从窄栏底下滑走，不盖住窄栏 */
body.multi #tui-pane, body.multi #tui-split { display: none !important; }
/* r154：两栏 / 三栏时每栏是一张圆角卡片、栏和栏之间留空，消息改成左右聊天泡泡（单栏、手机不受影响） */
body.multi { --pb-ai: var(--surface-2); --pb-user: color-mix(in srgb, var(--brand) 24%, var(--surface)); }
[data-theme="light"] body.multi { --pb-user: color-mix(in srgb, var(--brand) 14%, var(--surface)); }
body.multi .pane-row { gap: 10px; padding: 10px; background: var(--page-2); }
body.multi .pane-row > .claude-area { min-width: 0; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-card); overflow: hidden; }
body.multi .pane-row .composer { background: transparent; }
body.multi .chat-msgs { gap: 16px; padding-left: 14px; padding-right: 14px; }
body.multi .turn { gap: 10px; }
body.multi .turn-body { max-width: calc(100% - 26px); }
body.multi .turn-body .msg.assistant { width: auto; max-width: 100%; align-self: flex-start; }
body.multi .msg.assistant .bubble { padding: 10px 14px; border-radius: 4px 14px 14px 14px; background: var(--pb-ai); }
body.multi .msg.assistant.gpt-img .bubble { padding: 6px; }
body.multi .msg.user { max-width: 85%; }
body.multi .msg.user .bubble { padding: 10px 14px; border-radius: 14px 4px 14px 14px; background: var(--pb-user); color: var(--foreground); box-shadow: none; }
body.multi .msg.user .bubble a { color: var(--brand-ink); }
body.multi .msg .bubble pre, body.multi .pre-wrap { max-width: 100%; }
body.multi .msg .bubble table { display: block; max-width: 100%; overflow-x: auto; }
body.multi .msg .bubble th, body.multi .msg .bubble td { white-space: nowrap; }
body.multi .msg.relay { max-width: 100%; margin: 2px 0; }
body.multi .relay-head { min-width: 0; }
body.multi .relay-head > span:first-of-type, body.multi .relay-tag { flex-shrink: 0; white-space: nowrap; }
body.multi .relay-go-btn { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* r156：两栏 / 三栏时栏头整条填这个对话的颜色（没设颜色的跟「发送」按钮同色同字色），栏头上的字和按钮换成在底色上看得清的颜色 */
body.multi .chat-head { --hc-bg: var(--brand-strong); --hc-fg: var(--on-brand); background: var(--hc-bg); border-bottom-color: var(--hc-bg); color: var(--hc-fg); }
[data-theme="dark"] body.multi .chat-head { --hc-bg: var(--brand); }
body.multi .chat-head.tinted { --hc-bg: var(--hc); --hc-fg: #fff; box-shadow: none; }
body.multi .chat-head.tinted.ink-dark { --hc-fg: #1b2538; }
/* ---------- r185：多栏选中那栏（F 底色 + 输入框）：整栏铺这条对话颜色的浅底（实色），栏里分隔线同色浅线、AI 气泡换底免得糊在一起；输入框 2px 对话色边框 + 浅底 + 一圈实色光晕。
   没设颜色的用主色（浅色藏青、暗色米金）；暗色是深底上 12% 的对话色。没选中的栏、单栏都不变 ---------- */
body.multi .pane-row > .claude-area.cur-pane { --pc: var(--pc185, var(--brand)); --pbg185: color-mix(in srgb, var(--pc) 12%, var(--surface)); --border: color-mix(in srgb, var(--pc) 30%, var(--surface)); --pb-ai: var(--page); background: var(--pbg185); }
[data-theme="light"] body.multi .pane-row > .claude-area.cur-pane { --pbg185: color-mix(in srgb, var(--pc) 9%, #fff); --border: color-mix(in srgb, var(--pc) 20%, #fff); --pb-ai: #fff; }
body.multi .pane-row > .claude-area.cur-pane .chain-bar { background: var(--pbg185); }
body.multi .pane-row > .claude-area.cur-pane .composer .chat-input-row, body.multi .pane-row > .claude-area.cur-pane .composer .chat-input-row:focus-within { border: 2px solid var(--pc); background: color-mix(in srgb, var(--pc) 8%, var(--surface)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--pc) 18%, var(--pbg185)); }
[data-theme="light"] body.multi .pane-row > .claude-area.cur-pane .composer .chat-input-row, [data-theme="light"] body.multi .pane-row > .claude-area.cur-pane .composer .chat-input-row:focus-within { background: color-mix(in srgb, var(--pc) 7%, #fff); }
body.multi .claude-area.cur-pane .chat-head { border-top-color: transparent; }
body.multi .chat-head.tinted :is(#chat-title, [data-pid="chat-title"])::before { display: none; }
body.multi .chat-head :is(#chat-title, [data-pid="chat-title"]), body.multi .chat-head .icon-btn { color: var(--hc-fg); }
body.multi .chat-head .icon-btn:hover { background: color-mix(in srgb, var(--hc-bg) 80%, var(--hc-fg)); color: var(--hc-fg); }
body.multi .chat-head .chat-status, body.multi .chat-head .chat-status.run { border-color: var(--hc-fg); background: transparent; color: var(--hc-fg); }
body.multi .chat-head .pane-no { border-color: var(--hc-fg); background: transparent; color: var(--hc-fg); }
body.multi .claude-area.cur-pane .chat-head .pane-no { border-color: var(--hc-fg); background: var(--hc-fg); color: var(--hc-bg); }
body.multi .chat-head .chat-status { flex: 1000 0 calc(2em + 24px); min-width: 0; max-width: max-content; overflow: hidden; text-overflow: ellipsis; }   /* r158：状态起步只占「就绪」两个字宽，名字放全以后有空余才长回全宽；「已结束 · 发消息即恢复」这类长状态先收成省略号，名字多留字 */
body.multi .chat-head :is(#chat-title, [data-pid="chat-title"]) { min-width: 0; }   /* r158：状态收到最短还放不下，名字再收成省略号；× 和 ‹ › ⇄ 一直在栏里 */
/* r159：有新版不弹浮条，侧栏和「我的」页的「更新」按钮右上角挂小红点；「网页版本」卡片折着时卡片标题也挂一个；手机「⋯」菜单里的「检查更新」字后面挂一个 */
#rail-update.has-update::after, #me-update.has-update::after { content: ""; position: absolute; top: 5px; right: 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--danger); }
#me-update { position: relative; }
#me-update.has-update::after { top: -3px; right: -3px; }
.me-card.folded:has(#me-update.has-update) > .me-h::after { content: ""; order: 1; margin-left: auto; width: 8px; height: 8px; border-radius: 50%; background: var(--danger); align-self: center; flex: none; }
.me-card.folded:has(#me-update.has-update) > .me-h .me-caret { order: 2; margin-left: 0; }
.menu-item.has-update .mi-label::after { content: ""; display: inline-block; width: 7px; height: 7px; margin-left: 6px; border-radius: 50%; background: var(--danger); vertical-align: middle; }
/* r171：竖条里副号收成一个「副号」圈，点开实底小浮窗列每个副号的 5 小时、7 天额度和恢复时间 */
.aws-pop { position: fixed; z-index: 60; width: 330px; max-height: calc(100vh - 16px); overflow-y: auto; padding: 10px 12px 4px; border-radius: 12px;
  background: var(--surface); border: 1px solid var(--border-strong); box-shadow: var(--shadow-pop); color: var(--foreground); }
.aws-pop .ap-h { font-size: 12px; font-weight: 600; color: var(--muted-foreground); margin-bottom: 6px; }
.aws-pop .ap-acct { padding: 8px 0; border-top: 1px solid var(--border); }
.aws-pop .ap-name { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; font-size: 13.5px; font-weight: 600; margin-bottom: 6px; }
.aws-pop .ap-label { white-space: nowrap; }
.aws-pop .ap-stale { font-size: 11px; font-weight: 400; color: var(--muted-foreground); }
.aws-pop .ap-row { display: grid; grid-template-columns: 44px 1fr 52px 128px; align-items: center; gap: 8px; font-size: 12.5px; line-height: 22px; }
.aws-pop .ap-k { color: var(--muted-foreground); }
.aws-pop .ap-bar { height: 6px; border-radius: 3px; background: var(--surface-3); overflow: hidden; }
.aws-pop .ap-bar i { display: block; height: 100%; border-radius: 3px; background: var(--brand); }
.aws-pop .ap-left { font-weight: 600; font-family: var(--mono); text-align: right; }
.aws-pop .ap-at { color: var(--muted-foreground); font-size: 12px; white-space: nowrap; }
.aws-pop .ap-row.bad .ap-bar i { background: var(--danger); }
.aws-pop .ap-row.bad .ap-left { color: var(--danger); }
.quota-item.aws-fold[aria-expanded="true"] { background: var(--surface-2); }
/* r166：多人协作。员工（body.staff）藏掉老板才有的东西；登录页邀请块；「我的」页成员卡、号卡；侧栏员工对话挂人名、按人筛选 */
body.staff :is(#new-term, #open-config, #open-nuan, #open-files, #open-wx, #hf-wx, #hf-config, #history-new-more, #history-trash, #me-rename, #chat-at, [data-pid="chat-at"], #chat-attach, [data-pid="chat-attach"], .m-tab-ren, #chat-term, .quick-btn[data-act="term"], .quick-btn[data-act="files"], .quota-reset, .mq-reset, .qr-reset, .h-pren, .h-peng, .owner-only) { display: none !important; }
body.staff #history-new { border-radius: 8px; }
body.staff #me-avatar { pointer-events: none; }
body.staff #me-avatar i { display: none; }
.login.inviting :is(.features, #wx-login, #pair-box, .auth-foot) { display: none !important; }
.inv-box { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.inv-title { font-size: 17px; font-weight: 600; color: var(--foreground); }
.inv-sub { font-size: 13px; color: var(--muted-foreground); line-height: 1.6; }
.inv-box .wx-panel { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.inv-box .wx-panel.hidden, .inv-box .wx-btn.hidden { display: none; }
.inv-leave { font-size: 12.5px; color: var(--hint); }
@media (max-width: 760px) { #open-board { order: 1; } }   /* r225：手机底部栏老板、员工都有「看板」，排在「对话」后面（r166 员工隐藏名单里的 #open-board 也拿掉了） */
.tm-row { display: flex; align-items: center; gap: 10px; padding: 9px 0; flex-wrap: wrap; }
.tm-row + .tm-row, .tm-confirm + .tm-row { border-top: 1px solid var(--border); }
.tm-main { display: flex; align-items: center; gap: 8px; min-width: 0; }
.tm-name { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 12em; }
.tm-role { flex: none; font-size: 11px; line-height: 16px; padding: 0 6px; border-radius: 4px; border: 1px solid var(--border-strong); color: var(--muted-foreground); }
.tm-role.owner { border-color: var(--brand); color: var(--brand-ink); }
.tm-sub { flex: 1; min-width: 8em; font-size: 12.5px; color: var(--hint); }
.tm-sub.on { color: var(--ok); }
.tm-row.off .tm-name, .tm-row.off .tm-role { color: var(--hint); }
.tm-off-btn { flex: none; }
.tm-confirm { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; margin: 2px 0 8px; border-radius: 10px; border: 1px solid var(--danger); background: color-mix(in srgb, var(--danger) 8%, var(--page)); }
.tm-ctext { flex: 1; min-width: 12em; font-size: 13px; line-height: 1.6; color: var(--foreground); }
.tm-cbtns { display: flex; gap: 8px; flex: none; }
.tm-confirm .btn.danger { background: var(--danger); border-color: var(--danger); color: #fff; }
.tm-add { margin: 8px 0 2px; }
.tm-add svg, .ac-add svg { width: 14px; height: 14px; }
.tm-form { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 0 4px; border-top: 1px solid var(--border); }
.tm-in, .tm-sel { height: 32px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--border-strong); background: var(--page); color: var(--foreground); font: inherit; font-size: 13.5px; }
.tm-in { flex: 1; min-width: 9em; }
.tm-sel { max-width: 100%; }
.tm-err { text-align: left; margin-top: 4px; }
.tm-made { display: flex; gap: 14px; align-items: flex-start; flex-wrap: wrap; padding: 12px 0 4px; border-top: 1px solid var(--border); }
.tm-qr { width: 168px; height: 168px; flex: none; }
.tm-minfo { flex: 1; min-width: 12em; display: flex; flex-direction: column; gap: 6px; }
.tm-url { font: 12px var(--mono); color: var(--muted-foreground); word-break: break-all; padding: 6px 8px; border-radius: 6px; background: var(--page-2); }
.tm-h { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); font-size: 12.5px; font-weight: 600; color: var(--muted-foreground); }
.tm-row.inv { border-top: 0; padding: 6px 0; }
.ac-row { display: flex; align-items: center; gap: 12px; padding: 10px 0; }
.ac-row + .ac-row { border-top: 1px solid var(--border); }
.ac-info { flex: 1; min-width: 0; }
.ac-rings { display: flex; gap: 6px; flex: none; }
.ac-ring { display: flex; flex-direction: column; align-items: center; gap: 2px; color: var(--muted-foreground); }
.ac-ring.stale .ring { opacity: .55; }
.ac-add { margin-top: 8px; }
.h-who { flex: none; max-width: 5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; line-height: 15px; padding: 0 5px; border-radius: 4px; color: var(--brand-ink); border: 1px solid var(--brand); }
#history-who.on { border-color: var(--brand); color: var(--brand-ink); }
.board-area { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
/* ---------- 第一百六十九轮：副号名额满了排队 / 额度用完 / 重启没发出去：输入框上面一条实底提示；侧栏「排队中」玫红灯 ---------- */
:root, [data-theme="dark"] { --lamp-queue: #f062c4; }
[data-theme="light"] { --lamp-queue: #c4268f; }
.h-lamp.queue { background: var(--lamp-queue); }
.h-rtag.queue { --tag-c: var(--lamp-queue); }
.queue-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; padding: 9px 10px 9px 12px; border-radius: 12px; border: 1px solid var(--qb-c); border-left-width: 4px; background: color-mix(in srgb, var(--qb-c) 12%, var(--page)); color: var(--foreground); font-size: 13px; line-height: 1.5; }
.queue-bar.queue { --qb-c: var(--lamp-queue); }
.queue-bar.full, .queue-bar.lost { --qb-c: var(--danger); }
.queue-bar .qb-words { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.queue-bar .qb-main { font-weight: 600; overflow-wrap: anywhere; }
.queue-bar .qb-sub { font-size: 12px; color: var(--muted-foreground); overflow-wrap: anywhere; }
.queue-bar .qb-alt { font-size: 12px; font-weight: 600; color: var(--foreground); overflow-wrap: anywhere; }   /* r209 */
.queue-bar .btn { flex-shrink: 0; }
@media (max-width: 760px) { .queue-bar { padding: 10px 10px 10px 12px; } .queue-bar .btn { height: 34px; padding: 0 14px; } }
/* r195：员工号上的对话，老板这边输入行换成一句话 */
.composer.owner-blocked > :is(.chat-input-row, .chips, .compose-bar, .img-tray) { display: none !important; }
.owner-block-bar { display: flex; align-items: center; gap: 10px; padding: 11px 10px 11px 12px; border-radius: 12px; border: 1px solid var(--border); border-left: 4px solid var(--muted-foreground); background: var(--page-2); color: var(--foreground); font-size: 13px; line-height: 1.5; }
.owner-block-bar .ob-words { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.owner-block-bar .ob-main { font-weight: 600; overflow-wrap: anywhere; }
.owner-block-bar .ob-sub { font-size: 12px; color: var(--muted-foreground); overflow-wrap: anywhere; }
.owner-block-bar .btn { flex-shrink: 0; }
body.staff .owner-block-bar { display: none; }
@media (max-width: 760px) { .owner-block-bar .btn { height: 34px; padding: 0 14px; } }
/* r199：老板看员工那边的批准 / 选择题：只读，没有允许 / 拒绝 / 提交，选项灰着 */
#perm-modal.owner-view :is(#perm-allow, #perm-deny) { display: none; }
#perm-modal.owner-view .ask-opt, #perm-modal.owner-view .ask-other { cursor: default; background: var(--page-2); color: var(--muted-foreground); box-shadow: none; }
#perm-modal.owner-view .ask-opt small { color: var(--muted-foreground); }
.owner-view-note { margin: 2px 0 12px; padding: 9px 12px; border-radius: 10px; border: 1px solid var(--border); border-left: 4px solid var(--muted-foreground); background: var(--page-2); color: var(--foreground); font-size: 13px; }
/* r210：电脑竖条主号三层同心环（外 5 小时、中周、内 Fable）。够用时三层各一色，剩 30% 以下变 warn、10% 以下变 danger，跟单个圈一样 */
:root, [data-theme="dark"] { --tri-week: #2cc4b4; --tri-fable: #b98bff; }
[data-theme="light"] { --tri-week: #0f8f83; --tri-fable: #8a46d6; }
.ring.tri { width: 42px; height: 42px; }
.ring.tri .ring-bg, .ring.tri .ring-fg { stroke-width: 3.4; }
.ring.tri .t5 { stroke: var(--brand); fill: var(--brand); }
.ring.tri .t7 { stroke: var(--tri-week); fill: var(--tri-week); }
.ring.tri .tf { stroke: var(--tri-fable); fill: var(--tri-fable); }
.ring.tri .warn { stroke: var(--warn); fill: var(--warn); }
.ring.tri .bad { stroke: var(--danger); fill: var(--danger); }
.ring.tri .ring-fg { fill: none; }
.ring.tri text[class] { font-size: 10px; stroke: none; }
@media (min-width: 761px) and (max-height: 760px) { .ring.tri { width: 36px; height: 36px; } }
@media (min-width: 761px) and (max-height: 560px) { .ring.tri { width: 30px; height: 30px; } }
/* r210：导航按钮多了（8 个），窗口矮于 660 时额度区几乎没地方（560 高时只剩 17px）；这时导航按钮压矮一点、额度区上下留白收一点，给三层环腾地方（图标、文字照旧） */
@media (min-width: 761px) and (max-height: 660px) { .rail-logo { margin-bottom: 6px; } .rail-btn.labeled { height: 41px; gap: 2px; } .rail-btn.labeled.current::before { top: 11px; bottom: 11px; } .quota { padding: 6px 0 4px; } .rail-avatar, .rail-avatar.has-img { width: 20px; height: 20px; flex-shrink: 0; } }
@media (min-width: 761px) and (max-height: 560px) { .rail { padding-top: 6px; } .rail-btn.labeled { height: 37px; font-size: 10px; } .rail-btn.labeled svg { width: 18px; height: 18px; } .rail-btn.labeled.current::before { top: 10px; bottom: 10px; } .rail-avatar, .rail-avatar.has-img { width: 18px; height: 18px; flex-shrink: 0; } }
/* ---------- r219：触屏宽屏（折叠屏展开横拿、iPad）没有右键、没有悬停：侧栏条目照手机挂「⋯」，复制按钮、文件行操作常显；鼠标电脑不变 ---------- */
@media (hover: none) and (pointer: coarse) and (min-width: 761px) {
  .h-item, .h-item.term { padding-right: 38px; }
  .h-more { display: flex; position: absolute; right: 1px; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; border: 0; border-radius: 8px; background: transparent; color: var(--hint); align-items: center; justify-content: center; }
  .h-more svg { width: 17px; height: 17px; }
  .h-more:active { background: var(--surface-2); color: var(--foreground); }
  .h-item:has(.editing) .h-more { display: none; }
  .copy-btn { opacity: 1; }
  .file-row .act { visibility: visible; }
}
/* r219：很矮的手机屏（折叠屏合上横拿 594×368）聊天区只剩两行：收起标签上面的额度长条（点「我的」照样看额度），底部导航只留图标、压矮 */
@media (max-width: 760px) and (max-height: 420px) {
  .m-quota { display: none; }
  .chat-head { padding-top: env(safe-area-inset-top); height: calc(50px + env(safe-area-inset-top)); }
  .rail-nav .rail-btn.labeled { height: 38px; }
  .rail-nav .rail-btn.labeled > span:not(.rail-avatar) { display: none; }
}