/* LLM 导播台 · 网页端 —— 设计令牌全部取自桌面版 Assets/settings.html，两套主题同结构。
   硬纪律：零盒阴影（桌面版设计规则）；圆角 12px；强调色当背景时前景取 --accent-fg。
   移动端适配清单：860px 断点 / 100dvh + safe-area / 输入 16px / 触控目标 ≥44px /
   .row 与 .conn-head 换行 / @media (hover:none) 去掉悬停依赖 / .hint 取代 title 气泡 / 聚焦滚动到可见。 */

:root {
  --bg: #151517;
  --panel: #1b1b1d;
  --panel-2: #232326;
  --line: #3a3a3f;
  --text: #f9fafb;
  --muted: #a9adb3;
  --dim: #6f7379;
  --accent: #e9eaec;
  --accent-fg: #151517;
  --accent-soft: #3a3a3f;
  --switch-off: #35353a;
  --switch-knob: #c9ccd1;
  --ok: #3fb950;
  --err: #f85149;
  --radius: 12px;
  --surface-hover: #313136;
  --highlight: #6cb6ff;
  /* 蓝色专给「档案区」这条线（用户指定）：蓝按钮 / 蓝边框 / 蓝标题；选中卡面用深灰 #43454a 示意 */
  --blue: #4f8dff;
  --blue-fg: #0b1220;
  --sel-bg: #43454a;
  /* 最后一张完成卡的标题行 = 反白高亮（深色主题下白底黑字，用户要的就是这个样子）。
     正文不吃这组令牌：正文用主题自己的 --text，落在深色卡面上才看得见（0.1.21 的病根就是把反白色用到了正文上）。 */
  --done-head-surface: #f9fafb;
  --done-head-text: #151517;
  --done-head-muted: #5c6066;
  --done-code: #2a2b2f;
  --mono: ui-monospace, "Cascadia Mono", "Consolas", "Menlo", monospace;
  color-scheme: dark;
}

:root[data-theme="light"] {
  --bg: #f5f6f8;
  --panel: #ffffff;
  --panel-2: #ffffff;
  --line: #e2e6ed;
  --text: #1d2129;
  --muted: #5f6b7a;
  --dim: #8c97a6;
  --accent: #3a3b40;
  --accent-fg: #ffffff;
  --accent-soft: #eceef0;
  --switch-off: #d3d7dd;
  --switch-knob: #ffffff;
  --ok: #1f9d4d;
  --err: #d1362a;
  --surface-hover: #edf0f5;
  --highlight: #1f6feb;
  --blue: #1667c9;
  --blue-fg: #ffffff;
  --sel-bg: #dfe3ea;
  /* 浅色主题：标题行反过来（黑底白字），正文用主题自己的深字 */
  --done-head-surface: #151517;
  --done-head-text: #ffffff;
  --done-head-muted: #c4c8ce;
  --done-code: #eceef0;
  color-scheme: light;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    --bg: #f5f6f8; --panel: #ffffff; --panel-2: #ffffff; --line: #e2e6ed;
    --text: #1d2129; --muted: #5f6b7a; --dim: #8c97a6;
    --accent: #3a3b40; --accent-fg: #ffffff; --accent-soft: #eceef0;
    --switch-off: #d3d7dd; --switch-knob: #ffffff; --ok: #1f9d4d; --err: #d1362a;
    --surface-hover: #edf0f5; --highlight: #1f6feb;
    --blue: #1667c9; --blue-fg: #ffffff; --sel-bg: #dfe3ea;
    --done-head-surface: #151517; --done-head-text: #ffffff; --done-head-muted: #c4c8ce; --done-code: #eceef0;
    color-scheme: light;
  }
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 14px/1.6 system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
  -webkit-text-size-adjust: 100%;
}

body { min-height: 100dvh; }

a { color: var(--highlight); text-decoration: none; }
a:active { opacity: .7; }

/* ── 布局骨架 ─────────────────────────────────────────── */
/* 骨架定高：会话页只有 .stream 滚，快捷条与输入区永远钉在页面底部（用户要求）。
   定高之后必须给中间那层 min-height:0，flex 子项才肯让出滚动空间。 */
