/* Appearance tokens are loaded from theme.css. */
* { box-sizing: border-box; }
html, body {
  margin: 0;
  height: 100%;
  font: 15px/1.5 "Segoe UI", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  color: var(--ink);
  background: var(--paper);
}
/* ux(round19)：body 改 grid 两行（顶栏 auto + 主区 1fr），让浏览器自己算高度。
   原先 .layout 写死 height: calc(100% - 53px)，与顶栏实际高度硬耦合——顶栏一改就错位。
   仍需顶栏高度的只剩窄屏 fixed 覆盖层，统一引用 --cb-topbar-h。 */
body {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
}
.top { min-height: var(--cb-topbar-h); }
.top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 18px;
  background: var(--panel);
  border-bottom: 1px solid var(--line);
}
.brand { display: flex; gap: 10px; align-items: center; }
.mark {
  width: 30px; height: 30px; display: grid; place-items: center;
  background: var(--cb-blue); color: var(--cb-on-accent); font-weight: 700; font-size: 12px;
  border-radius: 8px;
}
.brand small { display: block; color: var(--muted); font-size: 12px; }
.top-meta { display: flex; gap: 8px; align-items: center; }
.pill {
  border: 1px solid var(--line); padding: 3px 8px; font-size: 12px;
  color: var(--muted); border-radius: 999px; background: var(--cb-panel);
}
.pill.ok { color: var(--ok); border-color: var(--cb-green); background: var(--cb-green-soft); }
.pill.warn { color: var(--warn); border-color: var(--cb-orange); background: var(--cb-orange-soft); }
:root { --cb-topbar-h: 53px; --cb-rail-w: 260px; --cb-dock-w: 320px; }
.layout {
  display: grid;
  /* ux(round19)：三栏 → 两栏；审计移入右侧抽屉，展开时才占第三列 */
  grid-template-columns: var(--cb-rail-w) minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  min-height: 0;
}
body[data-dock="open"] .layout { grid-template-columns: var(--cb-rail-w) minmax(0, 1fr) var(--cb-dock-w); }
.rail {
  background: var(--rail);
  color: var(--rail-ink);
  overflow: auto;
  padding: 14px 12px 20px;
}
/* ux(round14)：侧栏顶部「新建任务」主按钮 + 会话列表（标题+相对时间，选中浅色圆角高亮） */
.rail-new {
  width: 100%; display: flex; align-items: center; justify-content: center; gap: 6px;
  background: transparent; color: var(--rail-ink);
  border: 1px solid #33363b; padding: 8px 10px; cursor: pointer;
  border-radius: 10px; font: inherit; font-size: 13px; font-weight: 600; margin-bottom: 8px;
}
.rail-new:hover { background: #1d1f23; border-color: #3d4046; }
.rail-lead { font-size: 12px; color: #8b8f96; margin: 0 0 12px; line-height: 1.45; }
.ghost {
  width: 100%; margin-bottom: 8px; background: transparent; color: var(--rail-ink);
  border: 1px solid #33363b; padding: 7px 8px; cursor: pointer; border-radius: 10px; font: inherit;
}
.ghost:hover { background: #1d1f23; }
.ghost.tiny { width: auto; margin: 0; padding: 3px 8px; font-size: 11px; }
/* ===== ux(round19) 左栏项目树（两级）=====
   .thread-* 那套单级会话列表退役，改为 .proj / .sess-row 两级。
   左栏是「双主题恒定暗色 chrome」（styles.css 顶部 --rail 注释、spec 附录 J），
   故此处沿用 rail 语境的固定色，不随明暗翻转 —— 这是既有设计决定，不是遗漏。 */
.thread-none { font-size: 12px; color: #6f747c; padding: 4px 10px; }
.rail-projects { margin-bottom: 8px; }
.rail-foot { margin-top: 8px; }
.proj { margin-bottom: 2px; }
.proj-row { display: flex; align-items: center; gap: 4px; padding: 2px 0; }
.proj-tw {
  flex: none; width: 18px; height: 18px; padding: 0; cursor: pointer;
  background: transparent; border: 0; position: relative;
}
/* CSS 三角，不用字符（符号纪律，附录 L） */
.proj-tw::before {
  content: ""; position: absolute; left: 6px; top: 5px;
  border-left: 4px solid #8b8f96; border-top: 4px solid transparent;
  border-bottom: 4px solid transparent; transition: transform .12s ease;
}
.proj.open .proj-tw::before { transform: rotate(90deg); transform-origin: 2px 4px; }
.proj-tw:focus-visible { outline: 2px solid var(--cb-focus); outline-offset: -2px; border-radius: 4px; }
.proj-name {
  flex: 1; min-width: 0; text-align: left; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
  background: transparent; border: 0; color: var(--rail-ink);
  font: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
  padding: 4px 2px; border-radius: 6px;
}
.proj-name:hover { background: #1d1f23; }
.proj-n { flex: none; font-size: 11px; color: #7d838d; padding: 0 2px; }
.proj-more {
  flex: none; background: transparent; border: 0; cursor: pointer;
  color: #7d838d; font: inherit; font-size: 11px; padding: 2px 4px; border-radius: 6px;
}
.proj-more:hover { color: var(--rail-ink); background: #1d1f23; }
.proj-kids { padding-left: 18px; }
.proj-kids[hidden] { display: none; }
.rail-rename {
  width: 100%; margin: 2px 0; padding: 5px 8px; border-radius: 8px;
  border: 1px solid var(--cb-blue); background: #1a1c1f;
  color: var(--rail-ink); font: inherit; font-size: 12px;
}
.sess-row {
  display: flex; justify-content: space-between; align-items: baseline; gap: 8px;
  width: 100%; text-align: left; background: transparent;
  color: #c9ccd1; border: 0; padding: 6px 10px; margin: 0 0 2px; cursor: pointer;
  font-size: 12px; border-radius: 8px;
}
.sess-row .t-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sess-row .t-time { flex: none; font-size: 11px; color: #7d838d; }
.sess-row .t-time.t-running { color: var(--cb-blue); font-weight: 600; }
.sess-row .t-time.t-stale { color: var(--cb-red); }
.sess-row:hover, .sess-row.on { background: #2a2d31; color: var(--rail-ink); }
.sess-none { font-size: 11px; color: #6f747c; padding: 4px 10px; }
/* ux(round19)：常驻名册（.skill-q / .cat / .exp*）随 renderWall 一并删除，
   66 岗改由 composer 的「岗位」两级面板按需召唤。 */
.stage {
  display: flex; flex-direction: column; min-width: 0; min-height: 0;
  background: var(--panel);
}
/* ux(round19) 点名 chip 行：贴着输入框，空时整条隐藏（renderSummon 控制 hidden） */
.summon-bar {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  padding: 0 0 6px;
}
.summon-bar[hidden] { display: none; }
.cb-sum-chip {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 4px 2px 8px; border-radius: 999px;
  font-size: var(--cb-fs-xs); color: var(--cb-blue-strong);
  background: var(--cb-blue-soft); border: 1px solid var(--cb-line);
}
.cb-sum-x {
  border: 0; background: transparent; cursor: pointer;
  color: inherit; font: inherit; line-height: 1;
  padding: 2px 4px; border-radius: 999px;
}
.cb-sum-x:hover { background: var(--cb-panel); }
.cb-sum-x:focus-visible { outline: 2px solid var(--cb-focus); outline-offset: 1px; }
.cb-sum-clear {
  border: 1px solid var(--cb-line); background: transparent; cursor: pointer;
  color: var(--cb-text-muted); font: inherit; font-size: var(--cb-fs-xs);
  padding: 2px 8px; border-radius: 999px;
}
.cb-sum-clear[hidden] { display: none; }
.cb-sum-clear:hover { color: var(--cb-text); border-color: var(--cb-blue); }
.ctx-bar { padding: 4px 20px 8px; }
.ctx-meter {
  height: 3px; background: var(--cb-panel-soft); border-radius: 99px; overflow: hidden;
}
.ctx-meter i {
  display: block; height: 100%; width: 0; background: var(--ok); border-radius: 99px;
}
.ctx-bar[data-zone="warn"] .ctx-meter i { background: var(--warn); }
.ctx-bar[data-zone="compact"] .ctx-meter i { background: var(--accent); }
.ctx-bar[data-zone="full"] .ctx-meter i { background: var(--cb-red); }
.ctx-text { margin: 4px 0 0; font-size: 11px; color: var(--cb-text-faint); }
.ctx-bar { padding: 4px 0 0; }
.ctx-bar .top-btn { margin-top: 4px; font-size: 12px; }
.cb-context-panel { padding: 12px; border-bottom: 1px solid var(--cb-border); }
.cb-context-memory { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: 12px; max-height: 280px; overflow: auto; }
.cb-context-panel input { width: 100%; box-sizing: border-box; margin: 8px 0; padding: 8px; }
.cb-source-text { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 320px; overflow: auto; font: inherit; font-size: 12px; }
/* Allow the transcript to shrink inside both grid levels. Its contents scroll,
   while the composer keeps its own height even when onboarding is visible. */
.log { flex: 1 1 0; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 20px 24px 8px; }
.welcome { color: var(--muted); font-size: 14px; max-width: 36rem; margin: 12vh auto 0; text-align: center; }
.msg { margin: 0 0 16px; max-width: 40rem; }
.msg.user {
  margin-left: auto; background: var(--cb-panel-soft); padding: 10px 14px; border-radius: 16px 16px 4px 16px;
}
.msg.assistant { padding: 2px 0; white-space: pre-wrap; }
.msg .who { font-size: 11px; color: var(--muted); margin-bottom: 4px; }
.status-line { font-size: 12px; color: var(--accent-2); margin: 0 0 8px; }
.composer {
  flex: 0 0 auto;
  border-top: 1px solid var(--line); padding: 14px 20px 16px; background: var(--panel);
  /* viewport-fit=cover 后 iPhone 底部 Home 条会盖住输入区：留出安全区 */
  padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
}
.composer.drop { outline: 2px dashed var(--accent); outline-offset: -4px; }
/* === ux(round14) 输入条重做（参考图）：大圆角容器 · 左"+"开指令面板 · 中间 textarea · 右下圆形发送键 === */
.composer-shell {
  display: flex; align-items: flex-end; gap: 8px;
  background: var(--cb-panel-soft); border: 1px solid var(--cb-line);
  border-radius: var(--cb-radius-lg); padding: 10px;
}
.composer-shell:focus-within { border-color: var(--cb-blue); }
.composer-plus {
  flex: none; width: 36px; height: 36px; margin: 0; display: grid; place-items: center;
  background: transparent; border: none; border-radius: 50%;
  color: var(--cb-text-muted); font-size: 18px; line-height: 1; cursor: pointer;
}
.composer-plus:hover { background: var(--cb-gray-200); color: var(--cb-text); }
.local-row { display: flex; gap: 6px; margin-top: 8px; }
.local-row input {
  flex: 1; border: 1px solid var(--cb-line-soft); padding: 6px 8px; font: inherit; border-radius: 10px;
  background: var(--cb-panel-soft); color: var(--ink);
}
.local-row button, #send {
  border: 1px solid var(--cb-line-soft); background: var(--cb-panel-soft); padding: 6px 10px;
  font-size: 12px; cursor: pointer; border-radius: 10px; font: inherit; color: var(--ink);
}
/* 参考图：下方一行小字 chips（文字为主，无框或极淡框） */
.hints button {
  border: 1px solid transparent; background: var(--cb-panel-soft); padding: 4px 10px;
  font-size: 12px; cursor: pointer; border-radius: 999px; font: inherit; color: var(--cb-text-muted);
}
.hints button:hover { color: var(--cb-blue); background: var(--cb-blue-soft); }
#btnFirm { color: var(--accent-2); }
.attaches { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.chip {
  display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid var(--cb-line-soft); background: var(--cb-panel-soft); padding: 2px 8px;
  font-size: 12px; border-radius: 999px;
}
.chip button { border: 0; background: none; cursor: pointer; color: var(--muted); }
.composer .input-wrap { flex: 1; min-width: 0; position: relative; }
.composer textarea {
  width: 100%; resize: none; border: none; padding: 7px 2px;
  font: 14px/1.6 var(--cb-font); background: transparent; color: var(--ink); border-radius: 10px; min-height: 36px;
}
.composer textarea:focus { outline: none; box-shadow: none; }
#send {
  flex: none; width: 36px; height: 36px; margin: 0; padding: 0;
  display: grid; place-items: center; border-radius: 50%;
  background: var(--cb-blue); color: var(--cb-on-accent); border: none;
  font-size: 16px; font-weight: 700; line-height: 1;
}
#send:hover:not(:disabled) { background: var(--cb-blue-strong); }
/* === ux(round2) 输入体验：autosize 1→8 行 + @岗位补全浮层（全部 --cb-* token，零 CDN） === */
.composer .input-wrap { position: relative; }
.cb-at-menu {
  position: absolute; bottom: calc(100% + 6px); left: 0; right: 0; z-index: 40;
  max-height: 264px; overflow-y: auto; padding: 4px;
  background: var(--cb-gray-50); color: var(--cb-text);
  border: 1px solid var(--cb-line); border-radius: var(--cb-radius-md);
  box-shadow: var(--cb-shadow-lg); font-size: var(--cb-fs-sm);
}
.cb-at-item {
  display: flex; justify-content: space-between; align-items: baseline; gap: var(--cb-space-3);
  padding: 6px 10px; border-radius: var(--cb-radius-sm); cursor: pointer;
}
.cb-at-item.on { background: var(--cb-blue-soft); color: var(--cb-blue-strong); }
.cb-at-item .cb-at-cat { color: var(--cb-text-muted); font-size: var(--cb-fs-xs); white-space: nowrap; }

/* === ux(round9) 快捷指令面板：/ 命令 + 模板填空 + 最近任务（--cb-* token，零 CDN） ===
   与 @岗位补全同一浮层体系（.cb-at-menu 基座）；图标=--cb-* 色块+单字，不引图标库。 */
.cb-cmd-head { padding: 6px 10px 2px; font-size: var(--cb-fs-xs); color: var(--cb-text-muted); }
.cb-cmd-item {
  display: flex; align-items: center; gap: var(--cb-space-3);
  padding: 6px 10px; border-radius: var(--cb-radius-sm); cursor: pointer;
}
.cb-cmd-item.on { background: var(--cb-blue-soft); }
.cb-cmd-item.on .cb-cmd-name, .cb-cmd-item.on .cb-cmd-desc { color: var(--cb-blue-strong); }
.cb-cmd-ico {
  flex: 0 0 auto; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center;
  border-radius: var(--cb-radius-sm); color: var(--cb-on-accent); font-size: var(--cb-fs-xs); font-weight: 600;
}
.cb-cmd-ico.tone-blue { background: var(--cb-blue); }
.cb-cmd-ico.tone-strong { background: var(--cb-blue-strong); }
.cb-cmd-ico.tone-orange { background: var(--cb-orange); }
.cb-cmd-ico.tone-red { background: var(--cb-red); }
.cb-cmd-ico.tone-green { background: var(--cb-green); }
.cb-cmd-ico.tone-gray { background: var(--cb-gray-500); }
.cb-cmd-name { font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cb-cmd-name code { font-family: var(--cb-mono); font-size: var(--cb-fs-xs); color: var(--cb-text-muted); margin-left: 4px; font-weight: 400; }
.cb-cmd-desc { flex: 1 1 auto; min-width: 0; color: var(--cb-text-muted); font-size: var(--cb-fs-xs); text-align: right; }
.cb-cmd-recent .cb-cmd-name { font-weight: 400; }
@media screen and (max-width: 430px) { /* --cb-bp-mobile */
  .cb-cmd-desc { display: none; }  /* 手机竖屏：只留图标+名称，说明换 title 提示 */
  .cb-cmd-item { min-height: 44px; }  /* --cb-touch-min 触控目标 */
}
.composer-note { font-size: var(--cb-fs-xs); color: var(--cb-text-muted); margin: 0; }
.composer-heading { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; }
.composer-shortcut { color: var(--cb-text-muted); font-size: 11px; }
.composer-risk { margin: 0 0 10px; color: var(--cb-text-muted); font-size: 12px; }
.composer-risk summary { width: fit-content; cursor: pointer; padding: 4px 0; line-height: 1.6; }
.composer-risk summary > span { margin-left: 8px; color: var(--cb-text-muted); font-size: 11px; }
.composer-risk[open] { padding: 10px 12px; border: 1px solid var(--cb-line); border-radius: var(--cb-radius-md); background: var(--cb-panel-soft); }
.composer-risk[open] summary { padding-top: 0; color: var(--cb-text); }
.composer-risk .confirm { display: grid; gap: 8px; margin: 8px 0 0; }
.composer-risk .confirm strong { font-weight: 500; color: var(--cb-text); }
.composer-risk .confirm input { width: 100%; min-height: 38px; padding: 8px 10px; }
#send:disabled { background: var(--cb-gray-200); color: var(--cb-gray-500); cursor: not-allowed; }
.confirm { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 12px; color: var(--muted); margin-bottom: 8px; }
.confirm input, .cb-apr-ack-input { min-width: 0; max-width: 100%; box-sizing: border-box; padding: 6px 8px; border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm); background: var(--cb-panel); color: var(--cb-text); font: inherit; }
.confirm input { flex: 1 1 220px; }
.row { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 8px; flex-wrap: wrap; }
.hints { display: flex; flex-wrap: wrap; gap: 6px; }
/* ux(round19) 审计抽屉：宽屏是第三列，窄屏是 fixed 浮层（附录 P） */
.dock {
  overflow: auto; padding: 12px 14px 24px;
  background: var(--cb-bg); border-left: 1px solid var(--line);
  min-height: 0;
}
.dock[hidden] { display: none; }
.dock-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 10px;
}
.dock-h { font-size: 12px; margin: 16px 0 6px; color: var(--muted); font-weight: 600; letter-spacing: .04em; }
.muted { font-size: 12px; color: var(--muted); margin: 0 0 8px; }
.dock ul { list-style: none; padding: 0; margin: 0; }
.dock li { font-size: 12px; border-top: 1px solid var(--line); padding: 8px 0; }
.layer { display: inline-block; font-size: 10px; padding: 0 4px; margin-right: 4px; border: 1px solid var(--line); border-radius: 4px; }
.layer.expert { border-color: var(--accent); color: var(--accent); }
.layer.category { border-color: var(--accent-2); color: var(--accent-2); }
.kb-size { color: var(--muted); }
.err { color: var(--cb-red); white-space: pre-wrap; }
.top-btn {
  background: var(--ink); color: var(--cb-panel); border: 0; padding: 6px 12px; cursor: pointer;
  font: inherit; border-radius: 8px;
}
.kb-link { background: none; border: 0; padding: 0; color: inherit; cursor: pointer; text-align: left; font: inherit; }
.over { color: var(--warn); }
.studio {
  position: fixed; inset: 0; background: var(--paper); z-index: 20; display: flex; flex-direction: column;
}
.studio.hidden { display: none; }
.studio-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 20px; background: var(--panel); border-bottom: 1px solid var(--line);
}
.studio-head small { display: block; color: var(--muted); }
.studio-grid { display: grid; grid-template-columns: 300px 1fr; flex: 1; min-height: 0; }
.studio-nav { overflow: auto; padding: 12px; border-right: 1px solid var(--line); }
.studio-main { display: flex; flex-direction: column; min-width: 0; }
.studio-actions { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 12px; }
.studio-actions button, .limit-row button, .expert-form button {
  border: 1px solid var(--line); background: var(--cb-panel); padding: 5px 8px; cursor: pointer; font-size: 12px; border-radius: 6px;
}
.limit-row { display: flex; gap: 6px; align-items: center; font-size: 12px; margin-bottom: 6px; }
.limit-row input { width: 72px; }
.tree-h { font-size: 12px; margin: 12px 0 4px; color: var(--muted); }
.tree-item {
  display: block; width: 100%; text-align: left; border: 1px solid transparent; background: transparent;
  padding: 4px 6px; font-size: 12px; cursor: pointer; border-radius: 6px;
}
.tree-item:hover, .tree-item.on { background: var(--cb-panel); border-color: var(--line); }
.tree-item.over { color: var(--warn); }
.expert-form { padding: 10px 14px; border-bottom: 1px solid var(--line); display: grid; gap: 6px; }
.expert-form label { font-size: 12px; color: var(--muted); display: grid; gap: 2px; }
.expert-form input, .expert-form select { font: inherit; padding: 4px 6px; border: 1px solid var(--line); border-radius: 6px; }
.form-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; }
.editor-meta {
  display: flex; gap: 12px; align-items: center; padding: 8px 14px; font-size: 12px; border-bottom: 1px solid var(--line);
}
#editor {
  flex: 1; border: 0; padding: 14px 16px; font: 13px/1.55 ui-monospace, Consolas, monospace;
  resize: none; background: var(--panel);
}
/* ux(round19) 三档断点（附录 P）：
   ≥1280 两栏 + 抽屉可作第三列；769–1279 两栏 + 抽屉浮层；≤768 单栏 + 两者皆浮层。 */
@media (max-width: 1279px) {
  body[data-dock="open"] .layout { grid-template-columns: var(--cb-rail-w) minmax(0, 1fr); }
  .dock {
    position: fixed; right: 0; top: var(--cb-topbar-h); bottom: 0;
    width: min(92vw, 360px); z-index: 25;
    box-shadow: var(--cb-shadow-md);
  }
}
@media (max-width: 1100px) {
  :root { --cb-rail-w: 200px; }
}
@media (max-width: 768px) {
  .layout, body[data-dock="open"] .layout { grid-template-columns: minmax(0, 1fr); }
  .rail { display: none; }
}

/* === ux(round3) 阶段时间线 · 一条流水线（进度可见）· docs/ux/ux-design-spec.md 附录 B ===
   8 阶段轨道：理解任务→召唤岗位→成箱→人工确认→拼柜→合规校核→落盘→收口。
   状态色（--cb-* token）：工程蓝=进行中 / 通过绿=完成 / 安全橙=打回·待人工·UNSPECIFIED / 合规红=阻断。
   借鉴 pattern-only：aider waiting.Spinner 单行进行中反馈+降级渲染（Apache-2.0）；
   openai/codex history_cell 追加式会话流、完成后定格为一行（Apache-2.0）；
   VS Code Tasks presentation：长输出默认折叠、展开才看全文（文档 pattern-only）。 */
/* ux(round14)：时间线极简化——去容器框底，改左侧细竖线语境；阶段状态=单色 CSS 圆点（不写字符，规则见 spec 附录 L） */
.cb-tl {
  border: none; border-left: 2px solid var(--cb-line-soft); border-radius: 0;
  background: transparent; padding: 2px 0 2px 10px;
  margin: 0 0 10px; font-size: var(--cb-fs-xs);
}
.cb-tl-head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 6px; }
.cb-tl-title { font-weight: 700; color: var(--cb-text); font-size: var(--cb-fs-xs); }
.cb-tl-badge {
  font-size: 11px; color: var(--cb-text-muted); border: 1px solid var(--cb-line-soft);
  border-radius: var(--cb-radius-full); padding: 0 8px;
}
.cb-tl-badge.hitl { color: var(--cb-orange); border-color: var(--cb-orange); }
.cb-tl-fold { background: none; border: none; cursor: pointer; color: var(--cb-blue); font-size: 11px; padding: 0 2px; }
.cb-tl-track { display: flex; flex-wrap: wrap; gap: 4px 2px; align-items: center; }
.cb-tl-stage {
  display: inline-flex; align-items: center; gap: 5px; padding: 2px 4px;
  border-radius: var(--cb-radius-sm); border: none;
  color: var(--cb-gray-400); background: transparent; white-space: nowrap;
}
.cb-tl-stage.run { color: var(--cb-text); font-weight: 600; }
.cb-tl-stage.done { color: var(--cb-text); }
.cb-tl-stage.warn { color: var(--cb-orange-ink); }
.cb-tl-stage.err { color: var(--cb-red); }
/* 状态圆点：idle=空心 / run=spinner / done=绿 / warn=橙 / err=红（单色 CSS，零字符图标） */
.cb-tl-st {
  width: 7px; height: 7px; border-radius: 50%; display: inline-block; flex: none;
  border: 1.5px solid var(--cb-gray-400);
}
.cb-tl-stage.done .cb-tl-st { border: none; background: var(--cb-green); }
.cb-tl-stage.warn .cb-tl-st { border: none; background: var(--cb-orange); }
.cb-tl-stage.err .cb-tl-st { border: none; background: var(--cb-red); }
.cb-tl-spin {
  width: 10px; height: 10px; border-radius: 50%; flex: none;
  border: 2px solid rgba(37, 99, 235, 0.25); border-top-color: var(--cb-blue);
  animation: cb-tl-rot 0.9s linear infinite;
}
@keyframes cb-tl-rot { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .cb-tl-spin { animation: none; border-color: var(--cb-blue); } }
.cb-tl-arrow { color: var(--cb-gray-200); font-size: 10px; flex: none; }
.cb-tl-dur { font-size: 10px; color: var(--cb-text-muted); font-family: var(--cb-mono); }
.cb-tl-lines { margin-top: 6px; display: flex; flex-direction: column; gap: 1px; max-height: 200px; overflow: auto; }
.cb-tl-line {
  display: flex; align-items: baseline; gap: 6px; padding: 1px 6px;
  margin-left: 6px; border-left: 2px solid var(--cb-line-soft);
  color: var(--cb-text-muted); font-size: 11px;
}
.cb-tl-line .tl-tool { font-family: var(--cb-mono); color: var(--cb-text); flex: none; }
.cb-tl-line .tl-text { overflow-wrap: anywhere; }
.cb-tl-line.is-running { border-left-color: var(--cb-blue); }
.cb-tl-line.is-ok { border-left-color: var(--cb-green); }
.cb-tl-line.is-warn { border-left-color: var(--cb-orange); }
.cb-tl-line.is-err { border-left-color: var(--cb-red); }
.cb-tl-more { background: none; border: none; cursor: pointer; padding: 0; color: var(--cb-blue); font-size: 11px; flex: none; }
.cb-tl-hitl {
  margin-top: 6px; border: none; border-left: 2px solid var(--cb-orange); border-radius: 0;
  background: var(--cb-orange-soft); color: var(--cb-orange-ink); padding: 6px 10px; font-size: var(--cb-fs-xs);
}
.cb-tl-summary { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; color: var(--cb-text); font-size: var(--cb-fs-xs); }
.cb-tl-chip {
  font-family: var(--cb-mono); border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm);
  padding: 0 6px; color: var(--cb-text-muted); background: var(--cb-panel);
}

/* ===== ux(round5) HITL 审批卡（docs/ux/ux-design-spec.md 附录 D）=====
   显式决策事件 + Esc/关闭=驳回永不放行 + 决策写审计行。与 frontend/workbench.html 同构。 */
.cb-tl-audit { margin-top: 6px; display: flex; flex-direction: column; gap: 4px; }
.cb-tl-audit-row {
  font-size: 11px; font-family: var(--cb-mono); color: var(--cb-text-muted);
  border-left: 3px solid var(--cb-gray-500); padding: 2px 8px; background: var(--cb-panel);
  border-radius: 0 var(--cb-radius-sm) var(--cb-radius-sm) 0;
}
/* ux(round14)：审批卡收敛为「左侧 3px 色条 + 无框」——去边框/重阴影，功能与诚实呈现不减 */
.cb-apr {
  position: relative; border: none; border-radius: var(--cb-radius-md);
  background: var(--cb-panel-soft); box-shadow: none; overflow: hidden; color: var(--cb-text);
}
.cb-apr.is-rejected { border-color: var(--cb-orange); }
.cb-apr.is-approved { border-color: var(--cb-green); }
.cb-apr-bar { position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--cb-red); }
.cb-apr.is-approved .cb-apr-bar { background: var(--cb-green); }
.cb-apr.is-rejected .cb-apr-bar { background: var(--cb-orange); }
.cb-apr-head {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 6px 10px 6px 14px; border-bottom: none;
}
.cb-apr-title { font-weight: 700; font-size: var(--cb-fs-sm); }
.cb-apr-risk {
  font-size: 11px; border-radius: var(--cb-radius-full); padding: 1px 8px;
  border: 1px solid var(--cb-gray-400); color: var(--cb-gray-500);
}
.cb-apr-risk.is-high { color: var(--cb-orange); border-color: var(--cb-orange); background: var(--cb-orange-soft); }
.cb-apr-state {
  font-size: 11px; font-weight: 700; color: var(--cb-green);
  border: 1px solid var(--cb-green); border-radius: var(--cb-radius-full); padding: 1px 8px;
}
.cb-apr-state.is-rejected { color: var(--cb-orange); border-color: var(--cb-orange); }
.cb-apr-x {
  margin-left: auto; background: none; border: 1px solid var(--cb-line-soft); color: var(--cb-text-muted);
  border-radius: var(--cb-radius-sm); padding: 1px 8px; height: 22px; cursor: pointer; line-height: 1;
  font: inherit; font-size: 11px;
}
.cb-apr-x:hover { color: var(--cb-red); border-color: var(--cb-red); }
.cb-apr-body { padding: 8px 10px 10px 14px; }
.cb-apr-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.cb-apr-chip {
  font-size: 11px; border: 1px solid var(--cb-line-soft); border-radius: var(--cb-radius-sm);
  padding: 2px 8px; background: transparent;
}
.cb-apr-chip b { font-family: var(--cb-mono); }
.cb-apr-chip.is-warn { border-color: transparent; color: var(--cb-orange); }
.cb-apr-block {
  margin-top: 6px; font-size: 11px; color: var(--cb-orange-ink);
  background: transparent; border: none; border-left: 2px solid var(--cb-orange);
  border-radius: 0; padding: 2px 0 2px 8px; line-height: 1.5;
}
.cb-apr-block.is-ok { color: var(--cb-text-muted); border-left-color: var(--cb-line-soft); background: transparent; }
.cb-apr-reject-note {
  margin-top: 6px; font-size: var(--cb-fs-xs); color: var(--cb-orange-ink); font-weight: 600;
  background: var(--cb-orange-soft); border: none;
  border-radius: var(--cb-radius-sm); padding: 8px 10px; line-height: 1.6;
}
.cb-apr-actions { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.cb-apr-actions button { border-radius: var(--cb-radius-sm); padding: 5px 12px; font-size: var(--cb-fs-xs); cursor: pointer; }
.cb-apr-confirm { background: var(--cb-blue); border: 1px solid var(--cb-blue); color: var(--cb-on-accent); font-weight: 600; }
.cb-apr-confirm:hover { background: var(--cb-blue-strong); }
.cb-apr-confirm:disabled { opacity: 0.45; cursor: not-allowed; }
.cb-apr-reject { background: transparent; border: 1px solid var(--cb-red); color: var(--cb-red); font-weight: 600; }
.cb-apr-reject:hover { background: var(--cb-red-soft); }
.cb-apr-later { background: transparent; border: 1px solid var(--cb-line); color: var(--cb-text-muted); }
.cb-apr-later:hover { color: var(--cb-text); border-color: var(--cb-gray-400); }
.cb-apr-foot { margin-top: 6px; font-size: 11px; color: var(--cb-text-muted); line-height: 1.5; }
.cb-apr-confirm-phrase { color: var(--cb-orange); }
.cb-apr-ack { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; font-size: var(--cb-fs-xs); }
@media (max-width: 768px) {
  /* R8 打底：窄屏审批卡按钮全宽、决策区纵排 */
  .cb-apr-actions { flex-direction: column; }
  .cb-apr-actions button { width: 100%; }
}

/* ===== ux(round4) 交付物文书预览（cbDocOpen / docpreview.js）=====
   白底 A4 版心 + 页眉页脚 + 免责横幅常驻；诚实元素徽章；打印隐藏聊天 chrome。 */
.cb-doc-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; }
.cb-doc-overlay[hidden] { display: none; }
.cb-doc-backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, 0.55); }
.cb-doc-modal { position: relative; margin: auto; width: min(880px, calc(100vw - 24px)); max-height: calc(100vh - 24px); display: flex; flex-direction: column; }
.cb-doc-toolbar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 8px 10px;
  background: #1e293b; color: #fff; border-radius: var(--cb-radius-md) var(--cb-radius-md) 0 0;
}
.cb-doc-title { font-weight: 600; font-size: var(--cb-fs-sm); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 46%; }
.cb-doc-meta { font-size: var(--cb-fs-xs); color: var(--cb-gray-400); font-family: var(--cb-mono); }
.cb-doc-actions { margin-left: auto; display: flex; gap: 6px; flex-wrap: wrap; }
.cb-doc-btn {
  background: transparent; color: #e2e8f0; border: 1px solid rgba(226, 232, 240, 0.4);
  border-radius: var(--cb-radius-sm); padding: 3px 10px; font-size: var(--cb-fs-xs); cursor: pointer;
}
.cb-doc-btn:hover { border-color: #fff; color: #fff; }
.cb-doc-scroll { overflow: auto; background: var(--cb-gray-100); padding: 14px; border-radius: 0 0 var(--cb-radius-md) var(--cb-radius-md); }
.cb-doc-page {
  /* ux(round11) 纸张语境固定：暗色主题下文书仍为白纸深字（GB/T 工程文书惯例，附录 J） */
  --cb-text: #171717; --cb-text-muted: #57534e; --cb-text-faint: #78716c;
  --cb-line: #d6d3d1; --cb-gray-50: #f5f5f5; --cb-gray-100: #f1f5f9;
  --cb-gray-200: #e5e5e5; --cb-gray-400: #78716c; --cb-gray-500: #64748b;
  --cb-blue: #1d4ed8; --cb-orange: #c2410c; --cb-red: #b91c1c; --cb-green: #047857;
  --cb-blue-soft: #eff6ff; --cb-orange-soft: #fff7ed; --cb-red-soft: #fef2f2; --cb-green-soft: #ecfdf5;
  background: #fff; color: var(--cb-text); margin: 0 auto; width: 794px; max-width: 100%;
  min-height: 1000px; padding: 56px 60px 72px; box-shadow: var(--cb-shadow-lg);
  font-family: "FangSong", "FangSong_GB2312", "仿宋", "仿宋_GB2312", "STFangsong", "SimSun", "宋体", "Microsoft YaHei", serif;
  font-size: 15px; line-height: 1.9;
}
/* 页眉 / 页脚 */
.cb-doc-head, .cb-doc-foot {
  display: flex; align-items: baseline; gap: 12px; font-size: 12px; color: var(--cb-text-muted);
  border-bottom: 1px solid var(--cb-line); padding-bottom: 8px; margin-bottom: 20px;
}
.cb-doc-head .cb-doc-proj { font-weight: 700; color: var(--cb-text); }
.cb-doc-head .cb-doc-role { margin-left: auto; font-family: var(--cb-mono); }
.cb-doc-foot { border-bottom: none; border-top: 1px solid var(--cb-line); margin: 28px 0 0; padding: 10px 0 0; }
.cb-doc-foot .cb-doc-time { font-family: var(--cb-mono); }
.cb-doc-foot .cb-doc-ver { font-family: var(--cb-mono); color: var(--cb-gray-400); }
.cb-doc-disclaim {
  margin-left: auto; background: var(--cb-red-soft); color: var(--cb-red);
  border: 1px solid var(--cb-red); border-radius: var(--cb-radius-sm);
  padding: 2px 8px; font-size: 12px; font-weight: 600; white-space: nowrap;
}
/* 正文层级：标题黑体、表格实线边框（工程文档惯例） */
.cb-doc-md h1, .cb-doc-md h2, .cb-doc-md h3, .cb-doc-md h4, .cb-doc-md h5, .cb-doc-md h6 {
  font-family: "SimHei", "黑体", "Microsoft YaHei", "PingFang SC", sans-serif;
  font-weight: 700; color: var(--cb-text); line-height: 1.5; margin: 1.2em 0 0.5em;
}
.cb-doc-md h1 { font-size: 21px; text-align: center; margin-top: 0.2em; }
.cb-doc-md h2 { font-size: 17px; border-left: 4px solid var(--cb-blue); padding-left: 8px; }
.cb-doc-md h3 { font-size: 15px; }
.cb-doc-md p { margin: 0.5em 0; }
.cb-doc-md ul, .cb-doc-md ol { margin: 0.5em 0; padding-left: 1.8em; }
.cb-doc-md li { margin: 0.15em 0; }
.cb-doc-md a { color: var(--cb-blue); overflow-wrap: anywhere; }
.cb-doc-md code {
  font-family: var(--cb-mono); font-size: 0.92em; background: var(--cb-gray-100);
  border: 1px solid var(--cb-line); border-radius: 3px; padding: 0 4px;
}
.cb-doc-md pre { background: var(--cb-gray-50); border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm); padding: 10px 12px; overflow: auto; }
.cb-doc-md pre code { border: none; background: none; padding: 0; }
.cb-doc-md blockquote { border-left: 3px solid var(--cb-line); margin: 0.6em 0; padding: 0.1em 0.9em; color: var(--cb-text-muted); }
.cb-doc-md table { border-collapse: collapse; width: 100%; margin: 0.8em 0; font-size: 13px; }
.cb-doc-md th, .cb-doc-md td { border: 1px solid var(--cb-gray-400); padding: 5px 8px; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.cb-doc-md th { background: var(--cb-gray-100); font-family: "SimHei", "黑体", "Microsoft YaHei", sans-serif; font-weight: 700; }
.cb-doc-md tr:nth-child(even) td { background: var(--cb-gray-50); }
.cb-doc-md hr { border: none; border-top: 1px solid var(--cb-line); margin: 1.2em 0; }
/* 诚实元素：安全橙徽章 / 锚点 / 工具计算小节 / 合规横幅 */
.cb-badge {
  display: inline-block; font-family: var(--cb-mono); font-size: 0.88em; line-height: 1.4;
  border-radius: var(--cb-radius-sm); padding: 0 6px; margin: 0 1px; white-space: nowrap;
}
.cb-badge-unspec { background: var(--cb-orange-soft); color: var(--cb-orange); border: 1px solid var(--cb-orange); }
.cb-badge-anchor { background: #fff; color: var(--cb-orange); border: 1px dashed var(--cb-orange); }
.cb-tool-h { background: var(--cb-blue-soft); border-radius: 3px 3px 0 0; }
.cb-tool-h::after {
  content: "tool-computed"; display: inline-block; margin-left: 8px; vertical-align: middle;
  font-family: var(--cb-mono); font-size: 10px; font-weight: 400; color: var(--cb-blue);
  border: 1px solid var(--cb-blue); border-radius: var(--cb-radius-full); padding: 0 7px;
}
.cb-tool-comp { background: var(--cb-blue-soft); box-shadow: 0 6px 0 -4px var(--cb-blue-soft); }
.cb-doc-disclaim-p {
  background: var(--cb-red-soft); border: 1px solid var(--cb-red); border-left-width: 4px;
  color: var(--cb-text); border-radius: var(--cb-radius-sm); padding: 8px 12px !important; font-size: 13px;
}
body.cb-doc-open { overflow: hidden; }
/* 聊天流内交付物卡片（:8765） */
.cb-doc-card {
  margin-top: 8px; border: 1px solid var(--cb-line); border-radius: var(--cb-radius-md);
  background: var(--cb-panel); padding: 8px 10px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.cb-doc-card .cb-doc-card-t { font-weight: 600; font-size: var(--cb-fs-sm); }
.cb-doc-card .cb-doc-card-k { font-size: 11px; color: var(--cb-text-muted); font-family: var(--cb-mono); }
.cb-doc-card .cb-doc-card-tag {
  font-size: 10px; color: var(--cb-blue); border: 1px solid var(--cb-blue);
  border-radius: var(--cb-radius-full); padding: 0 7px; font-family: var(--cb-mono);
}
.cb-doc-card button, .cb-doc-card a.dl {
  font-size: var(--cb-fs-xs); border: 1px solid var(--cb-line); background: var(--cb-gray-50);
  border-radius: var(--cb-radius-sm); padding: 2px 10px; cursor: pointer; color: var(--cb-text); text-decoration: none;
}
.cb-doc-card button:hover, .cb-doc-card a.dl:hover { border-color: var(--cb-blue); color: var(--cb-blue); }
/* 交付物卡片：一份文书一行（标题 + 预览 + 各格式），轮次头一行（标签 + 岗位/时间 + 打包） */
.cb-doc-card { flex-direction: column; align-items: stretch; gap: 6px; }
.cb-doc-card-head, .cb-doc-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cb-doc-card-run { font-size: 11px; color: var(--cb-text-muted); }
.cb-doc-card-zip { margin-left: auto; }
.cb-doc-row .cb-doc-card-t { flex: 1 1 160px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cb-doc-note { margin: 0; font-size: 12px; color: var(--cb-amber, #a35d00); }
@media screen and (max-width: 430px) {
  .cb-doc-card button, .cb-doc-card a.dl { min-height: var(--cb-touch-min, 44px); display: inline-flex; align-items: center; }
  .cb-doc-card-zip { margin-left: 0; flex: 1 1 100%; justify-content: center; }
}
/* 打印：只留文书本体，隐藏聊天 chrome；@page A4 + 页眉页脚由文书自绘 */
@media print {
  body > :not(.cb-doc-overlay) { display: none !important; }
  body.cb-doc-open { display: block; height: auto; overflow: visible; }
  .cb-doc-overlay { position: static; display: block; }
  .cb-doc-backdrop, .cb-doc-toolbar { display: none !important; }
  .cb-doc-modal { margin: 0; width: auto; max-height: none; }
  .cb-doc-scroll { overflow: visible; background: #fff; padding: 0; border-radius: 0; }
  .cb-doc-page { width: auto; max-width: none; min-height: 0; box-shadow: none; padding: 0; }
  .cb-doc-head, .cb-doc-foot { position: fixed; left: 0; right: 0; }
  .cb-doc-head { top: 0; }
  .cb-doc-foot { bottom: 0; }
  .cb-badge { border-color: var(--cb-orange); color: var(--cb-orange); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .cb-doc-page * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ===== ux(round6) 跨运行审计时间线（docs/ux 附录 E）=====
   垂直时间线 · 四类节点（工具=蓝 / 决策=合规红边 / 错误=橙 / 写盘=绿）· 决策永久置顶。 */
.cb-audit { margin-top: 6px; }
.cb-audit-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.cb-audit-body { display: flex; flex-direction: column; gap: 8px; }
.cb-audit-none { font-size: 12px; color: var(--cb-text-muted); margin: 4px 0; }
.cb-audit-pinned {
  border: 1px solid var(--cb-red); border-radius: var(--cb-radius-md);
  background: var(--cb-red-soft); padding: 8px 10px;
}
.cb-audit-pinned-h { font-size: 12px; font-weight: 700; color: var(--cb-red); margin-bottom: 4px; }
.cb-audit-run { border-left: 2px solid var(--cb-line); padding-left: 12px; }
.cb-audit-run-h {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 12px; color: var(--cb-text-muted); margin: 4px 0;
}
.cb-audit-runid { font-family: var(--cb-mono); color: var(--cb-text); }
.cb-audit-node {
  position: relative; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap;
  font-size: 12px; padding: 2px 0 2px 10px; margin-left: 7px;
  border-left: 2px solid transparent;
}
.cb-audit-dot {
  position: absolute; left: -5px; top: 9px; width: 8px; height: 8px;
  border-radius: 999px; background: var(--cb-blue);
}
.cb-audit-node.is-decision { border-left-color: var(--cb-red); background: var(--cb-red-soft); }
.cb-audit-node.is-decision .cb-audit-dot { background: var(--cb-red); }
.cb-audit-node.is-error { border-left-color: var(--cb-orange); }
.cb-audit-node.is-error .cb-audit-dot { background: var(--cb-orange); }
.cb-audit-node.is-write .cb-audit-dot { background: var(--cb-green); }
.cb-audit-k {
  flex: none; font-size: 10px; font-family: var(--cb-mono); color: var(--cb-text-muted);
  border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm);
  padding: 0 5px; min-width: 30px; text-align: center;
}
.cb-audit-node.is-decision .cb-audit-k { color: var(--cb-red); border-color: var(--cb-red); }
.cb-audit-node.is-error .cb-audit-k { color: var(--cb-orange); border-color: var(--cb-orange); }
.cb-audit-node.is-write .cb-audit-k { color: var(--cb-green); border-color: var(--cb-green); }
.cb-audit-t { overflow-wrap: anywhere; color: var(--cb-text); min-width: 140px; flex: 1 1 auto; }
.cb-audit-time { flex: none; font-family: var(--cb-mono); color: var(--cb-text-muted); font-size: 10px; }
.cb-audit-op { flex: none; font-size: 10px; color: var(--cb-red); font-family: var(--cb-mono); }
.cb-audit-raw { flex-basis: 100%; margin: 4px 0 0; }
.cb-audit-raw summary { cursor: pointer; font-size: 11px; color: var(--cb-text-muted); }
.cb-audit-raw pre {
  margin: 4px 0 0; max-height: 200px; overflow: auto; font-size: 10px;
  color: var(--cb-text-muted); background: var(--cb-gray-50);
  border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm); padding: 8px;
  white-space: pre-wrap;
}

/* ===== ux(round7) 纠偏卡片（docs/ux/ux-design-spec.md 附录 F）=====
   发生了什么（一句人话）+ 为什么（策略 code）+ 现在能做什么（≤3 动作）。全 --cb-* token，零外链。 */
.cb-fix {
  display: flex; gap: 10px; align-items: stretch;
  margin: 8px 0 4px; padding: 10px 12px;
  background: var(--cb-orange-soft);
  border: none; border-radius: var(--cb-radius-md);
  box-shadow: none;
  text-align: left;
}
.cb-fix.is-red { background: var(--cb-red-soft); }
.cb-fix-bar { flex: none; width: 3px; border-radius: var(--cb-radius-full); background: var(--cb-orange); }
.cb-fix.is-red .cb-fix-bar { background: var(--cb-red); }
.cb-fix-main { min-width: 0; display: grid; gap: 6px; }
.cb-fix-head { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.cb-fix-badge {
  flex: none; font-size: var(--cb-fs-xs); font-weight: 600; line-height: 1;
  color: var(--cb-on-accent); background: var(--cb-orange); border-radius: var(--cb-radius-full); padding: 3px 8px;
}
.cb-fix.is-red .cb-fix-badge { background: var(--cb-red); }
.cb-fix-title { font-size: var(--cb-fs-sm); font-weight: 600; color: var(--cb-text); overflow-wrap: anywhere; }
.cb-fix-why { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.cb-fix-code {
  font-family: var(--cb-mono); font-size: var(--cb-fs-xs); color: var(--cb-text);
  background: var(--cb-gray-100); border: 1px solid var(--cb-line);
  border-radius: var(--cb-radius-sm); padding: 1px 6px;
}
.cb-fix-why-txt { font-size: var(--cb-fs-xs); color: var(--cb-text-muted); }
.cb-fix-meta { font-family: var(--cb-mono); font-size: var(--cb-fs-xs); color: var(--cb-text-muted); }
.cb-fix-what { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.cb-fix-what-label { flex: none; font-size: var(--cb-fs-xs); color: var(--cb-text-muted); }
.cb-fix-btn {
  font: inherit; font-size: var(--cb-fs-sm); cursor: pointer;
  color: var(--cb-blue); background: var(--cb-blue-soft);
  border: 1px solid var(--cb-blue); border-radius: var(--cb-radius-sm);
  padding: 3px 10px;
}
.cb-fix-btn:hover { background: var(--cb-blue); color: var(--cb-on-accent); }
.cb-fix-btn.is-retry { color: var(--cb-on-accent); background: var(--cb-blue); border-color: var(--cb-blue-strong); }
.cb-fix-btn.is-retry:hover { background: var(--cb-blue-strong); }
.cb-fix-note { font-size: var(--cb-fs-xs); color: var(--cb-text-muted); overflow-wrap: anywhere; }
.cb-fix-raw { flex-basis: 100%; margin: 2px 0 0; }
.cb-fix-raw summary { cursor: pointer; font-size: 11px; color: var(--cb-text-muted); }
.cb-fix-raw code {
  display: block; margin: 4px 0 0; padding: 6px 8px;
  font-family: var(--cb-mono); font-size: 10px; color: var(--cb-text-muted);
  background: var(--cb-gray-50); border: 1px solid var(--cb-line);
  border-radius: var(--cb-radius-sm); white-space: pre-wrap; overflow-wrap: anywhere;
}

/* ===== ux(round8) 窄屏/工地手机适配（docs/ux/ux-design-spec.md 附录 G）=====
   断点三档（--cb-bp-*）：≤430 手机竖屏 / 431-768 平板 / ≥769 桌面不动。
   借鉴 pattern-only：GitHub Primer（min 320px、触控目标 44px、内容定断点）、
   antd mobile / TDesign Mobile（卡片纵排、主操作全宽）、PWA 最小件（manifest+theme-color）。
   规则一律 @media screen：打印仍走 @media print 的 A4 版式，不受窄屏影响。 */

/* 大字模式钩子（R11 主题轮在此之上接明暗切换）：字号阶梯 +2 档 */
html.cb-large {
  --cb-fs-xs: 14px; --cb-fs-sm: 16px; --cb-fs-md: 18px; --cb-fs-lg: 22px;
  --cb-fs-xl: 28px; --cb-fs-2xl: 32px; --cb-fs-3xl: 36px;
}

/* 汉堡键：仅 ≤768（.rail 隐藏档）出现，展开「会话/岗位」侧栏 */
#railToggle { display: none; }
.rail.mobile-open {
  display: flex; flex-direction: column;
  position: fixed; top: var(--cb-topbar-h); left: 0; bottom: 0; z-index: 35;
  width: min(100%, 320px); box-shadow: var(--cb-shadow-lg);
}

/* 平板档（--cb-bp-tablet=768）：顶栏可折叠、聊天正文 14px/1.6、触控 ≥44px */
@media screen and (max-width: 768px) { /* --cb-bp-tablet */
  #railToggle { display: inline-block; min-height: var(--cb-touch-min, 44px); }
  .top { flex-wrap: wrap; gap: 6px; padding: 8px 12px; }
  .top-meta { flex-wrap: wrap; }
  .log { padding: 12px 14px 8px; }
  .msg, .welcome { font-size: 14px; line-height: 1.6; }
  .welcome { margin-top: 8vh; }
  #send, #stop, .composer-attach, .top-btn, .hints button, .local-row button { min-height: var(--cb-touch-min, 44px); }
  .ghost.tiny { min-height: var(--cb-touch-min, 44px); }
  .thread-row { display: flex; align-items: center; min-height: var(--cb-touch-min, 44px); }
  .confirm, .composer-note { font-size: 13px; line-height: 1.6; }
  .cb-tl-fold { min-height: var(--cb-touch-min, 44px); padding: 0 10px; font-size: 12px; }
  .cb-apr-x { min-width: var(--cb-touch-min, 44px); min-height: var(--cb-touch-min, 44px); }
  /* 审批卡：决策区纵排全宽、主决策 48px（附录 D.2 打底补齐） */
  .cb-apr-actions { flex-direction: column; }
  .cb-apr-actions button { width: 100%; min-height: var(--cb-touch-lg, 48px); font-size: var(--cb-fs-md, 14px); }
  .cb-fix-btn { min-height: var(--cb-touch-min, 44px); }
  .cb-audit-actions button { min-height: var(--cb-touch-min, 44px); }
  /* 文书预览：A4 版心退化为流式宽、内边距收窄；表格横向滚动 + 粘性首列 */
  .cb-doc-modal { width: 100vw; max-height: 100dvh; border-radius: 0; }
  .cb-doc-scroll { padding: 8px; }
  .cb-doc-page { width: 100%; padding: 24px 16px 40px; }
  .cb-doc-btn, .cb-doc-row-btn { min-height: var(--cb-touch-min, 44px); }
  .cb-doc-md table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .cb-doc-md th:first-child, .cb-doc-md td:first-child { position: sticky; left: 0; background: #fff; }
}

/* 手机竖屏档（--cb-bp-mobile=430）：时间线缩轨、审计节点单列、JSON 全宽 */
@media screen and (max-width: 430px) { /* --cb-bp-mobile */
  .cb-tl-line { margin-left: 4px; }
  .cb-audit-node { flex-wrap: wrap; row-gap: 2px; }
  .cb-audit-t { min-width: 0; flex-basis: 100%; order: 3; }
  .cb-audit-raw { flex-basis: 100%; max-height: 180px; }
  .local-row { flex-wrap: wrap; }
  .local-row input, .local-row button { flex: 1 1 auto; }
  .hints { gap: 8px; }
}

/* === ux(round10) 空态卡 + 三步引导 checklist + 网关兜底（--cb-* token，零 CDN；docs/ux 附录 I） ===
   pattern-only：shadcn/ui Empty / Tailwind UI empty state（MIT / 文档）：图标 + 一句话 + 主动作；
   PostHog/Appcues 首访 checklist（文档）：3 步、逐项打勾、全完成自动收起、可重开；
   openai/codex 首启欢迎（Apache-2.0）：单一 composer 聚焦，欢迎区只占一屏不堆字。 */
.cb-empty { max-width: 560px; margin: 7vh auto 0; text-align: center; }
.cb-empty-media {
  width: 44px; height: 44px; margin: 0 auto var(--cb-space-3);
  display: grid; place-items: center;
  background: var(--cb-blue); color: var(--cb-on-accent);
  font-size: var(--cb-fs-md); font-weight: 700; letter-spacing: 0.02em;
  border-radius: var(--cb-radius-md); box-shadow: var(--cb-shadow-md);
}
.cb-empty-title {
  margin: 0 0 var(--cb-space-2);
  font-size: var(--cb-fs-xl); font-weight: 700; color: var(--cb-text);
  letter-spacing: -0.01em;
}
.cb-empty-desc {
  margin: 0 auto var(--cb-space-4);
  font-size: var(--cb-fs-md); line-height: 1.6; color: var(--cb-text-muted);
  max-width: 36rem;
}
.cb-empty-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--cb-space-3); }
.cb-empty-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 16px; }
.cb-empty-actions .cb-empty-tool { display: inline-block; font: inherit; font-size: 12px; padding: 5px 10px; }
.cb-empty-actions button:disabled { opacity: .55; cursor: not-allowed; }
.cb-empty-card {
  display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
  padding: var(--cb-space-3) var(--cb-space-3) var(--cb-space-2);
  background: var(--cb-panel-soft); border: 1px solid var(--cb-line-soft); border-radius: var(--cb-radius-md);
  box-shadow: none; cursor: pointer; text-align: left;
  font-family: inherit; font-size: var(--cb-fs-sm); color: var(--cb-text);
  transition: border-color .12s, background .12s;
}
.cb-empty-card[hidden] { display: none; }
.cb-empty-card:hover { border-color: var(--cb-blue); background: var(--cb-blue-soft); }
.cb-empty-card:focus-visible { outline: 2px solid var(--cb-blue); outline-offset: 2px; }
.cb-empty-ico {
  flex: 0 0 auto; width: 20px; height: 20px; display: grid; place-items: center;
  border-radius: var(--cb-radius-sm); color: var(--cb-on-accent);
  font-size: var(--cb-fs-xs); font-weight: 600;
}
.cb-empty-card.tone-blue .cb-empty-ico { background: var(--cb-blue); }
.cb-empty-card.tone-strong .cb-empty-ico { background: var(--cb-blue-strong); }
.cb-empty-card.tone-orange .cb-empty-ico { background: var(--cb-orange); }
.cb-empty-k { font-weight: 600; font-size: var(--cb-fs-sm); }
.cb-empty-k code { font-family: var(--cb-mono); font-size: var(--cb-fs-xs); color: var(--cb-blue-strong); }
.cb-empty-v { font-size: var(--cb-fs-xs); line-height: 1.5; color: var(--cb-text-muted); }
.cb-empty-note {
  margin: var(--cb-space-4) 0 0;
  font-size: var(--cb-fs-xs); color: var(--cb-text-muted);
}
/* ux(round16) 直达词提示：空态卡内一行，比 note 稍显眼但不抢示例卡（附录 M.2） */
.cb-empty-hint {
  margin: var(--cb-space-3) 0 0;
  font-size: var(--cb-fs-xs); line-height: 1.7; color: var(--cb-text);
}
.cb-empty-hint code {
  padding: 1px 6px; margin: 0 1px;
  font-family: var(--cb-mono); font-size: var(--cb-fs-xs); color: var(--cb-blue-strong);
  background: var(--cb-blue-soft); border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm);
}
/* 网关兜底空态：加载失败/后端未起（纠偏卡三段式：发生了什么 + 现在能做什么） */
.cb-empty-down {
  max-width: 560px; margin: 0 auto var(--cb-space-4);
  text-align: left; padding: var(--cb-space-4);
  background: var(--cb-red-soft); border: 1px solid var(--cb-red); border-radius: var(--cb-radius-md);
}
.cb-empty-down .cb-empty-k { color: var(--cb-red); }
.cb-empty-down p { margin: 0 0 var(--cb-space-2); font-size: var(--cb-fs-sm); line-height: 1.6; color: var(--cb-text); }
.cb-empty-down code {
  display: block; margin: var(--cb-space-2) 0; padding: 8px 10px;
  font-family: var(--cb-mono); font-size: var(--cb-fs-xs); color: var(--cb-text);
  background: var(--cb-panel); border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm);
  overflow-x: auto; white-space: nowrap;
}
.cb-empty-down .cb-empty-acts { display: flex; gap: var(--cb-space-2); flex-wrap: wrap; }
.cb-empty-down button {
  padding: 6px 12px; min-height: 32px; border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm);
  background: var(--cb-panel); color: var(--cb-text); font-size: var(--cb-fs-xs); font-weight: 600; cursor: pointer; font-family: inherit;
}
.cb-empty-down button:hover { border-color: var(--cb-blue); color: var(--cb-blue-strong); }
/* ux(round15) 装箱直达卡（附录 M）：未启动态直接复用 .cb-empty-down（同为后端不可达语义），
   已打开态同版式换蓝 token；两态均只用 --cb-* 变量，随 R11 明暗主题翻转。 */
.cb-pack-ok {
  max-width: 560px; margin: 0 auto var(--cb-space-4);
  text-align: left; padding: var(--cb-space-4);
  background: var(--cb-blue-soft); border: 1px solid var(--cb-blue); border-radius: var(--cb-radius-md);
}
.cb-pack-ok .cb-empty-k { color: var(--cb-blue-strong); }
.cb-pack-ok p { margin: 0 0 var(--cb-space-2); font-size: var(--cb-fs-sm); line-height: 1.6; color: var(--cb-text); }
.cb-pack-ok .cb-empty-acts { display: flex; gap: var(--cb-space-2); flex-wrap: wrap; }
.cb-pack-ok a {
  display: inline-block; padding: 6px 12px; min-height: 20px; line-height: 20px;
  border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm);
  background: var(--cb-panel); color: var(--cb-blue-strong);
  font-size: var(--cb-fs-xs); font-weight: 600; text-decoration: none; font-family: inherit;
}
.cb-pack-ok a:hover { border-color: var(--cb-blue); }
.cb-pack-ok a:focus-visible { outline: 2px solid var(--cb-focus); outline-offset: 2px; }
/* 三步引导 checklist（首访一次性；PostHog/Appcues 模式：逐项打勾 + 全完成自动收起 + 可重开） */
.cb-ob {
  max-width: 560px; margin: var(--cb-space-5) auto 0;
  background: var(--cb-panel); border: 1px solid var(--cb-line); border-radius: var(--cb-radius-md);
  box-shadow: var(--cb-shadow-md); overflow: hidden;
}
.cb-ob-head {
  display: flex; align-items: center; gap: var(--cb-space-2);
  padding: 10px var(--cb-space-4); border-bottom: 1px solid var(--cb-line);
}
.cb-ob-head strong { font-size: var(--cb-fs-md); color: var(--cb-text); }
.cb-ob-head .cb-ob-sub { font-size: var(--cb-fs-xs); color: var(--cb-text-muted); }
.cb-ob-x {
  margin-left: auto; width: 26px; height: 26px; display: grid; place-items: center;
  background: transparent; border: none; border-radius: var(--cb-radius-sm);
  color: var(--cb-text-muted); font-size: var(--cb-fs-md); cursor: pointer;
}
.cb-ob-x:hover { background: var(--cb-gray-100); color: var(--cb-text); }
.cb-ob-steps { list-style: none; margin: 0; padding: var(--cb-space-2) 0; }
.cb-ob-steps li { display: flex; align-items: flex-start; gap: 10px; padding: 7px var(--cb-space-4); font-size: var(--cb-fs-sm); line-height: 1.55; color: var(--cb-text); }
.cb-ob-dot {
  flex: 0 0 auto; width: 18px; height: 18px; margin-top: 1px;
  display: grid; place-items: center;
  border: 1.5px solid var(--cb-gray-400); border-radius: var(--cb-radius-full);
  font-size: 11px; color: transparent; background: var(--cb-panel);
}
.cb-ob-steps li.on .cb-ob-dot { border-color: var(--cb-green); background: var(--cb-green); color: var(--cb-on-accent); }
.cb-ob-steps li.on { color: var(--cb-text-muted); }
.cb-ob-steps li.on .cb-ob-t { text-decoration: line-through; }
.cb-ob-steps li.now .cb-ob-dot { border-color: var(--cb-blue); }
.cb-ob-foot { padding: 8px var(--cb-space-4) 10px; border-top: 1px solid var(--cb-line); font-size: var(--cb-fs-xs); color: var(--cb-text-muted); }
@media screen and (max-width: 768px) { /* --cb-bp-tablet */
  .cb-empty { margin-top: 4vh; }
  .cb-empty-cards { grid-template-columns: 1fr; }
  .cb-empty-card { min-height: var(--cb-touch-min, 44px); }
}

/* === ux(round11) 无障碍收口（附录 J）=== */
:focus-visible { outline: 2px solid var(--cb-focus); outline-offset: 2px; }
.cb-sr-only {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ===== ux(round17) 模型设置浮层：居中卡片，全部走 --cb-* token 随明暗主题翻转 ===== */
.cb-llm {
  position: fixed; inset: 0; z-index: 40;
  display: flex; align-items: center; justify-content: center;
  padding: var(--cb-space-4); background: rgba(0, 0, 0, 0.45);
}
.cb-llm.hidden { display: none; }
.cb-llm-box {
  width: 100%; max-width: 520px; max-height: 88vh; overflow: auto;
  padding: var(--cb-space-4);
  background: var(--cb-panel); border: 1px solid var(--cb-line);
  border-radius: var(--cb-radius-md); box-shadow: var(--cb-shadow-md);
}
.cb-llm-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--cb-space-3); }
.cb-llm-note { margin: var(--cb-space-2) 0 var(--cb-space-3); font-size: var(--cb-fs-xs); line-height: 1.7; color: var(--cb-text-muted); }
.cb-llm-note code {
  padding: 1px 5px; font-family: var(--cb-mono); font-size: var(--cb-fs-xs);
  color: var(--cb-blue-strong); background: var(--cb-blue-soft);
  border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm);
}
.cb-llm-row { display: grid; grid-template-columns: 84px 1fr; align-items: center; gap: var(--cb-space-3); margin-bottom: var(--cb-space-3); }
.cb-llm-row > span { font-size: var(--cb-fs-xs); color: var(--cb-text); }
.cb-llm-row input, .cb-llm-row select {
  width: 100%; min-height: 36px; padding: 6px 10px;
  font-family: inherit; font-size: var(--cb-fs-sm); color: var(--cb-text);
  background: var(--cb-paper); border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm);
}
.cb-llm-row input:focus-visible, .cb-llm-row select:focus-visible { outline: 2px solid var(--cb-focus); outline-offset: 1px; }
.cb-llm-status { margin: var(--cb-space-3) 0; font-size: var(--cb-fs-xs); line-height: 1.7; color: var(--cb-text); }
.cb-llm-status.ok { color: var(--cb-green, var(--cb-blue-strong)); }
.cb-llm-status.err { color: var(--cb-red); }
.cb-llm-acts { display: flex; gap: var(--cb-space-2); flex-wrap: wrap; }
@media (max-width: 430px) {
  .cb-llm-row { grid-template-columns: 1fr; gap: 4px; }
  .cb-llm-acts button { flex: 1 1 100%; min-height: 44px; }
}

/* ===== ux(round19) 设置菜单 + 流内依据卡（附录 P）===== */
.top-menu-wrap { position: relative; }
.top-menu {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 40;
  min-width: 168px; padding: 4px;
  background: var(--cb-panel); border: 1px solid var(--cb-line);
  border-radius: var(--cb-radius-md); box-shadow: var(--cb-shadow-md);
}
.top-menu[hidden] { display: none; }
.top-menu-item {
  display: block; width: 100%; text-align: left;
  padding: 8px 10px; min-height: var(--cb-touch-min, 44px);
  background: transparent; border: 0; border-radius: var(--cb-radius-sm);
  color: var(--cb-text); font: inherit; font-size: var(--cb-fs-sm); cursor: pointer;
}
.top-menu-item:hover { background: var(--cb-blue-soft); color: var(--cb-blue-strong); }
.top-menu-item:focus-visible { outline: 2px solid var(--cb-focus); outline-offset: -2px; }

/* 依据卡：跟着那条回答走，不再堆在右栏 */
.cb-cite-card {
  margin: 8px 0 0; padding: 8px 10px;
  background: var(--cb-bg); border: 1px solid var(--cb-line);
  border-radius: var(--cb-radius-sm);
}
.cb-cite-h { font-size: var(--cb-fs-xs); color: var(--cb-text-muted); margin-bottom: 4px; }
.cb-cite-card ul { list-style: none; padding: 0; margin: 0; }
.cb-cite-card li { font-size: var(--cb-fs-xs); border-top: 1px solid var(--cb-line); padding: 6px 0; }
.cb-cite-card li:first-child { border-top: 0; }


/* ===== ux(round19) 装柜台内嵌面板（附录 P）：不跳走，嵌在对话流里 ===== */
.cb-pack-embed {
  margin: 10px 0; border: 1px solid var(--cb-line);
  border-radius: var(--cb-radius-md); overflow: hidden; background: var(--cb-panel);
}
.cb-pack-embed-h {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 8px 10px; border-bottom: 1px solid var(--cb-line);
  font-size: var(--cb-fs-sm);
}
.cb-pack-embed-h span { color: var(--cb-text-muted); font-size: var(--cb-fs-xs); }
.cb-pack-embed-acts { margin-left: auto; display: flex; gap: 6px; }
.cb-pack-frame {
  display: block; width: 100%; height: min(72vh, 720px); border: 0; background: var(--cb-bg);
}
.cb-pack-embed.is-max {
  position: fixed; inset: var(--cb-topbar-h) 0 0 0; z-index: 30;
  margin: 0; border-radius: 0;
}
.cb-pack-embed.is-max .cb-pack-frame { height: calc(100dvh - var(--cb-topbar-h) - 42px); }
.cb-pack-embed-fb { margin: 10px; font-size: var(--cb-fs-sm); color: var(--cb-text); }
.cb-pack-embed > a {
  display: inline-block; margin: 0 10px 12px; padding: 6px 12px;
  border: 1px solid var(--cb-line); border-radius: var(--cb-radius-sm);
  background: var(--cb-panel); color: var(--cb-blue-strong);
  font-size: var(--cb-fs-xs); font-weight: 600; text-decoration: none;
}

/* ===== ux(round21) 回形针与附件 chip（附录 Q）=====
   只补一个入口，不恢复 round19 拆掉的那排杂项。图标是文字「附件」——
   符号纪律禁 emoji 与 dingbats，回形针图标会撞 test_ux_no_emoji。 */
.composer-attach {
  flex: none; align-self: flex-end;
  padding: 6px 10px; min-height: 36px;
  background: transparent; border: 1px solid var(--cb-line);
  border-radius: 999px; cursor: pointer;
  color: var(--cb-text-muted); font: inherit; font-size: var(--cb-fs-xs);
}
.composer-attach:hover { color: var(--cb-blue-strong); border-color: var(--cb-blue); }
.composer-attach:focus-visible { outline: 2px solid var(--cb-focus); outline-offset: 2px; }
/* 语音输入：空闲只显示内联 SVG 麦克风（不是 emoji，不违反符号纪律）；录音中变红并显示计时，时间位数固定，读秒时按钮不跳宽 */
.composer-voice { font-variant-numeric: tabular-nums; display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-width: 32px; }
.composer-voice .cb-mic { flex: none; display: block; }
.cb-voice-label:empty { display: none; }
.composer-voice.is-rec { color: var(--cb-red); border-color: var(--cb-red); background: var(--cb-red-soft); }
/* 录音时按钮变宽，输入框的提示字会折成两行，第二行被切掉半截；提示字只排一行，放不下就截断 */
.composer textarea::placeholder { white-space: nowrap; overflow: hidden; }
.composer-voice:disabled { opacity: .55; cursor: default; }
.composer-voice[aria-disabled="true"] { opacity: .55; cursor: progress; }
.cb-voice-status { margin: 4px 0 0; font-size: 11px; color: var(--cb-text-muted); }
.cb-voice-interim { margin: 2px 0 0; font-size: 11px; color: var(--cb-text-faint); }
.cb-voice-status:empty, .cb-voice-interim:empty { margin: 0; }
.cb-voice-status[data-kind="warn"] { color: var(--warn); }
.cb-voice-status[data-kind="ok"] { color: var(--ok); }
.attaches { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.attaches[hidden] { display: none; }
.cb-att-chip {
  display: inline-flex; align-items: center; gap: 6px;
  max-width: 260px; padding: 2px 4px 2px 10px; border-radius: 999px;
  font-size: var(--cb-fs-xs); color: var(--cb-text);
  background: var(--cb-bg); border: 1px solid var(--cb-line);
}
.cb-att-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cb-att-size { flex: none; color: var(--cb-text-muted); }
.cb-att-x {
  flex: none; border: 0; background: transparent; cursor: pointer;
  color: var(--cb-text-muted); font: inherit; line-height: 1;
  padding: 2px 6px; border-radius: 999px;
}
.cb-att-x:hover { background: var(--cb-panel); color: var(--cb-text); }
.cb-att-x:focus-visible { outline: 2px solid var(--cb-focus); outline-offset: 1px; }
/* 上传中的 chip：进度条 + 百分比 + ×；失败的变红并给「重试」 */
.cb-att-chip.pending { border-style: dashed; }
.cb-att-chip.err { border-color: var(--cb-red); color: var(--cb-red); }
.cb-att-bar { flex: none; width: 64px; height: 6px; border-radius: 999px; background: var(--cb-line); overflow: hidden; }
.cb-att-bar > i { display: block; height: 100%; width: 0; background: var(--cb-green); transition: width .15s linear; }
.cb-att-pct { flex: none; min-width: 3ch; color: var(--cb-text-muted); font-variant-numeric: tabular-nums; }
/* 拖拽反馈：round19 删拖拽是因为它当时看不见；现在有 chip 与这个高亮，不再是隐藏通道 */
.composer.drop { outline: 2px dashed var(--cb-blue); outline-offset: -4px; }

.cb-post-details { border: 0; padding: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.cb-post-details:focus-visible { outline: 2px solid var(--cb-focus); outline-offset: 3px; }
.cb-capability-panel, .cb-route-card, .cb-collaboration-card {
  min-width: 0; margin: 12px 0; padding: 12px; border: 1px solid var(--cb-line);
  border-radius: var(--cb-radius-sm); background: var(--cb-panel); text-align: left; overflow-wrap: anywhere;
}
.cb-capability-panel h4, .cb-route-card h4, .cb-collaboration-card h4 { margin: 8px 0; font-size: var(--cb-fs-sm); }
.cb-capability-panel ul, .cb-route-card ul, .cb-collaboration-card ul { margin: 6px 0; padding-left: 20px; }
.cb-capability-panel li, .cb-route-card li, .cb-collaboration-card li { margin: 4px 0; font-size: var(--cb-fs-xs); line-height: 1.6; }
.cb-capability-panel select { width: 100%; margin: 8px 0; padding: 8px; color: var(--cb-text); background: var(--cb-bg); border: 1px solid var(--cb-line); }
.cb-route-choice { display: block; margin: 8px 0; max-width: 100%; white-space: normal; text-align: left; }
.cb-collaboration-card details { border-top: 1px solid var(--cb-line); padding: 8px 0; }
.cb-collaboration-card summary { cursor: pointer; font-size: var(--cb-fs-sm); }
.cb-collaboration-budget { font-size: var(--cb-fs-xs); color: var(--cb-text-muted); }
.cb-collaboration-budget meter { width: 100%; }
.cb-collaboration-card table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: var(--cb-fs-xs); }
.cb-collaboration-card th, .cb-collaboration-card td { padding: 6px; border: 1px solid var(--cb-line); text-align: left; vertical-align: top; white-space: pre-wrap; }
.cb-att-role { max-width: 100px; padding: 2px; font: inherit; color: var(--cb-text); background: var(--cb-panel); border: 1px solid var(--cb-line); border-radius: 4px; }
.cb-att-chip:has(.cb-att-role) { max-width: min(420px, 100%); }
.cb-att-role:focus-visible { outline: 2px solid var(--cb-focus); outline-offset: 1px; }

/* 后台任务完成提示：底部一条，可点「查看」切过去 */
.cb-toast {
  position: fixed; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%);
  z-index: 60; max-width: min(92vw, 520px);
  display: inline-flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-radius: 10px;
  background: var(--cb-text); color: var(--cb-bg);
  font-size: var(--cb-fs-sm); box-shadow: 0 6px 24px rgba(0, 0, 0, .25);
}
.cb-toast[hidden] { display: none; }
.cb-toast button {
  border: 0; border-radius: 6px; padding: 4px 10px; cursor: pointer; font: inherit;
  background: var(--cb-green); color: var(--cb-on-accent);
}

/* 回答收口后的 Markdown（流式期间仍是纯文本）；表格横向滚动，代码块保留换行 */
.body.md { white-space: normal; }
.body.md > :first-child { margin-top: 0; }
.body.md > :last-child { margin-bottom: 0; }
.body.md h1, .body.md h2, .body.md h3, .body.md h4 { margin: .9em 0 .4em; line-height: 1.3; font-size: 1.05em; }
.body.md h1 { font-size: 1.2em; } .body.md h2 { font-size: 1.12em; }
.body.md p, .body.md ul, .body.md ol, .body.md blockquote { margin: .5em 0; }
.body.md ul, .body.md ol { padding-left: 1.4em; }
.body.md li + li { margin-top: .2em; }
.body.md code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .92em; padding: 0 .3em; border-radius: 4px; background: var(--cb-bg-soft, rgba(0,0,0,.05)); }
.body.md pre { overflow-x: auto; padding: .6em .8em; border-radius: 8px; background: var(--cb-bg-soft, rgba(0,0,0,.05)); }
.body.md pre code { padding: 0; background: none; }
.body.md table { display: block; overflow-x: auto; max-width: 100%; border-collapse: collapse; margin: .6em 0; font-size: .95em; }
.body.md th, .body.md td { border: 1px solid var(--cb-line); padding: .3em .6em; text-align: left; vertical-align: top; }
.body.md th { background: var(--cb-bg-soft, rgba(0,0,0,.04)); }
.body.md blockquote { border-left: 3px solid var(--cb-line); padding-left: .8em; color: var(--cb-text-muted); }
.body.md a { color: var(--cb-blue); word-break: break-all; }

