/* board 站点布局：色板/圆角/阴影等 tokens 一律来自 tokens.css（共享接口，
   hub 未来引用同一文件——命名即接口，本文件只写 board 自己的布局）。

   2026-08-10「方案 A · 克制中性」换肤（UI-1）：本文件是全站共享层，随
   tokens.css 一起重做。核心原则只有一条——颜色只表达含义，不做装饰
   （见 tokens.css 顶部注释）。本文件里每一处旧的 --primary/--accent
   （靛蓝/橙）用色都已替换成中性 --ink 或语义色，不再新增这两个别名的
   使用（tokens.css 已注明它们只保留给还没来得及改的旧模板兜底）。
   类名一个不删——模板从未改名，改的只是长什么样。 */
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:15px/1.6 var(--font-stack);
  /* 数字是主角：全站默认等宽对齐，不用逐处补 .num——tabular-nums 对
     非数字字符无影响，直接挂在 body 上比满世界找「这格是不是数字」
     更省事也更不会漏（tokens.css 的 .num/td.n 仍保留，给需要单独覆盖
     字重/字号的地方用）。 */
  font-variant-numeric:tabular-nums;font-feature-settings:var(--num-feat)}
a{color:var(--ink);text-decoration:none}
/* 链接不是蓝色：正文墨色 + 悬停下划线（军哥原话点名的「蓝紫色」在这版
   彻底退场）。侧栏导航单独在下面覆盖成「不下划线，靠变色/左缘线示意」
   ——导航项不是正文链接，下划线在那里是噪音不是信号。 */
a:hover{text-decoration:underline}
blockquote{margin:14px 0;padding:2px 0 2px 14px;border-left:2px solid var(--line);
  color:var(--muted);font-size:15px}

/* ---- 侧栏骨架（≤860px CSS checkbox 抽屉，零 JS 不变）---- */
.layout{display:flex;min-height:100vh}
.sidebar{flex:0 0 230px;background:var(--bg);
  border-right:1px solid var(--line);padding:22px 0}
/* 品牌角：从「大号加粗靛蓝」退成「小号大写灰字」——它是坐标不是广告位，
   军哥原话「这也太丑了」很大一部分就是旧版把 CI 色铺得到处都是。 */
.sidebar .brand{display:block;font-size:13px;font-weight:600;
  letter-spacing:.14em;color:var(--faint);text-transform:uppercase;
  padding:0 20px 20px;margin:0}
.sidebar .brand:hover{text-decoration:none;color:var(--ink)}
.nav-group{font-size:11px;letter-spacing:.1em;color:var(--faint);
  text-transform:uppercase;margin:18px 0 6px;padding:0 20px}
/* 扁平导航：去圆角去底色块，行与行之间只靠留白分隔。当前项不再涂色块
   （旧版是靛蓝底白字），改成「墨色 + 加粗 + 左缘一条 2px 墨线」——
   颜色只留给状态点，导航的「在哪」靠位置/字重/线条表达。 */
.nav-item{display:flex;align-items:center;gap:8px;padding:7px 20px;
  color:var(--muted);font-size:14px;text-decoration:none}
.nav-item:hover{color:var(--ink);text-decoration:none}
.nav-item.on{color:var(--ink);font-weight:600;
  box-shadow:inset 2px 0 0 var(--ink)}
.nav-item .tag{margin:0}
main{flex:1 1 auto;max-width:var(--wrap-w);margin:0 auto;
  padding:28px 40px 60px;min-width:0}
.topbar{display:none}
.scrim{display:none}
.nav-toggle{display:none}
.foot{color:var(--faint);font-size:12px;text-align:center;padding:20px}
h1{font-size:22px;font-weight:650;letter-spacing:-.01em;margin:4px 0 16px;
  color:var(--ink)}
/* 区段标题退到背景里：小号、大写、字距拉开、三级灰——层级靠字号与灰度，
   不靠色块（tokens.css 顶部原则②）。.card-head 里的 h2 是卡片/区域的
   可点标题（市场名、事项标题……），信息密度不同，下面单独覆盖回可读
   尺寸，不跟着缩成小字注脚。 */
h2{font-size:12px;font-weight:600;letter-spacing:.08em;color:var(--faint);
  text-transform:uppercase;margin:24px 0 10px}
h3{font-size:14px;font-weight:600;color:var(--ink);margin:0 0 4px}

/* ---- 卡片网格（.hcard 基类在 tokens.css）与既有组件 ---- */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.card-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
/* 卡片标题（市场名/事项标题）：可点、墨色、比区段标题大一档——它是内容
   不是装饰性导航，不该跟着 h2 一起缩成大写小字。 */
.card-head h2{font-size:15px;font-weight:600;letter-spacing:0;
  color:var(--ink);text-transform:none;margin:0}
.card-head h2 a,h2 a{color:var(--ink)}
.card-head h2 a:hover,h2 a:hover{text-decoration:underline}
/* 状态点：12px → 5px（军哥选定方案 A 的明确尺寸）。旧版又大又占位，
   一屏七八个圆点抢戏；缩小后颜色仍然可辨，但不再跟数字抢视觉重量。 */
.dot{width:5px;height:5px;border-radius:50%;display:inline-block;flex:none;
  vertical-align:1px}
.dot.green{background:var(--green)}
.dot.yellow{background:var(--yellow)}
.dot.grey{background:var(--grey)}
.dot.red{background:var(--red)}
/* .tag/.chip 基础样式已在 tokens.css 里定义（灰描边胶囊），本文件不
   重复声明——旧版这里另写过一份靛蓝描边覆盖掉它，两处各改一半最容易
   漂移，删掉重复定义，样式单一事实源回到 tokens.css。 */
.muted{color:var(--muted);font-size:13px;margin:6px 0}
/* 黄灯提示：旧版借用 --accent（原橙色）表警示，那两个别名现已退成墨色
   别名（tokens.css 说明），警示语义必须换成真正的语义色 token。 */
.warn{color:var(--yellow);font-size:13px;margin:6px 0}
/* .alarm 比 .warn 高一档：只跟着 red 灯出现，加粗以便一屏扫过时抓得住。 */
.alarm{color:var(--red);font-size:13px;margin:6px 0;font-weight:600}
/* 数字方块：用「flex-wrap + 1px 缝隙」拼出的发丝分隔（gap 背景=--line，
   格子本身白底），跟方案 A 首页「今天要看的」三格同一种做法——比旧版
   灰底圆角格子更安静，也更像"一张小表"而不是"一张卡片"。
   刻意不用 CSS Grid：漏斗永远是 4 个数，Grid 的 auto-fit 按整个容器定列数，
   碰上换行（比如卡片较窄只放得下 3 列）最后一行会露出没内容的空白网格
   （4 个数换行成 3+1，第 2/3 列凭空多出一块灰色空格）。flex-wrap 按每一行
   自己的剩余空间把 flex:1 的格子撑满，同样的换行下最后一行那 1 个数会
   自然铺满整行，不会露出空洞（2026-08-09 本地截图核验时发现，改用 flex）。 */