.app {
  display: flex;
  flex-direction: column;
  height: 100dvh;
  overflow: hidden;
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}

.topbar {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  background: var(--panel);
  position: sticky; top: 0; z-index: 30;
}
.topbar .brand { font-weight: 700; letter-spacing: .3px; display: flex; align-items: center; gap: 8px; }
/* 与桌面版同一张图标（app.svg 随包）：顶部标题前挂一枚小 logo，圆角跟随图标本体 */
.topbar .brand-logo { width: 20px; height: 20px; border-radius: 5px; display: block; }
.topbar .brand small { color: var(--dim); font-weight: 500; margin-left: 6px; }
.topbar .spacer { flex: 1; }
.topbar nav { display: flex; gap: 6px; }

.tabs { display: flex; gap: 6px; }
.tab {
  min-height: 40px; padding: 8px 14px; border-radius: 10px;
  border: 1px solid var(--line); background: transparent; color: var(--muted);
  font: inherit; cursor: pointer;
}
.tab[aria-current="page"] { background: var(--accent); color: var(--accent-fg); border-color: var(--accent); }

.pages { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.page { flex: 1; display: none; }
.page[data-active="1"] { display: flex; flex-direction: column; flex: 1; min-height: 0; }
/* 配置页整页滚（它没有钉底输入区） */
.page[data-active="1"] > .wrap { flex: 1; min-height: 0; overflow-y: auto; }

/* ── 通用面板 / 行 ─────────────────────────────────────── */
.wrap { padding: 14px; display: flex; flex-direction: column; gap: 12px; max-width: 1180px; width: 100%; margin: 0 auto; }
/* 配置页跟着窗宽走（聊天页留着 1180px 的阅读宽度）：宽屏下两边那两条大空白没有意义 */
.wrap.wide { max-width: none; }
.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 14px;
}
/* 当前发往的那张卡（档案 / 连接器共用）：整张深灰面，一眼看出是哪张在选中状态 */
.card.sel { background: var(--sel-bg); }
/* 档案区这条线的蓝：卡片蓝边框 + 标题蓝字 + 那颗蓝色按钮 */
.card.blue { border-color: var(--blue); }
.card.blue > h2, .card.blue > h2 .sub { color: var(--blue); }
.btn.blue { background: var(--blue); color: var(--blue-fg); border-color: var(--blue); }
/* 「启用」那颗文字标记：外围边框整条去掉（不是把边框刷成透明留 1px 占位） */
.chip.flat { border: 0; }
/* 档案卡的「启用 / 删除」同尺寸（一个 44 一个 70 看着像两个队伍的按钮） */
.btnrow .btn { min-width: 88px; }
/* 0.1.74 模型档案列表：页面默认只出「厂家 → 模型 + 备注」列表，✓ 标当前发往，点一行弹表单编辑
   （老的「折叠态 + 每档案一张参数卡」整块退役） */
