/* 极简实验室的样式。**够用就行，不做视觉设计。**
 *
 * 这一轮要看的是产出内容像不像人写的，不是页面好不好看。
 * 把时间花在配色上，实验本身的进度不会快一分钟。
 */

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  font-size: 14px;
  line-height: 1.7;
  color: #1f2937;
  background: #f5f6f8;
}

/* ---------------------------------------------------------------- 顶栏 */

.topbar {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 10px 20px;
  background: #111827;
  color: #e5e7eb;
  position: sticky;
  top: 0;
  z-index: 20;
  flex-wrap: wrap;
}
.brand { font-weight: 600; display: flex; align-items: center; gap: 8px; }
.brand .dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: #22c55e; display: inline-block;
}
.brand .ver { color: #9ca3af; font-weight: 400; font-size: 12px; }
.topbar nav { display: flex; gap: 4px; flex: 1; flex-wrap: wrap; }
.nav-item {
  color: #d1d5db; text-decoration: none; padding: 5px 11px;
  border-radius: 6px; font-size: 13px;
}
.nav-item:hover { background: #1f2937; color: #fff; }
.nav-item.on { background: #2563eb; color: #fff; }
.topbar .right { display: flex; align-items: center; gap: 10px; }
.linkish {
  background: none; border: none; color: #9ca3af;
  cursor: pointer; font-size: 13px;
}
.linkish:hover { color: #fff; text-decoration: underline; }

/* ---------------------------------------------------------------- 布局 */

main { max-width: 1180px; margin: 18px auto; padding: 0 16px 60px; }

.card {
  background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
  padding: 16px 18px; margin-bottom: 16px;
}
.card > h2 { margin: 0 0 4px; font-size: 16px; }
h4 { margin: 14px 0 6px; font-size: 13px; color: #374151; }

.note { color: #6b7280; font-size: 12.5px; margin: 4px 0 12px; }
.dim { color: #9ca3af; }
.loading, .empty, .empty-inline {
  color: #6b7280; padding: 18px; text-align: center;
}
.empty-inline {
  background: #f9fafb; border-radius: 8px; padding: 14px; text-align: left;
}
.empty-text { margin-bottom: 10px; }

/* 正在跑的那一步。**和"还没有生成"长得明显不一样** ——
   两者都是"下面没有内容"，但一个该等，一个该点。 */
.busy {
  border-left: 3px solid #2563eb; background: #eff6ff; color: #1e40af;
  padding: 12px 14px; border-radius: 6px; margin: 8px 0;
}

.warn-hint {
  color: #92400e; background: #fffbeb; border: 1px solid #fde68a;
  border-radius: 6px; padding: 9px 12px; margin: 8px 0; font-size: 13px;
}
.errbox { color: #b91c1c; background: #fef2f2; padding: 16px; border-radius: 8px; }
.fail-block {
  border: 1px solid #fecaca; background: #fef2f2;
  border-radius: 8px; padding: 12px 14px; margin-bottom: 16px;
}
.fail-title { font-weight: 600; color: #b91c1c; margin-bottom: 6px; }

/* ---------------------------------------------------------------- 组件 */

.btn {
  border: 1px solid #d1d5db; background: #fff; color: #1f2937;
  padding: 6px 13px; border-radius: 6px; cursor: pointer;
  font-size: 13px; font-family: inherit; text-decoration: none;
  display: inline-block;
}
.btn:hover:not(:disabled) { background: #f3f4f6; }
.btn.primary { background: #2563eb; border-color: #2563eb; color: #fff; }
.btn.primary:hover:not(:disabled) { background: #1d4ed8; }
.btn.small { padding: 3px 9px; font-size: 12px; }
.btn:disabled { opacity: .5; cursor: not-allowed; }

.toolbar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
           margin-bottom: 10px; }

.badge {
  display: inline-block; padding: 2px 8px; border-radius: 999px;
  font-size: 12px; background: #e5e7eb; color: #374151; margin-right: 5px;
}
.badge.ok   { background: #dcfce7; color: #166534; }
.badge.warn { background: #fef3c7; color: #92400e; }
.badge.err  { background: #fee2e2; color: #991b1b; }
.badge.dim  { background: #f3f4f6; color: #9ca3af; }

table.grid { width: 100%; border-collapse: collapse; font-size: 13px; }
table.grid th, table.grid td {
  border-bottom: 1px solid #f0f1f3; padding: 7px 9px;
  text-align: left; vertical-align: top;
}
table.grid thead th { background: #f9fafb; color: #6b7280; font-weight: 500; }
table.grid tr.dim-row td { color: #9ca3af; }
table.grid tr.sum-row td { font-weight: 600; border-top: 2px solid #d1d5db; }
table.grid td { font-variant-numeric: tabular-nums; }

table.kv { width: 100%; border-collapse: collapse; font-size: 13px; }
table.kv th {
  text-align: left; width: 150px; color: #6b7280; font-weight: 500;
  padding: 5px 10px 5px 0; vertical-align: top;
}
table.kv td { padding: 5px 0; vertical-align: top; }

ul.plain { margin: 3px 0; padding-left: 18px; }
ul.plain li { margin: 2px 0; }

.field { display: block; margin-bottom: 12px; }
.field-label { display: block; font-size: 13px; color: #374151; margin-bottom: 4px; }
.field-hint { display: block; font-size: 12px; color: #9ca3af; margin-top: 3px;
              white-space: pre-line; }
.field input, .field textarea, .field select {
  width: 100%; padding: 7px 9px; border: 1px solid #d1d5db;
  border-radius: 6px; font-family: inherit; font-size: 13px;
}
.field textarea { resize: vertical; }
.mark-select { padding: 3px 6px; border: 1px solid #d1d5db; border-radius: 5px;
               font-size: 12px; font-family: inherit; }

.subject-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 16px; background: #fff; border: 1px solid #e5e7eb;
  border-radius: 10px; padding: 14px 18px; margin-bottom: 16px;
}
.subject-head h1 { margin: 0 0 6px; font-size: 19px; }
.subject-head .sub { margin-bottom: 4px; }

.version-card {
  border: 1px solid #e5e7eb; border-radius: 8px;
  padding: 12px 14px; margin-bottom: 10px; background: #fff;
}
.version-card.approved { border-color: #86efac; background: #f0fdf4; }
.version-card.rejected { opacity: .65; }
.version-head { display: flex; align-items: center; gap: 8px;
                flex-wrap: wrap; margin-bottom: 8px; }
.profile-detail { border-top: 1px dashed #e5e7eb; padding-top: 10px; margin-top: 8px; }
.struct-card { border-left: 3px solid #d1d5db; padding-left: 12px; margin: 10px 0; }

/* 正文按段落渲染。行高和字号往阅读那边靠一点 ——
   这一页的用途就是"读一遍，判断像不像人写的"。 */
.article-body {
  background: #fcfcfd; border: 1px solid #eef0f2; border-radius: 8px;
  padding: 14px 18px; margin-top: 6px; font-size: 14.5px; line-height: 1.9;
  max-height: 620px; overflow: auto;
}
.article-body p { margin: 0 0 12px; }

pre.raw {
  background: #1f2937; color: #e5e7eb; padding: 12px; border-radius: 6px;
  font-family: Consolas, "Courier New", monospace; font-size: 12px;
  line-height: 1.6; white-space: pre-wrap; word-break: break-all;
  max-height: 420px; overflow: auto; margin-top: 8px;
}

.write-form { max-width: 720px; }

/* ---------------------------------------------------------------- 弹框 */

#modal-backdrop {
  position: fixed; inset: 0; background: rgba(17, 24, 39, .45);
  display: flex; align-items: center; justify-content: center; z-index: 50;
}
/* `hidden` 是靠 UA 样式的 display:none 实现的，而上面这条 display:flex
   会盖掉它 —— 主系统在这里踩过一次（白色遮挡层）。显式补一条。 */
#modal-backdrop[hidden] { display: none; }
.modal {
  background: #fff; border-radius: 10px; padding: 20px 22px;
  max-width: 820px; width: calc(100% - 40px); max-height: 84vh;
  overflow: auto; position: relative;
}
.modal h3 { margin: 0 0 12px; font-size: 16px; }
.modal-close {
  position: absolute; top: 10px; right: 12px; border: none;
  background: none; font-size: 22px; cursor: pointer; color: #9ca3af;
}
.modal-foot { display: flex; gap: 8px; margin-top: 16px; justify-content: flex-end; }

#toast {
  position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%);
  background: #111827; color: #fff; padding: 10px 18px;
  border-radius: 8px; z-index: 60; max-width: 80%; font-size: 13px;
}
#toast[hidden] { display: none; }
#toast.err { background: #b91c1c; }

/* ------------------------------------------------ P0：状态同步那一轮新增 */

/* 前端版本号。小、灰、不抢眼 —— 它是排查用的，不是给人天天看的。 */
.fe-ver {
  font-family: Consolas, "Courier New", monospace;
  font-size: 11px; color: #6b7280; letter-spacing: .3px;
}

/* 顶部"当前表达主体"那一条的小标签。
   不写这四个字的话，人会把主体名当成页面标题。 */
.cur-label {
  font-size: 12px; color: #9ca3af; letter-spacing: 1px; margin-bottom: 2px;
}

.head-actions { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; }
.head-actions .toolbar { margin-bottom: 0; }

/* 样本统计那张表：数字要能一眼对齐着比 */
table.stats td { font-size: 15px; font-weight: 600; }

/* ---------------------------------------------- V0.1 闭环冲刺：Tab 与诊断 */

.tabs { display: flex; gap: 2px; border-bottom: 2px solid #e5e7eb;
        margin-bottom: 16px; flex-wrap: wrap; }
.tab {
  border: none; background: none; padding: 9px 18px; cursor: pointer;
  font-size: 14px; font-family: inherit; color: #6b7280;
  border-bottom: 2px solid transparent; margin-bottom: -2px;
}
.tab:hover { color: #1f2937; background: #f9fafb; }
.tab.on { color: #2563eb; border-bottom-color: #2563eb; font-weight: 600; }

.ok-hint {
  color: #166534; background: #f0fdf4; border: 1px solid #bbf7d0;
  border-radius: 6px; padding: 9px 12px; margin: 8px 0 16px; font-size: 13px;
}

/* 段号。正文和诊断要靠它对得上 —— 诊断说"第 4 段"，
   人得能在正文里一眼找到第 4 段。 */
.pnum {
  display: inline-block; min-width: 30px; color: #9ca3af;
  font-family: Consolas, monospace; font-size: 12px; user-select: none;
}

.assess { font-size: 15px; line-height: 1.8; margin: 0 0 10px; }

/* 评分条。数字 + 条，比只给数字快得多 */
.bar { background: #f3f4f6; border-radius: 3px; height: 8px; width: 160px; }
.bar-fill { height: 8px; border-radius: 3px; }
.bar-fill.ok  { background: #22c55e; }
.bar-fill.mid { background: #f59e0b; }
.bar-fill.err { background: #ef4444; }

.finding {
  border-left: 3px solid #fbbf24; background: #fffbeb;
  padding: 10px 14px; margin-bottom: 10px; border-radius: 0 6px 6px 0;
}
.finding-head { margin-bottom: 6px; }
.evidence {
  margin: 6px 0; padding: 6px 12px; border-left: 3px solid #d1d5db;
  color: #4b5563; background: #fff; font-size: 13px;
}

/* ================================================== 老板验收账号（第六轮） */

/* 顶栏的操作人下拉。**不是登录** —— 见 index.html 顶部注释。 */
.actor-select {
  background: #1b1f27; color: #d8dee9; border: 1px solid #333a46;
  border-radius: 6px; padding: 3px 6px; font-size: 12px; max-width: 200px;
}
.badge.role { background: #2b313c; color: #b9c2d0; }
.badge.role.ok { background: #1f3a2a; color: #7fd6a0; }

/* 危险但要走的按钮：强制继续、清空、强制改状态。
   跟 primary 长得一样的话，这几个就太好点了。 */
.btn.danger { background: #4a2020; border-color: #6b2b2b; color: #ffb4b4; }
.btn.danger:hover { background: #5c2727; }

/* 理由输入 + 按钮。理由空的时候按钮是灰的 —— 不是提示一下就放行。 */
.reason-row { display: flex; gap: 6px; align-items: center; margin-top: 6px; }
.reason-row .inp { flex: 1; min-width: 160px; }
.reason-row button[disabled] { opacity: .4; cursor: not-allowed; }
.inp.reason { font-size: 12px; }

.form-row { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0; }
.form-row .inp { min-width: 150px; }
.inp.wide { flex: 2; min-width: 280px; }

.sub-block { margin-top: 14px; padding-top: 12px;
             border-top: 1px dashed #333a46; }
.sub-block h4 { margin: 0 0 4px; font-size: 13px; color: #c8d0dc; }

.tbl { width: 100%; border-collapse: collapse; margin-top: 8px;
       font-size: 12px; }
.tbl th, .tbl td { text-align: left; padding: 5px 8px;
                   border-bottom: 1px solid #262c36; vertical-align: top; }
.tbl th { color: #8b93a1; font-weight: 500; }
.tbl .mono { font-family: Consolas, monospace; font-size: 11px; }
/* 越权那几行标出来。**审计日志里最该被一眼看到的就是这些行。** */
.row-override td { background: #23191c; }

.who-line { display: flex; gap: 10px; align-items: center;
            flex-wrap: wrap; margin-bottom: 6px; }
.plan-box { margin-top: 8px; }

/* 缺前置数据的清单。列出来再给按钮 ——
   只给一个"强制继续"等于让人闭着眼睛点。 */
.miss-list { margin: 6px 0 10px 18px; color: #ffcf8f; }
.miss-list li { margin: 2px 0; }

/* 链接导入的预览。 */
.link-preview { margin-top: 10px; }
.link-preview .kv { display: flex; gap: 8px; margin: 3px 0; font-size: 13px; }
.link-preview .kv .k { color: #8b93a1; min-width: 40px; }
.excerpt {
  margin: 8px 0; padding: 8px 10px; background: #1a1e26;
  border-left: 3px solid #3a4250; border-radius: 0 4px 4px 0;
  color: #aab3c0; font-size: 12px; line-height: 1.7; white-space: pre-wrap;
}

/* ================================ 生成梯子（Tab1 还没有正文的时候） */
.steps { margin-top: 10px; }
.step {
  padding: 10px 12px; margin-bottom: 8px; border-radius: 6px;
  border: 1px solid #2b313c; background: #1a1e26;
}
/* 当前该做的那一步亮起来。**三步长得一样的话，人不知道该点哪个。** */
.step.on { border-color: #3d6a8f; background: #1b222c; }
.step.done { opacity: .75; }
.step.waiting { opacity: .55; }
.step-head { display: flex; gap: 10px; align-items: baseline;
             margin-bottom: 6px; }
.structure-box {
  margin-top: 8px; padding: 8px 10px; background: #161a21;
  border-radius: 4px; border-left: 3px solid #3a4250;
}

/* ================================================== 送进公众号草稿箱 */
.deliver-box { margin-top: 10px; }
.deliver-box .kv { max-width: 720px; }

/* ================================================== 发布（三步确认） */
.publish-stage { margin-top: 10px; }
/* 要逐字打出来的那句话。**给它足够的存在感** ——
   混在正文里的话，人会跳过去直接找输入框。 */
.phrase-box {
  margin: 10px 0 6px; padding: 10px 14px;
  background: #2a1f1f; border: 1px dashed #6b4a4a; border-radius: 6px;
  font-size: 15px; letter-spacing: 1px; color: #ffd7d7;
  user-select: none;              /* 不给复制 —— 能复制的确认等于没确认 */
}
.gate-list { margin: 4px 0 0 18px; }
.gate-list li { margin: 2px 0; }

/* ================================================== 多账号发布工作台 */
.tbl input[type="checkbox"] { width: 15px; height: 15px; cursor: pointer; }

/* ================================================== 接入向导 */
.ob-steps { margin-top: 6px; }
.ob-step { display: flex; gap: 12px; padding: 12px 0;
           border-bottom: 1px solid #262c36; }
.ob-step:last-child { border-bottom: none; }
.ob-dot {
  flex: none; width: 26px; height: 26px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: #2b313c; color: #98a2b1; font-size: 13px;
}
/* 做完的那几步淡下去。**没做完的才是要看的。** */
.ob-step.done .ob-dot { background: #1f3a2a; color: #7fd6a0; }
.ob-step.done .ob-title { color: #8b93a1; }
.ob-body { flex: 1; }
.ob-title { font-size: 14px; margin-bottom: 4px; color: #d8dee9; }
.ob-cmd {
  margin: 8px 0 0; padding: 8px 10px; background: #12151b;
  border-radius: 4px; border-left: 3px solid #3a4250;
  font-family: Consolas, monospace; font-size: 12px; color: #b9c2d0;
  white-space: pre-wrap; word-break: break-all; overflow-x: auto;
}

/* ================================================== 手工发布清单 */
.copy-row { margin-bottom: 12px; }
.copy-label { display: flex; align-items: center; gap: 10px;
              margin-bottom: 4px; font-size: 12px; color: #8b93a1; }
.copy-row .inp { width: 100%; }
.copy-area { font-family: Consolas, monospace; font-size: 12px;
             line-height: 1.7; resize: vertical; }

/* ============================================ 发布台账 */
.check-box { margin-top: 10px; }
.check-box .tbl { margin-top: 10px; }
.inp.tiny { font-size: 11px; padding: 2px 4px; max-width: 190px; }

/* ============================================ A 线：素材库与素材分析
 *
 * **只加新类，不改上面任何一条。** 这一轮有五条线在跑，
 * 改一条已有规则就等于让另外四条线的页面跟着变，而没人会去看。 */

/* 宽表横向滚动。展开分析列之后一行有十五列 ——
   不给容器的话整个页面会跟着横向滚，顶栏也跟着跑。 */
.tbl-scroll { overflow-x: auto; max-width: 100%; }
.tbl-scroll .tbl { min-width: 100%; }
.tbl tr.dim-row td { color: #6b7280; }
.tbl td, .tbl th { white-space: nowrap; }
.tbl td.small { white-space: normal; max-width: 320px; }
/* 标题那一列。公众号标题动辄四五十个字，不限宽的话一行就把表格
   撑到两千像素宽，右边那两个操作按钮直接跑出屏幕。 */
.tbl td.title-cell { white-space: normal; max-width: 420px; min-width: 220px; }
/* 操作那一列**不做 sticky**。
   试过：`position: sticky; right: 0` 在容器比表格窄的时候会把
   左边相邻的两列（分析状态、用途判断）盖住 —— 屏幕上看不出是被盖了，
   看起来就像那两列根本没画出来。横着滚一下比丢两列强。 */
.tbl td:last-child { white-space: nowrap; }

/* 「展开分析列」那个勾选。和筛选下拉排在同一行。 */
.col-toggle { display: inline-flex; align-items: center; gap: 4px;
              font-size: 12px; color: #8b93a1; cursor: pointer; }
.col-toggle input { width: 14px; height: 14px; cursor: pointer; }

/* 17 格那张表。**比 kv 多一个表头**，因为要标出每一格的来源和核实状态。 */
table.kv.fields thead th {
  font-size: 12px; color: #8b93a1; border-bottom: 1px solid #2b313c;
  padding-bottom: 6px; width: auto;
}
table.kv.fields th { width: 110px; }
table.kv.fields td { padding: 7px 8px 7px 0; vertical-align: middle; }
table.kv.fields tr { border-bottom: 1px solid #23272f; }
table.kv.fields tr.dim-row td, table.kv.fields tr.dim-row th { opacity: .45; }

/* 用途：九个可勾的格子。**平铺不折叠** ——
   折进下拉里的话，"这篇能拿来做什么"要点两下才看得见，
   而那正是这一栏存在的理由。 */
.purpose-grid { display: grid; gap: 8px;
                grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.purpose-item {
  display: grid; grid-template-columns: auto 1fr; gap: 2px 6px;
  align-items: center; padding: 8px 10px; border: 1px solid #2b313c;
  border-radius: 6px; cursor: pointer; background: #1a1e25;
}
.purpose-item:hover { border-color: #3a4250; }
.purpose-item.on { border-color: #2563eb; background: #172033; }
.purpose-item input { width: 15px; height: 15px; cursor: pointer; }
.purpose-label { font-size: 13px; color: #d8dee9; }
.purpose-hint, .purpose-reason {
  grid-column: 1 / -1; font-size: 11px; color: #8b93a1; line-height: 1.5;
}
.purpose-reason { color: #9fb0c8; }

/* 弹框里的表单。mvp 那边叫同一个名字，这里补一份最小样式。 */
.card-form { margin-top: 4px; }

/* ============================================ 号主 / 作者库（B 线）
 *
 * 只加 `.am-` 前缀的类，**一个已有规则都不改** ——
 * 五条线同时在这个文件上改共享规则，改出来的样式互相打架，
 * 而"谁把按钮改窄了"这种问题查起来没有起点。
 *
 * 长期稳定和近期变化是**并排两栏**，不是上下两段。
 * 上下摆的话，屏幕短的时候近期那一栏要滚动才看得见 ——
 * 而"最近变了没有"正是打开这一页最常问的问题。 */
.am-two {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
}
@media (max-width: 900px) {
  .am-two { grid-template-columns: 1fr; }
}
.am-col {
  background: #12151b; border: 1px solid #262b34; border-radius: 6px;
  padding: 12px 14px;
}
.am-col-title { margin: 0 0 6px; font-size: 14px; }
.am-col-title.ok { color: #7fd6a0; }
.am-col-title.warn { color: #e2b86b; }

.am-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}
.am-group { min-width: 0; }
.am-group-label {
  font-size: 12px; color: #8b93a1; margin: 8px 0 4px;
}
.am-chips { display: flex; flex-wrap: wrap; gap: 6px; }

/* 一条特征。**整块可点** —— 能点开看证据这件事必须看得出来，
 * 藏在文字里没人会去点。 */
.am-chip {
  display: inline-flex; align-items: baseline; gap: 6px;
  padding: 3px 9px; border-radius: 12px; cursor: pointer;
  background: #1a1f27; border: 1px solid #313945; color: #d8dee9;
  font-size: 12.5px; font-family: inherit; line-height: 1.6;
}
.am-chip:hover { border-color: #4b5563; background: #212733; }
.am-chip-v { font-weight: 600; }
.am-chip-n { font-size: 11px; color: #8b93a1; }
.am-chip-tag {
  font-size: 10px; padding: 0 5px; border-radius: 8px;
  background: #263244; color: #9fc0e8;
}
/* 人工确认过的要一眼看得出来：它压过统计，**重跑一百遍也在**。 */
.am-chip.pinned { border-color: #3f7f5c; background: #16241d; }
.am-chip.excluded {
  border-color: #7f3f3f; background: #241616; color: #b58f8f;
  text-decoration: line-through;
}
.am-toolbar { margin: 10px 0 14px; flex-wrap: wrap; }

/* ============================================ C 线段：批量工作台
 *
 * **整段追加在文件末尾。** style.css 和 store.py / server.py 一样，
 * 是五条线都要加东西的地方 —— 各自在自己那一段末尾追加，
 * 合并时才不会撞成一团。
 *
 * 前缀一律 `bq-`（batch queue）。不用通用名字是为了不撞别人 ——
 * 一个叫 `.card` 或 `.row` 的新类，另外四条线也很可能会想加。 */

/* 几个通用小工具。**已经有代码在用它们了**（publish.js 里的
 * `class: 'small muted'`），但样式表里一直没有 —— 于是那些字
 * 和正文一样大、一样黑。补上。 */
.muted { color: #6b7280; }
.small { font-size: 12px; }
.num   { font-variant-numeric: tabular-nums; text-align: right; }
.inp {
  border: 1px solid #d1d5db; border-radius: 6px; padding: 6px 9px;
  font-size: 13px; font-family: inherit; background: #fff; color: #1f2937;
}
.inp:focus { outline: 2px solid #bfdbfe; outline-offset: -1px; }
textarea.inp { width: 100%; line-height: 1.6; resize: vertical; }
.ok-hint { color: #166534; background: #f0fdf4; border: 1px solid #bbf7d0;
           border-radius: 6px; padding: 8px 12px; font-size: 13px; }

/* ---- 进度 ---- */

.bq-progress { margin: 6px 0 10px; }
.bq-progress .bar { width: 100%; height: 10px; }
.bq-progress .bar-fill { transition: width .3s ease; background: #2563eb; }

.bq-counts { display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
             margin: 8px 0; }
.bq-chip {
  display: inline-flex; align-items: baseline; gap: 5px;
  background: #f3f4f6; border-radius: 6px; padding: 3px 9px; font-size: 12px;
}
.bq-chip b { font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; }
.bq-chip i { font-style: normal; color: #6b7280; }
.bq-chip.ok   { background: #dcfce7; }
.bq-chip.ok b { color: #166534; }
.bq-chip.warn { background: #fef3c7; }
.bq-chip.warn b { color: #92400e; }
.bq-chip.err  { background: #fee2e2; }
.bq-chip.err b { color: #991b1b; }
.bq-chip.dim b { color: #6b7280; }
.bq-pct { margin-left: auto; font-size: 12px; color: #6b7280;
          font-variant-numeric: tabular-nums; }
.bq-rate { display: flex; gap: 8px; align-items: center; margin-top: 4px; }

/* ---- 为什么停了 ----
 *
 * **预算撞墙用红底，人工暂停用黄底。** 同色的话，
 * 军哥分不清是自己点的还是系统拦的，而这两件事的下一步完全不同。 */

.bq-banner {
  border-radius: 8px; padding: 12px 14px; margin-bottom: 12px;
  border: 1px solid #fde68a; background: #fffbeb;
}
.bq-banner.budget { border-color: #fecaca; background: #fef2f2; }
.bq-banner-main { font-weight: 600; color: #92400e; margin-bottom: 4px; }
.bq-banner.budget .bq-banner-main { color: #b91c1c; }
.bq-banner-hint { font-size: 13px; color: #6b7280; margin-bottom: 8px; }

/* ---- 失败原因 ---- */

.bq-err { max-width: 460px; }
.bq-err-human { color: #b91c1c; font-weight: 500; }
.bq-err-hint  { color: #6b7280; font-size: 12px; margin-top: 2px; }
.bq-err pre.raw { max-height: 180px; font-size: 11px; }
.bq-row-err td { background: #fffbfb; }

/* ---- 任务表 / 条目表 ---- */

.bq-tasks td, .bq-items td { vertical-align: top; }
.bq-items .bq-url a { color: #2563eb; text-decoration: none;
                      word-break: break-all; }
.bq-items .bq-url a:hover { text-decoration: underline; }
.bq-bar { margin: 10px 0 4px; }

/* ---- 多选列表 ----
 *
 * 每一层都是多选：单篇是一条线，批量是一棵树。 */

.bq-picklist { border: 1px solid #eef0f2; border-radius: 8px; padding: 10px; }
.bq-pick-rows { max-height: 460px; overflow: auto; }
.bq-pick-all { display: inline-flex; align-items: center; gap: 5px;
               font-size: 13px; cursor: pointer; }
.bq-pick {
  display: flex; gap: 10px; align-items: flex-start; cursor: pointer;
  padding: 8px 6px; border-bottom: 1px solid #f5f6f8;
}
.bq-pick:hover { background: #f9fafb; }
.bq-pick input[type="checkbox"] { width: 15px; height: 15px; margin-top: 4px;
                                  cursor: pointer; flex: none; }
.bq-pick-body { flex: 1; min-width: 0; }
.bq-pick-title { font-weight: 500; }
.bq-pick-meta { display: flex; gap: 8px; align-items: center;
                flex-wrap: wrap; margin-top: 2px; }
.bq-struct { font-size: 12px; color: #6b7280; margin-top: 5px;
             border-left: 2px solid #e5e7eb; padding-left: 9px; }

/* ---- 自定义指令 ----
 *
 * 预设做成**多选的小按钮**，不是下拉 ——
 * 下拉的话「冲突加强 + 结尾不要说教」就点不出来了。 */

.bq-instr { border-top: 1px dashed #e5e7eb; margin-top: 12px; padding-top: 10px; }
.bq-instr-label { font-size: 13px; margin-bottom: 6px; }
.bq-presets { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.bq-preset { border-style: dashed; }
.bq-preset.on {
  background: #2563eb; border-color: #2563eb; color: #fff;
  border-style: solid;
}
.bq-preset.on:hover:not(:disabled) { background: #1d4ed8; }
.bq-inline { display: inline-flex; align-items: center; gap: 5px;
             font-size: 13px; }

/* ---- 号主 ---- */

.bq-owners { display: flex; gap: 8px; flex-wrap: wrap; }
.bq-owner {
  display: inline-flex; align-items: baseline; gap: 6px;
  background: #f3f4f6; border-radius: 6px; padding: 4px 10px; font-size: 13px;
}
.bq-owner i { font-style: normal; color: #6b7280; font-size: 12px; }

.bq-tosubject { display: flex; gap: 10px; align-items: center;
                flex-wrap: wrap; margin-top: 10px;
                border-top: 1px dashed #e5e7eb; padding-top: 10px; }
.bq-adminlink { margin-top: 8px; }

/* ---- 管理后台的旋钮 ---- */

.bq-setting {
  border: 1px solid #eef0f2; border-radius: 8px;
  padding: 10px 12px; margin-bottom: 10px;
}
.bq-setting-head { display: flex; gap: 8px; align-items: center;
                   flex-wrap: wrap; margin-bottom: 4px; }
.bq-setting-head .inp { max-width: 110px; text-align: right; }
.bq-setting .dim { color: #9ca3af; }

/* ================================================== 审核台（D 线，第九轮） */

/* 总分盘。**数字要大** —— 运营人员打开这一页第一眼找的就是它。 */
.au-scoreboard {
  display: flex; gap: 18px; align-items: center; flex-wrap: wrap;
  margin-bottom: 14px;
}
.au-score {
  min-width: 118px; text-align: center; padding: 12px 16px;
  border-radius: 10px; background: #f3f4f6; border: 1px solid #e5e7eb;
}
.au-score.ok   { background: #f0fdf4; border-color: #bbf7d0; }
.au-score.warn { background: #fffbeb; border-color: #fde68a; }
.au-score.err  { background: #fef2f2; border-color: #fecaca; }
.au-score.dim  { background: #f9fafb; border-color: #e5e7eb; }
.au-score-num { font-size: 34px; font-weight: 700; line-height: 1.1; }
/* "数据不足"四个字比数字长得多，缩一号免得撑破盒子。
   **但绝不缩成 0** —— 那是这一页最要紧的一条诚实性。 */
.au-score-num:not(:empty) { word-break: keep-all; }
.au-score .au-score-num { font-size: 34px; }
.au-score.dim .au-score-num { font-size: 20px; color: #6b7280; }
.au-score-cap { font-size: 11px; color: #6b7280; margin-top: 4px; }
.au-score-side { flex: 1; min-width: 260px; }
.au-arrow { font-size: 26px; color: #9ca3af; }

/* 数据不足的标记。**灰的、带一句解释，不画进度条。** */
.au-nodata {
  font-size: 12px; color: #9ca3af; background: #f9fafb;
  border: 1px dashed #d1d5db; border-radius: 4px; padding: 2px 8px;
}
.au-row-unknown { background: #fcfcfd; }
.au-row-unknown .au-cell-score { color: #9ca3af; font-size: 12px; }

/* 问题诊断：左正文右问题。**同屏才点得动。** */
.au-split { display: flex; gap: 16px; align-items: flex-start; }
.au-left  { flex: 1 1 55%; min-width: 0; }
.au-right { flex: 1 1 45%; min-width: 0; max-height: 720px; overflow: auto; }
@media (max-width: 1080px) {
  .au-split { flex-direction: column; }
  .au-right { max-height: none; width: 100%; }
}
.au-title-line {
  font-weight: 600; padding: 6px 10px; background: #f3f4f6;
  border-radius: 6px; margin-bottom: 6px; font-size: 13px;
}
.au-article { max-height: 720px; }
.au-para { transition: background .18s; padding: 2px 4px; border-radius: 4px; }
/* 命中段落。**整段变色 + 命中处 <mark>** —— 只标一处的话，
   段落很长时视线还是要找。 */
.au-para.hit { background: #fff7ed; box-shadow: inset 0 0 0 2px #fdba74; }
.au-mark { background: #fde68a; padding: 0 2px; border-radius: 3px; }

.au-problem { cursor: pointer; }
.au-problem:hover { background: #fff7e6; }
.au-problem.on { border-left-color: #ef4444; background: #fff1f2; }
.au-problem-title { font-weight: 600; margin: 4px 0; }
.au-why { font-size: 13px; color: #92400e; margin: 4px 0; }
.au-fix { font-size: 13px; color: #166534; margin: 4px 0; }
.au-src { font-size: 11px; margin-top: 6px; }
.au-check { width: 15px; height: 15px; vertical-align: middle; cursor: pointer; }
.au-problem-list h4 { margin: 12px 0 6px; }
.au-top-problems .au-problem { cursor: pointer; }
.au-solved { border-left-color: #86efac; background: #f0fdf4; }

.au-actions { flex-wrap: wrap; align-items: center; }
.au-sep { color: #d1d5db; padding: 0 4px; }
.btn.ok-btn { border-color: #86efac; color: #166534; }
.au-instructions { margin: 6px 0 0 18px; line-height: 1.9; }
.au-instructions li { margin-bottom: 10px; }
.au-editor { width: 100%; font-family: inherit; line-height: 1.8; }
.au-whylow { font-size: 12px; color: #92400e; max-width: 380px; }
.au-scores td { vertical-align: top; }
pre.raw.small { font-size: 11px; max-height: 220px; overflow: auto; }

/* ============================================ 产品线（UX）：五个业务入口
 *
 * 追加在末尾，上面一条规则都没动。
 */

/* ------------------------------------------------------------ 导航下拉 */

.nav-group { position: relative; }
.nav-toggle {
  background: none; border: none; cursor: pointer;
  font-family: inherit; line-height: inherit;
}
.nav-menu {
  display: none; position: absolute; left: 0; top: 100%;
  min-width: 190px; padding: 6px; z-index: 40;
  background: #111827; border: 1px solid #374151; border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
  flex-direction: column; gap: 2px;
}
.nav-group.open .nav-menu { display: flex; }
.nav-menu .nav-item { display: block; white-space: nowrap; }

/* ------------------------------------------------------------ 工作台 */

.wb-cards {
  display: grid; gap: 12px; margin: 14px 0 18px;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}
.wb-card {
  text-align: left; cursor: pointer; font-family: inherit;
  background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
  padding: 16px 18px; border-left: 4px solid #9ca3af;
}
.wb-card:hover { border-color: #2563eb; box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.wb-card.ok   { border-left-color: #16a34a; }
.wb-card.warn { border-left-color: #d97706; }
.wb-card.err  { border-left-color: #dc2626; }
.wb-card.dim  { border-left-color: #d1d5db; }
.wb-num { font-size: 30px; font-weight: 700; line-height: 1.2; color: #111827; }
.wb-label { font-size: 15px; font-weight: 600; margin-top: 2px; }
.wb-human { font-size: 12px; color: #6b7280; margin-top: 4px; }

.wb-accounts { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.wb-acc { font-size: 13px; padding: 2px 9px; border-radius: 999px;
          background: #eef2ff; color: #3730a3; }
.wb-acc.ok   { background: #dcfce7; color: #166534; }
.wb-acc.warn { background: #fef3c7; color: #92400e; }
.wb-acc.err  { background: #fee2e2; color: #991b1b; }
.wb-acc.dim  { background: #f3f4f6; color: #6b7280; }

.wb-list { list-style: none; padding: 0; margin: 0; }
.wb-list li { padding: 6px 0; border-bottom: 1px solid #f3f4f6; }
.wb-list li:last-child { border-bottom: none; }
.wb-problem { padding: 10px 0; }

/* ------------------------------------------------------------ 爆文库 */

.hp-top { display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
          margin-bottom: 10px; }
.hp-top .inp.wide { flex: 1; min-width: 240px; }
.hp-filters { flex-wrap: wrap; }

/* ------------------------------------------------------------ 创作 */

.cr-quick .field { margin-bottom: 14px; }
.cr-ref-wrap { margin: 4px 0 14px; }
.cr-ref {
  border: 1px solid #dbeafe; background: #f8fafc; border-radius: 8px;
  padding: 12px 14px; margin-top: 6px;
}
.cr-ref.empty { border-color: #e5e7eb; background: #fafafa; }
.cr-ref-head { display: flex; justify-content: space-between;
               align-items: center; gap: 10px; margin-bottom: 8px; }
.cr-pro { border-top: 1px dashed #e5e7eb; padding-top: 14px; margin-top: 6px; }
.cr-status { min-height: 22px; font-size: 13px; color: #6b7280; }
.cr-status.busy { color: #b45309; }
.cr-status.ok { color: #166534; }
.btn.big { padding: 9px 26px; font-size: 15px; }

/* ===== 小助理 AI 工作管理 ===== */
/*
 * 追加在文件末尾，**上面一行都没动。**
 *
 * 这一块的目标不是好看，是"手机和电脑上都能一眼看清、点得中"。
 * 所以只有三样东西：大数字、大按钮、够大的点击区域。
 * 配色全部沿用上面已有的那几个（灰 / 蓝 / 绿 / 橙 / 红），
 * 不引入新色板 —— 多一套颜色，"红色代表什么"就开始不确定了。
 */

.aw-title { font-size: 20px; margin: 0 0 2px; }
.aw-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 12px; flex-wrap: wrap; margin: 4px 0 14px;
}
.aw-head-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.aw-who { color: #6b7280; font-size: 13px; }

/* 一句安静的交代。**不是错误**，所以既不红也不带图标。 */
.aw-quiet { color: #6b7280; font-size: 13px; margin: 6px 0 10px; }
.aw-locked {
  color: #92400e; background: #fffbeb; border: 1px solid #fde68a;
  border-radius: 6px; padding: 6px 10px; font-size: 13px; margin-top: 8px;
}

/* 数字块。**数字大、标签小** —— 一屏扫过去要先看见数。 */
.aw-stats {
  display: grid; gap: 10px; margin: 10px 0;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
}
.aw-stat {
  background: #fff; border: 1px solid #e5e7eb; border-radius: 8px;
  padding: 10px 12px; border-left: 4px solid #d1d5db; text-align: left;
}
.aw-stat.ok   { border-left-color: #16a34a; }
.aw-stat.warn { border-left-color: #d97706; }
.aw-stat.err  { border-left-color: #dc2626; }
.aw-stat-num { font-size: 26px; font-weight: 700; line-height: 1.25; color: #111827; }
.aw-stat-label { font-size: 12.5px; color: #6b7280; }

/* 五个大按钮。**手指点得中**：最小高度 76px，不是一行小链接。 */
.aw-acts {
  display: grid; gap: 12px; margin: 6px 0 18px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}
.aw-act {
  min-height: 76px; cursor: pointer; font-family: inherit; text-align: left;
  background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
  padding: 14px 16px; border-left: 4px solid #2563eb;
}
.aw-act:hover { border-color: #2563eb; box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.aw-act-label { font-size: 17px; font-weight: 600; color: #111827; }
.aw-act-hint { font-size: 12.5px; color: #6b7280; margin-top: 4px; }

/* 今日异常。橙色，不是红色 —— 它要人看一眼，不是要人停下手里的活。 */
.aw-alerts { list-style: none; padding: 0; margin: 8px 0 0; }
.aw-alerts li {
  font-size: 13px; color: #92400e; background: #fffbeb;
  border-left: 3px solid #f59e0b; padding: 5px 10px; margin-bottom: 4px;
  border-radius: 0 6px 6px 0;
}

/* 逐行结果 / 记录列表。**理由那一行和主行一样重要**，所以不缩成小灰字。 */
.aw-list { list-style: none; padding: 0; margin: 0; }
.aw-row { padding: 9px 0; border-bottom: 1px solid #f3f4f6; }
.aw-row:last-child { border-bottom: none; }
.aw-row-top { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.aw-row-no { color: #9ca3af; font-size: 12px; min-width: 34px; }
.aw-row-main { flex: 1; min-width: 180px; word-break: break-all; }
.aw-row-why { font-size: 13px; color: #6b7280; margin-top: 3px; }
.aw-link { display: inline-block; margin-top: 4px; }

/* 聊天。**只有两个身份：我 / AI主管。** 四个内部角色一个都不露出来。 */
.aw-chat {
  list-style: none; padding: 0; margin: 0 0 12px;
  max-height: 460px; overflow-y: auto;
}
.aw-msg { padding: 9px 12px; border-radius: 10px; margin-bottom: 8px; max-width: 92%; }
.aw-msg.me { background: #eff6ff; margin-left: auto; }
.aw-msg.ai { background: #f8fafc; border: 1px solid #eef2f7; }
.aw-msg-who { font-size: 12px; color: #6b7280; margin-bottom: 2px; }
/* `role_hint`：这一次是按哪个角度答的。小字、灰色 ——
   它帮人判断答得对不对，**不是一个可以点的开关**。 */
.aw-msg-hint { font-size: 12px; color: #9ca3af; margin-top: 4px; }
.aw-send textarea { width: 100%; }

/* 换行要保住：AI 回复和复盘答案都是多行的。 */
.aw-text { white-space: pre-wrap; word-break: break-word; }

/* 员工卡片。**左边那条色带就是状态**，一屏扫过去先看颜色。 */
.aw-people {
  display: grid; gap: 12px; margin: 10px 0 16px;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.aw-person {
  cursor: pointer; font-family: inherit; text-align: left; font-size: 13px;
  background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
  padding: 12px 14px; border-left: 4px solid #d1d5db; line-height: 1.7;
}
.aw-person:hover { border-color: #2563eb; box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.aw-person.ok   { border-left-color: #16a34a; }
.aw-person.warn { border-left-color: #d97706; }
.aw-person.err  { border-left-color: #dc2626; }
.aw-person-top { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.aw-person-name { font-size: 16px; font-weight: 600; color: #111827; }
.aw-person-nums { display: flex; gap: 12px; flex-wrap: wrap; color: #374151;
                  margin-top: 4px; }
.aw-person-line { color: #6b7280; }

/* 趋势表。**横向能滚**，不然手机上会把整页撑宽。 */
.aw-trend { width: 100%; border-collapse: collapse; font-size: 13px;
            display: block; overflow-x: auto; }
.aw-trend th, .aw-trend td {
  border-bottom: 1px solid #f3f4f6; padding: 6px 10px; text-align: left;
  white-space: nowrap;
}
.aw-trend th { color: #6b7280; font-weight: 600; }

.aw-form textarea, .aw-form input[type="text"], .aw-form input[type="password"] {
  width: 100%;
}
.aw-block .toolbar .inp { min-width: 130px; }

/* 手机。**一列到底** —— 两列在 375px 上会把数字挤成两行。 */
@media (max-width: 640px) {
  .aw-head { flex-direction: column; }
  .aw-acts { grid-template-columns: 1fr 1fr; }
  .aw-people { grid-template-columns: 1fr; }
  .aw-stats { grid-template-columns: repeat(auto-fit, minmax(84px, 1fr)); }
  .aw-msg { max-width: 100%; }
  .btn.big { width: 100%; }
}