.nums{display:flex;flex-wrap:wrap;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  margin:10px 0}
.nums div{flex:1 1 84px;background:var(--card);text-align:center;padding:10px 4px}
/* 数字是主角：加大加粗、比标签明显重一级；标签退到三级灰、小一号
   （原则①：数字放大加粗，标签退到背景里）。 */
.nums b{display:block;font-size:24px;font-weight:600;color:var(--ink);
  letter-spacing:-.01em}
.nums span{font-size:11px;color:var(--faint)}
.mon{font-size:14px;margin:6px 0;color:var(--muted)}
/* 出处折叠：跟区段标题一样退到三级灰，它是"可以不看"的元信息。 */
.evidence summary{cursor:pointer;font-size:12px;color:var(--faint)}
.evidence p{font-size:12px;color:var(--muted);margin:6px 0;word-break:break-all}
.evidence pre{font-size:11px;background:var(--sunken);border-radius:8px;padding:8px;
  overflow-x:auto;white-space:pre-wrap;word-break:break-all}
/* .kbody（知识详情正文，最长约 15000 字）：功能性 overflow 修复，不是
   Task 5 的样式打磨——裸 <pre> 默认 white-space:pre 不换行，长正文会把
   手机页面横向撑爆，全站「零横向滚动」铁律不允许（2026-08-08 review
   fix 2）。只补跟 .evidence pre 同款的三条防爆规则，其余留给 Task 5。 */
.kbody{overflow-x:auto;white-space:pre-wrap;word-break:break-all}
.chart-wrap{overflow-x:auto;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:10px;margin:12px 0}
.chart{width:100%;min-width:560px;height:auto}
.grid{stroke:var(--line);stroke-width:1}
.tick{font-size:11px;fill:var(--muted)}
.section{background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:14px 16px;margin:12px 0}
/* .kv 同 .nums 一套「flex-wrap 发丝网格」处理（原因见 .nums 上方注释——
   部门钻取页一次铺 12 个指标，换行更常见，Grid 的空洞问题在这里更明显），
   字号略小一档（详情页指标更密）。 */
.kv{display:flex;flex-wrap:wrap;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.kv div{flex:1 1 104px;background:var(--card);text-align:center;padding:10px 6px}
.kv b{display:block;font-size:20px;font-weight:600;color:var(--ink)}
.kv span{font-size:11px;color:var(--faint)}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.back-link{margin:0 0 6px}
.line-block{border-top:1px solid var(--line);padding-top:10px;margin-top:10px}
.line-block:first-of-type{border-top:none;padding-top:0;margin-top:0}
.line-block h3{font-size:15px;margin:0 0 4px;display:flex;align-items:center;gap:6px}
.breakdown{margin-top:-2px}

/* ---- 部门钻取量级条（Task 6）---- */
.dept-row{display:flex;align-items:center;gap:10px;padding:6px 0;
  border-top:1px solid var(--line)}
.dept-row:first-of-type{border-top:none}
.dept-name{flex:0 0 auto;min-width:110px}
.bar-track{flex:1 1 80px;height:8px;background:var(--sunken);
  border:1px solid var(--line);border-radius:4px;overflow:hidden}
.bar-fill{height:100%;background:var(--ink);border-radius:4px}
.dept-nums{flex:0 0 auto;font-size:12px;color:var(--muted)}

/* ---- P3d 日期条（零 JS：form GET + input[type=date]，服务端算前后日）---- */
.datebar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:8px 12px;margin:10px 0}
.datebar label{font-size:13px;color:var(--muted)}
.datebar input[type=date]{font:inherit;font-size:14px;color:var(--ink);
  background:var(--bg);border:1px solid var(--line);border-radius:8px;
  padding:4px 8px}
.datebar button{font:inherit;font-size:14px;color:#fff;
  background:var(--ink);border:none;border-radius:8px;padding:5px 14px;
  cursor:pointer}
.datenav{font-size:13px;color:var(--ink);padding:2px 4px;white-space:nowrap}
.datenav.off{color:var(--faint);opacity:.5}

/* ---- ≤860px：侧栏变抽屉（零 JS） ---- */
@media (max-width:860px){
  /* 顶栏白底墨字 + 细分隔线，品牌字同样退成安静小字，跟桌面侧栏同律。 */
  .topbar{display:flex;align-items:center;gap:12px;position:sticky;top:0;
    z-index:30;background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(10px);
    backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
    color:var(--ink);padding:10px 14px}
  .topbar .brand{color:var(--ink);font-weight:600;font-size:14px;
    letter-spacing:.08em;text-transform:uppercase}
  .hamburger{font-size:20px;cursor:pointer;color:var(--ink)}
  .sidebar{position:fixed;left:0;top:0;bottom:0;z-index:40;width:230px;
    transform:translateX(-100%);transition:transform .18s ease;
    overflow-y:auto;box-shadow:var(--shadow-2)}
  .nav-toggle:checked ~ .layout .sidebar{transform:translateX(0)}
  .scrim{position:fixed;inset:0;z-index:35;background:var(--scrim);
    display:none}
  .nav-toggle:checked ~ .layout .scrim{display:block}
  main{padding:10px}
  .cols{grid-template-columns:1fr}
  .nums b{font-size:22px}
  .dept-row{flex-wrap:wrap}
  .dept-nums{width:100%}
  /* 日期条改 grid 锁成稳定两行（军哥 2026-08-07 iOS 实拍：flex-wrap 在窄屏
     散架——label 的 width:100% 把「业务日」挤成孤立一行、与自己的输入框拆散，
     而 iOS Safari 的 input[type=date] 会被「2026年8月7日」这种本地化长文本
     撑宽，把「查看」和「后一日」挤到错位）。
     两行版式：① 前一日 · 日期框 · 后一日（导航一行，日期框吃掉剩余宽度）
              ② 查看 · 最新（操作一行）。label 视觉隐藏但留给读屏器。 */
  .datebar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;
    gap:8px 6px;padding:10px}
  /* label 视觉隐藏但保留给读屏器（for=datepick 的关联不能丢） */
  .datebar label{position:absolute;width:1px;height:1px;overflow:hidden;
    clip:rect(0 0 0 0);white-space:nowrap}
  /* order 精确排位：导航是 <a>/<span> 混排，:nth-of-type 不可靠，靠类名 */
  .datebar .dn-prev{order:1;justify-self:start}
  .datebar input[type=date]{order:2;width:100%;min-width:0;text-align:center}
  .datebar .dn-next{order:3;justify-self:end}
  /* 「查看」居中收窄不铺满：它是低频操作（默认视图就是最新日，多数时候不用点），
     全宽实心块会成为整屏最抢眼的东西，与它的重要性不符 */
  .datebar button{order:4;grid-column:1/-1;justify-self:center;
    min-width:132px;padding:9px 22px}
  .datebar .dn-latest{order:5;grid-column:1/-1;text-align:center}
  .datebar .datenav{align-self:center}
}