#profList { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.prof-head { color: var(--blue); font-size: 12px; font-weight: 600; letter-spacing: .3px; margin-top: 4px; }
.prof-row {
  display: flex; align-items: center; gap: 8px;
  font: inherit; color: var(--text); text-align: left;
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 10px;
  padding: 9px 11px; min-height: 40px; cursor: pointer;
}
.prof-row:hover { border-color: var(--accent); }
.prof-row.sel { background: var(--sel-bg); border-color: var(--blue); }
.prof-check { width: 15px; flex: none; color: var(--blue); font-weight: 700; }
.prof-name { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.prof-alias { flex: 0 1 auto; min-width: 0; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.prof-key { flex: none; }
.prof-row.new { border-color: var(--accent); outline: 2px solid var(--accent); outline-offset: 1px; }
dialog.form-dlg {
  width: min(520px, calc(100vw - 20px)); max-height: calc(100vh - 20px); overflow: auto;
  background: var(--panel); color: var(--text);
  border: 1px solid var(--line); border-radius: var(--radius); padding: 14px;
}
dialog.form-dlg::backdrop { background: rgba(0, 0, 0, .45); }
dialog.form-dlg h2 { margin: 0 0 10px; font-size: 15px; color: var(--blue); }
.card h2 { margin: 0 0 10px; font-size: 15px; }
.card h2 .sub { color: var(--dim); font-weight: 500; font-size: 12px; margin-left: 8px; }
/* 刚新增的那一条：给一眼看得见的边与底色，配合滚动定位（以前新增完卡片混在堆里，用户以为没反应） */
.card.new { border-color: var(--accent); outline: 2px solid var(--accent); outline-offset: 1px; }
.kind-picker { margin-top: 8px; }
.kind-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.chip.kind-chip { cursor: pointer; background: transparent; font: inherit; padding: 7px 11px; min-height: 34px; }
.chip.kind-chip.off { color: var(--dim); border-style: dashed; }
.hint { color: var(--dim); font-size: 12px; line-height: 1.5; }
.hint.warn { color: var(--err); }

.row {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 0; border-bottom: 1px solid var(--line);
}
.row:last-child { border-bottom: 0; }
.row > label:first-child { flex: 0 0 120px; color: var(--muted); }
.row > .grow { flex: 1; min-width: 0; }
.row.wrapable { flex-wrap: wrap; }
/* 当前会话那行要一眼看出来：左侧一道色条 + 底色微亮 + 标题加粗（规范禁发光那类，所以只用边框与底色） */
.row.cur { border-left: 3px solid var(--highlight); background: var(--panel-2); padding-left: 10px; }
.row.cur > .grow > b { color: var(--text); }
/* 输入框 + 紧跟它右侧的按钮（密钥「清除」这类）：同一行，框吃掉剩余宽度，按钮不缩 */
.row.pairrow { flex-wrap: nowrap; }
.row > .grow.inline { display: flex; align-items: center; gap: 10px; }
.row > .grow.inline > input[type="text"],
.row > .grow.inline > input[type="password"],
.row > .grow.inline > input[type="number"],
.row > .grow.inline > input[type="search"],
.row > .grow.inline > select { flex: 1 1 auto; min-width: 0; width: auto; }
.row > .grow.inline > .btn { flex: 0 0 auto; }
/* 按钮区整体居左（不吃 label 那 120px 缩进）；.tail 推到这一行最右边 */
.btnrow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 0; }

.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }

/* ── 控件（触控目标 ≥44px，输入 16px 防 iOS 聚焦缩放）─── */
input, select, textarea, button { font: inherit; color: var(--text); }

input[type="text"], input[type="password"], input[type="number"], input[type="search"], select, textarea {
  width: 100%; min-height: 44px;
  padding: 10px 12px; font-size: 16px;
  background: var(--panel-2);
  border: 1px solid var(--line); border-radius: 10px;
  outline: none;
}
input:focus, select:focus, textarea:focus { border-color: var(--highlight); }
/* 下拉框不铺满整行：原生下拉列表跟着控件宽度铺开，宽屏（配置页自适应窗宽）下 1100px 宽的列表弹出会顶出可视区（用户截图） */
select { width: auto; max-width: 420px; min-width: 170px; }
textarea { resize: vertical; }
label.field { display: block; margin: 10px 0 4px; color: var(--muted); font-size: 12px; }