/* Compact input stays readable when the workbench sits in a narrow app panel. */
.composer .ctx-bar { margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--cb-line-soft); }
.composer .ctx-text { font-size: 11px; line-height: 1.6; }
.composer #ctxOpen { padding: 4px 0; min-height: 30px; background: transparent; border-color: transparent; color: var(--cb-blue-ink); }
.composer .ctx-meter { background: var(--cb-line-soft); }
.composer textarea::placeholder { color: var(--cb-text-muted); }
@media (max-width: 600px) {
  .composer { padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px)); }
  .composer-shortcut { display: none; }
  .composer-shell { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto auto; gap: 8px; }
  .composer .input-wrap { grid-column: 1 / -1; grid-row: 1; }
  .composer textarea { min-height: 52px; padding: 4px; }
  .composer-plus { grid-column: 1; grid-row: 2; }
  .composer-voice { grid-column: 2; grid-row: 2; justify-self: end; }
  #btnAttach { grid-column: 3; grid-row: 2; }
  #send { grid-column: 4; grid-row: 2; }
  #stop { grid-column: 1 / -1; grid-row: 3; }
  .composer-shell #send, .composer-shell .composer-plus, .composer-shell .composer-attach { min-height: 40px; height: 40px; }
  .composer-shell #send, .composer-shell .composer-plus { width: 40px; }
  .composer-risk summary > span { display: block; margin: 0 0 0 15px; }
}