/* ---- P3f-2 同比/环比 ---- */
.deltas{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 0;align-items:center}
/* 同比/环比 chip：涨绿跌红（军哥 2026-08-10 定，推翻此前的"统一中性灰"）。
   这不违反方案 A 的「颜色只表含义、不作装饰」——涨跌本身就是含义。

   ⚠️ 前提：**当前所有带同比的指标都是「越多越好」**（注册/预约/试听/首付/
   全款/课节/在营人次/学生数/billing）。deltas.py 的 dir 只是数值方向，不含
   好坏判断。将来若接入「越少越好」的指标（退费、取消、成本、投诉），照这套
   映射会把"退费涨了"画成绿色——那是说反话。届时必须在数据层给指标加极性
   标记，由 dir 与极性共同决定颜色，而不是在这里加特例。
   ↑/↓ 箭头字符保留：颜色是加强，不是唯一载体（红绿色觉障碍照样读得懂）。 */
.delta{font-size:12px;line-height:1.7;border-radius:999px;padding:0 9px;
  border:1px solid var(--line);background:var(--card);color:var(--muted);
  white-space:nowrap}
.delta.d-up{color:var(--green);border-color:var(--green-line);
  background:var(--green-soft)}
.delta.d-down{color:var(--red);border-color:var(--red-line);
  background:var(--red-soft)}
/* flat（持平）与 none（无同比基准）保持中性灰——"没变化"和"没数据"都
   不是好消息也不是坏消息，染色只会制造不存在的情绪。 */
.delta i,.delta em{font-style:normal;font-size:11px;opacity:.75}
.delta.d-none{border-style:dashed}
.mismatch{font-size:11px;flex:1 1 100%}

/* ---- P3b metric cells: value + sample size on one screen ---- */
/* minmax 210px: a cell has to fit 值/名/分子分母/档位标注 four stacked lines
   without the sample line wrapping mid-number on a phone（这条宽度红线不
   是装饰，改动前先看这条注释）。 */
.qgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
  gap:1px;background:var(--line);border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden}
.qcell{background:var(--card);padding:10px 12px}
.qcell b{display:block;font-size:20px;font-weight:600;color:var(--ink)}
.qcell .qname{display:block;font-size:12px;color:var(--faint)}
.qcell .qsample{display:block;font-size:11px;color:var(--faint);margin-top:4px}
.qcell .qwhy{display:block;font-size:11px;color:var(--muted);margin-top:4px;
  line-height:1.5}
.qcell .qgrade{display:inline-block;font-size:11px;line-height:1.7;
  border:1px solid var(--line);border-radius:999px;padding:0 8px;
  margin-top:4px;color:var(--faint)}
/* g-tiny only downgrades confidence — the number itself stays at full size
   and full contrast on purpose (never hide the digits)。样本量过小是「可疑」
   语义，借语义色板里的黄（--yellow），不再借退役的 --accent。 */
.qcell .qgrade.g-tiny{color:var(--yellow);border-color:var(--yellow)}
.qcell.q-missing b,.qcell.q-no_row b,.qcell.q-no_value b{color:var(--faint);
  font-size:18px}

/* 详情页「同比 / 环比」一行一指标：指标名 + 两张 chip 并排，说明整行独占
   （.drift 须排在 .muted 之后——同特异度靠顺序覆盖 .muted 的字号与外边距）*/
.delta-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  padding:6px 0;border-top:1px solid var(--line)}
.delta-row:first-of-type{border-top:none}
.delta-name{flex:0 0 auto;min-width:96px;font-size:14px}
.drift{flex:1 1 100%;font-size:12px;margin:0}