.btn {
  min-height: 44px; padding: 10px 16px;
  border: 1px solid var(--line); border-radius: 10px;
  background: var(--panel-2); color: var(--text);
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
}
.btn.primary { background: var(--accent); color: var(--accent-fg); border-color: var(--accent); }
.btn.ok { background: var(--ok); color: #fff; border-color: var(--ok); }
.btn.err { background: var(--err); color: #fff; border-color: var(--err); }
.btn.ghost { background: transparent; }
.btn:disabled { opacity: .45; cursor: default; }
.btn.sm { min-height: 36px; padding: 6px 10px; font-size: 13px; }
.btn:focus-visible, .tab:focus-visible { outline: 2px solid var(--highlight); outline-offset: 2px; }

.switch { position: relative; display: inline-block; min-width: 52px; min-height: 30px; }
.switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.switch i {
  position: absolute; inset: 0; border-radius: 999px;
  background: var(--switch-off); transition: background .15s;
}
.switch i::after {
  content: ""; position: absolute; top: 3px; left: 3px;
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--switch-knob); transition: transform .15s;
}
.switch input:checked + i { background: var(--accent); }
.switch input:checked + i::after { transform: translateX(22px); background: var(--accent-fg); }
.switch input:focus-visible + i { outline: 2px solid var(--highlight); outline-offset: 2px; }

.seg { display: flex; flex-wrap: wrap; gap: 6px; }
.seg button {
  min-height: 38px; padding: 7px 12px; font-size: 13px;
  border: 1px solid var(--line); border-radius: 9px;
  background: transparent; color: var(--muted); cursor: pointer;
}
.seg button[aria-pressed="true"] { background: var(--accent); color: var(--accent-fg); border-color: var(--accent); }

.chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 9px; border-radius: 999px; font-size: 12px;
  border: 1px solid var(--line); color: var(--muted); background: var(--panel-2);
}
.chip.on { border-color: var(--accent); color: var(--text); }
/* 连接器的类型那颗改蓝底（放在 .chip.on 之后：两条特异性相同，靠源码顺序才压得住 .chip.on 的字色） */
.chip.blue { background: var(--blue); color: var(--blue-fg); border-color: var(--blue); }
/* 空的标记位（连接器测之前那一位）必须真的不占位：.chip 自带 display:inline-flex 会盖掉 [hidden] 的默认 display:none */
.chip[hidden] { display: none; }
.chip.hi { border-color: var(--highlight); color: var(--highlight); }
.chip.err { border-color: var(--err); color: var(--err); }
.chip code { font-family: var(--mono); font-size: 11px; }
/* 长短标签两份都在 DOM 里，靠媒体查询切（宽屏长标签，手机短标签） */
.btn .short { display: none; }

.pill { font-size: 11px; padding: 2px 8px; border-radius: 999px; background: var(--accent-soft); color: var(--text); }
.mono { font-family: var(--mono); }
.muted { color: var(--muted); }
.dim { color: var(--dim); }
.marks { font-family: var(--mono); font-size: 12px; color: var(--dim); }

/* ── 活动流（照桌面版：过程灰、完成卡反相标题条、只有最后一个 Done 标强调）─── */
.stream { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 8px; padding: 14px; overflow-y: auto; overscroll-behavior: contain; }
/* 流是纵向 flex：子卡默认会被压扁去适配容器高度（实测 scrollHeight == clientHeight，卡片被裁）
   —— 钉高布局下必须让卡片保持自身高度，流才真的滚起来 */
.stream > * { flex: 0 0 auto; }
.act { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); overflow: hidden; }
.act > header {
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
  padding: 9px 12px; font-size: 14px;
}
.act > header .glyph { font-family: var(--mono); width: 1.1em; }
.act > header .title { color: var(--muted); }
.act > header .time { color: var(--dim); font-size: 12px; font-family: var(--mono); }
.act > header .text { flex: 1; min-width: 40%; }
.act .body { padding: 0 12px 11px; color: var(--muted); font-size: 13px; white-space: pre-wrap; overflow-wrap: anywhere; }
.act[data-kind="UserPrompt"] { background: var(--panel-2); }
.act[data-kind="Error"] { border-color: var(--err); }
.act[data-kind="Error"] > header .title { color: var(--err); }
/* 反白高亮只给标题行；正文走主题自己的 --text（0.1.21：把反白字色用到正文上 → 深色主题下正文黑得看不见） */
.act[data-last="1"] > header { background: var(--done-head-surface); color: var(--done-head-text); }
.act[data-last="1"] > header .title { color: var(--done-head-muted); }
.act[data-last="1"] > header .time { color: var(--done-head-muted); }
.act[data-last="1"] .body { color: var(--text); }
.act[data-last="1"] .body code, .act[data-last="1"] .body pre { background: var(--done-code); color: var(--text); }
.act[data-group="1"] > header { cursor: pointer; }
.act[data-group="1"] > header .fold { font-family: var(--mono); color: var(--dim); }
.act[data-group="1"][data-open="0"] .body, .act[data-group="1"][data-open="0"] .kids { display: none; }
.kids { display: flex; flex-direction: column; gap: 6px; padding: 0 12px 11px; }
.kids .act { background: var(--panel-2); }
.kids .act > header { font-size: 13px; }

