/* ============================================================
   KNS大雄 · 主界面样式 v2（对齐 QClaw 那种版式）
   只覆盖「登录后」的界面；登录页仍用 style.css，不动。
   加载顺序：style.css → app-shell.css（后者覆盖前者）
   ============================================================ */

:root {
  --bg: #f7f7f8;
  --panel: #ffffff;
  --line: #ececf0;
  --line-2: #e6e7eb;
  --ink: #16181d;
  --ink-2: #3d4450;
  --ink-3: #6b7280;
  --ink-4: #9aa1ab;
  --hover: #ececef;
  --brand: #1a7f5a;
  --brand-soft: #e8f4ee;
}

body {
  background: var(--bg);
}

.app {
  display: flex;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
}

/* ---------------- 侧栏 ---------------- */
.sidebar {
  width: 238px;
  flex: 0 0 238px;
  background: var(--bg);
  border-right: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  padding: 10px 10px 8px;
  gap: 2px;
}

.side-head {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 4px 4px 13px;
  position: relative;      /* 品牌下拉菜单要相对它定位 */
}

/* ---------------- 左上角品牌按钮 + 设置菜单（2026-10-30）----------------
   老板：「左上角大雄图标那里是不是该有软件设置的选项？版本信息、检查更新放那儿，
   常规设置也该有一些」—— 常规软件都这样，点 logo/版本号出「关于/设置/退出」。 */