/* ---- V2-P1 总览三区 + 知识区（首页三卡、/knowledge 列表/详情）---- */
.areas{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
/* 卡片本身用 class="hcard area"，视觉已由既有 .hcard 提供（背景/边框/圆角/
   hover）——.area 不重复定义，只是网格分发用的语义类，避免规则打架。 */
.opslist,.klist{list-style:none;margin:8px 0;padding:0}
.opslist li,.klist li{display:flex;gap:8px;align-items:baseline;padding:2px 0;flex-wrap:wrap}
.ksearch{display:flex;gap:8px;margin:8px 0;align-items:center}
/* label 取跟 .datebar label 同款尺寸（13px muted），比正文字号小一档更像表单
   提示而非正文，375px 上也更省宽度；真正防溢出靠 input 的 min-width:0——
   label/button 都是短汉字，nowrap 只是保险。 */
.ksearch label{font-size:13px;color:var(--muted);white-space:nowrap}
.ksearch input{flex:1;min-width:0;padding:6px 10px;border:1px solid var(--line);
  border-radius:8px;background:var(--bg);color:inherit}
/* .ktable（表格类页面：知识列表/审批/财务）防溢出：跟 .kbody/.evidence pre
   同一条铁律——笔记标题若含一段不换行的长 Latin 串（URL/代码标识符），
   auto 布局下表格会为了塞下这段内容把列宽撑到超出 100%，把整页顶出水平
   滚动条。table-layout:fixed 让列宽只认容器宽度不认内容，配合单元格
   word-break:break-all（跟 .evidence p 同款手法）把长词强制截断，
   两条规则缺一不可（终审 Fix 3，2026-08-08）。
   行高与内边距放宽（9px 16px）、分隔线只留底部一条发丝线——方案 A 的
   表格质感：安静的行分隔 + 更松的呼吸感，替代旧版卡片网格。 */
.ktable{width:100%;border-collapse:collapse;table-layout:fixed}
.ktable td,.ktable th{padding:9px 12px;border-bottom:1px solid var(--line);
  text-align:left;word-break:break-all}
.ktable tr:last-child td{border-bottom:0}
.ktable th{font-size:11px;letter-spacing:.05em;color:var(--faint);
  font-weight:500;text-transform:uppercase;padding-bottom:8px}
/* 数字列：右对齐、加粗、比同行文字大一号——原则①在真正的 <table> 里的
   落点（方案 A 「七市场」表格同款处理）。模板层只给真正的数值列挂
   class="n"，文字列（月份/科目/币种……）不挂，保持左对齐。 */
.ktable td.n{text-align:right;font-weight:600;font-size:15px}
/* .tbl-scroll：极少数列数过多的表格（目前只有财务「三大费用块」7 列）专用
   逃生舱——.ktable 的 table-layout:fixed 全站防长词顶爆页面，但数字列被
   固定死的窄列宽度逼着按 word-break:break-all 硬拆，会把「2,160,000」拆成
   「2,1／60,0／00」这种认不出数的碎片，比横向滚动更糟（终审 UI-1 375px
   手机核验发现）。仅给需要的表格套这层容器：列宽转自然宽度、单元格不再
   断词，超出视口时容器自己横向滚动——跟 .chart-wrap（宽图表同款逃生舱）
   一个道理，页面本身依然不会被顶宽，「零横向滚动」铁律管的是页面整体，
   不禁止内容自己的小盒子局部滚动。 */
.tbl-scroll{overflow-x:auto}
.tbl-scroll .ktable{table-layout:auto;width:auto;min-width:100%}
.tbl-scroll .ktable td,.tbl-scroll .ktable th{white-space:nowrap;word-break:normal}
.pager{display:flex;gap:16px}

/* ---- V2-P2 审批流（/work/approvals 统计+明细+详情）---- */
/* 详情页「四要素」「审批链」：跟 .kv 不一样——.kv 是给短数字用的固定网格
   （font-size:20px 大字块），用途（purpose）这类可能几十上百字的正文塞
   进 .kv 既不合适也没有防溢出。改用 .delta-row 同款「标签+值」横排：
   label 固定宽、value 用 min-width:0 + word-break:break-all 防止一段不
   含空格的长英文/URL 串把 375px 页面顶出水平滚动条（同 .kbody/.evidence p
   /.ktable td 的既有铁律，手机验证见 Task 6 verification）。 */
.appr-facts{margin:8px 0}
.appr-fact{display:flex;gap:8px;padding:6px 0;border-top:1px solid var(--line);
  flex-wrap:wrap}
.appr-fact:first-of-type{border-top:none}
.appr-fact .k{flex:0 0 84px;color:var(--faint);font-size:13px}
.appr-fact .v{flex:1 1 200px;min-width:0;word-break:break-all}

/* ---- V2-P3 重大事项（/work/items 列表/详情，只读渲染）---- */
/* 事项标题、说明、时间线/候选文案全部是军哥手打或另一个系统写入的自由
   文本，可能是一整段不含空格的长串（表单在 Task 5 才落地，渲染层现在
   就要扛住）——跟 .ktable/.kbody/.appr-fact 同一条铁律：word-break:
   break-all 负责断词；.item-card h2 额外补 min-width:0，理由同
   .appr-fact .v 的既有注释——flex 布局里的子元素默认 min-width:auto，
   不显式清零，长词可能撑破 .card-head 这个 flex 容器（终审同款处理）。 */
.item-card .card-head h2{min-width:0;word-break:break-all}
.item-note{word-break:break-all}
.break-title{word-break:break-all}
.entry-row,.cand-row{padding:8px 0;border-top:1px solid var(--line)}
.entry-row:first-of-type,.cand-row:first-of-type{border-top:none}
.entry-row p,.cand-row p{margin:2px 0;word-break:break-all}
/* 已归档折叠区：原生 <details>/<summary>（零 JS 铁律），样式上跟
   .evidence 的收纳观感区分开——这里折的是整组卡片而不是一行小字出处，
   摘要行要更显眼一些（更大字号、墨色而非 faint）。 */
.archived-toggle{margin-top:16px}
.archived-toggle>summary{cursor:pointer;font-size:14px;color:var(--ink);
  padding:8px 0}

/* ---- V2-P3 重大事项（写入表单——新建事项/补进展/改关键词/归档/
   候选收编忽略，全部普通 HTML 表单，零 JS）---- */
/* .item-form 是"标签+输入框+提交按钮"横排的表单（新建事项、补进展、改
   关键词三处复用），跟 .ksearch（/knowledge 搜索框）同一个基本形状，这里
   单独命名是因为一个表单里可能有不止一对 label+input（新建事项有
   标题/说明/关键词三对），.ksearch 那套只按单个 input 设计，直接复用会
   在多字段时把布局挤在一起。 */
.item-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:6px 0}
.item-form label{font-size:13px;color:var(--muted);white-space:nowrap}
.item-form input[type=text]{flex:1;min-width:140px;padding:6px 10px;
  border:1px solid var(--line);border-radius:8px;background:var(--bg);
  color:inherit;font:inherit}
/* 按钮：中性墨色实心块，取代旧版靛蓝——全站唯一的"强调色"就是墨色本身，
   不需要第二种品牌色来喊"点我"。 */
.item-form button,.inline-form button{font:inherit;font-size:14px;color:#fff;
  background:var(--ink);border:none;border-radius:8px;padding:5px 14px;
  cursor:pointer}
/* .inline-form：单动作小表单（归档/取消归档、候选收编/忽略），跟着一段
   文字或另一个表单平铺，不需要 .item-form 那套 flex-wrap 换行逻辑，
   display:inline-flex 让它不强占一整行。候选行两个按钮（收编/忽略）共享
   同一个 .inline-form，靠 gap 隔开，不需要额外包一层。 */
.inline-form{display:inline-flex;gap:8px;margin:6px 0 2px}
.item-form-section{margin-bottom:16px}

/* ---- UI-2 首页重构（/，2026-08-10）：问候语 + 「今天要看的」+ 七市场表 +
   知识/财务/健康收尾行。军哥选定的参考稿（方案 A）结构——从上到下按
   「今天要不要管」的优先级排列，不是按「项目实现了哪几块」排列。旧的
   .areas/.opslist/.klist 三个类名不删（其余页面/回滚都可能还用得上），
   本节只新增，不动它们已有的规则。 #}
.home>section{margin-top:28px}
.home>section:first-of-type{margin-top:18px}
.sub{color:var(--faint);font-size:13px;margin-top:3px}
/* 区段小标题一行：裸 h2 已经是小号大写灰字（全站默认），这里只加一个
   同排的 .meta（更淡一档，用于「业务日 08-09」这类补充说明，不抢 h2）。 */
.sechead{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}
.meta{font-size:12px;color:var(--faint)}
.two{display:grid;grid-template-columns:1.35fr 1fr;gap:22px;align-items:start}
/* .panel：跟 .hcard 同款边框/圆角，但不带内边距——给表格/列表这类自己
   管内边距的内容用（.hcard 的 14px 16px 会跟表格自己的单元格内边距叠
   加出双重留白）。 */
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
.quiet{padding:14px 16px;color:var(--muted);font-size:13px}
/* 知识搜索框/列表原本是 .hcard 卡片里的组件（自带 14px 16px 外层内边距），
   现在挪进无内边距的 .panel，这里补一份 panel 专属内边距，不改
   .ksearch/.klist 本身（/knowledge 页面直接在 main 下用这两个类，不经过
   .panel，改了它们的默认外边距会让那边跟着走样）。 */