/* 反问卡（ask_user_question）：题目 + 选项按钮，点一下就发出去（不走弹层） */
.askq { padding: 0 12px 11px; display: grid; gap: 8px; }
.askq-h { color: var(--text); font-size: 14px; white-space: pre-wrap; overflow-wrap: anywhere; }
.askq-opts { display: flex; flex-wrap: wrap; gap: 8px; }
.askq-opt { text-align: left; font-size: 13px; max-width: 100%; }
.askq-hint { color: var(--dim); font-size: 12px; }

.md p { margin: 0 0 8px; }
.md code { font-family: var(--mono); font-size: 12px; background: var(--accent-soft); border-radius: 5px; padding: 1px 5px; }
.md pre { font-family: var(--mono); font-size: 12px; background: var(--panel-2); border: 1px solid var(--line); border-radius: 10px; padding: 10px; overflow-x: auto; white-space: pre-wrap; }
.md h1, .md h2, .md h3 { font-size: 15px; margin: 10px 0 6px; }
.md ul, .md ol { margin: 0 0 8px 18px; padding: 0; }
.md blockquote { margin: 0 0 8px; padding-left: 10px; border-left: 2px solid var(--line); color: var(--muted); }
.md a { color: var(--highlight); }

/* ── 状态条 / 输入区 ─────────────────────────────────── */
.statusbar {
  display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
  padding: 8px 14px; border-top: 1px solid var(--line); background: var(--panel);
}
.composer {
  display: flex; flex-direction: column; gap: 6px;
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  border-top: 1px solid var(--line); background: var(--panel);
  position: sticky; bottom: 0;
}
.composer-row { display: flex; gap: 8px; align-items: flex-end; }
.composer textarea { flex: 1; min-height: 48px; max-height: 200px; }
.composer .send { min-width: 76px; }
/* 输入框下方那条实时状态（桌面版单行状态条）：图标 + 一行文字，超长横向滚动。
   它自己占一行、横向铺满输入行宽度 → 结构上压不到发送按钮（测试按矩形相交量）。 */
.livestatus {
  display: flex; align-items: center; gap: 8px;
  min-height: 20px; padding: 0 2px; color: var(--muted); font-size: 12px;
}
.ls-icon { flex: 0 0 auto; width: 16px; text-align: center; font-size: 13px; color: var(--dim); }
.ls-icon.spin { animation: r .9s linear infinite; color: var(--highlight); }
.ls-icon.ok { color: var(--ok); }
.ls-icon.err { color: var(--err); }
.ls-track { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; }
.ls-text { display: inline-block; white-space: nowrap; will-change: transform; }
.ls-meta { flex: 0 0 auto; color: var(--muted); }
.ls-meta[hidden] { display: none; }