.brand-btn {
  flex: 1 1 auto; min-width: 0;
  display: flex; align-items: flex-start; gap: 9px;
  border: 0; background: transparent; padding: 0; margin: 0;
  font-family: inherit; text-align: left; cursor: pointer; border-radius: 10px;
  transition: background .14s;
}
.brand-btn:hover { background: #f2f4f5; }
.brand-btn:hover .brand-caret { color: #6b7280; }
.brand-caret { flex: 0 0 auto; margin-top: 8px; color: #c2c7cc; transition: color .14s; }
.brand-txt { display: flex; flex-direction: column; min-width: 0; }

.brand-drop {
  position: absolute; left: 4px; top: calc(100% - 4px); z-index: 70;
  width: 232px; padding: 6px;
  background: #fff; border: 1px solid #e6e8eb; border-radius: 12px;
  box-shadow: 0 12px 32px rgba(16, 40, 32, .14);
}
.bd-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  padding: 8px 10px 9px; font-size: 12px; color: var(--ink-2);
}
.bd-head b { font-weight: 650; }
.bd-head span { font-size: 11px; color: var(--ink-4); font-variant-numeric: tabular-nums; }
.bd-item {
  display: flex; align-items: center; gap: 9px; width: 100%;
  padding: 8px 10px; border: 0; border-radius: 8px; background: transparent;
  font-family: inherit; font-size: 12.5px; color: var(--ink-1);
  text-align: left; cursor: pointer; text-decoration: none; position: relative;
}
.bd-item:hover { background: #f3f5f6; }
.bd-item svg { flex: 0 0 13px; color: #7b8794; }
.bd-sep { height: 1px; margin: 5px 8px; background: #eef0f2; }
.bd-dot {
  position: absolute; right: 10px; top: 50%; margin-top: -3px;
  width: 6px; height: 6px; border-radius: 50%; background: #e0473c;
}

/* 绿底圆角徽标：跟品牌主视觉一致（logo_head 是透明猫头，单独放没有底色太单薄） */
.side-logo {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  border-radius: 9px;
  object-fit: contain;
  box-shadow: 0 2px 7px rgba(26, 127, 90, .22);
}

/* 名字 + 英文 + 版本，竖着三行放一起，避免同一屏里出现两次品牌名 */
.brand-txt {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  padding-top: 1px;
  line-height: 1.25;
}

.side-name {
  font-size: 14px;
  font-weight: 680;
  color: var(--ink);
  letter-spacing: .2px;
  white-space: nowrap;
}

.brand-en {
  font-size: 8px;
  font-weight: 500;
  letter-spacing: .55px;
  color: var(--ink-4);
  white-space: nowrap;
  margin-top: 1px;
}

.side-tools {
  margin-left: auto;
  display: flex;
  gap: 2px;
}

.icon-btn {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: none;
  background: transparent;
  color: var(--ink-3);
  border-radius: 8px;
  cursor: pointer;
  font-size: 12.5px;
  padding: 0 6px;
}
.icon-btn:hover { background: var(--hover); color: var(--ink-2); }
.icon-btn svg { width: 16px; height: 16px; }

/* 导航 */
.side-nav {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding-bottom: 8px;
}

.nav-item {
  display: flex;
  align-items: center;
  gap: 9px;
  height: 34px;
  padding: 0 9px;
  border: none;
  background: transparent;
  border-radius: 9px;
  font-size: 13.5px;
  color: var(--ink-2);
  cursor: pointer;
  text-align: left;
  text-decoration: none;
  font-family: inherit;
}
.nav-item:hover { background: var(--hover); }
.nav-item svg {
  width: 17px; height: 17px; flex: 0 0 auto;
  stroke: currentColor; fill: none;
  stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round;
  color: #5b6270;
}
.nav-item:hover svg { color: var(--ink-2); }

.nav-badge {
  margin-left: auto;
  background: #e9eaee;
  color: var(--ink-3);
  font-size: 11px;
  line-height: 16px;
  padding: 0 6px;
  border-radius: 8px;
}

/* 对话分组 */
.side-group {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding-top: 4px;
  border-top: 1px solid var(--line);
}

.group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11.5px;
  color: var(--ink-4);
  padding: 8px 9px 6px;
  letter-spacing: .3px;
}
.group-head button {
  border: none; background: transparent; color: var(--ink-4);
  cursor: pointer; font-size: 13px; line-height: 1; padding: 2px 4px; border-radius: 6px;
}
.group-head button:hover { background: var(--hover); color: var(--ink-2); }

.conv-list {
  flex: 1 1 auto;
  overflow-y: auto;
  padding-bottom: 6px;
}

.conv-item {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 9px;
  border-radius: 8px;
  font-size: 13px;
  color: var(--ink-2);
  cursor: pointer;
  margin-bottom: 1px;
}
.conv-item span {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.conv-item:hover { background: var(--hover); }
.conv-item.active { background: #e7e8ec; color: var(--ink); font-weight: 500; }
.conv-item .del {
  border: none; background: transparent; color: var(--ink-4);
  font-size: 14px; line-height: 1; cursor: pointer;
  opacity: 0; padding: 0 2px; border-radius: 4px;
}
.conv-item:hover .del { opacity: 1; }
.conv-item .del:hover { color: #c0392b; }

/* 知识库面板 */
.kb-panel {
  border-top: 1px solid var(--line);
  padding: 8px 2px 4px;
  max-height: 40vh;
  overflow-y: auto;
}
.kb-panel.hidden { display: none; }

/* 底部用户 */
.side-foot {
  border-top: 1px solid var(--line);
  padding-top: 6px;
}

.user-card {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 6px;
  border-radius: 10px;
  text-decoration: none;
  cursor: pointer;
}
.user-card:hover { background: var(--hover); }

.user-avatar {
  width: 26px; height: 26px;
  border-radius: 50%;
  object-fit: contain;
  background: var(--brand-soft);
  padding: 2px;
  flex: 0 0 auto;
}

.user-meta { display: flex; flex-direction: column; min-width: 0; }

.user-chip, .user-name {
  font-size: 13px;
  color: var(--ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0;
  background: transparent;
  border: none;
}
.user-chip.hidden, .user-name.hidden { display: none; }

.user-sub { font-size: 11px; color: var(--ink-4); }

/* ---------------- 主区 ---------------- */
.main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  background: var(--panel);
}

.topbar {
  height: 52px;
  flex: 0 0 52px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 18px;
  border-bottom: 1px solid #f3f3f6;
  background: var(--panel);
}

.tabs {
  display: inline-flex;
  gap: 2px;
  background: #f2f2f4;
  border-radius: 10px;
  padding: 3px;
}

.tab-pill {
  height: 27px;
  padding: 0 14px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--ink-3);
  font-size: 13px;
  font-family: inherit;
  cursor: pointer;
}
.tab-pill:hover { color: var(--ink-2); }
.tab-pill.active {
  background: #fff;
  color: var(--ink);
  font-weight: 500;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .07);
}

.topbar-right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}

.status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--ink-4);
}

.status .dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: #37b26a;
  box-shadow: 0 0 0 3px rgba(55, 178, 106, .13);
}

/* 消息区 */
.messages {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 20px 24px 8px;
  scroll-behavior: smooth;
}

.msg {
  max-width: 760px;
  margin: 0 auto 22px;
  display: flex;
  gap: 10px;
}

.msg .avatar { display: none; }

.msg .bubble {
  max-width: 100%;
  min-width: 0;
}

.msg .role {
  font-size: 12px;
  color: var(--ink-4);
  margin-bottom: 5px;
}

.msg .content {
  font-size: 14.5px;
  line-height: 1.75;
  color: var(--ink);
  word-break: break-word;
}

.msg .content p { margin: 0 0 10px; }
.msg .content p:last-child { margin-bottom: 0; }
.msg .content h3 {
  font-size: 15.5px;
  font-weight: 650;
  margin: 18px 0 8px;
  color: var(--ink);
}
.msg .content ul, .msg .content ol { margin: 0 0 12px; padding-left: 20px; }
.msg .content li { margin: 4px 0; }
.msg .content strong { font-weight: 650; }
.msg .content code {
  background: #f4f4f6;
  padding: 1px 5px;
  border-radius: 5px;
  font-size: 13px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.msg .content pre {
  background: #f7f7f9;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
  overflow-x: auto;
  margin: 0 0 12px;
}
.msg .content pre code { background: none; padding: 0; font-size: 12.5px; }
.msg .content table { width: 100%; border-collapse: collapse; margin: 0 0 12px; font-size: 13.5px; }
.msg .content th, .msg .content td {
  border: 1px solid var(--line);
  padding: 7px 10px;
  text-align: left;
}
.msg .content th { background: #fafafa; font-weight: 600; }

/* 用户消息：右侧浅底气泡，无头像 */
.msg.user { justify-content: flex-end; }
.msg.user .bubble {
  flex: 0 1 auto;
  background: #f4f4f6;
  border-radius: 14px;
  padding: 9px 14px;
  max-width: 76%;
}
.msg.user .role { display: none; }
.msg.user .content { font-size: 14px; }

/* 欢迎区 */
.welcome {
  max-width: 760px;
  margin: 6vh auto 0;
  text-align: left;
}

.welcome h1 {
  font-size: 26px;
  font-weight: 650;
  color: var(--ink);
  margin: 0 0 8px;
  letter-spacing: .2px;
}

.welcome > p {
  font-size: 14px;
  color: var(--ink-3);
  margin: 0 0 26px;
  line-height: 1.7;
}

.preset-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.preset {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 13px 15px;
  border: 1px solid var(--line-2);
  background: #fff;
  border-radius: 12px;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}
.preset:hover { background: #fafafb; border-color: #d9dbe1; }
.preset-t { font-size: 13.5px; color: var(--ink); font-weight: 500; }
.preset-d { font-size: 12px; color: var(--ink-4); }

/* ---------------- 输入区 ---------------- */
.composer {
  flex: 0 0 auto;
  padding: 8px 24px 12px;
  background: var(--panel);
}

.composer-card {
  max-width: 760px;
  margin: 0 auto;
  border: 1px solid var(--line-2);
  border-radius: 16px;
  background: #fff;
  padding: 10px 10px 7px;
  box-shadow: 0 1px 3px rgba(16, 24, 40, .045);
  transition: border-color .15s, box-shadow .15s;
}
.composer-card:focus-within {
  border-color: #ccd0d7;
  box-shadow: 0 2px 8px rgba(16, 24, 40, .07);
}

.composer-card textarea {
  width: 100%;
  border: none;
  outline: none;
  resize: none;
  background: transparent;
  font-family: inherit;
  font-size: 14.5px;
  line-height: 1.65;
  color: var(--ink);
  padding: 4px 6px 6px;
  max-height: 190px;
  overflow-y: auto;
}
.composer-card textarea::placeholder { color: #a8adb6; }

.composer-tools {
  display: flex;
  align-items: center;
  gap: 4px;
  padding-top: 2px;
}

.tools-left { display: flex; align-items: center; gap: 2px; }
.tools-right { margin-left: auto; display: flex; align-items: center; gap: 8px; }

.tool-icon {
  width: 30px; height: 30px;
  display: grid; place-items: center;
  border: none; background: transparent;
  border-radius: 9px;
  color: var(--ink-3);
  cursor: pointer;
  padding: 0;
}
.tool-icon:hover { background: #f3f3f5; color: var(--ink-2); }
.tool-icon svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 1.7; }

/* 模型下拉：隐形边框，hover 才露 */
.model-select {
  border: none;
  background: transparent;
  font-family: inherit;
  font-size: 12.5px;
  color: var(--ink-2);
  padding: 5px 6px;
  border-radius: 8px;
  cursor: pointer;
  max-width: 200px;
  outline: none;
}
.model-select:hover { background: #f3f3f5; }

/* 参考知识库开关 */
.kb-switch {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12.5px;
  color: var(--ink-3);
  cursor: pointer;
  user-select: none;
}
.kb-switch input { accent-color: var(--brand); width: 13px; height: 13px; cursor: pointer; }

/* 多端：设备改名（铅笔 → 原地变输入框） */
.dev-edit {
  width: 18px; height: 18px; padding: 0;
  border: none; border-radius: 5px;
  background: transparent; color: var(--ink-3);
  display: grid; place-items: center; cursor: pointer;
  flex: none;
}
.dev-edit:hover { color: var(--brand); background: var(--brand-soft); }
.dev-edit svg { width: 13px; height: 13px; }
/* 输入框的选择器必须带 .dev-switch：
   上面那条 `.kb-switch input { width:13px; height:13px }` 是给复选框写的，
   特异性 .kb-switch input(0,1,1) 压得住单独的 .dev-name(0,1,0) ——
   第一版就是这样被压成 14×13 的正方小块，肉眼几乎看不见。 */
.dev-switch input.dev-name {
  width: 118px; height: 22px; box-sizing: border-box;
  font-size: 12px; font-family: inherit; color: inherit;
  border: 1px solid var(--brand); border-radius: 6px;
  padding: 0 6px; outline: none; background: #fff;
  cursor: text;
}
.dev-toast {
  position: fixed; left: 50%; bottom: 96px;
  transform: translateX(-50%) translateY(8px);
  background: #1f2430; color: #fff; font-size: 12.5px;
  padding: 7px 14px; border-radius: 8px;
  opacity: 0; pointer-events: none;
  transition: opacity .18s, transform .18s;
  z-index: 9999;
}
.dev-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

.btn-send {
  width: 32px; height: 32px;
  border: none;
  border-radius: 50%;
  background: var(--brand);
  color: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
  transition: background .15s, transform .1s;
}
.btn-send:hover { background: #166b4c; }
.btn-send:active { transform: scale(.94); }
.btn-send:disabled { background: #e6e7eb; color: #a8adb6; cursor: default; }
.btn-send svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.hint {
  max-width: 760px;
  margin: 7px auto 0;
  text-align: center;
  font-size: 11.5px;
  color: #a8adb6;
}

/* 细滚动条 */
.messages::-webkit-scrollbar, .conv-list::-webkit-scrollbar,
.kb-panel::-webkit-scrollbar { width: 8px; }
.messages::-webkit-scrollbar-thumb, .conv-list::-webkit-scrollbar-thumb,
.kb-panel::-webkit-scrollbar-thumb {
  background: #dcdde2; border-radius: 8px;
}
.messages::-webkit-scrollbar-thumb:hover { background: #c9cbd2; }

/* 窄屏：侧栏收成图标条 */
@media (max-width: 860px) {
  .sidebar { width: 62px; flex-basis: 62px; padding: 10px 8px 8px; }
  .side-name, .nav-item span:not(.nav-badge), .group-head, .user-meta, .conv-list { display: none; }
  .side-nav .nav-item { justify-content: center; padding: 0; }
  .brand-txt { display: none; }
  .side-head { justify-content: center; padding-bottom: 10px; }
  .side-logo { width: 30px; height: 30px; flex: 0 0 30px; }
  .messages, .composer { padding-left: 14px; padding-right: 14px; }
}

/* --- 覆盖旧风格残留（style.css 里的同类选择器） --- */
.msg { padding: 0; }
.welcome { padding: 0; }
.msg .bubble { padding-top: 0; }
.upload-box {
  display: block; text-align: center; font-size: 12.5px; color: var(--ink-3);
  border: 1px dashed #d6d8de; border-radius: 10px; padding: 12px 8px;
  cursor: pointer; margin: 0 4px 8px;
}
.upload-box:hover { border-color: #b9bcc5; color: var(--ink-2); background: #fafafb; }
.kb-list { font-size: 12.5px; color: var(--ink-3); padding: 0 4px; }
.kb-list .kb-row { display: flex; align-items: center; gap: 6px; padding: 4px 0; }


/* ---------- 主区内嵌视图（工作区 / 连接中心） ---------- */
.embed-view {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.embed-view.hidden { display: none; }
.embed-bar {
  flex: 0 0 42px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 16px;
  border-bottom: 1px solid #f3f3f6;
  font-size: 13px;
  color: var(--ink-3);
}
.embed-bar span { font-weight: 500; color: var(--ink-2); }
.embed-bar #embedOpen { margin-left: auto; }
.embed-view iframe {
  flex: 1 1 auto;
  width: 100%;
  border: 0;
  background: var(--panel);
}


/* ---------------- 侧栏账号菜单（对齐企微） ---------------- */
.side-foot { position: relative; }
.user-card {
  width: 100%;
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.user-chev {
  margin-left: auto;
  width: 14px; height: 14px;
  flex: 0 0 auto;
  fill: none;
  stroke: var(--ink-4);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .16s ease;
}
.user-card[aria-open="1"] .user-chev { transform: rotate(180deg); }

.user-menu {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: calc(100% + 8px);
  background: #fff;
  border: 1px solid #e8e9ee;
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(16, 24, 40, .13), 0 2px 6px rgba(16, 24, 40, .06);
  padding: 6px;
  z-index: 60;
}
.user-menu.hidden { display: none; }

.um-head {
  display: flex; align-items: center; gap: 9px;
  padding: 9px 8px 10px;
  border-bottom: 1px solid #f2f3f6;
  margin-bottom: 5px;
}
.um-head .user-avatar.lg {
  width: 34px; height: 34px;
  background: var(--brand-soft);
}
.um-id { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.um-id b { font-size: 13.5px; font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.um-id small { font-size: 11.5px; color: var(--ink-4); }

.um-item {
  display: flex; align-items: center; gap: 9px;
  width: 100%;
  padding: 8px 9px;
  border: 0; border-radius: 8px;
  background: transparent;
  color: var(--ink-2);
  font: inherit; font-size: 13px;
  text-align: left;
  cursor: pointer;
  text-decoration: none;
}
.um-item:hover { background: #f4f5f8; color: var(--ink); }
.um-item.hidden { display: none; }
.um-item svg {
  width: 16px; height: 16px; flex: 0 0 auto;
  fill: none; stroke: currentColor;
  stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;
  color: #6b7280;
}
.um-item span { flex: 0 0 auto; }
.um-item small {
  margin-left: auto;
  font-size: 11px; color: var(--ink-4);
  white-space: nowrap;
}
.um-item.danger { color: #b42318; }
.um-item.danger:hover { background: #fef3f2; }
.um-item.danger svg { color: #d92d20; }
.um-sep { height: 1px; background: #f2f3f6; margin: 5px 4px; }


/* ---------------- 登录页：验证码 + 自动出码 ---------------- */
.code-field {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.code-field input { flex: 1 1 auto; min-width: 0; }
.code-btn {
  flex: 0 0 auto;
  padding: 0 14px;
  border: 1px solid #d8dbe2;
  border-radius: 10px;
  background: #fff;
  color: #1a7f5a;
  font: inherit;
  font-size: 13px;
  white-space: nowrap;
  cursor: pointer;
  transition: background .15s, border-color .15s;
}
.code-btn:hover:not(:disabled) { background: #f3f8f6; border-color: #b9cfc7; }
.code-btn:disabled { color: #9aa1ab; cursor: default; background: #f6f7f9; }

.qr-auto {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 16px;
  border: 1px solid #e7e9ee;
  border-radius: 12px;
  background: #fafbfc;
  margin-bottom: 14px;
}
.qr-spin {
  width: 34px; height: 34px;
  flex: 0 0 auto;
  border-radius: 50%;
  border: 3px solid #dfe6e3;
  border-top-color: #1a7f5a;
  animation: qrspin .9s linear infinite;
}
@keyframes qrspin { to { transform: rotate(360deg); } }
.qr-txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.qr-txt strong { font-size: 14px; color: #1f2430; font-weight: 600; }
.qr-txt span { font-size: 12px; color: #8a9099; }

.wx-btn.wx-fallback {
  background: #fff;
  color: #4b5563;
  border: 1px solid #e2e4ea;
  font-size: 13px;
  padding: 9px 12px;
}
.wx-btn.wx-fallback:hover { background: #f7f8fa; }

/* 手机端这一屏的主操作就是「用企业微信打开」，别做成灰白次要按钮 */
@media (max-width: 640px) {
  .wx-btn.wx-fallback {
    background: #12805c;
    color: #fff;
    border-color: #12805c;
    font-size: 15px;
    font-weight: 600;
    padding: 11px 14px;
  }
  .wx-btn.wx-fallback:hover,
  .wx-btn.wx-fallback:active { background: #0f6e4f; }
}


/* 登录主按钮换成品牌绿（原来那版是蓝色，跟品牌不搭） */
.login-btn {
  background: #12805c !important;
  border-color: #12805c !important;
}
.login-btn:hover:not(:disabled) { background: #0f6e4f !important; border-color: #0f6e4f !important; }
.login-btn:disabled { opacity: .7; }


/* ---------------- 登录框内的企微二维码（内嵌，不跳页） ---------------- */
.qr-frame {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 250px;
  padding: 18px 12px 14px;
  margin-bottom: 12px;
  border: 1px solid #e9ebf0;
  border-radius: 12px;
  background: #fcfdfd;
  overflow: hidden;
}
.qr-img {
  width: 200px;
  height: 200px;
  display: block;
  image-rendering: -webkit-optimize-contrast;
}
.qr-img:not([src]) { visibility: hidden; }
.qr-tip {
  font-size: 12.5px;
  color: #8a9099;
  text-align: center;
  line-height: 1.5;
  cursor: default;
}
.qr-loading {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: #fcfdfd;
  font-size: 12.5px;
  color: #8a9099;
  z-index: 2;
}
.qr-loading.hidden { display: none; }
.qr-loading .qr-spin { width: 26px; height: 26px; border-width: 2.5px; }

/* 手机端：这张码是能点的（点了调起企业微信），手指得看得出来 */
.qr-img { cursor: pointer; transition: opacity .15s; }
.qr-img:active { opacity: .78; }
.qr-save {
  display: block;
  margin: 0 auto 2px;
  padding: 7px 16px;
  font: inherit;
  font-size: 12.5px;
  line-height: 1.2;
  color: #0f6e4f;
  background: #f2fbf7;
  border: 1px dashed #b7e2cf;
  border-radius: 999px;
  cursor: pointer;
}
.qr-save.hidden { display: none; }
.qr-save:active { transform: scale(.97); }


/* ---------------- 输入框上方的附件条 ---------------- */
.att-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 12px 2px;
}
.att-list.hidden { display: none; }
.att-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 240px;
  padding: 5px 8px 5px 5px;
  border: 1px solid #e6e8ee;
  border-radius: 10px;
  background: #fafbfc;
}
.att-chip img {
  width: 34px;
  height: 34px;
  object-fit: cover;
  border-radius: 7px;
  flex: 0 0 auto;
}
.att-ico {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  border-radius: 7px;
  background: #eef1f5;
  color: #6b7280;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: .3px;
}
.att-meta {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.3;
}
.att-meta b {
  font-size: 12.5px;
  font-weight: 500;
  color: #374151;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.att-meta i {
  font-style: normal;
  font-size: 11px;
  color: #9ca3af;
}
.att-del {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  line-height: 16px;
  text-align: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #9ca3af;
  font-size: 14px;
  cursor: pointer;
}
.att-del:hover { background: #eef0f3; color: #6b7280; }

/* ---------------- Agent 工具调用卡片 ---------------- */
.agent-switch span { color: var(--brand); font-weight: 600; }

.tool-card {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 6px 0;
  padding: 7px 11px;
  border: 1px solid var(--line-2);
  border-radius: 10px;
  background: #fbfcfc;
  font-size: 12.5px;
  color: var(--ink-3);
  max-width: 100%;
  overflow: hidden;
}
.tool-card .tc-ico {
  width: 17px; height: 17px;
  flex: 0 0 17px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--brand-soft);
  color: var(--brand);
  font-size: 11px;
  line-height: 1;
}
.tool-card .tc-name { color: var(--ink-2); font-weight: 600; flex: 0 0 auto; }
.tool-card .tc-arg {
  color: var(--ink-4);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1 1 auto;
}
.tool-card .tc-state { color: var(--ink-4); flex: 0 0 auto; font-variant-numeric: tabular-nums; }
.tool-card.ok .tc-ico { background: var(--brand-soft); color: var(--brand); }
.tool-card.ok .tc-state { color: var(--brand); }
.tool-card.warn { border-color: #f0d9c8; background: #fdf7f2; }
.tool-card.warn .tc-ico { background: #fbe9dc; color: #b96a2c; }
.tool-card.warn .tc-state { color: #b96a2c; }

/* 计划清单：多步任务时显示"要走几步、走到哪了" */
.plan-card {
  margin: 8px 0;
  padding: 10px 12px 8px;
  border: 1px solid var(--line-2);
  border-radius: 12px;
  background: #fbfcfc;
}
.plan-card .pc-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
  margin-bottom: 6px;
}
.plan-card .pc-count {
  color: var(--ink-4);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.plan-card .pc-item {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  padding: 3px 0;
  font-size: 12.8px;
  line-height: 1.5;
  color: var(--ink-2);
}
.plan-card .pc-box {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin-top: 1px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-2);
  border-radius: 50%;
  font-size: 10px;
  color: var(--ink-4);
  background: #fff;
}
.plan-card .pc-item.done .pc-box {
  border-color: var(--brand);
  background: var(--brand-soft);
  color: var(--brand);
}
.plan-card .pc-item.done .pc-txt { color: var(--ink-4); text-decoration: line-through; }
.plan-card .pc-txt { flex: 1 1 auto; word-break: break-word; }

.file-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 2px; }
.file-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 11px;
  border: 1px solid var(--line-2);
  border-radius: 999px;
  background: #fff;
  color: var(--ink-2);
  font-size: 12.5px;
  text-decoration: none;
}
.file-chip:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }

.notice {
  margin: 6px 0;
  font-size: 12px;
  color: var(--ink-4);
}

/* ---------------- 知识库：语义索引状态 ---------------- */
.kb-semantic {
  margin: 0 4px 8px;
  padding: 7px 9px;
  border-radius: 9px;
  background: #f7f8f8;
  border: 1px solid var(--line);
  font-size: 11.5px;
  line-height: 1.55;
  color: var(--ink-3);
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.kb-semantic:empty { display: none; }
.kb-sem-on { color: var(--brand); font-weight: 600; }
.kb-sem-off { color: var(--ink-4); }
.kb-sem-run { color: var(--brand); }
.kb-sem-btn {
  margin-left: auto;
  border: 1px solid var(--line-2);
  background: #fff;
  color: var(--ink-2);
  border-radius: 7px;
  font-size: 11px;
  padding: 2px 8px;
  cursor: pointer;
  font-family: inherit;
}
.kb-sem-btn:hover { border-color: var(--brand); color: var(--brand); }
.kb-sem-btn:disabled { opacity: .5; cursor: default; }

/* 每篇文档的索引状态点 */
.kb-item span { flex: 1 1 auto; }
.kb-item .kb-dot {
  flex: 0 0 auto;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #d8dae0;
}
.kb-item .kb-dot.on { background: var(--brand); }
.kb-item button { margin-left: 2px; }

/* ---------------- 语音按钮（录音中变红 + 呼吸） ---------------- */
.mic-btn.rec {
  background: #e5484d !important;
  color: #fff !important;
  border-color: #e5484d !important;
  animation: micPulse 1.2s ease-in-out infinite;
}
.mic-btn.rec svg { stroke: #fff; }
@keyframes micPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(229, 72, 77, .45); }
  50%      { box-shadow: 0 0 0 6px rgba(229, 72, 77, 0); }
}
.mic-btn:disabled { opacity: .5; cursor: default; }

/* ---------------- 版本行 + 更新记录弹窗 ---------------- */
.ver-line {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 1px 0 0;
  margin: 0;
  border: 0;
  background: transparent;
  color: var(--ink-4);
  font-size: 9.5px;
  font-variant-numeric: tabular-nums;
  letter-spacing: .2px;
  font-family: inherit;
  cursor: pointer;
  text-align: left;
}
.ver-line:hover { color: var(--brand); }
.ver-dot {
  width: 5px; height: 5px;
  border-radius: 50%;
  background: #e8890c;
  box-shadow: 0 0 0 2px rgba(232, 137, 12, .16);
}
.ver-line.new { color: #b96a2c; font-weight: 600; }

.ver-modal { position: fixed; inset: 0; z-index: 900; display: grid; place-items: center; }
.ver-modal.hidden { display: none; }
.ver-mask { position: absolute; inset: 0; background: rgba(16, 22, 26, .38); backdrop-filter: blur(2px); }
.ver-card {
  position: relative;
  width: min(560px, calc(100vw - 32px));
  max-height: min(76vh, 640px);
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 22px 60px rgba(16, 22, 26, .22);
  overflow: hidden;
  animation: verIn .18s ease-out;
}
@keyframes verIn { from { opacity: 0; transform: translateY(8px) scale(.985); } }
.ver-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 18px 12px;
  border-bottom: 1px solid var(--line);
}
.ver-head b { font-size: 15px; }
.ver-cur {
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--brand-soft);
  color: var(--brand);
  font-size: 11.5px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.ver-x {
  border: 0; background: transparent;
  font-size: 22px; line-height: 1;
  color: var(--ink-4); cursor: pointer;
  padding: 2px 6px; border-radius: 8px;
  font-family: inherit;
}
.ver-x:hover { background: #f3f4f5; color: var(--ink-2); }
.ver-body { padding: 6px 18px 18px; overflow-y: auto; }
/* 客户端版本 + 更新状态区（2026-10-29）
   版式照成熟软件（WorkBuddy / VS Code 一路）：标题 50% + 详情 70% + 6px 圆头进度条 + 主次按钮。
   拿不到百分比时用「来回扫」的不确定态，不留一根死条。 */
.ver-shell {
  display: flex; align-items: center; gap: 12px;
  margin: 0 18px; padding: 11px 13px;
  background: #f7f8f9; border: 1px solid var(--line); border-radius: 11px;
}
.ver-shell.hidden { display: none; }
.ver-shell .su-body { min-width: 0; flex: 1 1 auto; }
.ver-shell .su-title {
  font-size: 13px; font-weight: 600;
  color: rgba(0, 0, 0, .5);          /* 标题压淡，让详情更清楚 */
  line-height: 1.35;
}
.ver-shell .su-detail {
  margin-top: 2px;
  font-size: 12.5px; color: rgba(0, 0, 0, .7);
  font-variant-numeric: tabular-nums;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ver-shell .su-track {
  position: relative; height: 6px; margin-top: 9px;
  border-radius: 96px; background: #eceef1; overflow: hidden;
}
.ver-shell .su-fill {
  height: 100%; width: 0; border-radius: 96px;
  background: var(--brand); transition: width 200ms ease-out;
}
/* 不确定态：拿不到百分比时（检查中 / 下载中）来回扫动 */
.ver-shell .su-track[data-indeterminate="true"] .su-fill {
  width: 30%; transition: none;
  animation: su-sweep 1.4s ease-in-out infinite;
}
@keyframes su-sweep {
  0%   { transform: translateX(-100%); }
  50%  { transform: translateX(233%); }
  100% { transform: translateX(-100%); }
}
.ver-shell .su-btn {
  flex: 0 0 auto;
  padding: 6px 14px; border-radius: 8px;
  font-size: 12.5px; font-weight: 600; font-family: inherit; cursor: pointer;
  border: 1px solid transparent;
}
.ver-shell .su-btn.primary { background: var(--brand); color: #fff; }
.ver-shell .su-btn.primary:hover { filter: brightness(1.07); }
.ver-shell .su-btn.ghost {
  background: #fff; color: var(--ink-2); border-color: #dedede;
}
.ver-shell .su-btn.ghost:hover { background: #f7f7f7; }
.ver-shell .su-btn.ghost:active { background: #f2f2f2; }
.ver-shell .su-btn:disabled { opacity: .55; cursor: default; }
/* 版本列表（2026-10-30 改成折叠：一行一个版本，点开看细节） */
.ver-item { border-bottom: 1px solid var(--line); }
.ver-item:last-child { border-bottom: 0; }
/* 一行 = 左边可点展开的版本号 + 右边（仅当有新版时）一个「更新」按钮 */
.ver-item .vi-row { display: flex; align-items: center; gap: 8px; }
.ver-item .vi-top {
  display: flex; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0;
  padding: 12px 2px; border: 0; background: transparent;
  font: inherit; text-align: left; cursor: pointer; border-radius: 8px;
}
.ver-item .vi-upd {
  flex: 0 0 auto; border: 0; border-radius: 8px; cursor: pointer;
  background: var(--brand); color: #fff; font: inherit;
  font-size: 12px; font-weight: 600; padding: 5px 13px;
}
.ver-item .vi-upd:hover { filter: brightness(1.07); }
.ver-item .vi-upd:disabled { opacity: .6; cursor: default; }
.ver-item .vi-top:hover { background: #f7f8f9; }
.ver-item .vi-ver { font-size: 13.5px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.ver-item .vi-date { margin-left: auto; font-size: 11.5px; color: var(--ink-4); font-variant-numeric: tabular-nums; }
.ver-item .vi-care { flex: 0 0 auto; color: #b6bcc3; transition: transform .16s; }
.ver-item.open .vi-care { transform: rotate(180deg); }
.ver-item .vi-new {
  font-size: 10.5px; font-weight: 600;
  padding: 1px 6px; border-radius: 5px;
  background: var(--brand); color: #fff;
}
/* 默认收起，点开才展开 */
.ver-item .vi-items { display: none; margin: 0 0 10px; padding-left: 17px; }
.ver-item.open .vi-items { display: block; }
.ver-item li { font-size: 12.5px; line-height: 1.72; color: var(--ink-3); }
.ver-item li b { color: var(--ink-1); font-weight: 600; }

/* ================= 手机端（PWA / 微信内打开） ================= */
/* 目标：iPhone / 安卓 / 鸿蒙 都能正常用，不用装 App。
   关键点：触控目标 ≥40px、输入框不能低于键盘、刘海屏留安全区。 */
@media (max-width: 640px) {
  html, body { height: 100%; }
  body {
    -webkit-text-size-adjust: 100%;
    overscroll-behavior-y: contain;
  }
  .app {
    height: 100vh;
    height: 100dvh;                     /* 手机浏览器地址栏收放不跳动 */
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
  }

  /* 侧栏收成 52px 图标条，把宽度让给内容 */
  .sidebar { width: 52px; flex-basis: 52px; padding: 8px 5px 6px; }
  .side-logo { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 8px; }
  .side-head { padding: 0 0 6px; justify-content: center; }
  .side-tools { display: none; }
  .nav-item { height: 42px; border-radius: 10px; }
  .nav-item svg { width: 19px; height: 19px; }
  .nav-badge { display: none; }
  .user-card { justify-content: center; padding: 4px 0; }
  .user-avatar { width: 26px; height: 26px; }
  .user-chev { display: none; }

  /* 主区 */
  .main { min-width: 0; }
  .topbar { height: 46px; padding: 0 10px; gap: 6px; }
  .topbar .title { font-size: 13.5px; }
  .messages { padding: 12px 10px 8px; }
  .msg .bubble { max-width: 100%; font-size: 14.5px; line-height: 1.72; }
  .msg.me .bubble { max-width: 86%; }

  /* 输入区：贴住安全区，按钮放大到手指能点 */
  .composer { padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); }
  .composer-box { border-radius: 14px; }
  #input, textarea#input { font-size: 16px !important; }   /* 16px 以下 iOS 会自动放大页面 */
  .tool-icon { width: 38px; height: 38px; }
  .send-btn { width: 42px; height: 42px; }

  /* 工具调用的卡片压缩一下 */
  .tool-card { font-size: 12px; padding: 6px 9px; }
  .tool-card .tc-arg { max-width: 40vw; }

  /* 弹层 */
  .ver-card { width: calc(100vw - 20px); max-height: 82vh; border-radius: 14px; }
  .ver-body { padding: 4px 14px 14px; }
  .user-menu { width: calc(100vw - 70px); left: 56px; }
}

/* 横屏手机 / 小屏平板 */
@media (max-width: 900px) and (max-height: 480px) {
  .topbar { height: 40px; }
  .messages { padding-top: 8px; }
  .welcome { padding: 10px 12px; }
}

/* ---------------- 输入框工具栏：左边能力开关，右边输入类工具 ----------------
 * 老板 2026-10-28 指定的排布：
 *   左：Agent / 联网 / 知识库 / 连接服务器
 *   右：模型 / 语音 / 附件 / 发送
 */
.composer-tools {
  flex-wrap: wrap;
  row-gap: 4px;
}
.tools-left {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.tools-right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 3px;
}
.tools-right .model-select { margin-right: 2px; }
.conn-btn { color: var(--ink-3); }
.conn-btn:hover { color: var(--brand); background: var(--brand-soft); }

/* 窄屏：两组各自换行也不挤 */
@media (max-width: 640px) {
  .composer-tools { gap: 2px; }
  .tools-left { gap: 3px; }
  .tools-left .kb-switch span { font-size: 11px; }
  .tools-right { gap: 1px; }
  .tools-right .model-select { max-width: 96px; font-size: 11.5px; }
  .dev-switch input.dev-name { width: 92px; }
  .dev-switch { margin-left: 4px; }   /* 手机上「知识库」和它贴太近 */
}

/* 登录卡片：文字不可选，只有输入框可选（2026-10-28）
   在手机号里按住往左右拖时，若卡片其他文字可选，选择范围会溢出到标题和按钮上，
   整片蓝底看着像「整个对话框都被选中了」。 */
.login-card { user-select: none; -webkit-user-select: none; }
.login-card input, .login-card textarea { user-select: text; -webkit-user-select: text; }

/* ---------------- 消息排队（2026-10-28 老板要的） ----------------
   正在生成时又发了几条 → 不丢、不顶掉，排在这儿。
   点一条就把它提到最前面，等当前这条答完立刻发它。 */
.queue-bar {
  display: flex; flex-direction: column; gap: 6px;
  padding: 0 max(16px, calc((100% - 780px) / 2)) 6px;
}
.queue-bar.hidden { display: none; }
.queue-head {
  font-size: 11.5px; color: #a16207; display: flex; align-items: center; gap: 6px;
  padding-left: 2px;
}
.queue-head b { font-weight: 600; }
.qitem {
  display: flex; align-items: center; gap: 9px;
  background: #fffbeb; border: 1px dashed #f3d9a4; border-radius: 10px;
  padding: 8px 11px; font-size: 12.5px; color: #7c5a1e; cursor: pointer;
  transition: background .15s, border-color .15s;
}
.qitem:hover { background: #fef6e0; border-color: #e8c07a; }
.qitem.now { background: #fff7e6; border-style: solid; border-color: #d97706; }
.qtext { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qtag {
  flex: none; font-size: 10.5px; padding: 1px 7px; border-radius: 999px;
  background: #fde9c4; color: #92400e;
}
.qkill {
  flex: none; width: 20px; height: 20px; line-height: 18px; text-align: center;
  border: none; background: transparent; color: #b08968; cursor: pointer;
  border-radius: 6px; font-size: 15px; padding: 0;
}
.qkill:hover { background: #f5e6c8; color: #92400e; }
/* 手机上贴边一点，别浪费宽度 */
@media (max-width: 820px) {
  .queue-bar { padding: 0 10px 5px; }
}

/* ================= 手机端第二版（2026-10-28 晚） =================
   老板原话：「手机端不是按照正常的手机 WorkBuddy 这种模式去搞的，
             它就是一个电脑端的一个压缩版，这个不适配。」
   上一版把侧栏压成 52px 图标条，等于把电脑版削窄 —— 占掉 13% 宽度，
   还全是只有图标没文字的按钮。这一版改成手机该有的样子：
     · 侧栏收进抽屉（功能一个不少，只是不常驻）
     · 常用入口放到底栏，拇指够得着
     · 顶部只留汉堡 + 两个 tab + 一个状态点
   桌面端完全不受影响（下面这些类在桌面上是 display:none）。 */
.side-burger,
.mobile-nav,
.side-mask { display: none; }

@media (max-width: 640px) {
  /* ---------------- 侧栏 → 抽屉 ---------------- */
  .side-mask {
    display: block;
    position: fixed; inset: 0; z-index: 910;
    background: rgba(15, 23, 42, .44);
    opacity: 0; pointer-events: none;
    transition: opacity .22s;
  }
  .side-mask.show { opacity: 1; pointer-events: auto; }

  .sidebar {
    position: fixed;
    top: 0; left: 0; bottom: 0;
    width: 84vw; max-width: 320px;
    flex-basis: auto;
    padding: 14px 12px calc(14px + env(safe-area-inset-bottom));
    background: #fff;
    z-index: 920;
    transform: translateX(-102%);
    transition: transform .24s cubic-bezier(.4, 0, .2, 1);
    box-shadow: 0 12px 40px rgba(15, 23, 42, .18);
    overflow-y: auto;
  }
  .sidebar.open { transform: translateX(0); }

  /* 抽屉里把 52px 图标条藏掉的文字全恢复回来 */
  .sidebar .side-name,
  .sidebar .nav-item span:not(.nav-badge),
  .sidebar .group-head,
  .sidebar .user-meta,
  .sidebar .conv-list,
  .sidebar .brand-txt,
  .sidebar .nav-badge,
  .sidebar .user-chev { display: revert; }
  .sidebar .side-head { justify-content: flex-start; padding-bottom: 12px; }
  .sidebar .side-logo { width: 32px; height: 32px; flex: 0 0 32px; }
  .sidebar .side-tools { display: flex; }
  .sidebar .nav-item { justify-content: flex-start; padding: 0 12px; height: 44px; }
  .sidebar .nav-item svg { width: 19px; height: 19px; }
  .sidebar .user-card { justify-content: flex-start; padding: 8px 10px; }
  .sidebar .user-avatar { width: 30px; height: 30px; }

  /* ---------------- 顶部 ---------------- */
  .side-burger {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; flex: 0 0 36px;
    border: none; background: transparent; color: #4b5563;
    border-radius: 10px;
  }
  .side-burger:active { background: #f1f3f5; }
  .topbar { padding-left: 6px; gap: 4px; }
  .topbar .status span:not(.dot) { display: none; }   /* 手机上只留状态点 */

  /* ---------------- 底部导航 ---------------- */
  .mobile-nav {
    display: flex; align-items: stretch;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
    height: calc(54px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
    background: rgba(255, 255, 255, .97);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid #ebedf0;
  }
  .mn-item {
    flex: 1 1 0;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 2px;
    border: none; background: transparent; color: #8a9099;
    font-size: 10.5px; font-family: inherit; padding: 0;
    -webkit-tap-highlight-color: transparent;
  }
  .mn-item svg { width: 21px; height: 21px; }
  .mn-item.active { color: #12805c; font-weight: 600; }
  .mn-item:active { background: #f6f8f9; }

  /* 主区给底栏让位；输入区不再自己顶安全区（底栏已经处理） */
  .main { padding-bottom: calc(54px + env(safe-area-inset-bottom)); }
  .composer { padding-bottom: 8px; }

  /* ---------------- 工具开关换成胶囊（原来是一排原生小方块，很土） ---------------- */
  .composer-tools { gap: 6px; row-gap: 6px; }
  .tools-left { gap: 6px; }
  .kb-switch {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 5px 10px 5px 8px;
    border: 1px solid #e3e6ea; border-radius: 999px; background: #fff;
    line-height: 1;
  }
  .kb-switch input[type="checkbox"] {
    -webkit-appearance: none; appearance: none;
    width: 14px; height: 14px; margin: 0; flex: 0 0 14px;
    border: 1.5px solid #c8ccd4; border-radius: 50%; background: #fff;
    position: relative; transition: background .15s, border-color .15s;
  }
  .kb-switch input[type="checkbox"]:checked {
    background: #12805c; border-color: #12805c;
    box-shadow: inset 0 0 0 3px #fff;
  }
  .kb-switch span { font-size: 11.5px; color: #4b5563; }
  .kb-switch:has(input[type="checkbox"]:checked) {
    background: #f0faf5; border-color: #bfe3d2;
  }
  .kb-switch:has(input[type="checkbox"]:checked) span { color: #0f6e4f; }
  .conn-btn { padding: 5px 9px; border: 1px solid #e3e6ea; border-radius: 999px; }

  /* 模型选择在手机上收窄，别把工具栏顶成两行 */
  .tools-right { gap: 4px; }
  .tools-right .model-select { max-width: 74px; }

  /* 欢迎语在手机上别用大标题 */
  .welcome h1 { font-size: 24px; line-height: 1.3; }
  .welcome p { font-size: 13.5px; }
  .preset-grid { gap: 8px; }
  .preset { padding: 11px 12px; }
  .preset-t { font-size: 13.5px; }
  .preset-d { font-size: 11.5px; }
}

/* 个人微信登录那一屏（只有配了微信开放平台 AppID 才会出现） */
.wxopen-hero { text-align: center; padding: 18px 0 14px; }
.wxopen-hero svg { display: block; margin: 0 auto 10px; }
.wxopen-t { font-size: 15.5px; font-weight: 600; color: #1f2430; margin: 0 0 5px; }
.wxopen-d { font-size: 12.5px; color: #8a9099; margin: 0; line-height: 1.5; }

/* 微信内「一键登录」大按钮（只在微信里 + 公众号配好时出现） */
.wx-login-top {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; height: 44px; margin: 2px 0 12px;
  border: none; border-radius: 12px;
  background: #07C160; color: #fff;
  font: inherit; font-size: 15px; font-weight: 600;
  box-shadow: 0 4px 14px rgba(7, 193, 96, .28);
  cursor: pointer;
}
.wx-login-top:active { transform: translateY(1px); box-shadow: 0 2px 8px rgba(7, 193, 96, .3); }
.wx-login-top.hidden { display: none; }
.wx-login-top svg { flex: 0 0 auto; }

/* 知识库「公共资料」勾选（只有管理员看得到） */
.kb-pub {
  display: flex; align-items: center; gap: 7px;
  margin: 0 4px 8px; padding: 8px 10px;
  border: 1px solid #e3e6ea; border-radius: 10px; background: #fbfcfd;
  font-size: 12.5px; color: #4b5563; cursor: pointer;
}
.kb-pub input { width: 15px; height: 15px; margin: 0; accent-color: #12805c; }
.kb-pub b { color: #0f6e4f; font-weight: 600; }
.kb-pub.hidden { display: none; }

/* 知识库列表：公共资料标记 + 谁上传的 */
.kb-item.kb-shared { background: #f4fbf7; }
.kb-tag {
  flex: none; font-size: 10px; font-style: normal; line-height: 1;
  padding: 2px 5px; border-radius: 4px;
  background: #d8f0e4; color: #0f6e4f; font-weight: 600;
}
.kb-owner {
  flex: none; font-size: 10.5px; font-style: normal; color: #9aa0a8;
  max-width: 64px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* 对话置顶标记（2026-10-29 老板要） */
.conv-item.pinned { background: #f7fbf9; }
.conv-item .pin-mark {
  flex: none; font-style: normal; font-size: 10px;
  margin-right: 4px; opacity: .75;
}

/* 加模型的入口已移到下拉列表内，这里原来的 .add-model-btn 样式删掉 */


/* 会话项的图钉按钮（只靠右键没人看得见，必须给个可见的） */
.conv-item .pin {
  flex: none; width: 20px; height: 20px; padding: 0; margin-right: 2px;
  border: none; background: transparent; cursor: pointer;
  font-size: 10px; line-height: 20px; text-align: center;
  opacity: 0; transition: opacity .12s; border-radius: 5px;
}
.conv-item:hover .pin { opacity: .55; }
.conv-item .pin:hover { opacity: 1 !important; background: #eef1f4; }
.conv-item .pin.on { opacity: 1; }
@media (max-width: 640px) {
  .conv-item .pin { opacity: .45; width: 26px; height: 26px; line-height: 26px; font-size: 11px; }
  .conv-item .pin.on { opacity: 1; }
}

/* 会话列表分区标题（置顶 / 最近对话）—— 2026-10-29 老板要跟 WorkBuddy 一样分组 */
.conv-group-title {
  display: flex; align-items: center; gap: 6px;
  padding: 10px 10px 5px;
  font-size: 11px; font-weight: 600; letter-spacing: .4px;
  color: #9aa0a8; user-select: none;
}
.conv-group-title.pin-title { color: #12805c; }
.conv-group-title::after {
  content: ""; flex: 1; height: 1px; background: #eef0f3;
}
.conv-item.pinned { background: #f4fbf7; }

/* 「对话」那一行去掉文字后只留刷新按钮，右对齐，不占高度 */
.group-head.bare {
  justify-content: flex-end;
  padding: 4px 8px 0;
  min-height: 18px;
}
.group-head.bare button { opacity: .45; }
.group-head.bare button:hover { opacity: 1; }

/* ================= 「＋」上拉菜单（2026-10-29） =================
   老板：像 WorkBuddy 那样，把加图片/加文件/加链接收进一个加号里。
   定位由 JS 实时算（fixed），这里只管长相。 */
.plus-menu {
  position: fixed;
  z-index: 960;
  min-width: 216px;
  padding: 6px;
  background: #fff;
  border: 1px solid #e8eaee;
  border-radius: 13px;
  box-shadow: 0 10px 34px rgba(15, 23, 42, .16), 0 2px 8px rgba(15, 23, 42, .06);
  animation: pmIn .14s ease-out;
}
.plus-menu.hidden { display: none; }
@keyframes pmIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.pm-item {
  display: flex; align-items: center; gap: 10px;
  width: 100%; padding: 9px 10px;
  border: none; border-radius: 9px; background: transparent;
  color: #2b3138; font: inherit; font-size: 13.5px;
  text-align: left; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.pm-item svg { width: 18px; height: 18px; flex: 0 0 18px; color: #12805c; }
.pm-item span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pm-item:hover, .pm-item:focus-visible { background: #f4f6f8; outline: none; }
.pm-item:active { background: #eceff2; }

.plus-btn[aria-expanded="true"] { background: #eef1f4; color: #12805c; }

@media (max-width: 640px) {
  .plus-menu { min-width: 200px; }
  .pm-item { padding: 11px 10px; font-size: 14px; }   /* 手机上手指更好点 */
}

/* ================= 专家体系（2026-10-29） ================= */
/* 输入框上方的"当前专家"小标签 */
.expert-chip {
  display: inline-flex; align-items: center; gap: 6px;
  margin: 8px 10px 0; padding: 4px 6px 4px 9px;
  background: #eef7f2; border: 1px solid #cfe9dd; border-radius: 999px;
  font-size: 12px; color: #0f6e4f; align-self: flex-start;
}
.expert-chip.hidden { display: none; }
.expert-chip .ec-icon { font-size: 12px; opacity: .8; }
.expert-chip .ec-name { font-weight: 600; }
.expert-chip .ec-x {
  width: 16px; height: 16px; padding: 0; border: none; border-radius: 50%;
  background: transparent; color: #6b8a7d; font-size: 13px; line-height: 1;
  cursor: pointer;
}
.expert-chip .ec-x:hover { background: #d8ecdf; color: #0b5a40; }

/* 面板 */
.sheet-mask {
  position: fixed; inset: 0; z-index: 940;
  background: rgba(15, 23, 42, .38);
}
.sheet-mask.hidden { display: none; }
.sheet {
  position: fixed; z-index: 950;
  left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(560px, calc(100vw - 32px));
  max-height: min(76vh, 620px);
  display: flex; flex-direction: column;
  background: #fff; border-radius: 16px;
  box-shadow: 0 20px 60px rgba(15, 23, 42, .24);
}
.sheet.hidden { display: none; }
.sheet-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 16px 18px 12px; border-bottom: 1px solid #f0f2f4;
}
.sheet-title { font-size: 15.5px; font-weight: 650; color: #1f2430; }
.sheet-sub { margin-top: 3px; font-size: 12px; color: #8a9099; line-height: 1.5; }
.sheet-close {
  flex: none; width: 28px; height: 28px; border: none; border-radius: 8px;
  background: transparent; color: #8a9099; font-size: 15px; cursor: pointer;
}
.sheet-close:hover { background: #f2f4f6; color: #4b5563; }

.sheet-body { overflow-y: auto; padding: 10px 12px; }
.sheet-empty { padding: 26px 12px; text-align: center; color: #9aa0a8; font-size: 13px; line-height: 1.7; }

.ex-card {
  display: flex; align-items: center; gap: 11px; width: 100%;
  padding: 11px 12px; margin-bottom: 6px;
  border: 1px solid #eceef1; border-radius: 11px; background: #fff;
  text-align: left; font: inherit; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.ex-card:hover { background: #fafbfc; border-color: #dfe3e8; }
.ex-card.on { background: #f2fbf6; border-color: #bfe3d2; }
.ex-ico {
  flex: none; width: 32px; height: 32px; border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  background: #eef7f2; color: #12805c; font-size: 15px;
}
.ex-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.ex-name { font-size: 13.5px; font-weight: 600; color: #1f2430; }
.ex-tag { font-size: 11.5px; color: #8a9099; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ex-now { flex: none; font-size: 10.5px; color: #0f6e4f; background: #d8f0e4; padding: 2px 6px; border-radius: 5px; }

.sheet-foot { padding: 10px 16px 14px; border-top: 1px solid #f0f2f4; }
.sheet-none {
  width: 100%; height: 38px; border: 1px solid #e3e6ea; border-radius: 10px;
  background: #fff; color: #4b5563; font: inherit; font-size: 13px; cursor: pointer;
}
.sheet-none:hover { background: #f6f8f9; }

@media (max-width: 640px) {
  .sheet { width: calc(100vw - 20px); max-height: 82vh; }
  .ex-card { padding: 12px 11px; }
  .ex-name { font-size: 14px; }
}

/* ================= 发给同事（2026-10-29） ================= */
.share-sheet { width: min(520px, calc(100vw - 32px)); }
.share-search { padding: 10px 14px 4px; }
.share-search input {
  width: 100%; height: 34px; padding: 0 12px;
  border: 1px solid #e3e6ea; border-radius: 9px; background: #fafbfc;
  font: inherit; font-size: 13px; color: #1f2430; outline: none;
}
.share-search input:focus { border-color: #bfe3d2; background: #fff; }

.col-item {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 8px 10px; margin-bottom: 4px;
  border: 1px solid transparent; border-radius: 10px; background: #fff;
  text-align: left; font: inherit; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.col-item:hover { background: #f7f9fa; }
.col-item.on { background: #f2fbf6; border-color: #bfe3d2; }
.col-av {
  flex: none; width: 30px; height: 30px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: #eef1f4; color: #4b5563; font-size: 13px; font-weight: 600;
}
.col-item.on .col-av { background: #d8f0e4; color: #0f6e4f; }
.col-name { flex: none; font-size: 13.5px; color: #1f2430; font-weight: 500; }
.col-uid { flex: 1; min-width: 0; font-size: 11px; color: #b0b6bd;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.col-tick { flex: none; font-size: 12px; color: #12805c; opacity: 0; }
.col-item.on .col-tick { opacity: 1; }

.share-foot { display: flex; flex-direction: column; gap: 9px; }
.share-foot #shareNote {
  width: 100%; height: 36px; padding: 0 12px;
  border: 1px solid #e3e6ea; border-radius: 9px; background: #fff;
  font: inherit; font-size: 13px; color: #1f2430; outline: none;
}
.share-foot #shareNote:focus { border-color: #bfe3d2; }
.share-actions { display: flex; gap: 8px; }
.share-actions .share-copy { flex: 1; }
.share-send {
  flex: 1; height: 38px; border: none; border-radius: 10px;
  background: #12805c; color: #fff; font: inherit; font-size: 13.5px; font-weight: 600;
  cursor: pointer;
}
.share-send:hover:not(:disabled) { background: #0f6e4f; }
.share-send:disabled { background: #cfd6dc; cursor: not-allowed; }

@media (max-width: 640px) {
  .share-sheet { width: calc(100vw - 20px); }
  .col-item { padding: 10px 9px; }
  .share-send, .share-actions .share-copy { height: 42px; }
}

/* ---------------- 右侧文件面板（2026-10-29）----------------
   老板原话：「对话窗口里面生成的文件没有侧边栏么，也没有文件存储位置的快捷到达区域，
   不太方便吧，你看 workbuddy 的布局也同步设计一下吧」。
   布局：桌面在对话右侧固定 268px，可收起；手机变成从右边滑出的抽屉。 */
.file-btn {
  display: inline-flex; align-items: center; gap: 5px;
  font: inherit; font-size: 12.5px; padding: 5px 10px; border-radius: 8px;
  border: 1px solid var(--line); background: var(--panel); color: var(--ink-3);
  cursor: pointer; transition: .12s; white-space: nowrap;
}
.file-btn:hover { border-color: var(--brand); color: var(--brand); }
.file-btn.on { border-color: var(--brand); background: var(--brand-soft); color: var(--brand); font-weight: 600; }
.file-btn .file-n {
  min-width: 16px; height: 16px; line-height: 16px; padding: 0 4px;
  background: var(--brand); color: #fff; border-radius: 8px;
  font-size: 10px; font-weight: 700; text-align: center;
}

.files-panel {
  flex: 0 0 286px; width: 286px; display: none; flex-direction: column;
  border-left: 1px solid var(--line); background: #fbfbfc; min-height: 0;
}
.files-panel.on { display: flex; }
.fp-head {
  flex: 0 0 auto; height: 46px; display: flex; align-items: center; gap: 8px;
  padding: 0 12px; border-bottom: 1px solid #f1f2f3;
}
.fp-title { font-size: 12.5px; font-weight: 650; color: var(--ink-2); }
.fp-open {
  margin-left: auto; font-size: 11.5px; color: var(--brand); text-decoration: none;
  padding: 3px 7px; border-radius: 6px;
}
.fp-open:hover { background: var(--brand-soft); }
.fp-close {
  font: inherit; font-size: 13px; line-height: 1; width: 22px; height: 22px;
  border: 0; background: none; color: var(--ink-4); cursor: pointer; border-radius: 6px;
}
.fp-close:hover { background: #eef0f1; color: var(--ink-2); }
.fp-sub {
  flex: 0 0 auto; padding: 8px 12px 6px; font-size: 11px; color: var(--ink-4);
  border-bottom: 1px dashed #eeeff0;
}
/* 「存在哪」这两行（2026-10-29 老板要的存储位置）：工作区名 + 服务器真实路径 */
.fp-sub .fp-ws { display: block; }
.fp-sub .fp-path {
  display: block; margin-top: 3px;
  font-size: 10px; color: var(--ink-4); opacity: .85;
  font-family: ui-monospace, Consolas, monospace;
  word-break: break-all; cursor: pointer;
}
.fp-sub .fp-path:hover { color: var(--brand); text-decoration: underline; }
/* 每条右侧的下载按钮：平时淡，hover 才明显（不抢文件名的地方） */
.fp-item .fp-dl {
  flex: 0 0 20px; width: 20px; height: 20px; border-radius: 6px;
  display: grid; place-items: center;
  font-size: 13px; line-height: 1; color: var(--ink-4);
  opacity: 0; transition: opacity .12s ease;
}
.fp-item:hover .fp-dl { opacity: 1; }
.fp-item .fp-dl:hover { background: #e6e8ec; color: var(--ink-1); }
.fp-list { flex: 1 1 auto; overflow-y: auto; padding: 6px; min-height: 0; }

.fp-item {
  display: flex; align-items: center; gap: 8px; padding: 7px 8px;
  border-radius: 8px; cursor: pointer; text-decoration: none; color: inherit;
}
.fp-item:hover { background: #f2f4f5; }

/* ---------------- 列表 / 平铺 切换（2026-10-30 老板：「做一个平铺」）----------------
   平铺是为了「一眼看到刚生成的那几个」：图片直接出缩略图，其他给大图标；
   今天的文件右上角带一个绿点，不用看时间去猜。 */
.fp-view { margin-left: auto; display: flex; gap: 2px; }
.fp-view + .fp-open { margin-left: 6px; }
.fp-vbtn {
  width: 24px; height: 22px; border: 0; border-radius: 6px; background: transparent;
  display: grid; place-items: center; cursor: pointer; color: #9aa0a6;
  font-family: inherit; padding: 0;
}
.fp-vbtn:hover { background: #eef0f2; color: #4b5563; }
.fp-vbtn.on { background: #e8f1ed; color: var(--brand); }

/* 平铺网格 */
.fp-list.grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px; align-content: start; padding: 8px;
}
.fp-tile {
  display: flex; flex-direction: column; gap: 5px;
  padding: 7px; border-radius: 10px; cursor: pointer;
  text-decoration: none; color: inherit; border: 1px solid transparent;
}
.fp-tile:hover { background: #f4f6f7; border-color: #e6e8eb; }
.fp-thumb {
  position: relative; display: block; width: 100%; aspect-ratio: 4 / 3;
  border-radius: 8px; overflow: hidden; background: #f2f4f6;
  border: 1px solid #eaedf0;
}
.fp-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fp-thumb-ico {
  width: 100%; height: 100%; display: grid; place-items: center;
  font-size: 15px; font-weight: 700; letter-spacing: .3px; color: #6b7785;
}
/* 今天的文件：右上角一个小绿点 */
.fp-thumb .fp-new {
  position: absolute; top: 6px; right: 6px;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--brand); box-shadow: 0 0 0 2px #fff;
}
.fp-tile-name {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  font-size: 11.5px; color: var(--ink-1); line-height: 1.35;
  overflow: hidden; word-break: break-all;
  min-height: 2.7em;   /* 两行固定高度，网格才对得齐 */
}
.fp-tile-meta {
  display: block; font-size: 10px; color: var(--ink-4);
  font-variant-numeric: tabular-nums;
}
/* 列表里「今天生成」的小绿点，跟在文件名后面 */
.fp-name .fp-dot {
  display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: var(--brand); margin-left: 5px; vertical-align: 1px;
}
.fp-ico {
  flex: 0 0 26px; width: 26px; height: 26px; border-radius: 7px;
  display: grid; place-items: center; overflow: hidden;
  font-size: 8.5px; letter-spacing: -0.2px; line-height: 1;
  background: #eef1f3; color: #5b6b7a; font-weight: 700;
}
.fp-ico.img { background: #e8f6f0; color: #0aa06e; }
.fp-ico.txt { background: #eef2f8; color: #4a6fa5; }
.fp-main { flex: 1 1 auto; min-width: 0; }
/* 这两个必须 block：span 默认 inline，不设就会挤在同一行（截图里踩到过） */
.fp-name {
  display: block; font-size: 12.5px; color: var(--ink-1); overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
}
.fp-meta {
  display: block; font-size: 10.5px; color: var(--ink-4);
  margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.fp-empty { padding: 28px 14px; text-align: center; font-size: 12px; color: var(--ink-4); line-height: 1.9; }

@media (max-width: 760px) {
  .file-btn span:not(.file-n) { display: none; }   /* 手机上只留图标，省位置 */
  .files-panel {
    position: fixed; top: 0; right: 0; bottom: 0; width: 82vw; max-width: 320px;
    z-index: 60; box-shadow: -6px 0 24px rgba(0,0,0,.14);
    transform: translateX(100%); transition: transform .22s ease;
    display: flex;                       /* 手机上常驻 DOM，靠 transform 滑 */
  }
  .files-panel.on { transform: translateX(0); }
  /* 手机上不做半透明遮罩：用伪元素铺满是常见坑（fixed 里再 fixed，层级和点击穿透都容易出问题）。
     点右上角 ✕ 或按 Esc 关掉就够，抽屉本来只占 82vw，左边还看得见对话。 */
}

/* ---------------- 生成的文件卡片 + 预览弹层（2026-10-29）----------------
   老板：「输出文档比如 ppt/pdf 的时候能不能整的专业点，看起来像一个比较优美的智能体，
   能预览、能方便打开文件」。
   以前只有一行小 chip，点了跳工作区首页 —— 既不像智能体，也谈不上"打开文件"。 */
.made-files { display: flex; flex-direction: column; gap: 8px; margin: 10px 0 4px; max-width: 560px; }

.mf-item {
  display: flex; align-items: center; gap: 11px;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px;
  background: #fff; transition: .14s;
}
.mf-item:hover { border-color: #cfd8d4; box-shadow: 0 2px 10px rgba(16, 40, 32, .06); }

.mf-ico {
  flex: 0 0 38px; width: 38px; height: 38px; border-radius: 10px;
  display: grid; place-items: center; overflow: hidden;
  font-size: 9.5px; font-weight: 700; letter-spacing: -.2px; line-height: 1;
  background: #eef1f4; color: #5b6b7a;
}
.mf-ico.pdf  { background: #fdecec; color: #c0392b; }
.mf-ico.ppt  { background: #fdf0e6; color: #c05621; }
.mf-ico.doc  { background: #e9f1fb; color: #2b6cb0; }
.mf-ico.xls  { background: #e8f6ee; color: #1f7a45; }
.mf-ico.img  { background: #f0ecfd; color: #6b46c1; }
.mf-ico.md   { background: #eef2f7; color: #4a5568; }
.mf-ico.zip  { background: #fdf6e3; color: #975a16; }

.mf-main { flex: 1 1 auto; min-width: 0; }
.mf-name {
  display: block; font-size: 13.5px; font-weight: 600; color: var(--ink-1);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mf-meta { display: block; font-size: 11px; color: var(--ink-4); margin-top: 2px; }

.mf-acts { flex: 0 0 auto; display: flex; gap: 6px; }
.mf-btn {
  font: inherit; font-size: 12px; padding: 5px 11px; border-radius: 8px; cursor: pointer;
  border: 1px solid var(--line); background: #fff; color: var(--ink-3);
  text-decoration: none; white-space: nowrap; transition: .12s;
}
.mf-btn:hover { border-color: var(--brand); color: var(--brand); }
.mf-btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 600; }
.mf-btn.primary:hover { background: #088a5e; color: #fff; }

/* 预览弹层：占满窗口，留出边距，像模像样 */
.pv-mask {
  position: fixed; inset: 0; z-index: 90; display: none;
  background: rgba(18, 24, 28, .55); backdrop-filter: blur(3px);
  padding: 26px;
}
.pv-mask.on { display: flex; align-items: center; justify-content: center; }
.pv-box {
  width: min(1120px, 100%); height: 100%; max-height: 100%;
  background: #fff; border-radius: 14px; overflow: hidden;
  display: flex; flex-direction: column; box-shadow: 0 24px 60px rgba(0,0,0,.28);
}
.pv-head {
  flex: 0 0 auto; height: 50px; display: flex; align-items: center; gap: 10px;
  padding: 0 14px; border-bottom: 1px solid var(--line);
}
.pv-head .mf-ico { flex: 0 0 28px; width: 28px; height: 28px; border-radius: 8px; font-size: 8px; }
.pv-title { font-size: 13.5px; font-weight: 620; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-sub { font-size: 11.5px; color: var(--ink-4); }
.pv-acts { margin-left: auto; display: flex; align-items: center; gap: 7px; }
.pv-body { flex: 1 1 auto; overflow: auto; background: #f4f5f6; min-height: 0; }
.pv-body iframe { width: 100%; height: 100%; border: 0; display: block; background: #fff; }
.pv-body img { display: block; max-width: 100%; margin: 0 auto; }
.pv-body pre {
  margin: 0; padding: 18px 20px; font-size: 12.5px; line-height: 1.75;
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
  white-space: pre-wrap; word-break: break-word; background: #fff; min-height: 100%;
}
.pv-tip {
  padding: 56px 24px; text-align: center; color: var(--ink-4); font-size: 13px; line-height: 2.1;
  background: #fff; min-height: 100%;
}
.pv-tip b { color: var(--ink-2); }

@media (max-width: 760px) {
  .pv-mask { padding: 0; }
  .pv-box { border-radius: 0; height: 100%; }
  .mf-item { padding: 9px 10px; gap: 9px; }
  .mf-ico { flex-basis: 34px; width: 34px; height: 34px; font-size: 8.5px; }
  .mf-name { font-size: 13px; }
  .mf-acts .mf-btn { padding: 5px 9px; font-size: 11.5px; }
}

/* ---------------- 底部「有更新」提示条（2026-10-29）----------------
   老板：「老需要重装/刷新不是大麻烦么」。所以更新这件事不该让人操心：
   人不在看的时候自动刷，人在看的时候只出一条这个，点一下就好，不打断打字。 */
.au-bar {
  position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%);
  z-index: 95; display: flex; align-items: center; gap: 10px;
  padding: 8px 10px 8px 14px; border-radius: 999px;
  background: #16232b; color: #eaf2ef; font-size: 12.5px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .28);
  animation: auIn .22s ease;
}
@keyframes auIn { from { opacity: 0; transform: translate(-50%, 8px); } to { opacity: 1; transform: translate(-50%, 0); } }
.au-bar button {
  font: inherit; font-size: 12px; padding: 4px 12px; border-radius: 999px;
  border: 0; background: var(--brand); color: #fff; cursor: pointer; font-weight: 600;
}
.au-bar button:hover { background: #088a5e; }

/* 菜单右侧的值（当前模型名、主题、缓存大小） */
.bd-val {
  margin-left: auto; font-style: normal;
  font-size: 11px; color: var(--ink-4);
  max-width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* 左下角头像菜单里，右侧实时值（当前模型 / 主题 / 缓存大小） */
.um-val {
  margin-left: auto; font-style: normal;
  font-size: 11px; color: var(--ink-4);
  max-width: 96px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.um-dot {
  margin-left: auto; width: 6px; height: 6px; border-radius: 50%; background: #e0473c;
}
.um-item { position: relative; }

/* ---------------- 顶部菜单栏（2026-10-30 照 WorkBuddy 那行做）----------------
   只在桌面客户端显示：网页版没有"窗口"这回事，多一行反而怪。 */
.appmenu { display: none; }
body.is-app .appmenu {
  display: flex; align-items: center; gap: 1px;
  height: 30px; padding: 0 6px; flex: 0 0 auto;
  background: #fbfbfa; border-bottom: 1px solid #e8eaec;
  -webkit-user-select: none; user-select: none;
}
.am-top {
  border: 0; background: transparent; font: inherit; font-size: 12.5px;
  color: var(--ink-2); padding: 4px 10px; border-radius: 6px; cursor: default;
}
.am-top:hover, .am-top.on { background: #eceef0; }
.am-drag { flex: 1 1 auto; height: 100%; }
.am-drop {
  position: fixed; z-index: 200; min-width: 208px; padding: 5px;
  margin-top: 26px; background: #fff; border: 1px solid #e3e6e9;
  border-radius: 10px; box-shadow: 0 14px 34px rgba(16, 40, 32, .16);
}
.am-item {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 7px 10px; border: 0; border-radius: 7px; background: transparent;
  font: inherit; font-size: 12.5px; color: var(--ink-1); text-align: left; cursor: default;
}
.am-item:hover { background: #f2f4f5; }
.am-item.danger:hover { background: #1f6fd0; color: #fff; }
.am-item.danger:hover .am-key { color: #d8e6fb; }
.am-key { margin-left: auto; font-size: 11px; color: var(--ink-4); }
.am-sep { height: 1px; margin: 5px 6px; background: #eef0f2; }

/* 可拖区域（2026-10-30）：窗口只能从这两条拖，正文不受影响，
   所以对话框里的文字能正常选中、复制。 */
.pywebview-drag-region { cursor: default; }
.appmenu.pywebview-drag-region, .topbar.pywebview-drag-region { -webkit-app-region: drag; }
/* 里面的按钮/链接照旧可点（不然拖拽会把点击吃掉） */
.pywebview-drag-region button, .pywebview-drag-region a, .pywebview-drag-region input {
  -webkit-app-region: no-drag;
}

/* 左上角版本弹窗里的「当前版本」块（2026-10-30：只显示当天版本，历史挪去关于） */
.ver-only { padding: 4px 2px 14px; }
.ver-only .vo-line { font-size: 13px; color: var(--ink-2); padding: 10px 0 12px; }
.ver-only .vo-line b { font-size: 15px; color: var(--ink); font-variant-numeric: tabular-nums; }
.ver-only .vo-more {
  display: inline-block; font-size: 12.5px; color: var(--brand);
  text-decoration: none; padding: 6px 0;
}
.ver-only .vo-more:hover { text-decoration: underline; }

/* 快捷任务菜单（2026-10-31）：分组标题 + 图标 */
.am-group {
  padding: 7px 10px 4px; font-size: 10.5px; letter-spacing: .6px;
  color: var(--ink-4); font-weight: 600;
}
.am-ico { flex: 0 0 auto; width: 16px; text-align: center; font-size: 12px; }
.am-quick { font-weight: 600; color: var(--ink-1); }
.am-quick::before {
  content: ""; display: inline-block; width: 5px; height: 5px; border-radius: 50%;
  background: var(--brand); margin-right: 6px; vertical-align: 2px;
}

/* 会议记录按钮 + 录音中的红点（2026-10-31）
   录音必须在界面上**一直看得见**，不能让人忘了还在录。 */
.mtg-btn {
  display: inline-flex; align-items: center; gap: 6px;
  height: 30px; padding: 0 11px; border: 1px solid var(--line-2, #e3e6e9);
  border-radius: 9px; background: #fff; color: var(--ink-2, #3d4450);
  font: inherit; font-size: 12.5px; cursor: pointer;
}
.mtg-btn:hover { background: #f7f8f9; }
.mtg-btn.rec {
  background: #fdeceb; border-color: #f3c2be; color: #c0392b; font-weight: 600;
}
.mtg-btn .rec-dot {
  width: 7px; height: 7px; border-radius: 50%; background: #e0473c;
  animation: mtgPulse 1.4s ease-in-out infinite;
}
@keyframes mtgPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .45; transform: scale(.82); }
}

/* 左上角纯展示（2026-10-31）：不可点、不 hover、没有箭头 */
.brand-static, .brand-static:hover { background: transparent; cursor: default; }
.brand-static .ver-line { pointer-events: none; }

/* 计划模式开关：勾上时给点提示色，让人知道这轮它只能看不能改 */
.plan-switch input:checked ~ span { color: #b45309; font-weight: 600; }
.plan-switch input { accent-color: #b45309; }

/* ---------------- 拖文件进来（2026-11-02） ----------------
   全屏提示层只在拖动文件时出现；不用 opacity 渐隐（会跟拖拽事件的
   频繁 enter/leave 打架），直接 display 切换。 */
.drop-mask {
  position: fixed; inset: 0; z-index: 90; display: none;
  align-items: center; justify-content: center;
  background: rgba(12, 26, 22, .55); backdrop-filter: blur(2px);
}
.drop-mask.on { display: flex; }
.drop-card {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 34px 46px; border-radius: 18px; color: #0a6b4b;
  background: #fff; border: 2px dashed #35c08e;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .28);
  animation: dropPulse 1.1s ease-in-out infinite alternate;
}
.drop-card b { font-size: 17px; letter-spacing: .5px; }
.drop-card span { font-size: 12.5px; color: #6b7d76; }
@keyframes dropPulse {
  from { transform: scale(1); border-color: #35c08e; }
  to   { transform: scale(1.025); border-color: #0aa06e; }
}
/* 手机上不显示（没有拖拽） */
@media (max-width: 760px) { .drop-mask { display: none !important; } }

/* ---------------- 朗读喇叭（2026-11-02） ----------------
   开的时候是品牌绿，关掉变灰；手机上比电脑端再大一点，
   因为"不方便打字"的场景基本都在手机上，得让人一眼找到。 */
.tts-btn.on {
  color: var(--brand, #0aa06e);
  background: rgba(10, 160, 110, .10);
}
.tts-btn:not(.on) { color: #b3bac1; }
.tts-btn.reading { animation: micPulse 1.2s ease-in-out infinite; color: #0aa06e; }
@media (max-width: 640px) {
  .tts-btn, .mic-btn { width: 40px; height: 40px; }
  .tts-btn svg, .mic-btn svg { width: 19px; height: 19px; }
}

/* 手机上「说一句」是主路径（2026-11-02 老板：手机端要更便捷）：
   麦克风做成实心主按钮，喇叭只在开着的时候淡淡地亮，别抢戏。 */
@media (max-width: 640px) {
  .mic-btn {
    background: var(--brand, #0aa06e) !important;
    color: #fff !important;
    border-color: transparent !important;
  }
  .mic-btn svg { stroke: #fff; }
  .tts-btn.on { background: rgba(10, 160, 110, .12); color: var(--brand, #0aa06e); }
  .tts-btn.on svg { stroke: var(--brand, #0aa06e); }
}

/* ---------------- 朗读音色（2026-11-02） ----------------
   只在朗读开着的时候露出一个 chip，点开挑音色。
   不常驻、不抢麦克风的位置 —— 手机上输入区本来就挤。 */
.voice-chip {
  display: none; align-items: center; gap: 4px; height: 30px; padding: 0 8px;
  border: 1px solid var(--line, #e6e8ea); border-radius: 15px; background: #fff;
  font: inherit; font-size: 12px; color: #55606b; cursor: pointer; flex: 0 0 auto;
  max-width: 96px; overflow: hidden; white-space: nowrap;
}
.voice-chip.show { display: inline-flex; }
.voice-chip:hover { border-color: var(--brand, #0aa06e); color: var(--brand, #0aa06e); }
.voice-chip .vc-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--brand, #0aa06e); flex: 0 0 6px;
}
.voice-chip .vc-caret { font-size: 9px; opacity: .7; }
#voiceChipName { overflow: hidden; text-overflow: ellipsis; }

.voice-pop {
  position: fixed; z-index: 95; display: none; width: min(330px, calc(100vw - 24px));
  max-height: min(64vh, 460px); overflow: hidden; background: #fff; border-radius: 14px;
  box-shadow: 0 18px 50px rgba(0,0,0,.18); border: 1px solid var(--line, #e6e8ea);
  flex-direction: column;
}
.voice-pop.on { display: flex; }
.voice-pop .vp-head {
  display: flex; align-items: baseline; gap: 8px; padding: 12px 14px 8px;
  border-bottom: 1px solid #f2f3f4;
}
.voice-pop .vp-head b { font-size: 13.5px; }
.voice-pop .vp-sub { font-size: 11px; color: #9aa5ae; }
.voice-pop .vp-list { overflow-y: auto; padding: 4px 6px 6px; }
.vp-row {
  display: flex; align-items: center; gap: 8px; padding: 8px 8px; border-radius: 9px;
  cursor: pointer;
}
.vp-row:hover { background: #f6f8f8; }
.vp-row.on { background: rgba(10,160,110,.08); }
.vp-row .vp-name { font-size: 13px; font-weight: 600; }
.vp-row .vp-tag {
  font-size: 10px; padding: 1px 5px; border-radius: 5px; background: #eef1f4; color: #6b7784;
}
.vp-row .vp-desc { font-size: 11px; color: #9aa5ae; margin-top: 2px; }
.vp-row .vp-main { min-width: 0; flex: 1 1 auto; }
.vp-row .vp-play {
  flex: 0 0 auto; font: inherit; font-size: 11.5px; padding: 4px 9px; border-radius: 7px;
  border: 1px solid #d9dfe4; background: #fff; color: #55606b; cursor: pointer;
}
.vp-row .vp-play:hover { border-color: var(--brand); color: var(--brand); }
.vp-row .vp-tick { color: var(--brand, #0aa06e); font-size: 13px; width: 14px; text-align: center; }
.voice-pop .vp-foot { padding: 8px 10px 10px; border-top: 1px solid #f2f3f4; }
.voice-pop .vp-foot button {
  width: 100%; font: inherit; font-size: 12px; padding: 8px; border-radius: 9px;
  border: 1px solid var(--line, #e6e8ea); background: #fafbfb; color: #6b7784; cursor: pointer;
}
@media (max-width: 640px) {
  .voice-chip { max-width: 74px; padding: 0 7px; font-size: 11.5px; }
}
.voice-pop .vp-group {
  font-size: 10.5px; color: #9aa5ae; padding: 8px 10px 3px; letter-spacing: .5px;
}

/* ================= 输入区重排（2026-11-02） =================
   老板：「所有东西都堆在对话的层面上……按微信那种语音和打字切换的格式」。
   现在输入区只有一行：切换键 | 输入框（或按住说话条）| ＋ | 发送。
   其余全部收进「＋」面板，手机上从底部升起。 */
.composer-card { padding: 8px; }

.cm-row {
  display: flex; align-items: flex-end; gap: 6px;
}
.cm-field { flex: 1 1 auto; min-width: 0; }
.composer-card textarea { padding: 8px 4px; max-height: 132px; }

/* 语音/键盘 切换键：只在手机上出现（电脑上直接点麦克风） */
.cm-mode {
  display: none; align-items: center; justify-content: center;
  width: 38px; height: 38px; flex: 0 0 38px;
  border: 1px solid var(--line, #e6e8ea); border-radius: 11px;
  background: #fff; color: #55606b; cursor: pointer; padding: 0;
}
.cm-mode svg { width: 19px; height: 19px; }
.cm-mode .ic-kb { display: none; }
body.voice-mode .cm-mode .ic-mic { display: none; }
body.voice-mode .cm-mode .ic-kb { display: block; }

/* 按住说话条（点一下开始、再点一下结束；点页面任何地方也会结束） */
.hold-bar {
  display: none; width: 100%; height: 40px;
  align-items: center; justify-content: center;
  border: 1px solid var(--line, #e6e8ea); border-radius: 11px;
  background: #fff; color: #2b3138; font: inherit; font-size: 14px;
  cursor: pointer; -webkit-tap-highlight-color: transparent; padding: 0;
}
body.voice-mode .hold-bar { display: flex; }
body.voice-mode .composer-card textarea { display: none; }
.hold-bar.rec {
  background: #e5484d; border-color: #e5484d; color: #fff;
  animation: micPulse 1.2s ease-in-out infinite;
}

/* ---------- 「＋」面板= 底部抽屉（手机） / 浮层（电脑） ---------- */
.plus-menu { padding: 4px 6px 10px; max-height: 72vh; overflow-y: auto; min-width: 268px; }
.pm-title {
  font-size: 11px; color: #9aa5ae; letter-spacing: .4px;
  padding: 10px 8px 4px;
}
.pm-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px;
}
.pm-grid .pm-item { padding: 10px 8px; font-size: 12.5px; gap: 8px; }
.pm-grid .pm-item svg { width: 17px; height: 17px; }

.pm-list { display: flex; flex-direction: column; gap: 2px; }

/* 开关行：左边两行字（标题+说明），右边一个开关 */
.pm-switch {
  display: flex; align-items: center; gap: 10px; padding: 9px 8px; border-radius: 10px;
  cursor: pointer;
}
.pm-switch:hover { background: #f6f8f8; }
.pm-switch input { display: none; }
.pm-sw-txt { flex: 1 1 auto; min-width: 0; }
.pm-sw-txt b { display: block; font-size: 13px; font-weight: 600; color: #2b3138; }
.pm-sw-txt i {
  display: block; font-style: normal; font-size: 11px; color: #9aa5ae;
  margin-top: 2px; line-height: 1.4;
}
.pm-sw {
  flex: 0 0 38px; width: 38px; height: 22px; border-radius: 11px; background: #d8dee3;
  position: relative; transition: background .15s;
}
.pm-sw::after {
  content: ""; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px;
  border-radius: 50%; background: #fff; transition: left .15s;
  box-shadow: 0 1px 2px rgba(0,0,0,.15);
}
.pm-switch input:checked + .pm-sw { background: var(--brand, #0aa06e); }
.pm-switch input:checked + .pm-sw::after { left: 18px; }

/* 设置行：左边标签，右边控件 */
.pm-line {
  display: flex; align-items: center; gap: 8px; padding: 8px; border-radius: 10px;
}
.pm-line:hover { background: #f6f8f8; }
.pm-lb { flex: 0 0 42px; font-size: 12.5px; color: #6b7784; }
.pm-sel {
  flex: 1 1 auto; min-width: 0; font: inherit; font-size: 12.5px;
  border: 1px solid var(--line, #e6e8ea); border-radius: 8px; padding: 6px 8px;
  background: #fff; color: #2b3138; outline: none;
}
.pm-link {
  flex: 1 1 auto; text-align: left; font: inherit; font-size: 12.5px;
  border: 1px solid var(--line, #e6e8ea); border-radius: 8px; padding: 6px 10px;
  background: #fff; color: #2b3138; cursor: pointer;
}
.pm-link.on { border-color: var(--brand, #0aa06e); color: var(--brand, #0aa06e); background: rgba(10,160,110,.06); }
.pm-mini {
  flex: 0 0 30px; width: 30px; height: 30px; border-radius: 8px; padding: 0;
  border: 1px solid var(--line, #e6e8ea); background: #fff; color: #6b7784; cursor: pointer;
  display: grid; place-items: center;
}
.pm-mini svg { width: 15px; height: 15px; }
.pm-list .voice-chip { display: inline-flex; }
.plus-menu .dev-name { flex: 1 1 auto; min-width: 0; }

@media (max-width: 640px) {
  /* 手机上：切换键出现，麦克风图标藏起来（改由切换面板里的说话条触发） */
  .cm-mode { display: inline-flex; }
  .cm-row #micBtn { display: none; }
  .cm-row { gap: 7px; }
  .cm-mode, .cm-row .plus-btn, .cm-row .btn-send { width: 42px; height: 42px; flex: 0 0 42px; }
  .cm-row .btn-send svg { width: 18px; height: 18px; }
  .hold-bar { height: 42px; font-size: 14.5px; }

  /* 「＋」变成从底部升起的抽屉，一屏看得完，不用在角落里挤 */
  .plus-menu {
    left: 0 !important; right: 0 !important; bottom: 0 !important; top: auto !important;
    width: auto !important; min-width: 0; border-radius: 18px 18px 0 0;
    max-height: 78vh; padding: 4px 10px calc(12px + env(safe-area-inset-bottom));
    animation: pmUp .18s ease-out;
  }
  .pm-grid { grid-template-columns: 1fr 1fr; }
  .pm-grid .pm-item { padding: 12px 10px; font-size: 13px; }
  .pm-switch { padding: 11px 8px; }
  .pm-sw-txt b { font-size: 13.5px; }
}
@keyframes pmUp { from { transform: translateY(30px); opacity: 0; } to { transform: none; opacity: 1; } }

/* 语音态下不需要「发送」——说完自动发；留着会让人以为要再点一下 */
body.voice-mode .cm-row .btn-send { display: none; }

/* 开关收进面板后，用一个小圆点提示"当前设置不是默认的"，
   不然一眼看不出 Agent/联网/知识库 有没有被关掉 */
.plus-btn { position: relative; }
.plus-btn.has-flag::after {
  content: ""; position: absolute; top: 5px; right: 5px;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--brand, #0aa06e); border: 1.5px solid #fff;
}

/* ================= 手机顶栏做减法（2026-11-02） =================
   老板：「界面还是乱七八糟」。查下来根子在顶栏：
     · 顶部有「对话 / 知识库」分段，底部导航又是同一套 —— 同一个导航出现两遍
     · 右边还挤着「开会」「文件」两个文字胶囊 + 一个状态点，393 宽塞不下
   现在手机顶栏只留：菜单 · 当前会话名 · 开会 · 文件（都是图标）。
   底部导航继续负责切「对话 / 知识库 / 定时 / 更多」。 */
.tb-title { display: none; }

@media (max-width: 760px) {
  .topbar { height: 50px !important; padding: 0 8px !important; gap: 6px !important; }
  .topbar .tabs { display: none !important; }

  .tb-title {
    display: block; flex: 1 1 auto; min-width: 0;
    font-size: 14.5px; font-weight: 600; color: #22282e; letter-spacing: .2px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    padding-left: 2px;
  }
  .topbar-right { gap: 6px !important; margin-left: 0 !important; }
  .topbar-right .status { display: none !important; }

  /* 两个文字胶囊 → 同尺寸图标按钮，视觉对齐、不打架 */
  .mtg-btn, .file-btn {
    width: 34px !important; height: 34px !important; flex: 0 0 34px !important;
    padding: 0 !important; border-radius: 10px !important;
    justify-content: center !important; gap: 0 !important; position: relative;
  }
  .mtg-btn > span, .file-btn > span:not(.file-n) { display: none !important; }
  .file-btn .file-n {
    position: absolute; top: -4px; right: -4px; margin: 0 !important;
    min-width: 15px; height: 15px; line-height: 15px; padding: 0 4px;
    border-radius: 8px; font-size: 10px; font-weight: 700;
    background: #e5484d; color: #fff; border: 1.5px solid #fff;
  }
}

/* ================= 手机单独的一套布局（2026-11-02 第二轮） =================
   老板：「针对手机单独要做适配的页面，不能这么堆，参考其他 App 的手机端布局」。

   参照微信 / 豆包 / ChatGPT 的做法 —— **一个页面只干一件事**：
     · 对话就是全屏对话页：顶栏只留「菜单 · 标题 · ⋯」，底部只留输入区
     · 底部那四个导航（对话/知识库/定时/更多）只在列表页出现，进对话就收起来
     · 「开会 / 文件」这类功能收进「⋯」，不再在顶栏并排挤着
   桌面端一行都不受影响（全部在媒体查询里）。 */
.m-more, .m-menu { display: none; }

@media (max-width: 760px) {
  /* 对话页 = 全屏：底部导航、页脚提示都收掉，屏幕全给内容 */
  body.m-chat .mobile-nav { display: none !important; }
  body.m-chat .hint { display: none !important; }
  body.m-chat .composer {
    padding-bottom: calc(10px + env(safe-area-inset-bottom)) !important;
  }
  body.m-chat .messages { padding-bottom: 4px; }

  /* 顶栏：左菜单 · 中间标题 · 右「⋯」，跟系统级 App 一致 */
  .topbar { height: 48px !important; }
  .tb-title { text-align: center; padding: 0 4px; font-size: 15px !important; }
  .mtg-btn, .file-btn { display: none !important; }     /* 都进 ⋯ 了 */

  .m-more {
    display: inline-flex; align-items: center; justify-content: center;
    width: 34px; height: 34px; flex: 0 0 34px; padding: 0;
    border: none; border-radius: 10px; background: transparent; color: #3c4249;
    -webkit-tap-highlight-color: transparent;
  }
  .m-more:active { background: #f0f2f4; }

  .m-menu {
    position: fixed; z-index: 970;
    display: none; min-width: 152px; padding: 6px;
    background: #fff; border-radius: 12px;
    border: 1px solid #e8eaed; box-shadow: 0 12px 34px rgba(0,0,0,.16);
  }
  .m-menu.on { display: block; animation: mPop .13s ease-out; }
  .m-menu button {
    display: block; width: 100%; text-align: left;
    padding: 10px 12px; border: none; border-radius: 8px; background: transparent;
    font: inherit; font-size: 14px; color: #2b3138;
  }
  .m-menu button:active { background: #f4f6f7; }
  .m-menu .m-sep { display: block; height: 1px; margin: 5px 4px; background: #eff1f3; }
}
@keyframes mPop { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* 手机全屏对话页：底部导航收起来后，主区不用再给它让 54px（否则输入区悬空） */
@media (max-width: 760px) {
  body.m-chat .main { padding-bottom: 0 !important; }
  body.m-chat .composer { padding-bottom: calc(8px + env(safe-area-inset-bottom)) !important; }
}

/* ================= 任务过程折叠（2026-11-02） =================
   老板：「跑任务时可以显示进行，但不需要大篇幅长期留在对话框里；
   跑完就隐藏起来，只显示任务的状态和条数」。
   整个过程只占一行，点开才看每一步 —— 过程不丢，答案不被埋。 */
.run-box {
  margin: 0 0 8px; border: 1px solid #e7eae8; border-radius: 10px;
  background: #fafbfa; overflow: hidden;
}
.run-head {
  display: flex; align-items: center; gap: 6px; width: 100%;
  padding: 6px 9px; border: none; background: transparent;
  font: inherit; font-size: 12.5px; color: #5b6670; cursor: pointer;
  text-align: left; -webkit-tap-highlight-color: transparent;
}
.run-head:hover { background: #f2f5f3; }
.run-ico { flex: 0 0 auto; width: 14px; text-align: center; font-size: 12px; color: #8b959e; }
.run-box.running .run-ico { color: var(--brand, #0aa06e); animation: runSpin 1.4s linear infinite; }
.run-box.done .run-ico { color: #0a9b6b; }
.run-box.fail .run-ico { color: #e5484d; }
.run-text {
  flex: 1 1 auto; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
}
.run-n { flex: 0 0 auto; font-size: 11.5px; color: #9aa5ae; }
.run-caret { flex: 0 0 auto; font-size: 9px; color: #b3bac1; transition: transform .16s; }
.run-box.open .run-caret { transform: rotate(180deg); }
.run-body { display: none; padding: 0 8px 7px; }
.run-box.open .run-body { display: block; }
.run-body .tool-card { margin: 3px 0; }
.run-box.done .run-head { color: #55606b; }
@keyframes runSpin { to { transform: rotate(360deg); } }
@media (max-width: 640px) {
  .run-head { font-size: 12px; padding: 7px 9px; }
  .run-n { font-size: 11px; }
}

/* 跑完后文案里已经有「N 个步骤」了，右边那个计数就多余（运行中才需要它） */
.run-box.done .run-n,
.run-box.fail .run-n { display: none; }


/* 运行中要把「第几步 + 在干什么 + 具体路径」看清楚（2026-11-02 老板补充）：
   名字和参数分两行；路径长了换行，不挤成一行省略号。 */
.run-body .tool-card { align-items: flex-start; }
.run-body .tool-card .tc-ico { margin-top: 1px; }
.tc-main {
  display: flex; flex-direction: column; gap: 2px;
  flex: 1 1 auto; min-width: 0;
}
.run-body .tool-card .tc-name { font-weight: 600; font-size: 12px; }
.run-body .tool-card .tc-arg {
  font-size: 11.5px; color: #8b959e; line-height: 1.45;
  white-space: normal; word-break: break-all;
  max-height: 3.1em; overflow: hidden;            /* 最多三行，防整段代码糊上来 */
  max-width: none;
}
.run-body .tool-card .tc-state { margin-top: 1px; }
/* 头部不再重复步数（文案里已经写了几步几秒） */
.run-n { display: none; }
@media (max-width: 640px) {
  .run-body .tool-card .tc-arg { max-width: none; max-height: 3.1em; }
}

/* 运行中本来就展开着，箭头没意义；完成后才需要它提示"可以点开看" */
.run-box.running .run-caret { display: none; }
.run-box.done .run-caret,
.run-box.fail .run-caret { color: #7d8790; }

/* 定时任务记录那一组（2026-11-02）：跟人工对话分开，颜色淡一点，
   一眼看出"这些是机器自动发的"，不是自己聊的 */
.conv-group-title.task-title {
  color: #9aa5ae;
  border-top: 1px solid #f0f2f3;
  margin-top: 6px;
  padding-top: 8px;
}
.conv-group-title.task-title span::before {
  content: "⏱";
  margin-right: 4px;
  opacity: .75;
  font-size: 10px;
}

/* 手机列表别每条都挂个粉色图钉（2026-11-02）：看着像一排按钮，很吵。
   置顶的长按一下就行，按钮只在**已置顶**那几条上显示，当作标记。 */
@media (max-width: 760px) {
  .conv-item .pin {
    opacity: 0; width: 0; padding: 0; margin: 0;
    pointer-events: none; overflow: hidden;
  }
  .conv-item .pin.on {
    opacity: .8; width: 18px; height: 18px; line-height: 18px;
    flex: 0 0 18px; margin-right: 2px; pointer-events: auto; font-size: 10px;
  }
}

/* 测试记录（2026-11-02）：自测造出来的会话，垫在最下面，颜色最淡 —— 一眼看出不用管 */
.conv-group-title.test-title {
  color: #b3bac1;
  border-top: 1px dashed #eef0f1;
  margin-top: 6px;
  padding-top: 8px;
}
.conv-group-title.test-title span::before {
  content: "◌";
  margin-right: 4px;
  font-size: 10px;
}
#convList .conv-item[data-origin="test"] .conv-t { color: #9aa5ae; }