.panel .ksearch{margin:0;padding:12px 16px;border-bottom:1px solid var(--line)}
.panel .klist{margin:0}
.panel .klist li{padding:9px 16px}

/* 「今天要看的」：全站字号最大的数字——早安语境下军哥要一眼扫出今天有
   没有事，比详情页 .nums（24px）还要再重一档。三格里任一数据源不可用
   就整格不渲染（同既有摘要行的降级律，只是从一行文字变成一格数字），
   格数跟着变；用 flex-wrap 而非 CSS Grid 撑满剩余空间——原因同 .nums
   头部注释：Grid 的 auto-fit 在末行数量不整除时会露出空洞网格，这里
   1~3 格都可能发生，跟 .nums/.kv/.qgrid 同一条铁律。整格可点：<a> 包住
   数字本身，不是数字下面另起一行链接。 */
.strip{display:flex;flex-wrap:wrap;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.strip .cell{flex:1 1 160px;background:var(--card);padding:16px 18px}
.strip .k{font-size:12px;color:var(--faint)}
.strip .v{font-size:28px;font-weight:600;letter-spacing:-.02em;margin-top:4px}
.strip .v a{color:var(--ink)}
.strip .v a:hover{text-decoration:underline}
.strip .v small{font-size:13px;font-weight:500;color:var(--faint);
  margin-left:6px;letter-spacing:0}

/* 七市场表：一行一市场，市场名墨色 + 5px 状态点（跟侧栏市场灯同一套
   语义色），数值列右对齐加粗——比 .ktable td.n（15px，财务/审批那类
   明细表用）再大一档，七市场是全站信息密度最高的一屏，数字必须一眼
   扫完（原则①）。kv 市场（日本课节/菲游学在营人次/中亚培育期）只有
   一个指标 + 一句口径注记，用 colspan 让整行跟漏斗/复合市场（注册/
   全款两个指标）等宽，不强行拉齐列数——那样等于把不同形状的市场说成
   一个形状（queries.ops_summary._split_caliber 的注释有完整理由）。 */
.mkttable{width:100%;border-collapse:collapse}
.mkttable td{padding:9px 16px;border-bottom:1px solid var(--line);
  font-size:14px;word-break:break-word}
.mkttable tr:last-child td{border-bottom:0}
.mkttable td.mkt{font-weight:550;white-space:nowrap;width:150px}
/* 数值列定宽并让最后一列吃掉剩余宽度：不定宽时表格会把 4 个数据列均分到
   1180px，标签与数字之间空出一大片，眼睛没法把「注册 23」看成一组
   （2026-08-10 实渲染发现，参考稿里它们是紧凑成组的）。 */
.mkttable td.lbl{width:44px}
.mkttable td.n{width:84px}
.mkttable td:last-child{width:auto}
.mkttable td.mkt .tag{margin-left:6px}
.mkttable td.lbl{color:var(--faint);font-size:12px;white-space:nowrap}
.mkttable{table-layout:fixed}
.mkttable td.n{text-align:right;white-space:nowrap}
.mkttable td.n b{font-size:17px;font-weight:600;letter-spacing:-.01em;
  color:var(--ink)}
.mkttable td.empty{color:var(--faint);font-size:13px}

@media (max-width:860px){
  .two{grid-template-columns:1fr}
  .strip .v{font-size:24px}
  .mkttable td{padding:8px 10px}
}

/* 今日日程表（首页顶部，2026-09-02）：两列——时间（定宽、不换行、等宽
   数字）+ 标题/地点（断词）。table-layout:fixed 让长标题在 375px 下换行
   而不是把表撑出横向滚动条；时间列给够「前日 23:00–01:00」这种最长形态
   的像素，别按比例分。当地时间小字与地点都退成 12px 淡灰，不抢标题。 */
.caltable{width:100%;border-collapse:collapse;table-layout:fixed}
.caltable td{padding:9px 16px;border-bottom:1px solid var(--line);
  font-size:14px;vertical-align:top}
.caltable tr:last-child td{border-bottom:0}
.caltable td.t{white-space:nowrap;width:150px;color:var(--muted);
  font-variant-numeric:var(--num-feat)}
.caltable td.s{word-break:break-word;font-weight:550;color:var(--ink)}
.caltable .local{font-size:12px;color:var(--faint);font-weight:400}
.caltable .meet{font-size:12px;font-weight:400;color:var(--muted);
  margin-left:4px;white-space:nowrap}
.caltable .loc{display:block;font-size:12px;color:var(--faint);font-weight:400;
  margin-top:2px}
.quiet.warn{color:var(--yellow)}
@media (max-width:640px){
  .caltable td{padding:8px 10px;font-size:13px}
  .caltable td.t{width:128px}
}

/* 外站直达（外脑 / 运维）：不加色，只用一个小箭头示意"会跳出去"——
   方案 A 的规矩是颜色只表状态，不做装饰，所以这里用符号不用颜色。 */
.nav-item .ext{color:var(--faint);font-size:11px;margin-left:5px;
  vertical-align:1px}

/* ---- 大事（P0-T8，2026-08-11）：/bigthing 绑定页 / 等待态 / 文档清单 ----
   军哥多半在手机上刷这页（他人在群里，顺手就点开），所以这一节按 375px
   优先写：可点区域一律 ≥44px（Apple HIG 的最小可靠点按尺寸——一行里
   「群名」和「盯这件事」挨着，按钮矮于这个高度他会点不中而误触旁边的行），
   长群名断词，行在窄屏自己换行而不是把页面顶宽。 */
.bt-row{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;
  justify-content:space-between;padding:4px 0;
  border-top:1px solid var(--line)}
.bt-row:first-of-type{border-top:none}
/* 群名同时是链接（已绑定区）与纯文本（候选区），两种都要 ≥44px 的行高：
   前者是触控目标，后者跟同行按钮对齐。min-width:0 + break-all 是这一对
   flex 子项不顶宽父容器的必要条件（flex 子项默认 min-width:auto，长词
   会把它撑到内容宽度，整页跟着横向滚动）。 */
.bt-name{flex:1 1 12em;min-width:0;display:flex;align-items:center;
  min-height:44px;word-break:break-all}
.bt-form{margin:0}
/* .bt-act：本页所有按钮（盯这件事 / 先不盯了 / 搜索）。样式跟 .item-form
   button 同款墨色实心块，只是把高度提到 44px——不复用那条规则是因为改它
   会连带动到重大事项页的既有版式。 */
.bt-act{font:inherit;font-size:14px;color:#fff;background:var(--ink);
  border:none;border-radius:8px;padding:0 16px;min-height:44px;
  cursor:pointer;white-space:nowrap}
.bt-search{display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  margin:8px 0 12px}
.bt-search label{font-size:13px;color:var(--muted);white-space:nowrap}
.bt-search input[type=search]{flex:1;min-width:140px;min-height:44px;
  padding:6px 10px;border:1px solid var(--line);border-radius:8px;
  background:var(--bg);color:inherit;font:inherit}
/* 一句要被读到的话（完成标准还没定义 / 这件事已归档）：比正文重一档，但不用
   颜色——「还没定义什么算完成」既不是好消息也不是坏消息，染色等于凭空造出
   一种情绪，而军哥拍板过「空白本身是发现，不是缺陷」。 */
.bt-note{font-size:15px;margin:14px 0 4px}
/* 被拒绝的那一下（标题空着 / 这个群已经归别的大事）。这是**唯一**该让人停下
   来看的一类文案，所以给一条左边线加重量；仍不用红色——它不是故障，是一次
   没做成的操作。 */
.bt-err{font-size:15px;margin:12px 0;padding:8px 12px;
  border-left:3px solid var(--ink);background:var(--sunken)}
/* 「+ 关联一个群」「去大事列表」这类行内入口：它是链接不是按钮（不改变任何
   东西，点了只是换一页），但在手机上同样要够得着，所以补足 44px 的行高。 */
.bt-more{margin:10px 0}
.bt-more a{display:inline-flex;align-items:center;min-height:44px}
/* 新建/编辑表单。width:100% 必须配 box-sizing:border-box——否则 padding 与
   border 加在 100% 之上，375px 下整页被顶出横向滚动条（同财务表那个坑：
   宽度约束和内边距要算在同一套账里）。textarea 只给两行：这一栏是「一句话
   说清什么算做完」，给一屏高度反而暗示他要写长文。 */
.bt-fields{display:flex;flex-direction:column;gap:6px;margin:8px 0 12px}
.bt-fields label{font-size:13px;color:var(--muted)}
.bt-fields input,.bt-fields textarea{width:100%;box-sizing:border-box;
  min-height:44px;padding:8px 10px;border:1px solid var(--line);
  border-radius:8px;background:var(--bg);color:inherit;font:inherit}
/* 折叠的编辑区（原生 <details>，零 JS 铁律下唯一的折叠手段）。summary 同样
   按 44px 触控目标给高度，list-style 保留默认三角——那个三角是「这里能展开」
   的唯一提示，去掉它就没人知道点得开。 */
.bt-edit>summary{display:list-item;min-height:44px;line-height:44px;
  cursor:pointer;font-size:15px}
/* 文档清单：防溢出全靠 .ktable 基类（table-layout:fixed + break-all），
   这里只分配列宽——标题与来源群名吃掉剩余空间，类型/日期给固定像素并
   nowrap。375px 实测（2026-08-11）：按百分比分配时日期列会被 .ktable 的
   word-break:break-all 拆成「2026-08-／08」两行，跟财务表把数字拆碎是同一
   个坑（见 .tbl-scroll 注释）。日期和类型都是短的定长串，给够像素比按比例
   分配可靠；标题与来源列不设宽度，剩多少吃多少，长内容照常断词换行。
   ⚠️ P0b 加了「来自」列（第 2 列），下面两条的 nth-child 跟着后挪了一位——
   这几个数字和模板里 <th> 的顺序是同一件事的两半，改一处必须改另一处。
   「来自」给 76px 而不是让它跟标题对半分剩余宽度：375px 实测（2026-08-11）
   对半分时标题列只剩九十来像素，一个长文档名被拆成五行，而群名本来就短
   （两行足够）。这一列存在是为了「这份文档从哪个群来的」，不需要跟标题
   争地方。 */
.bt-docs th:nth-child(2),.bt-docs td:nth-child(2){width:76px}
.bt-docs th:nth-child(3),.bt-docs td:nth-child(3){width:58px;white-space:nowrap}
.bt-docs th:nth-child(4),.bt-docs td:nth-child(4){width:92px;white-space:nowrap}
/* 标题行 + 编辑入口（2026-08-12，军哥：「编辑为什么不放在这个项目的右上
   角？更符合 UI 的通用习惯」）。h1 flex:1 + min-width:0 让长标题在自己的
   格子里断词换行，不被右侧入口压成一字一行；summary 不换行、补足 44px
   触控高度。details 展开时换行占满整行（flex-wrap + basis:100%）——编辑
   表单是一列输入框，挤在右侧一条窄柱里在 375px 下没法用。 */
.bt-head{display:flex;flex-wrap:wrap;align-items:flex-start;gap:0 12px}
.bt-head h1{flex:1 1 12em;min-width:0;word-break:break-all;margin-bottom:8px}
.bt-head .bt-edit{flex:0 0 auto}
.bt-head .bt-edit>summary{white-space:nowrap;padding:0 4px}
.bt-head .bt-edit[open]{flex-basis:100%}
/* 活动脉搏：16 个北京自然周的消息量。格子给**固定像素**而不是百分比——
   375px 下按比例分每格不足 22px 还要扣 gap，深浅看不出来；14px×16 格 +
   3px gap 总宽 269px，天然放得进最窄的屏。灰阶四档只用中性阶（方案 A：
   颜色只表状态，而「热/静」是节奏不是状态）：0=近白（沉默周是这条图最要
   紧的信息，必须和有动静的周一眼分开）、1/2/3 从浅到墨。lv1 的 #D8D7D2 是
   --line 与 --faint 之间的插值——中性阶没有现成的这一档，用 --line 会和
   0 档的 --sunken 几乎混在一起。格子不可点，不受 44px 触控规矩约束。 */
.bt-pulse-wrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;
  margin:2px 0 10px}