.pending { display: flex; flex-direction: column; gap: 8px; }
.pending .item { border: 1px solid var(--line); border-left: 3px solid var(--highlight); border-radius: 10px; padding: 10px; background: var(--panel-2); }
.pending .item .args { font-family: var(--mono); font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.pending .item .acts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
/* 问答卡（0.1.52）：DSH 反问与「向用户提问」的正文落在这几条里 —— 问题必须画得出来，选项要能点。
   输入框照控件规范：min-height 44px、字号 16px（iOS 聚焦不缩放）。 */
.pending .item .q { margin-top: 6px; }
.pending .item .q .qhead { color: var(--dim); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.pending .item .q .qtext { color: var(--text); font-size: 13px; line-height: 1.5; margin-top: 2px; overflow-wrap: anywhere; }
.pending .item .q .qopts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.pending .item .q .qopts .btn.on { background: var(--accent); color: var(--accent-fg); border-color: var(--accent); }
.pending .item .q input.qnote {
  width: 100%; min-height: 44px; margin-top: 6px; padding: 10px 12px; font-size: 16px;
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 10px; color: var(--text);
}
.pending .item .q input.qnote:focus { border-color: var(--highlight); }

/* ── 配对页 / 吐司 ───────────────────────────────────── */
.gate { position: fixed; inset: 0; background: var(--bg); display: flex; align-items: center; justify-content: center; z-index: 60; padding: 20px; }
.gate .box { width: min(420px, 100%); background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; }
.gate h1 { margin: 0 0 6px; font-size: 18px; }
.gate .code { font-family: var(--mono); font-size: 13px; color: var(--dim); margin: 8px 0 14px; }

.toasts { position: fixed; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 8px; z-index: 70; max-width: 92vw; }
/* 空的提示容器不许占位：没错误时右下角那圈孤零零的边框就是它露出来的（用户实拍要求彻底隐藏） */
.toasts:empty { display: none; }
/* 跟随底部松开时露出来的「回到底部」：右侧小圆钮、只有图标、半透明。
   纵向位置由 JS 贴在输入框上方（实测写死 bottom 会压在输入行上盖住输入框）。 */
.to-bottom {
  position: fixed; right: 12px; bottom: 96px; z-index: 71;
  width: 38px; height: 38px; min-height: 38px; padding: 0;
  display: grid; place-items: center;
  font-size: 17px; line-height: 1;
  background: rgba(30, 33, 40, 0.55); color: var(--text);
  border: 1px solid var(--accent); border-radius: 50%; cursor: grab;
  opacity: 0.72; backdrop-filter: blur(2px);
  touch-action: none;   /* 支持拖拽换位：别让浏览器把拖动当页面滚动 */
}
.to-bottom:active { cursor: grabbing; }
.to-bottom:hover, .to-bottom:focus-visible { opacity: 1; }
.toast { border: 1px solid var(--line); background: var(--panel); border-radius: 10px; padding: 10px 12px; font-size: 13px; }
.toast.ok { border-color: var(--ok); }
.toast.err { border-color: var(--err); }

.spin { display: inline-block; width: 12px; height: 12px; border: 2px solid var(--line); border-top-color: var(--highlight); border-radius: 50%; animation: r .8s linear infinite; }
@keyframes r { to { transform: rotate(360deg); } }

/* 连接器行在小屏换行；高级字段收进 details */
.conn-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.conn-head .grow { flex: 1; min-width: 140px; }
details.adv { border-top: 1px dashed var(--line); margin-top: 8px; padding-top: 8px; }
details.adv > summary { min-height: 36px; cursor: pointer; color: var(--muted); font-size: 13px; }

@media (max-width: 860px) {
  .grid2, .grid3 { grid-template-columns: 1fr; }
  .row > label:first-child { flex: 1 1 100%; }
  /* 密钥这类「框 + 框右按钮」的行在手机上：label 独占一行，第二行才是框 + 按钮（不换行会把按钮顶出屏幕） */
  .row.pairrow { flex-wrap: wrap; }
  .topbar { flex-wrap: wrap; }
  .topbar nav { order: 3; width: 100%; }
  .tab { flex: 1; min-height: 44px; }
  /* 手机上的顶栏动作键是点得最多的控件：整行铺开后抬到拇指点得准的尺寸（原来 36px 太矮） */
  .topbar nav { row-gap: 6px; }
  .topbar nav .btn { flex: 1; min-height: 44px; font-size: 14px; }
  /* 会话页快捷条与状态芯片同理：加高到 44 / 40px，字号抬一档 */
  .statusbar { row-gap: 6px; }
  .statusbar .btn { flex: 1; min-height: 44px; font-size: 14px; }
  .btn .full { display: none; }
  .btn .short { display: inline; }
  .chip { min-height: 40px; padding: 8px 12px; font-size: 13px; }
  .chip code { font-size: 12px; }
  /* 配置页在手机上：输入框/下拉/按钮都抬到 44px，字号 16px（iOS 聚焦不缩放） */
  input, select, textarea { min-height: 44px; font-size: 16px; }
  .row .btn, .card .btn { min-height: 44px; }
  /* 待批卡六个裁决按钮在 .item 里，上面两条盖不到：手机上必须够点 */
  .pending .btn, dialog .btn { min-height: 44px; font-size: 14px; }
  .prof-row { min-height: 44px; }
  .wrap { padding: 10px; }
  .stream { padding: 10px; }
  .composer { padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); }
  .composer .send { min-width: 64px; }
}

@media (hover: none) {
  .btn:hover { background: var(--panel-2); }
  .btn.primary:hover { background: var(--accent); }
  .tab:hover { background: transparent; }
  .act[data-group="1"] > header:active { background: var(--surface-hover); }
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001s !important; transition-duration: .001s !important; }
}