.bt-pulse{display:flex;gap:3px}
.bt-pw{width:14px;height:18px;border-radius:3px;border:1px solid var(--line);
  background:var(--sunken)}
.bt-pw.lv1{background:#D8D7D2}
.bt-pw.lv2{background:var(--faint)}
.bt-pw.lv3{background:var(--ink)}
/* 「最后动静 N 天前」是这一条里给人读的结论，比周边 muted 小字大一号加
   粗——格子说明「节奏」，这句话说明「静了多久」，后者才是要行动的依据。 */
.bt-last{font-size:17px;font-weight:600}

/* ---- 大事列表多维表格化 + 下一节点（v2，2026-08-14）----
   军哥：「用我的那个多维表格的形式做一下改造，加上下一个节点的时间和目标」。
   列表页从卡片改成 .ktable 表格（四列：大事/下一节点/节点目标/最后动静），
   防溢出吃 .ktable 基类；徽标颜色只用语义 token（红=已过、黄=今天/临近），
   同方案 A「颜色只表达含义」的换肤纪律。 */
/* 徽标本体：小号胶囊。due 借告警红的淡底组合（同 .delta.d-down 的三件套），
   soon 只描边不铺底——「临近」要被看见但还不是事故，铺黄底就跟过期一个
   分量了；far/none 灰调中性（还远/未定都不是情绪，未定的分量由「未定」两个
   字自己说）。 */
.bt-node{display:inline-block;font-size:12px;line-height:1.4;
  padding:1px 8px;border-radius:999px;border:1px solid var(--line);
  white-space:nowrap}
.bt-node.due{color:var(--red);border-color:var(--red-line);
  background:var(--red-soft);font-weight:600}
.bt-node.soon{color:var(--yellow);border-color:var(--yellow)}
.bt-node.far{color:var(--muted)}
.bt-node.none{color:var(--muted)}
/* 日期本体：数字是信息主体，徽标是它的注解，所以日期不缩小；nowrap 防
   .ktable 的 break-all 把「2026-08-14」拆成两行（同 .bt-docs 日期列的坑）。 */
.bt-date{white-space:nowrap}
/* 「大事」列里的小字（群数/文档数/首扫状态）：独占一行贴在标题下面，
   不跟标题挤在一行里换行成碎片。 */
.bt-sub{display:block;font-size:12px;margin-top:2px}
/* 列宽：下一节点列容得下「2026-08-14 + 已过 300 天」两件套后自然换行；
   最后动静列给固定宽（内容是定长短句）。大事/节点目标两列分剩余宽度。 */
.bt-items th:nth-child(2),.bt-items td:nth-child(2){width:8.5em}
.bt-items th:nth-child(4),.bt-items td:nth-child(4){width:7.5em}
/* 375px（军哥主用手机）：四列表格再省也挤爆，降级成堆叠行——thead 藏起、
   行变块级、格子上下排开。四列内容都是自解释短句（标题链接 / 日期+徽标 /
   目标 / 「最后动静 N 天前」），竖排不需要表头也读得懂；行与行用横线分隔
   （格子自己的横线去掉，否则一行四条线像四条记录）。断点 640 与全站抽屉
   断点同数量级，实测 375px 零横向滚动（见任务报告）。 */
@media (max-width:640px){
  .bt-items thead{display:none}
  .bt-items,.bt-items tbody,.bt-items tr,.bt-items td{display:block;width:auto}
  .bt-items tr{border-top:1px solid var(--line);padding:8px 0}
  .bt-items tr:first-child{border-top:none}
  .bt-items td{border-bottom:none;padding:2px 0}
}

/* ---- 本月至今 vs 去年同期（/work 顶部对照表，军哥 2026-08-16）----
   全表复用既有 token 与 .delta/.d-up/.d-down 三件套，不新造任何颜色：
   同比涨绿跌红这套语义色全站只有一份（.delta 那一处），这里只是把它摆进
   表格里。数字列走 --num-feat 等宽数字，右对齐加粗（同 .mkttable 的原则①）。*/
.mtd-yoy{margin-bottom:22px}
/* 指标切换：四个纯链接（零 JS 铁律）。当前项用墨色底反白，不用彩色填充
   ——颜色只表状态，方案 A 的规矩。 */
.mtd-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
.mtd-tab{font-size:13px;line-height:1.6;padding:3px 12px;border-radius:999px;
  border:1px solid var(--line);color:var(--muted);background:var(--card)}
.mtd-tab:hover{border-color:var(--ink);color:var(--ink);text-decoration:none}
.mtd-tab.on{background:var(--ink);border-color:var(--ink);color:var(--bg)}
/* 「各行业务日不同源」那句：贴在表上方。它是硬要求①的另一半——表头不给
   统一窗口，就得说清楚为什么每行的日期不一样。 */
.mtd-mixed{margin:0 0 8px}
.mtdtable{width:100%;border-collapse:collapse;table-layout:fixed}
.mtdtable th,.mtdtable td{padding:9px 14px;border-bottom:1px solid var(--line);
  font-size:14px;text-align:left;vertical-align:top;word-break:break-word}
.mtdtable tbody tr:last-child td{border-bottom:0}
.mtdtable th{font-size:11px;letter-spacing:.05em;color:var(--faint);
  font-weight:500;text-transform:none}
.mtdtable th.n,.mtdtable td.n{text-align:right}
.mtdtable td.n b{font-size:16px;font-weight:600;letter-spacing:-.01em;
  color:var(--ink);font-variant-numeric:tabular-nums;
  font-feature-settings:var(--num-feat)}
.mtdtable td.mkt{width:23%}
.mtdtable th.n,.mtdtable td.n{width:19%}
.mtdtable .mtd-name{font-weight:550}
/* 内陆少儿两条线缩进：它们是上一行的下钻，不是并列的第 9、10 个市场。 */
.mtdtable tr.sub td.mkt .mtd-name{padding-left:14px;font-weight:450;
  color:var(--muted)}
/* 中国三站合计（「课时」这一档专有）：它**不是市场**，是切不出市场时的兜底。
   与市场行分层靠三件事——一条上分隔线把它与上面六行留白隔开、整行淡底、
   名字不用市场行那档字重。颜色仍只用既有 token，不新造。 */
.mtdtable tr.agg{background:var(--sunken)}
.mtdtable tr.agg td{border-top:1px solid var(--line)}
.mtdtable tr.agg td.mkt .mtd-name{font-weight:450;color:var(--muted)}
/* 每行自己的「截至 08-15」：独占一行贴在市场名下（硬要求①）。 */
.mtd-asof,.mtd-win{display:block;font-style:normal;font-size:11px;
  color:var(--faint);margin-top:3px}
.mtd-unit{font-style:normal;font-size:11px;color:var(--faint);margin-left:3px}
.mtd-note{display:block;font-size:12px;color:var(--muted);margin-top:4px}
/* 单元格标签：宽屏由 <thead> 承担，藏起来；375px 堆叠后放出来。 */
.mtd-k{display:none}

/* 375px 零横滚（军哥主用手机）：四列数字表在 375 上再省也挤爆，
   降级成**堆叠行**——thead 藏起、行变块级、四格上下排开，每格自带
   「本月至今 / 去年同期 / 同比」小标签（宽屏靠表头，窄屏靠标签，信息
   一个不丢）。与 .bt-items 同一套做法、同一个 640 断点；数字列在堆叠态
   改回左对齐，右对齐在满宽块里会把标签和数字扯到两端。 */
@media (max-width:640px){
  .mtdtable{table-layout:auto}
  .mtdtable thead{display:none}
  .mtdtable,.mtdtable tbody,.mtdtable tr,.mtdtable td{display:block;
    width:auto}
  .mtdtable tr{border-top:1px solid var(--line);padding:10px 14px}
  .mtdtable tbody tr:first-child{border-top:none}
  .mtdtable td,.mtdtable tbody tr:last-child td{border-bottom:none;
    padding:2px 0}
  .mtdtable td.n,.mtdtable th.n{text-align:left;width:auto}
  .mtdtable td.mkt{width:auto;margin-bottom:2px}
  .mtd-k{display:inline;font-style:normal;font-size:11px;color:var(--faint);
    margin-right:6px}
}

/* 语言切换（2026-08-19 中日英）。零 JS，纯链接；当前语言用墨色加重而不是
   色块——与侧栏当前项同一套视觉语言，也避开状态灯已占满的红黄绿灰。 */
.lang-switch { margin: .2rem 0 .6rem; padding: 0 .9rem; font-size: .82rem; }
.lang-switch .lang { color: var(--muted); text-decoration: none; }
.lang-switch .lang:hover { color: var(--ink); }
.lang-switch .lang.on { color: var(--ink); font-weight: 600; }

/* 数据页标题行：标题左、三语切换右（军哥 2026-08-27 指定）。
   窄屏下换行不挤——语言不是主角，让位给标题。 */
.page-head { display: flex; align-items: baseline; justify-content: space-between;
             gap: .8rem; flex-wrap: wrap; }
.page-head h1 { margin-bottom: .2rem; }
.page-head .lang-switch { margin: 0; padding: 0; white-space: nowrap; }
.page-head .lang-switch .sep { color: var(--faint); margin: 0 .35rem; }

/* ---- 登录/申请页（gate）与访问后台。2026-09-03 Lark 授权上线 ---- */
/* gate 页不进侧栏布局：未登录的人不该看见任何导航——那些链接他一个也点不动，
   画出来只是告诉他"这里有你进不去的东西"。 */
body.gate { display: flex; align-items: center; justify-content: center;
            min-height: 100vh; margin: 0; background: var(--bg); }
/* flex:none 是必需的：登录卡片用的是 <main>，而全站 main 规则带
   `flex: 1 1 auto`——在 body.gate 这个 flex 容器里，flex-grow 会把卡片撑满
   整屏，`width` 根本不起作用（2026-09-03 实测：写着 420px，算出来 1180px）。
   同理覆盖 main 的 margin/max-width，否则边距与上限也是那条规则说了算。 */
.gate-card { flex: 0 0 auto; width: min(92vw, 420px); max-width: 420px;
             margin: 0; padding: 40px 32px; text-align: center;
             background: var(--card); border: 1px solid var(--line);
             border-radius: 14px; }
.gate-card h1 { margin: 0 0 6px; font-size: 22px; }
.gate-btn { display: block; margin: 26px 0 10px; padding: 12px 18px;
            background: var(--ink); color: var(--card); border-radius: 8px;
            text-decoration: none; font-weight: 600; }
.gate-note { font-size: 12px; margin-top: 14px; }
.gate-state { margin: 18px 0 4px; font-weight: 600; }
.gate-state.wait { color: var(--yellow); }
.gate-state.no { color: var(--red); }
.gate-form { margin-top: 18px; text-align: left; }
.gate-form label { display: block; font-size: 12px; color: var(--muted);
                   margin-bottom: 6px; }
.gate-form textarea { width: 100%; box-sizing: border-box; padding: 10px;
                      border: 1px solid var(--line); border-radius: 8px;
                      font: inherit; resize: vertical; }
.gate-form button { margin-top: 12px; width: 100%; padding: 11px;
                    background: var(--ink); color: var(--card);
                    border: 0; border-radius: 8px; font: inherit;
                    font-weight: 600; cursor: pointer; }

.whoami { font-size: 12px; color: var(--muted); margin: 0 0 2px; }
.whoami .sep { margin: 0 6px; }

.acc-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.acc-table th { text-align: left; font-weight: 600; color: var(--muted);
                font-size: 12px; padding: 6px 8px; border-bottom: 1px solid var(--line); }
.acc-table td { padding: 8px; border-bottom: 1px solid var(--line); }
.acc-purpose { color: var(--muted); }
.acc-act form { display: inline-flex; gap: 6px; }
.acc-act button { padding: 4px 12px; border: 1px solid var(--line);
                  border-radius: 6px; background: var(--card); font: inherit;
                  font-size: 12px; cursor: pointer; }
.acc-act button.ok { border-color: var(--green); color: var(--green); }
.acc-act button.no { border-color: var(--red); color: var(--red); }
.acc-add { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0 4px; }
.acc-add input { padding: 6px 10px; border: 1px solid var(--line);
                 border-radius: 6px; font: inherit; font-size: 13px; }
.acc-add button { padding: 6px 14px; border: 1px solid var(--line);
                  border-radius: 6px; background: var(--card); font: inherit;
                  font-size: 13px; cursor: pointer; }
/* 「被拒」是正常的拒绝（没获批的人来敲门），不是故障。标黄不标红——
   红色会让军哥每次扫过登录记录都以为出了事。 */
.acc-r { font-size: 12px; }
.acc-ok { color: var(--green); }
.acc-denied { color: var(--yellow); }
.acc-pager { margin-top: 12px; }
.acc-pager a { margin: 0 10px; }

/* ---- 审批「异常排查·第一层」影子运行区块（/work/approvals 顶部，2026-09-02）
   全部复用既有 token：区块只靠一条上分隔线与 .kv 区隔开；命中用列表不用
   表格（每条是"序号·类型·人 + 一句话读法 + 一行事实"，375px 上竖排自然
   可读，不需要横滚）；对照表沿用 .ktable + .tbl-scroll 逃生舱，列宽自然、
   超出视口时表格自己局部横滚，页面本身零横向滚动（同明细表的处理）。
   「影子运行」标识用灰描边胶囊（tokens.css 的 .tag 同款观感），不上色——
   它是状态说明，不是告警。 */
.audit{margin:0 0 26px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.audit h2{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px}
.audit-mode{font-size:11px;font-weight:500;letter-spacing:.04em;color:var(--muted);
  border:1px solid var(--line);border-radius:999px;padding:2px 10px;
  white-space:nowrap}
.audit h3{margin:18px 0 4px;font-size:15px}
.audit h4{margin:14px 0 4px;font-size:13px;color:var(--muted);font-weight:500}
.audit-cal b{font-weight:600;color:var(--ink)}
.audit-list{list-style:none;margin:6px 0 0;padding:0}
.audit-list li{padding:10px 0;border-top:1px solid var(--line);word-break:break-word}
.audit-head{font-weight:600}
.audit-head .tag{margin-left:6px}
.audit-say{margin:3px 0}
.audit-facts{font-size:12px;color:var(--muted)}
.audit-empty{margin:6px 0;color:var(--muted)}
.audit-group{padding:10px 0;border-top:1px solid var(--line)}
.audit-group .tbl-scroll{margin-top:6px}
.audit-table td.n{font-size:14px}
.audit-table tr.cur td{font-weight:600}