
/* 令牌。唯一一份 :root —— 颜色 / 字号 / 控件高 / 圆角 / 间距 / 行高全部在这里定值,
   021-kit.css 与 022-pages.css 只许引用,不许再写字面色值或字面高度。
   取值来自设计稿 Kit「0 · 令牌」一节,逐条对齐,不做再创作。 */
:root {
  --k-primary: #1a73e8;
  --k-primary-hover: #1967d2;
  --k-primary-bg: #e8f0fe;
  --k-selection-line: #d2e3fc;

  --k-ink: #202124;
  --k-ink-2: #3c4043;
  --k-ink-3: #5f6368;
  --k-ink-4: #80868b;
  --k-ink-5: #9aa0a6;

  --k-border: #dadce0;
  --k-border-card: #e8eaed;
  --k-divider: #e8eaed;
  --k-rule-soft: #f1f3f4;

  --k-bg-app: #f1f3f4;
  --k-bg-hover: #f1f3f4;
  --k-bg-soft: #f8f9fa;
  --k-surface: #ffffff;
  --k-row-selected: #e8f0fe;

  --k-success: #1e8e3e;
  --k-success-bg: #e6f4ea;
  --k-success-text: #137333;
  --k-warning: #f9ab00;
  --k-warning-bg: #fef7e0;
  --k-warning-text: #b06000;
  --k-error: #d93025;
  --k-error-bg: #fce8e6;
  --k-error-text: #b0413e;

  /* 分类色板:只给「按名字区分的同级分类」用(日程日历按品类给营销活动着色,107-schedule.js 按品类名
     固定哈希到 1–8)。红黄绿是状态色,不进这一组;none 给没填品类的活动。 */
  --k-cat-1: #1a73e8;
  --k-cat-2: #e8710a;
  --k-cat-3: #00897b;
  --k-cat-4: #a142f4;
  --k-cat-5: #d01884;
  --k-cat-6: #827717;
  --k-cat-7: #6d4c41;
  --k-cat-8: #5e35b1;
  --k-cat-none: #80868b;

  --k-scrim: rgba(32, 33, 36, .28);
  --k-shadow-1: 0 1px 2px rgba(60, 64, 67, .16);
  --k-shadow-2: 0 2px 6px rgba(60, 64, 67, .15);
  --k-shadow-3: 0 4px 12px rgba(60, 64, 67, .18);
  --k-shadow-4: 0 8px 28px rgba(60, 64, 67, .28);
  --k-shadow-drawer: -8px 0 24px rgba(60, 64, 67, .18);

  --k-font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Segoe UI", "Microsoft YaHei", sans-serif;
  --k-font-mono: "SFMono-Regular", Menlo, Consolas, monospace;
  --k-fs-title: 20px;
  --k-fs-panel: 16px;
  --k-fs-card: 14px;
  --k-fs-body: 13px;
  --k-fs-aux: 12px;
  --k-lh-body: 1.5384615384615385;
  --k-lh-title: 26px;

  --k-h-tag: 20px;
  --k-h-sm: 28px;
  --k-h-md: 32px;
  --k-h-head: 34px;
  --k-h-row: 36px;
  --k-h-toast: 44px;
  --k-h-top: 48px;

  --k-radius-card: 12px;
  --k-radius-control: 8px;
  --k-radius-tag: 6px;
  --k-radius-tag-sm: 5px;

  --k-space-1: 4px;
  --k-space-2: 8px;
  --k-space-3: 12px;
  --k-space-4: 16px;

  --k-side-w: 216px;
  --k-side-rail-w: 56px;
  --k-content-min: 1040px;
  --k-content-max: 1600px;
  --k-drawer-w: 520px;
  --k-search-w: 210px;
}
/* 密度开关(列设置菜单里切,记 localStorage,全站生效):只动行高与正文字号两个令牌。 */
:root[data-density="comfy"] {
  --k-h-row: 44px;
  --k-fs-body: 14px;
}
/* 组件样式。类名统一 k- 前缀,与旧壳的 lkt/bdg/pill 族没有任何交集 —— 两套 bundle 各自独立,
   同名类不会互相覆盖,但前缀仍然分开写:同一个类名在两套皮肤下长得不一样是最难查的那类样式 bug。
   规范来源:设计稿 Kit / States / Responsive 三页。几何与颜色一律走 020-tokens.css 的令牌。 */

/* ---------- 基础 ---------- */
* { box-sizing: border-box; }
body {
  margin: 0; font-family: var(--k-font); font-size: var(--k-fs-body); line-height: var(--k-lh-body);
  color: var(--k-ink); background: var(--k-bg-app); -webkit-font-smoothing: antialiased;
}
a { color: var(--k-primary); text-decoration: none; cursor: pointer; }
a:hover { color: var(--k-primary-hover); }
button { font: inherit; color: inherit; cursor: pointer; }
table { border-collapse: collapse; }
:focus-visible { outline: 2px solid var(--k-primary); outline-offset: 1px; border-radius: 3px; }
/* 只读给辅助技术的文字(页面状态播报),视觉上不占位。 */
.k-sr {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.k-num { font-variant-numeric: tabular-nums; text-align: right; }
.k-mut { color: var(--k-ink-3); }
.k-na { color: var(--k-ink-3); }
/* 越线的读数(停留超期、超 SLA)。只染字不加底,行里仍然只有一个主状态色。 */
.k-bad { color: var(--k-error-text); }
hr.k-hr { border: 0; border-top: 1px solid var(--k-rule-soft); margin: 10px 0; }
.k-ic { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.k-ic16, .k-ic14 { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.k-ic16 { width: 16px; height: 16px; }
.k-ic14 { width: 14px; height: 14px; }

/* ---------- 应用壳 ---------- */
.k-shell { display: flex; flex-direction: column; height: 100vh; overflow: hidden; }
.k-top {
  height: var(--k-h-top); flex-shrink: 0; display: flex; align-items: center; gap: var(--k-space-2);
  padding: 0 12px 0 10px; background: var(--k-surface); border-bottom: 1px solid var(--k-border-card);
}
.k-top .k-appname { font-size: var(--k-fs-card); color: var(--k-ink-2); margin-left: 2px; white-space: nowrap; }
.k-top .k-slash { color: var(--k-border); margin: 0 2px; }
.k-grow { flex: 1; }
.k-body { flex: 1; display: flex; min-height: 0; }

.k-ib {
  width: var(--k-h-md); height: var(--k-h-md); border-radius: var(--k-radius-control);
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--k-ink-3); background: transparent; border: 0; padding: 0;
}
.k-ib:hover { background: var(--k-bg-hover); color: var(--k-ink-2); }
.k-ib.k-ib-sm { width: var(--k-h-sm); height: var(--k-h-sm); }
.k-ib.on { background: var(--k-primary-bg); color: var(--k-primary-hover); }

/* 品牌选择:顶栏面包屑位上的原生 select,去掉系统外观,保留键盘可用性。 */
.k-brand { display: inline-flex; align-items: center; height: var(--k-h-md); }
.k-brand select {
  appearance: none; -webkit-appearance: none; border: 0; background: transparent;
  height: var(--k-h-md); padding: 0 20px 0 6px; border-radius: var(--k-radius-control);
  color: var(--k-ink-2); font-size: var(--k-fs-body); font-weight: 500; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239aa0a6' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 3px center; background-size: 14px 14px;
}
.k-brand select:hover { background-color: var(--k-bg-hover); }
.k-brand select:disabled { color: var(--k-ink-5); cursor: default; }

/* 顶栏功能查找框(⌘K):设计稿里的 420 宽居中搜索位。 */
.k-topsearch {
  display: flex; align-items: center; gap: 9px; height: var(--k-h-md); width: 420px; max-width: 42vw;
  padding: 0 6px 0 12px; background: var(--k-bg-app); border-radius: var(--k-radius-control);
  color: var(--k-ink-3); position: relative;
}
.k-topsearch input {
  flex: 1; min-width: 0; border: 0; background: transparent; outline: none;
  font-size: var(--k-fs-body); color: var(--k-ink);
}
.k-topsearch input::placeholder { color: var(--k-ink-3); }
.k-topsearch kbd {
  font-family: var(--k-font); font-size: var(--k-fs-aux); color: var(--k-ink-4);
  border: 1px solid var(--k-border); border-radius: var(--k-radius-tag-sm); padding: 0 5px; background: var(--k-surface);
}
.k-who { display: inline-flex; align-items: center; gap: 6px; font-size: var(--k-fs-aux); color: var(--k-ink-3); white-space: nowrap; max-width: 210px; overflow: hidden; }
.k-who b { font-weight: 500; color: var(--k-ink-2); }
.k-role {
  display: inline-flex; align-items: center; height: var(--k-h-tag); padding: 0 7px;
  border-radius: var(--k-radius-tag-sm); background: var(--k-primary-bg); color: var(--k-primary-hover);
  font-size: var(--k-fs-aux); font-weight: 500;
}
.k-role.member { background: var(--k-rule-soft); color: var(--k-ink-2); }
.k-toplink { font-size: var(--k-fs-aux); color: var(--k-ink-3); }
/* 无 k- 前缀的两个类名不是漏写:它们由**共享分片** 350-core-boot-init.js:renderWhoami 直接吐出
   (顶栏「用户管理」外链与身份栏的角色徽标),那份代码两套壳都在跑,不能只为 v2 改类名。
   不补这两条,v2 顶栏上它们就是两段裸文本。几何与颜色一律走 kit 令牌,与 .k-toplink / .k-role 同形。 */
.toplink { font-size: var(--k-fs-aux); color: var(--k-ink-3); white-space: nowrap; }
.rolebadge {
  display: inline-flex; align-items: center; height: var(--k-h-tag); padding: 0 7px;
  border-radius: var(--k-radius-tag-sm); background: var(--k-primary-bg); color: var(--k-primary-hover);
  font-size: var(--k-fs-aux); font-weight: 500;
}
.rolebadge.member { background: var(--k-rule-soft); color: var(--k-ink-2); }

/* ---------- 左导航 ---------- */
.k-side {
  width: var(--k-side-w); flex-shrink: 0; display: flex; flex-direction: column;
  padding: 10px 0 8px; overflow-y: auto; overflow-x: hidden; background: var(--k-bg-app);
}
.k-side nav { display: flex; flex-direction: column; }
.k-side nav a {
  display: flex; align-items: center; gap: 11px; height: var(--k-h-md); margin: 1px var(--k-space-2);
  padding: 0 10px; border-radius: var(--k-radius-control); color: var(--k-ink-2);
  font-size: var(--k-fs-body); font-weight: 500; white-space: nowrap; overflow: hidden; cursor: pointer;
}
.k-side nav a:hover { background: var(--k-bg-soft); color: var(--k-ink); }
.k-side nav a.on { background: var(--k-surface); color: var(--k-ink); box-shadow: var(--k-shadow-1); }
.k-side nav a.on .k-ic { color: var(--k-primary); }
.k-side nav a[hidden] { display: none; }
.k-side .navgrp {
  display: flex; align-items: center; height: 26px; margin: var(--k-space-2) var(--k-space-2) 1px;
  padding: 0 10px; color: var(--k-ink-3); font-size: var(--k-fs-aux); font-weight: 500;
  letter-spacing: .04em; white-space: nowrap;
}
.k-side .navgrp[hidden] { display: none; }
.k-navempty { padding: 10px 18px; color: var(--k-ink-3); font-size: var(--k-fs-aux); }
.k-scrim { display: none; border: 0; padding: 0; background: var(--k-scrim); }

/* ---------- 内容区 ---------- */
.k-main {
  flex: 1; min-width: 0; display: flex; flex-direction: column;
  padding: 14px 20px 16px 4px; overflow: hidden;
}
.k-page { display: none; flex-direction: column; gap: var(--k-space-3); min-height: 0; flex: 1; }
.k-page.on { display: flex; }
/* 页签组(导航重排二期):外壳 .k-page 里一条页签条在最顶,各页签的原页容器 .k-ptab 是子容器,
   排版与 .k-page 一致(各页的 .k-pagewrap 照旧直接挂在里面)。 */
.k-ptabs { flex-shrink: 0; }
.k-ptab { display: flex; flex-direction: column; gap: var(--k-space-3); min-height: 0; flex: 1; }
.k-ptab[hidden] { display: none; }
.k-pagewrap { display: flex; flex-direction: column; gap: var(--k-space-3); min-height: 0; flex: 1; min-width: var(--k-content-min); }
/* 页壳自己接纵向滚动。默认那套("表体接滚动":.k-main overflow:hidden + 唯一的 .k-tablecard
   吃掉剩余高度)只在页里**只有一张表**时成立;一页摆了图卡 + 表卡、固定高度相加超过一屏时,
   表卡会被挤到几个像素高,而 .k-main 把溢出的卡片直接裁掉 —— 看着像"滚到了空白"。
   这类页面给 .k-pagewrap 加这个类,滚动条落在页内(窗口仍不出现第二根)。
   ⚠️ 直接子项一律 flex:0 0 auto:滚动容器里被压扁的卡片是压不出滚动条的,
   要在页内自滚的表卡请自己写死高度(见 #page-tagboard .k-tablecard)。 */
/* position:relative 不是为了摆什么东西,是为了**关住 .k-sr**:那些读屏用的隐藏 label 是
   position:absolute 且外面没有定位祖先,包含块就成了初始包含块 —— 它们不受任何祖先
   overflow:hidden 的裁剪,照着"本来该在的位置"(页内滚动区里、屏外一千多像素处)
   把根元素的滚动区撑开,于是窗口多出一根滚动条、滚下去全是空白。给滚动层一个定位上下文,
   它们就被收回这一层里裁掉了。(.k-pop 自带 .k-popwrap 的定位上下文,不受影响。) */
/* overflow-x 写死 hidden:只写 overflow-y:auto 的话横轴会被算成 auto,窄屏下
   .k-toolbar(flex-wrap:nowrap,会横向撑出去)就凭空多一根横向滚动条 ——
   那一条在今天是由 .k-main 裁掉的,这次只搬纵向滚动,横轴保持原样。 */
.k-pagewrap.k-scrolly { position: relative; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; padding-right: 4px; }
.k-pagewrap.k-scrolly > * { flex: 0 0 auto; }
.k-card { background: var(--k-surface); border: 1px solid var(--k-border-card); border-radius: var(--k-radius-card); }

/* ---------- 页头 ---------- */
.k-ph { display: flex; align-items: center; gap: 10px; min-height: var(--k-h-md); flex-shrink: 0; flex-wrap: wrap; }
.k-ph h1 { margin: 0; font-size: var(--k-fs-title); line-height: var(--k-lh-title); color: var(--k-ink); font-weight: 500; }
.k-ph .k-sep { width: 1px; height: 16px; background: var(--k-border); }
.k-help { width: 24px; height: 24px; border: 0; padding: 0; background: transparent; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; color: var(--k-ink-5); }
.k-help:hover { background: var(--k-bg-hover); color: var(--k-ink-3); }
.k-fresh { display: inline-flex; align-items: center; gap: 5px; color: var(--k-ink-3); font-size: var(--k-fs-aux); white-space: nowrap; border: 0; background: transparent; padding: 0 2px; height: 20px; }
.k-fresh i { width: 6px; height: 6px; border-radius: 50%; display: inline-block; background: var(--k-ink-5); }
.k-fresh.s-fresh i { background: var(--k-success); }
.k-fresh.s-delayed i { background: var(--k-warning); }
.k-fresh.s-stale i { background: var(--k-error); }

/* ---------- 降级横幅(页头下,一页最多一条) ---------- */
.k-banner {
  display: flex; align-items: center; gap: var(--k-space-2); padding: 8px 12px; border-radius: var(--k-radius-control);
  font-size: var(--k-fs-aux); background: var(--k-warning-bg); color: var(--k-warning-text); flex-shrink: 0;
}
.k-banner.t-error { background: var(--k-error-bg); color: var(--k-error-text); }
.k-banner.t-info { background: var(--k-primary-bg); color: var(--k-primary-hover); }
.k-banner b { font-weight: 500; }

/* ---------- 指标条 ---------- */
.k-metrics { display: flex; align-items: stretch; padding: 0; flex-shrink: 0; min-height: 64px; }
.k-win {
  display: flex; align-items: center; gap: 6px; padding: 0 var(--k-space-4); color: var(--k-ink-2);
  font-size: var(--k-fs-aux); font-weight: 500; border-right: 1px solid var(--k-border-card); white-space: nowrap;
}
.k-mt { flex: 1; display: flex; flex-direction: column; gap: 1px; padding: 11px var(--k-space-4); border-right: 1px solid var(--k-border-card); min-width: 0; }
.k-mt:last-child { border-right: 0; }
.k-mt .k-mt-t { color: var(--k-ink-3); font-size: var(--k-fs-aux); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.k-mt .k-mt-v { font-size: var(--k-fs-title); line-height: var(--k-lh-title); color: var(--k-ink); font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 5px; min-width: 0; }
.k-mt .k-mt-v small { font-size: var(--k-fs-aux); color: var(--k-ink-4); font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- 步骤条 ---------- */
.k-steps { display: flex; align-items: stretch; padding: 0; flex-shrink: 0; overflow: hidden; }
.k-step {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: var(--k-space-2); padding: 0 var(--k-space-3);
  height: 40px; border: 0; border-right: 1px solid var(--k-border-card); background: transparent;
  color: var(--k-ink-3); font-size: var(--k-fs-body); white-space: nowrap;
}
.k-step:last-child { border-right: 0; }
.k-step:hover { background: var(--k-bg-soft); }
.k-step .k-step-no {
  width: 20px; height: 20px; border-radius: 50%; background: var(--k-border-card); color: var(--k-ink-3);
  display: inline-flex; align-items: center; justify-content: center; font-size: var(--k-fs-aux); font-weight: 500; flex-shrink: 0;
}
.k-step .k-step-l { overflow: hidden; text-overflow: ellipsis; }
.k-step .k-step-c { margin-left: auto; color: var(--k-ink-4); font-variant-numeric: tabular-nums; flex-shrink: 0; }
.k-step .k-step-note { font-style: normal; }
.k-step.sug .k-step-no { background: var(--k-primary); color: var(--k-surface); }
.k-step.sug .k-step-c { color: var(--k-primary); }
.k-step.on { background: var(--k-primary-bg); color: var(--k-primary-hover); }
.k-step.on .k-step-no { background: var(--k-primary); color: var(--k-surface); }
.k-step.on .k-step-c { color: var(--k-primary-hover); }

/* ---------- 按钮 / 片 / 输入 ---------- */
.k-btn {
  height: var(--k-h-md); padding: 0 var(--k-space-3); border: 1px solid var(--k-border); background: var(--k-surface);
  border-radius: var(--k-radius-control); display: inline-flex; align-items: center; gap: 6px;
  font-size: var(--k-fs-body); font-weight: 500; color: var(--k-ink); white-space: nowrap;
}
.k-btn:hover { background: var(--k-bg-soft); }
.k-btn--primary { background: var(--k-primary); border-color: var(--k-primary); color: var(--k-surface); }
.k-btn--primary:hover { background: var(--k-primary-hover); border-color: var(--k-primary-hover); }
.k-btn--ghost { border-color: transparent; background: transparent; color: var(--k-primary); }
.k-btn--ghost:hover { background: var(--k-primary-bg); }
.k-btn--danger { color: var(--k-error-text); border-color: var(--k-border); background: var(--k-surface); }
.k-btn--danger:hover { background: var(--k-error-bg); }
.k-btn--sm { height: var(--k-h-sm); padding: 0 10px; font-size: var(--k-fs-aux); }
.k-btn[disabled] { color: var(--k-ink-5); background: var(--k-bg-soft); border-color: var(--k-border-card); cursor: default; }
.k-btn--primary[disabled] { background: var(--k-bg-soft); border-color: var(--k-border-card); color: var(--k-ink-5); }

.k-chip {
  height: var(--k-h-sm); padding: 0 10px; border: 1px solid var(--k-border); border-radius: var(--k-radius-control);
  background: var(--k-surface); display: inline-flex; align-items: center; gap: 5px; color: var(--k-ink-2);
  font-size: var(--k-fs-aux); font-weight: 500; white-space: nowrap;
}
.k-chip:hover { background: var(--k-bg-soft); }
.k-chip .k-ar { color: var(--k-ink-5); font-size: 9px; }
.k-chip .k-cnt { font-variant-numeric: tabular-nums; color: var(--k-ink-5); font-weight: 400; }
.k-chip.on { background: var(--k-primary-bg); border-color: var(--k-primary-bg); color: var(--k-primary-hover); }
.k-chip.on .k-cnt { color: var(--k-primary-hover); }
.k-chip.on .k-ar { color: var(--k-primary-hover); }
.k-chip--add { border-style: dashed; color: var(--k-ink-3); }

.k-seg { display: inline-flex; padding: 2px; background: var(--k-border-card); border-radius: 9px; gap: 2px; }
.k-seg button {
  height: var(--k-h-sm); padding: 0 10px; border: 0; border-radius: 7px; background: transparent;
  display: inline-flex; align-items: center; gap: 5px; color: var(--k-ink-3);
  font-size: var(--k-fs-aux); font-weight: 500; white-space: nowrap;
}
.k-seg button.on { background: var(--k-surface); color: var(--k-ink); box-shadow: var(--k-shadow-1); }
.k-seg .k-cnt { font-variant-numeric: tabular-nums; color: var(--k-ink-5); font-weight: 400; }
.k-seg button.on .k-cnt { color: var(--k-primary); }

.k-inp {
  height: var(--k-h-sm); padding: 0 10px; border: 1px solid var(--k-border); border-radius: var(--k-radius-control);
  background: var(--k-surface); display: inline-flex; align-items: center; gap: 7px;
  color: var(--k-ink); font-size: var(--k-fs-aux);
}
.k-inp:focus-within { border-color: var(--k-primary); box-shadow: 0 0 0 2px var(--k-selection-line); outline: none; }
.k-inp input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; font-size: var(--k-fs-aux); color: var(--k-ink); }
.k-inp input::placeholder { color: var(--k-ink-4); }
.k-inp--search { width: var(--k-search-w); }
.k-field {
  height: var(--k-h-md); width: 100%; padding: 0 10px; border: 1px solid var(--k-border);
  border-radius: var(--k-radius-control); background: var(--k-surface); font-size: var(--k-fs-body); color: var(--k-ink);
}
.k-field:focus { border-color: var(--k-primary); box-shadow: 0 0 0 2px var(--k-selection-line); outline: none; }

/* ---------- 标签 / 状态 / KD / 变化 ---------- */
.k-tag {
  display: inline-flex; align-items: center; height: var(--k-h-tag); padding: 0 7px;
  border-radius: var(--k-radius-tag-sm); font-size: var(--k-fs-aux); font-weight: 500;
  margin-right: 3px; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis;
}
.k-tag--grey { background: var(--k-rule-soft); color: var(--k-ink-2); }
.k-tag--blue { background: var(--k-primary-bg); color: var(--k-primary-hover); }
.k-tag--yellow { background: var(--k-warning-bg); color: var(--k-warning-text); }
.k-tag--green { background: var(--k-success-bg); color: var(--k-success-text); }
.k-tag--red { background: var(--k-error-bg); color: var(--k-error-text); }
.k-tag--add { border: 1px dashed var(--k-border); color: var(--k-ink-3); background: transparent; }
/* 可点标签(表内改分类):看着是标签,点开才是选择器 —— 表内不放按钮,但分类要能改 */
.k-tag.k-edit { cursor: pointer; max-width: 100%; }
.k-tag.k-edit:hover { background: var(--k-border-card); color: var(--k-ink); }
.k-st { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.k-st i { width: 7px; height: 7px; border-radius: 50%; display: inline-block; flex-shrink: 0; background: var(--k-ink-5); }
.k-st.s-open i { background: var(--k-surface); border: 1.5px solid var(--k-border); }
.k-st.s-info i { background: var(--k-primary); }
.k-st.s-warn i { background: var(--k-warning); }
.k-st.s-ok i { background: var(--k-success); }
.k-st.s-bad i { background: var(--k-error); }
.k-st.s-mute i { background: var(--k-ink-5); }
.k-st small { color: var(--k-ink-4); font-size: var(--k-fs-aux); }
.k-kd {
  display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: var(--k-h-tag);
  padding: 0 5px; border-radius: var(--k-radius-tag-sm); font-size: var(--k-fs-aux); font-weight: 500;
  font-variant-numeric: tabular-nums; background: var(--k-rule-soft); color: var(--k-ink-2);
}
.k-kd.hi { color: var(--k-ink); font-weight: 500; }
.k-delta { font-size: var(--k-fs-aux); font-variant-numeric: tabular-nums; margin-left: 5px; }
.k-delta.up { color: var(--k-success-text); }
.k-delta.dn { color: var(--k-error-text); }
.k-delta.flat { color: var(--k-ink-3); }

/* ---------- 工具条 / 选择条 ---------- */
.k-toolbar { display: flex; align-items: center; gap: var(--k-space-2); padding: 9px var(--k-space-3); flex-shrink: 0; flex-wrap: nowrap; min-width: 0; }
.k-toolbar > .k-only-wide { display: inline-flex; align-items: center; gap: var(--k-space-2); min-width: 0; }
/* 逐项筛选片(宽屏)与合并成一个的「筛选 n」(1080–1279)是同一份状态的两种排布。
   选择器都写成 .k-toolbar > 子级:合并片的宿主同时带 .k-popwrap(display:inline-flex),
   单类选择器压不住它,窄屏的显隐就会两组同时出现、把搜索框挤出可视区。 */
.k-toolbar > .k-only-narrow { display: none; }
.k-toolbar .k-sep { width: 1px; height: 18px; background: var(--k-border-card); margin: 0 2px; flex-shrink: 0; }
/* 两行筛选条(kitFilterBar)。第一行白底:视图页签 + 右端一组(时间窗 / 分界日 / 口径 / 页面级动作);
   第二行浅灰底:行首筛选图标 + 筛选片 + 搜索,最右「清除筛选」。行内一律 32 高、间距 8,放不下在行内折行。 */
.k-fbar { display: flex; flex-direction: column; flex-shrink: 0; min-width: 0; }
.k-fbar-row { display: flex; align-items: center; flex-wrap: wrap; gap: var(--k-space-2); padding: var(--k-space-2) var(--k-space-3); min-width: 0; }
.k-fbar-view { background: var(--k-surface); }
.k-fbar-filt { background: var(--k-bg-soft); }
.k-fbar-view + .k-fbar-filt { border-top: 1px solid var(--k-border-card); }
.k-tablecard > .k-fbar { border-bottom: 1px solid var(--k-border-card); }
.k-fbar.k-card > .k-fbar-row:first-child { border-radius: var(--k-radius-card) var(--k-radius-card) 0 0; }
.k-fbar.k-card > .k-fbar-row:last-child { border-bottom-left-radius: var(--k-radius-card); border-bottom-right-radius: var(--k-radius-card); }
.k-fbar-end { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--k-space-2); margin-left: auto; min-width: 0; max-width: 100%; }
.k-fbar-ic { display: inline-flex; align-items: center; color: var(--k-ink-4); flex-shrink: 0; }
.k-fbar-clear { margin-left: auto; height: var(--k-h-md); padding: 0 var(--k-space-1); white-space: nowrap; }
.k-fbar .k-chip, .k-fbar .k-inp, .k-fbar .k-btn { height: var(--k-h-md); }
.k-fbar .k-chip { padding: 0 var(--k-space-3); }
.k-fbar .k-ib { width: var(--k-h-md); height: var(--k-h-md); }
.k-fbar .k-sep { width: 1px; height: 18px; background: var(--k-border-card); flex-shrink: 0; }
.k-fbar-row > .k-only-wide { display: inline-flex; align-items: center; flex-wrap: wrap; gap: var(--k-space-2); min-width: 0; }
.k-fbar-row > .k-only-narrow { display: none; }
/* 生效的筛选片:外壳是 span(片内有两颗按钮,按钮不能嵌套),主按钮开浮层,× 只清这一项。 */
.k-fchip.on, .k-datechip { padding: 0; gap: 0; }
.k-fchip-b {
  height: 100%; border: 0; background: transparent; color: inherit; font: inherit; padding: 0 var(--k-space-3);
  display: inline-flex; align-items: center; gap: 5px; border-radius: inherit; min-width: 0; white-space: nowrap;
}
.k-fchip--x .k-fchip-b { padding-right: 2px; }
.k-fchip-d { color: currentColor; opacity: .6; }
.k-fchip-v { max-width: 180px; overflow: hidden; text-overflow: ellipsis; }
.k-fchip-v.k-fchip-empty { color: var(--k-ink-4); font-weight: 400; }
.k-fchip-x {
  width: 22px; height: 22px; margin: 0 5px 0 2px; padding: 0; border: 0; border-radius: var(--k-radius-tag-sm);
  background: transparent; color: inherit; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.k-fchip-x:hover { background: var(--k-selection-line); }
.k-fchip-x .k-ic14 { width: 12px; height: 12px; }
.k-chip.on:hover { background: var(--k-primary-bg); }
.k-datechip { position: relative; }
.k-datechip .k-fchip-b .k-ic14 { color: var(--k-ink-4); }
.k-datechip.on .k-fchip-b .k-ic14 { color: inherit; }
/* 藏起来的原生日期框:不占位、不接指针,但仍"在渲染"(showPicker 需要),贴在片底边上让日历从片下方弹出。 */
.k-datechip-inp { position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; margin: 0; padding: 0; border: 0; opacity: 0; pointer-events: none; }
.k-selbar {
  display: flex; align-items: center; gap: 6px; min-height: var(--k-h-row); padding: 4px 14px;
  background: var(--k-primary-bg); border-top: 1px solid var(--k-selection-line);
  border-bottom: 1px solid var(--k-selection-line); flex-shrink: 0; color: var(--k-primary-hover); flex-wrap: wrap;
}
.k-selbar b { font-weight: 500; margin-right: var(--k-space-1); }
.k-selbar .k-btn--sm { border-color: var(--k-selection-line); color: var(--k-primary-hover); }
.k-selbar .k-sep { width: 1px; height: 16px; background: var(--k-selection-line); margin: 0 6px; }
.k-linkact { border: 0; background: transparent; padding: 0; color: var(--k-primary); font-size: var(--k-fs-aux); }
.k-linkact.k-quiet { color: var(--k-ink-3); }

/* ---------- 数据表 ---------- */
.k-tablecard { flex: 1; display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.k-tablewrap { flex: 1; min-height: 0; overflow: auto; }
.k-table { table-layout: fixed; width: 100%; }
.k-table th {
  text-align: left; font-weight: 500; color: var(--k-ink-3); font-size: var(--k-fs-aux); height: var(--k-h-head);
  padding: 0 9px; background: var(--k-surface); border-bottom: 1px solid var(--k-border); white-space: nowrap;
  position: sticky; top: 0; z-index: 2;
}
.k-table th.k-num { text-align: right; }
.k-table th.k-ctr, .k-table td.k-ctr { text-align: center; }
.k-table td { height: var(--k-h-row); padding: 0 9px; border-bottom: 1px solid var(--k-rule-soft); white-space: nowrap; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; }
.k-table td:first-child, .k-table th:first-child { padding-left: 14px; }
.k-table tbody tr:hover td { background: var(--k-bg-soft); }
.k-table tbody tr { cursor: pointer; }
.k-table tr.k-sel td { background: var(--k-row-selected); }
.k-table tr.k-sel td:first-child { box-shadow: inset 3px 0 0 var(--k-primary); }
.k-table th.k-sortable { cursor: pointer; }
.k-table th.k-sortable:hover { color: var(--k-ink-2); }
.k-table th .k-sortmark { color: var(--k-ink-5); }
.k-table th.k-sorted .k-sortmark { color: var(--k-primary); }
/* 列宽拖动(100-kit.js 的 kitColw*):表头右缘 6px 是拖动区,悬停表头时显示一条竖线提示 */
.k-table th:not(.k-c-pick)::after {
  content: ''; position: absolute; top: 8px; bottom: 8px; right: 0; width: 6px; cursor: col-resize;
  border-right: 2px solid transparent; touch-action: none;
}
.k-table th:not(.k-c-pick):hover::after { border-right-color: var(--k-border); }
.k-colrsz-on, .k-colrsz-on * { cursor: col-resize !important; user-select: none !important; }
.k-cellmain { color: var(--k-ink); font-weight: 500; }
.k-cellsub { color: var(--k-ink-3); font-size: var(--k-fs-aux); margin-left: 6px; }
.k-cellsub--bad { color: var(--k-error-text); }
.k-url { color: var(--k-ink-2); display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
.k-ck { width: 16px; height: 16px; margin: 0; accent-color: var(--k-primary); vertical-align: middle; cursor: pointer; }

/* ---------- 分页(文案口径同 113-core-pager.js) ---------- */
.k-tablenote { padding: 7px var(--k-space-3); border-top: 1px solid var(--k-border-card); color: var(--k-ink-4); font-size: var(--k-fs-aux); flex-shrink: 0; }
.k-pager { display: flex; align-items: center; gap: 6px; padding: 7px var(--k-space-3); border-top: 1px solid var(--k-border-card); color: var(--k-ink-3); font-size: var(--k-fs-aux); flex-shrink: 0; }
.k-pager select { height: var(--k-h-sm); border: 1px solid var(--k-border); border-radius: var(--k-radius-control); background: var(--k-surface); color: var(--k-ink-2); font-size: var(--k-fs-aux); padding: 0 6px; }
.k-pgb {
  width: var(--k-h-sm); height: var(--k-h-sm); border: 1px solid var(--k-border); border-radius: var(--k-radius-control);
  display: inline-flex; align-items: center; justify-content: center; color: var(--k-ink-2); background: var(--k-surface); padding: 0;
}
.k-pgb:hover { background: var(--k-bg-soft); }
.k-pgb[disabled] { color: var(--k-ink-5); background: var(--k-bg-soft); cursor: default; }

/* ---------- 浮层(筛选 / 列设置 / 视图更多) ---------- */
.k-popwrap { position: relative; display: inline-flex; }
.k-pop {
  position: absolute; top: calc(100% + 4px); left: 0; z-index: 40; min-width: 200px; max-width: 320px;
  max-height: 340px; overflow: auto; background: var(--k-surface); border: 1px solid var(--k-border);
  border-radius: var(--k-radius-control); box-shadow: var(--k-shadow-2); padding: 6px;
}
.k-pop.k-pop--right { left: auto; right: 0; }
.k-pop label, .k-pop .k-popitem {
  display: flex; align-items: center; gap: var(--k-space-2); height: var(--k-h-sm); padding: 0 var(--k-space-2);
  border-radius: var(--k-radius-tag); font-size: var(--k-fs-aux); color: var(--k-ink-2); white-space: nowrap; border: 0; background: transparent; width: 100%; text-align: left;
}
.k-pop label:hover, .k-pop .k-popitem:hover { background: var(--k-bg-soft); }
.k-pop .k-popgrp { padding: 6px var(--k-space-2) 2px; font-size: var(--k-fs-aux); color: var(--k-ink-4); }
.k-pop .k-popfoot { display: flex; justify-content: flex-end; gap: 6px; padding: 6px 4px 2px; border-top: 1px solid var(--k-rule-soft); margin-top: 4px; }

/* ---------- 抽屉 ---------- */
/* 抽屉与遮罩从顶栏下方开始:顶栏(品牌切换 / 刷新 / 身份)在抽屉打开时仍然可用,
   设计稿里抽屉也是挂在内容区上而不是盖住整页。 */
.k-drawer-scrim { position: fixed; top: var(--k-h-top); right: 0; bottom: 0; left: 0; background: var(--k-scrim); z-index: 50; }
.k-drawer {
  position: fixed; top: var(--k-h-top); right: 0; bottom: 0; width: var(--k-drawer-w); max-width: 100vw; z-index: 51;
  background: var(--k-surface); box-shadow: var(--k-shadow-drawer); display: flex; flex-direction: column;
}
.k-drawer-hd { display: flex; align-items: flex-start; gap: var(--k-space-2); padding: 14px 20px 10px; border-bottom: 1px solid var(--k-border-card); }
.k-drawer-hd h2 { margin: 0; font-size: var(--k-fs-panel); font-weight: 500; overflow: hidden; text-overflow: ellipsis; }
.k-drawer-sub { font-size: var(--k-fs-aux); color: var(--k-ink-3); margin-top: 2px; }
.k-drawer-acts { display: flex; align-items: center; gap: var(--k-space-2); padding: 10px 20px; border-bottom: 1px solid var(--k-border-card); background: var(--k-bg-soft); flex-wrap: wrap; }
.k-drawer-tabs { display: flex; gap: 20px; padding: 0 20px; border-bottom: 1px solid var(--k-border-card); }
.k-drawer-tabs button { height: var(--k-h-head); display: flex; align-items: center; gap: 4px; border: 0; background: transparent; color: var(--k-ink-3); font-size: var(--k-fs-body); padding: 0; border-bottom: 2px solid transparent; }
.k-drawer-tabs button.on { border-bottom-color: var(--k-primary); color: var(--k-primary); font-weight: 500; }
.k-drawer-body { flex: 1; overflow: auto; padding: 14px 20px 20px; display: flex; flex-direction: column; gap: 14px; }
.k-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.k-kpi .k-kpi-t { font-size: var(--k-fs-aux); color: var(--k-ink-3); }
.k-kpi .k-kpi-v { font-size: var(--k-fs-title); line-height: var(--k-lh-title); font-variant-numeric: tabular-nums; }
.k-panel { padding: 10px 12px; }
.k-h2 { font-size: var(--k-fs-card); font-weight: 500; color: var(--k-ink); }
.k-sub { font-size: var(--k-fs-aux); color: var(--k-ink-3); }
.k-rowline { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
/* 竖排堆叠:面板里"标题 + 一块内容"的间距只在这里定一次,不靠各页在元素上写 margin-top */
.k-stack { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.k-wrap { overflow-wrap: anywhere; }
/* 详情块:字段表 / 折叠块(kitFieldList·kitDetails) */
.k-fields { margin: 0; display: flex; flex-direction: column; gap: var(--k-space-2); }
.k-fields > div { display: flex; gap: 10px; align-items: baseline; }
.k-fields dt { flex: 0 0 72px; color: var(--k-ink-3); font-size: var(--k-fs-aux); }
.k-fields dd { margin: 0; flex: 1; min-width: 0; color: var(--k-ink); overflow-wrap: anywhere; }
.k-details summary { cursor: pointer; font-size: var(--k-fs-aux); color: var(--k-ink-3); }
.k-details .k-details-b { margin-top: 6px; }
/* 抽屉正文四块:键值清单 / 正文片段对照 / 折叠块(kitKv·kitSnippet·kitFold);代码块见下。
   .k-kv 有两种容器:抽屉里的 kitKv 出 <div>(窄标签列、无内边距,贴在面板里),
   卡片里的 kitKeyValue 出 <dl>(见下方"键值表")。两者的度量按元素选,互不覆盖。 */
div.k-kv { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 6px 10px; align-items: baseline; font-size: var(--k-fs-aux); }
div.k-kv > b { font-weight: 500; color: var(--k-ink-3); }
div.k-kv > span { color: var(--k-ink); min-width: 0; overflow-wrap: anywhere; white-space: pre-line; }
div.k-kv > span > i { display: block; font-style: normal; color: var(--k-ink-3); }
.k-snippet { font-size: var(--k-fs-body); line-height: 1.7; color: var(--k-ink-2); overflow-wrap: anywhere; }
.k-snippet mark { background: var(--k-warning-bg); color: var(--k-ink); border-radius: 3px; padding: 0 2px; font-weight: 500; }
.k-fold > summary { cursor: pointer; font-size: var(--k-fs-aux); color: var(--k-ink-3); }
.k-fold[open] > summary { margin-bottom: 8px; }
.k-ta { height: auto; padding: 8px 10px; line-height: 1.55; resize: vertical; font-family: inherit; }
.k-radios { display: flex; flex-direction: column; gap: 2px; }
.k-radios label { display: flex; align-items: center; gap: var(--k-space-2); height: var(--k-h-sm); font-size: var(--k-fs-aux); color: var(--k-ink-2); }
/* 等宽块(kitCode)。任务中心要"带框的只读小窗",工单审核要"贴在面板里的软底块",取带框那版:
   工单审核的块本来就装在 .k-panel 里,多一圈 1px 边框不改版式,行高沿用 1.55 那版更好读。 */
.k-code {
  display: block; margin: 0; padding: var(--k-space-2) 10px; background: var(--k-bg-soft);
  border: 1px solid var(--k-border-card); border-radius: var(--k-radius-control);
  font-family: var(--k-font-mono); font-size: var(--k-fs-aux); line-height: 1.55; color: var(--k-ink-2);
  white-space: pre-wrap; overflow-wrap: anywhere; max-height: 240px; overflow: auto;
}
.k-cmd {
  display: flex; align-items: center; gap: var(--k-space-2); min-width: 0; padding: 6px var(--k-space-2);
  background: var(--k-bg-soft); border: 1px solid var(--k-border-card); border-radius: var(--k-radius-control);
}
.k-cmd code { flex: 1; min-width: 0; overflow-x: auto; white-space: pre; font-family: var(--k-font-mono); font-size: var(--k-fs-aux); color: var(--k-ink-2); }
.k-cmd .k-btn { flex-shrink: 0; }

/* ---------- 状态:空 / 骨架 / 错误 ---------- */
.k-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 40px 20px; text-align: center; color: var(--k-ink-3); font-size: var(--k-fs-aux); }
.k-empty b { font-size: var(--k-fs-card); font-weight: 500; color: var(--k-ink); }
.k-empty .k-rowline { justify-content: center; margin-top: 4px; }
.k-error { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 40px 20px; text-align: center; color: var(--k-ink-3); font-size: var(--k-fs-aux); }
.k-error b { font-size: var(--k-fs-card); font-weight: 500; color: var(--k-error-text); }
.k-error code { font-family: var(--k-font-mono); font-size: var(--k-fs-aux); color: var(--k-ink-3); background: var(--k-bg-soft); border-radius: var(--k-radius-tag-sm); padding: 1px 6px; }
.k-skel { display: flex; flex-direction: column; }
.k-skel span {
  height: var(--k-h-row); border-bottom: 1px solid var(--k-rule-soft);
  background: linear-gradient(90deg, var(--k-border-card) 25%, var(--k-rule-soft) 50%, var(--k-border-card) 75%);
  background-size: 400% 100%; animation: k-skel 1.4s ease-in-out infinite; opacity: .55;
}
@keyframes k-skel { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }
@media (prefers-reduced-motion: reduce) { .k-skel span { animation: none; } }

/* ---------- Toast(110-core-cn-dicts.js 的 toast() 用的就是这个 #toast) ---------- */
.toast {
  position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%) translateY(8px); z-index: 90;
  display: inline-flex; align-items: center; min-height: var(--k-h-toast); padding: 0 14px;
  border-radius: var(--k-radius-control); background: var(--k-surface); color: var(--k-ink);
  font-size: var(--k-fs-body); border: 1px solid var(--k-border); box-shadow: var(--k-shadow-3);
  opacity: 0; pointer-events: none; transition: opacity .15s, transform .15s; max-width: 70vw;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ---------- 弹窗 ---------- */
.k-dlg-scrim { position: fixed; inset: 0; background: var(--k-scrim); z-index: 60; display: flex; align-items: center; justify-content: center; }
.k-dlg { width: 480px; max-width: calc(100vw - 32px); max-height: calc(100vh - 64px); background: var(--k-surface); border-radius: var(--k-radius-card); box-shadow: var(--k-shadow-4); display: flex; flex-direction: column; }
.k-dlg.k-dlg--sm { width: 400px; }
.k-dlg.k-dlg--wide { width: 720px; }
.k-dlg h2 { margin: 0; padding: 16px 20px 6px; font-size: var(--k-fs-panel); font-weight: 500; }
.k-dlg-b { padding: 6px 20px 12px; display: flex; flex-direction: column; gap: var(--k-space-3); overflow: auto; }
.k-dlg-f { padding: 10px 20px 14px; display: flex; justify-content: flex-end; align-items: center; gap: var(--k-space-2); }
.k-fld { display: flex; flex-direction: column; gap: var(--k-space-1); }
.k-fld label { font-size: var(--k-fs-aux); font-weight: 500; color: var(--k-ink-2); }
.k-fld .k-help-txt { font-size: var(--k-fs-aux); color: var(--k-ink-3); }

/* ---------- 启动遮罩 ---------- */
.boot-progress { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 95; background: var(--k-border-card); overflow: hidden; }
.boot-progress span { display: block; height: 100%; width: 40%; background: var(--k-primary); animation: k-boot 1.1s ease-in-out infinite; }
@keyframes k-boot { 0% { transform: translateX(-100%); } 100% { transform: translateX(320%); } }
.boot-loading { position: fixed; inset: 0; z-index: 94; background: var(--k-bg-app); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--k-space-3); }
.boot-loading[hidden] { display: none; }
.boot-loading-card { display: flex; align-items: center; gap: 10px; background: var(--k-surface); border: 1px solid var(--k-border-card); border-radius: var(--k-radius-card); padding: 14px 18px; box-shadow: var(--k-shadow-1); }
.boot-loading-card b { display: block; font-weight: 500; }
.boot-loading-card span { font-size: var(--k-fs-aux); color: var(--k-ink-3); }
.boot-loading.error .boot-loading-card b { color: var(--k-error-text); }
.boot-retry { height: var(--k-h-sm); padding: 0 10px; border: 1px solid var(--k-border); border-radius: var(--k-radius-control); background: var(--k-surface); font-size: var(--k-fs-aux); }
.k-spin { width: 18px; height: 18px; border: 2px solid var(--k-border-card); border-top-color: var(--k-primary); border-radius: 50%; display: inline-block; animation: k-spin .8s linear infinite; flex-shrink: 0; }
@keyframes k-spin { to { transform: rotate(360deg); } }
body:not(.app-booting) .boot-progress { display: none; }

/* ---------- 共用分片自带的类 ----------
   这几组类名不是 kit 自己发明的,是复用的核心分片直接往 DOM 里写的:
     .datatip-pop            100-core-dom-helpers.js 的 data-tip 浮层
     .chart*                 112-core-charts.js 的 SVG 图与读数浮层
     .page-loading/.loading/.spinner/.boot-skeleton/.empty/.page-load-error/.page-retry
                             105-core-page-registry.js 的壳级加载/失败态
     .view-loading-hint      130-core-cache-prefetch.js 的非侵入加载指示
   复用它们的逻辑就得给它们上这套皮:不写这一段,这些状态在新界面里会是裸 HTML。
   颜色一律走 v2 令牌,不引用旧壳变量。 */
.datatip-pop {
  position: fixed; left: 0; top: 0; width: max-content; max-width: 280px;
  padding: 5px 8px; border-radius: var(--k-radius-tag); background: var(--k-surface); color: var(--k-ink-2);
  font-size: var(--k-fs-aux); line-height: 1.5; white-space: normal; overflow-wrap: anywhere;
  border: 1px solid var(--k-border); box-shadow: var(--k-shadow-2); pointer-events: none; z-index: 100;
}
.datatip-pop[hidden] { display: none; }
.chartsvg { display: block; width: 100%; overflow: visible; }
.chartgrid { stroke: var(--k-rule-soft); stroke-width: 1; }
.chartaxis { fill: var(--k-ink-5); font-size: 10px; }
.chartline { stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.chartbar { opacity: .9; }
.chartdot { opacity: .85; }
.chartdot-last { opacity: 1; }
.chartlegend { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 5px; font-size: var(--k-fs-aux); color: var(--k-ink-3); }
.chartlegenditem { display: inline-flex; align-items: center; gap: 5px; }
.chartlegenditem i { width: 9px; height: 2.5px; border-radius: 2px; flex: none; }
.chartlegenditem.bar i { height: 9px; }
.chartnote { color: var(--k-ink-3); font-size: var(--k-fs-aux); }
/* 分界标记(chartLine 的 markIndex/markLabel):竖线比悬浮十字线实一档 —— 它是数据的一部分,
   不是交互反馈;分界之前那一段铺一层极淡的底色,让"前段 / 后段"不用看竖线也分得开。 */
.chartband { fill: var(--k-bg-soft); pointer-events: none; }
.chartmark { stroke: var(--k-ink-4); stroke-width: 1.5; stroke-dasharray: 5 3; pointer-events: none; }
.chartmarkt { fill: var(--k-ink-4); pointer-events: none; }
.charthit { fill: transparent; pointer-events: all; }
.chartcross { stroke: var(--k-border); stroke-width: 1; stroke-dasharray: 3 3; pointer-events: none; }
.chartempty { border: 1px dashed var(--k-border); border-radius: var(--k-radius-control); color: var(--k-ink-3); font-size: var(--k-fs-aux); text-align: center; padding: 22px 14px; }
.chartpop {
  position: fixed; left: 0; top: 0; width: max-content; max-width: 260px; display: flex; flex-direction: column; gap: 2px;
  padding: 6px 9px; border-radius: var(--k-radius-tag); background: var(--k-surface); color: var(--k-ink);
  border: 1px solid var(--k-border); box-shadow: var(--k-shadow-2);
  font-size: var(--k-fs-aux); line-height: 1.5; pointer-events: none; z-index: 100;
}
.chartpop[hidden] { display: none; }
.chartpop-d { color: var(--k-ink-3); }
.chartpop-r { display: flex; align-items: center; gap: 6px; }
.chartpop-r i { width: 9px; height: 2.5px; border-radius: 2px; flex: none; }
.chartpop-r.bar i { height: 9px; }
.page-loading { display: flex; flex-direction: column; gap: var(--k-space-3); padding: 20px; }
.loading, .view-loading-hint { display: flex; align-items: center; gap: var(--k-space-2); color: var(--k-ink-3); font-size: var(--k-fs-aux); padding: 8px 0; }
.spinner { width: 16px; height: 16px; border: 2px solid var(--k-border-card); border-top-color: var(--k-primary); border-radius: 50%; display: inline-block; animation: k-spin .8s linear infinite; flex-shrink: 0; }
.spinner.lg { width: 18px; height: 18px; }
.boot-skeleton { display: flex; flex-direction: column; gap: 8px; }
.boot-skeleton span { height: var(--k-h-row); border-radius: var(--k-radius-tag); background: var(--k-border-card); opacity: .55; }
.empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 40px 20px; text-align: center; color: var(--k-ink-3); font-size: var(--k-fs-aux); }
.empty b { font-size: var(--k-fs-card); font-weight: 500; color: var(--k-ink); }
.empty.page-load-error b { color: var(--k-error-text); }
.page-retry { height: var(--k-h-md); padding: 0 var(--k-space-3); border: 1px solid var(--k-border); border-radius: var(--k-radius-control); background: var(--k-surface); font-size: var(--k-fs-body); font-weight: 500; }

/* ---------- 响应式:四档(Responsive 页) ---------- */
@media (min-width: 1680px) {
  .k-pagewrap { max-width: var(--k-content-max); width: 100%; margin: 0 auto; }
}
/* 1280–1439:按列优先级先藏 SERP 对照与意图两列 */
@media (max-width: 1439px) {
  .k-topsearch { width: 300px; }
  #page-keywords .k-table:not([data-force~="serp"]) .k-c-serp,
  #page-keywords .k-table:not([data-force~="intent"]) .k-c-intent { display: none; }
  /* 步骤条一行放五步,1440 以下「建议本步」这四个字会把环节名挤成「收集…」——环节名优先 */
  .k-step .k-step-note { display: none; }
  /* 通用列优先级:页面把 cls:'k-hide-md' 写在列定义上,这一档就藏它(与上面按列 key 写死的
     两条同义,只是不必再为每张新表往 kit 里加一行选择器)。 */
  .k-table th.k-hide-md, .k-table td.k-hide-md { display: none; }
}
/* 1080–1279:导航收成图标窄栏(hover 展开),再藏品类与承接页,首两列冻结横向滚 */
@media (max-width: 1279px) {
  .k-topsearch { width: 240px; }
  .k-side { width: var(--k-side-rail-w); }
  .k-side nav a { justify-content: center; padding: 0 6px; gap: 0; }
  .k-side nav a span, .k-side .navgrp, .k-side .k-navempty { display: none; }
  .k-side:hover, .k-side:focus-within { width: var(--k-side-w); position: absolute; top: var(--k-h-top); bottom: 0; left: 0; z-index: 30; box-shadow: var(--k-shadow-3); background: var(--k-bg-app); }
  .k-side:hover nav a, .k-side:focus-within nav a { justify-content: flex-start; padding: 0 10px; gap: 11px; }
  .k-side:hover nav a span, .k-side:focus-within nav a span, .k-side:hover .navgrp, .k-side:focus-within .navgrp { display: flex; }
  .k-body { position: relative; }
  .k-main { padding: 12px 12px 12px 4px; }
  .k-pagewrap { min-width: 0; }
  /* 选择器要与上面 .k-toolbar > .k-only-wide 同级,否则媒体查询里的 display:none 特异性不够 */
  .k-toolbar > .k-only-wide { display: none; }
  .k-toolbar > .k-only-narrow { display: inline-flex; }
  .k-fbar-row > .k-only-wide { display: none; }
  .k-fbar-row > .k-only-narrow { display: inline-flex; }
  #page-keywords .k-table:not([data-force~="cat"]) .k-c-cat,
  #page-keywords .k-table:not([data-force~="url"]) .k-c-url { display: none; }
  .k-tablewrap { overflow-x: auto; }
  .k-table th.k-c-pick, .k-table td.k-c-pick { position: sticky; left: 0; z-index: 3; background: var(--k-surface); }
  .k-table th.k-hide-sm, .k-table td.k-hide-sm { display: none; }
  /* 冻结列:勾选列恒冻结(列类型固定 40 宽);主列由页面标 cls —— 表的第一列标 k-freeze,
     跟在勾选列后面的标 k-freeze2。.k-c-kw 是关键词视图主列的既有写法,等同 k-freeze2。 */
  .k-table th.k-freeze, .k-table td.k-freeze { position: sticky; left: 0; z-index: 3; background: var(--k-surface); }
  .k-table th.k-c-kw, .k-table td.k-c-kw,
  .k-table th.k-freeze2, .k-table td.k-freeze2 { position: sticky; left: 40px; z-index: 3; background: var(--k-surface); }
  .k-table tr.k-sel td.k-c-pick, .k-table tr.k-sel td.k-c-kw,
  .k-table tr.k-sel td.k-freeze, .k-table tr.k-sel td.k-freeze2 { background: var(--k-row-selected); }
  .k-table tbody tr:hover td.k-c-pick, .k-table tbody tr:hover td.k-c-kw,
  .k-table tbody tr:hover td.k-freeze, .k-table tbody tr:hover td.k-freeze2 { background: var(--k-bg-soft); }
  .k-mt .k-mt-v small { display: none; }
}
/* < 1080:导航默认收起,由汉堡按钮拉出;抽屉全宽 */
@media (max-width: 1079px) {
  /* 抽屉挂在 .k-body(position:relative,本身就从顶栏下沿开始)里,top 取 0;写成顶栏高会再往下错一个顶栏,
     顶栏与抽屉之间露出一条被遮罩压暗的页面,底部导航项被截掉。底色用白,与页面灰底分开。 */
  .k-side { position: absolute; top: 0; bottom: 0; left: 0; z-index: 31; width: var(--k-side-w); transform: translateX(-100%); transition: transform .16s; background: var(--k-surface); border-right: 1px solid var(--k-border-card); }
  .k-side nav a.on { background: var(--k-primary-bg); color: var(--k-primary); box-shadow: none; }
  .k-side nav a { justify-content: flex-start; padding: 0 10px; gap: 11px; }
  .k-side nav a span, .k-side .navgrp { display: flex; }
  body.nav-open .k-side { transform: none; box-shadow: var(--k-shadow-3); }
  body.nav-open .k-scrim { display: block; position: fixed; inset: var(--k-h-top) 0 0 0; z-index: 30; }
  .k-drawer { width: 100vw; }
  .k-topsearch { display: none; }
}
/* < 640(手机):顶栏右侧有日历/通知/刷新/门户/退出五个入口,留着应用名与账号名会把门户与退出挤出屏幕。
   窄屏只留汉堡、标志、品牌选择与右侧入口;账号名在门户里看得到。 */
@media (max-width: 639px) {
  .k-top { gap: 2px; padding: 0 6px; }
  .k-top .k-appname, .k-top .k-slash, .k-who { display: none; }
}

/* ---------- 卡片头 / 目标卡 / 进度条 / 漏斗条 / 待办列表 / 告警列表 / 新鲜度条 / 键值表 / 版本列表 ---------- */
/* 与上面的组件同规矩:只引用令牌,不写字面色值与字面高度。
   卡头与目标卡两页各写过一版,合成一版:节奏取"间距靠父级 gap"那版(项目目标页),
   工作台原来靠三处 margin-top 撑开的间距等价换成同一个 6px gap,块序与形态不变。 */
.k-cardhd { display: flex; align-items: center; gap: var(--k-space-2); padding: 10px 14px; border-bottom: 1px solid var(--k-border-card); flex-shrink: 0; min-width: 0; }
.k-cardhd b { font-size: var(--k-fs-card); font-weight: 500; color: var(--k-ink); white-space: nowrap; }
.k-cardhd > span { color: var(--k-ink-3); font-size: var(--k-fs-aux); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.k-cardfoot { padding: 8px 14px; border-top: 1px solid var(--k-rule-soft); font-size: var(--k-fs-aux); color: var(--k-ink-3); }
/* 卡底/列表底的一行灰字说明(kitNote) */
.k-note { padding: 8px 14px; color: var(--k-ink-3); font-size: var(--k-fs-aux); }
/* 卡内提示条:与 .k-banner 同一套语义色,但贴在卡片内不带圆角与外边距 */
.k-cardnote { display: flex; align-items: center; gap: 6px; padding: 8px 14px; font-size: var(--k-fs-aux); background: var(--k-warning-bg); color: var(--k-warning-text); }
.k-cardnote.t-mute { background: var(--k-bg-soft); color: var(--k-ink-3); }
.k-cardnote.t-error { background: var(--k-error-bg); color: var(--k-error-text); }

/* 目标卡:标题(可带 ⓘ)/ 大数 + 副文 / 进度条 / 脚注。脚注允许折行而不是截断 ——
   两页的脚注都是"口径 + 数据日"的串接,截掉尾巴等于把数据日藏起来。 */
.k-goal { padding: 14px var(--k-space-4); display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.k-goal-t { display: flex; align-items: center; gap: 2px; color: var(--k-ink-3); font-size: var(--k-fs-aux); font-weight: 500; min-width: 0; }
.k-goal-t > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.k-goal-v { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.k-goal-n { font-size: var(--k-fs-title); line-height: var(--k-lh-title); font-weight: 400; color: var(--k-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.k-goal-s { color: var(--k-ink-3); font-size: var(--k-fs-aux); min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.k-goal-f { color: var(--k-ink-3); font-size: var(--k-fs-aux); overflow-wrap: anywhere; }
.k-help-sm { width: 18px; height: 18px; border-radius: 5px; }
.k-bar { height: 6px; border-radius: 3px; background: var(--k-border-card); overflow: hidden; }
.k-bar i { display: block; height: 100%; border-radius: 3px; background: var(--k-primary); }
.k-bar.t-ok i { background: var(--k-success); }
.k-bar.t-warn i { background: var(--k-warning); }
.k-bar.t-mute i { background: var(--k-border); }
.k-warn { color: var(--k-warning-text); }

.k-funnelcard { overflow: hidden; flex-shrink: 0; }
.k-funnel { display: flex; overflow-x: auto; }
.k-fn { flex: 1 1 0; min-width: 104px; display: flex; flex-direction: column; gap: 1px; padding: 8px 12px; border: 0; border-right: 1px solid var(--k-border-card); background: transparent; text-align: left; }
.k-fn:last-child { border-right: 0; }
.k-fn:hover { background: var(--k-bg-soft); }
.k-fn.t-warn { background: var(--k-warning-bg); }
.k-fn.t-warn:hover { background: var(--k-warning-bg); }
.k-fn.on, .k-fn.on:hover { background: var(--k-primary-bg); box-shadow: inset 0 -2px 0 var(--k-primary); }
.k-fn-t { font-size: var(--k-fs-aux); color: var(--k-ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.k-fn-v { font-size: var(--k-fs-title); line-height: var(--k-lh-title); color: var(--k-ink); font-variant-numeric: tabular-nums; }
.k-fn-s { font-size: var(--k-fs-aux); color: var(--k-ink-4); min-height: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.k-listcard { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.k-li { display: flex; align-items: center; gap: 10px; min-height: 38px; padding: 0 14px; border-bottom: 1px solid var(--k-rule-soft); color: var(--k-ink); font-size: var(--k-fs-body); }
.k-li:last-child { border-bottom: 0; }
.k-li:hover { background: var(--k-bg-soft); }
.k-li .k-li-t { white-space: nowrap; }
.k-li .k-li-s { color: var(--k-ink-3); font-size: var(--k-fs-aux); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.k-li .k-li-n { margin-left: auto; font-variant-numeric: tabular-nums; font-weight: 500; }
.k-li .k-ic16 { color: var(--k-ink-5); }

.k-alert { display: block; width: 100%; text-align: left; border: 0; border-bottom: 1px solid var(--k-rule-soft); background: transparent; padding: 10px 14px; }
.k-alert:last-child { border-bottom: 0; }
.k-alert:hover { background: var(--k-bg-soft); }
.k-alert-h { display: flex; align-items: center; gap: 6px; min-width: 0; }
.k-alert-h .k-st { font-size: var(--k-fs-body); font-weight: 500; color: var(--k-ink); min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.k-alert-h .k-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.k-alert-time { font-size: var(--k-fs-aux); color: var(--k-ink-4); white-space: nowrap; }
.k-alert-r { display: block; margin-top: 3px; font-size: var(--k-fs-aux); color: var(--k-ink-3); white-space: normal; line-height: var(--k-lh-body); }

.k-freshrow { display: flex; align-items: center; flex-wrap: wrap; gap: var(--k-space-3) var(--k-space-4); padding: 10px 14px; flex-shrink: 0; }
.k-freshrow .k-fresh { gap: 6px; }
.k-freshrow .k-fresh b { color: var(--k-ink-2); font-weight: 500; }
.k-freshrow .k-fresh-d { font-variant-numeric: tabular-nums; }
.k-freshrow .k-fresh-l { color: var(--k-ink-4); }

/* 抽屉里的定义列表(阻断详情:解除条件 / 重试 / 责任人 / 证据) */
.k-dl { display: flex; flex-direction: column; gap: 10px; }
.k-dl > div { display: flex; gap: var(--k-space-3); align-items: flex-start; }
.k-dl dt { width: 76px; flex-shrink: 0; font-size: var(--k-fs-aux); color: var(--k-ink-3); }
.k-dl dd { margin: 0; font-size: var(--k-fs-body); color: var(--k-ink-2); min-width: 0; white-space: normal; line-height: var(--k-lh-body); }

/* ---------- 键值表(kitKeyValue,卡片里的 <dl>;抽屉里的 div.k-kv 见上) ---------- */
dl.k-kv { display: grid; grid-template-columns: 68px minmax(0, 1fr); gap: 7px var(--k-space-2); margin: 0; padding: 12px 14px; }
dl.k-kv dt { color: var(--k-ink-3); font-size: var(--k-fs-aux); }
dl.k-kv dd { margin: 0; color: var(--k-ink-2); font-size: var(--k-fs-aux); min-width: 0; overflow-wrap: anywhere; }
dl.k-kv dd small { display: block; color: var(--k-ink-4); }

/* ---------- 版本列表 ---------- */
.k-vers { display: flex; flex-direction: column; }
.k-vers-i { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 6px 14px; border-bottom: 1px solid var(--k-rule-soft); }
.k-vers-i:last-child { border-bottom: 0; }
.k-vers-i > i { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; border: 1.5px solid var(--k-border); box-sizing: border-box; }
.k-vers-i.on > i { background: var(--k-success); border-color: var(--k-success); }
.k-vers-x { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.k-vers-x b { font-weight: 500; color: var(--k-ink); }
.k-vers-x span { color: var(--k-ink-3); font-size: var(--k-fs-aux); }
/* 页面私有样式。规矩:能进 021-kit.css 的一律进 kit —— 这里只放"这一页独有、别的页面复用不了"
   的两三条。本单交付一页,故内容很少;它长胖就说明 kit 缺了一个块,该往 kit 加,不是往这里堆。 */

/* 工作台:三区栅格。合同结果卡 3 等分 → 待办 / 阻断两栏 → 新鲜度整行。
   窄档只改列数,卡片内部结构不变(漏斗自己横向滚,见 .k-funnel)。 */
.dv-goals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--k-space-3); flex-shrink: 0; }
.dv-cols { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: var(--k-space-3); align-items: start; }
@media (max-width: 1279px) {
  .dv-goals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dv-cols { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1079px) {
  .dv-goals { grid-template-columns: minmax(0, 1fr); }
}
/* 壳的 .k-main 是 overflow:hidden(表格页靠表体自己滚)。这一页没有表体,滚动由中段自己接:
   页头与底部新鲜度条留在滚动区外,阻断清单长起来也不会把它们顶走。 */
.dv-scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: var(--k-space-3); }
/* 页面优化开关开时,工单闭环折成一行小字入口(230 的 dv2FunnelFold),点开在下面出原来的八段计数条。 */
.dv-rqfold { display: flex; flex-direction: column; gap: var(--k-space-2); flex-shrink: 0; }
.dv-rqfold-sum { display: flex; align-items: center; gap: var(--k-space-1); min-width: 0; border: 0; background: transparent; padding: 0 var(--k-space-1);
  font-size: var(--k-fs-aux); color: var(--k-ink-3); text-align: left; cursor: pointer; }
.dv-rqfold-sum:hover { color: var(--k-primary); }
.dv-rqfold-sum > span:first-of-type { color: var(--k-ink-2); white-space: nowrap; }
.dv-rqfold-n { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 任务中心「可发起任务」页签的卡片网格。只有这一页有"卡片墙"形态(其余页都是表),
   放这里而不是 kit:再出现第二个卡片墙时再抽到 kit,现在抽是凭一处用例定通用件。 */
.k-tk-cards { flex: 1; min-height: 0; overflow: auto; padding: var(--k-space-3); display: grid; gap: var(--k-space-3); grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); align-content: start; }
.k-tk-card { display: flex; flex-direction: column; gap: 6px; padding: var(--k-space-3); }
.k-tk-card .k-tk-card-h { display: flex; align-items: baseline; gap: 6px; }
.k-tk-card h3 { margin: 0; font-size: var(--k-fs-card); font-weight: 500; color: var(--k-ink); }
.k-tk-card p { margin: 0; font-size: var(--k-fs-aux); color: var(--k-ink-3); line-height: var(--k-lh-body); }
.k-tk-card footer { margin-top: auto; padding-top: 6px; }
/* 卡片墙上方的一条上下文说明(某些流程的任务只能从业务页面创建) */
.k-tk-note { display: flex; align-items: center; gap: var(--k-space-2); margin: var(--k-space-3) var(--k-space-3) 0; padding: 10px var(--k-space-3); border-radius: var(--k-radius-control); background: var(--k-primary-bg); color: var(--k-primary-hover); font-size: var(--k-fs-aux); }
.k-tk-note b { font-weight: 500; }

/* 运行记录:请求态与运行态不一致的行整行黄底(设计稿:同一行只出一个主状态色,这里是行级警示) */
.k-table tr.k-tk-diverge td { background: var(--k-warning-bg); }

/* 任务中心表格的窄屏列优先级(与关键词视图的一套同形,列 key 不同故各写各的):
   1280–1439 先藏来源;1080–1279 再藏处理方与优先级,并冻结勾选 + 任务两列。 */
@media (max-width: 1439px) {
  .k-table .k-c-source { display: none; }
}
@media (max-width: 1279px) {
  .k-table .k-c-handler, .k-table .k-c-prio { display: none; }
  .k-table th.k-c-task, .k-table td.k-c-task { position: sticky; left: 40px; z-index: 3; background: var(--k-surface); }
  .k-table tr.k-sel td.k-c-task { background: var(--k-row-selected); }
  .k-table tbody tr:hover td.k-c-task { background: var(--k-bg-soft); }
  .k-table tr.k-tk-diverge td.k-c-task { background: var(--k-warning-bg); }
}
/* 项目目标与计划:左右两列(右列 320 定宽)。1440 以下右列没有可读宽度,并成单列;
   1080 以下三张目标卡再并成一列。只有布局,没有观感。 */
#page-goals .g-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: var(--k-space-3); align-items: start; }
#page-goals .g-col { display: flex; flex-direction: column; gap: var(--k-space-3); min-width: 0; }
#page-goals .g-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--k-space-3); }
@media (max-width: 1439px) {
  #page-goals .g-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1079px) {
  #page-goals .g-cards { grid-template-columns: minmax(0, 1fr); }
}
/* 指标条上「排名口径」是文字不是数字,20px 的值会折行;这一页把值行收成单行加省略号。 */
#page-goals .k-mt-v { white-space: nowrap; overflow: hidden; }
/* 只读看板(目标进度页签)的两张参考表:表格不开自己的滚动条(跟随页面滚),行也不是可点的,
   不给指针与悬停高亮。收窄在 .g-grid 之内 —— 任务清单与周计划两个页签的行是可点的(点开抽屉),
   不吃这四条。 */
#page-goals .g-grid .k-tablewrap { overflow: visible; }
#page-goals .g-grid .k-table tbody tr { cursor: default; }
#page-goals .g-grid .k-table tbody tr:hover td { background: transparent; }
#page-goals .g-grid .k-table tbody tr:last-child td { border-bottom: 0; }
/* 指标条第 3 格「排名口径」的值是一句话不是一个数,四格等分会把副文挤成省略号;
   这一格多要半格,从只放三位数的「考核词」那格里取(格序含最左的时窗片,故是 4 与 5)。 */
#page-goals .k-metrics .k-mt:nth-child(4) { flex: 1.45; }
#page-goals .k-metrics .k-mt:nth-child(5) { flex: 0.8; }
/* 「GA 会话范围」六个字在 68px 的键列里要折行 */
#page-goals .k-kv { grid-template-columns: 78px minmax(0, 1fr); }

/* 数据表现:总览页签左表右图(设计稿的 5fr / 3fr 两栏)。表卡在主栏拿满高度、表体自己滚;
   横条卡按内容定高(align-self:start,不跟着拉长)。1280 以下并成一列,表在上、图在下。 */
#page-perf .pf-overview {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 3fr);
  gap: var(--k-space-3); min-height: 0; flex: 1;
}
#page-perf .pf-barcard { align-self: start; }
/* 副栏放两张卡(SoV 走势 + 谁占了我们的词):grid 的一个格子里堆两张,所以套一层 flex 列。 */
#page-perf .pf-side { display: flex; flex-direction: column; gap: var(--k-space-3); align-self: start; min-width: 0; }
#page-perf .pf-sovcard { min-width: 0; }
#page-perf .pf-sovchart { padding: 10px 14px; }
#page-perf .pf-barcard .k-linkact { white-space: nowrap; }
/* 1279 以下并成一列:两块合起来比一屏高,所以滚动交给这一列本身,表体不再各开一条
   —— 表卡按 flex 分高度的话,横条卡占掉的那 370px 会把表体压到 0 行(实测 1080×720 一行不剩)。
   表头的 sticky 改跟这一列的滚动框走,滚下去仍然贴顶。 */
@media (max-width: 1279px) {
  #page-perf .pf-overview { display: flex; flex-direction: column; overflow-y: auto; overscroll-behavior: contain; }
  #page-perf .pf-overview > .k-tablecard { flex: none; }
  #page-perf .pf-overview .k-tablewrap { overflow: visible; }
  #page-perf .pf-barcard { flex-shrink: 0; }
  #page-perf .pf-side { flex-shrink: 0; }
}
/* 占比单元格:数字一行、进度条一行(列类型是 number,整格已右对齐) */
#page-perf .pf-pct { display: flex; flex-direction: column; gap: 3px; align-items: stretch; }
#page-perf .pf-pct .k-bar { height: 4px; }
/* 横条排名图(pf2BarList)。条高 12、行距 8 是设计稿 Charts 的定值;标签定宽省略号,
   数值贴条尾右对齐。竞品条一律灰(分类色),只有「我们」那条上主色。 */
#page-perf .pf-bars { display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; }
#page-perf .pf-bar {
  display: grid; grid-template-columns: 170px minmax(0, 1fr) 52px; align-items: center;
  gap: var(--k-space-2); height: 30px; width: 100%; padding: 0 4px; border: 0; background: transparent; text-align: left;
}
#page-perf .pf-bar[data-act] { cursor: pointer; border-radius: var(--k-radius-tag-sm); }
#page-perf .pf-bar[data-act]:hover { background: var(--k-bg-soft); }
#page-perf .pf-bar-l { color: var(--k-ink-3); font-size: var(--k-fs-aux); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#page-perf .pf-bar-t { height: 12px; background: var(--k-rule-soft); border-radius: var(--k-radius-tag-sm); overflow: hidden; }
#page-perf .pf-bar-t i { display: block; height: 100%; background: var(--k-ink-5); border-radius: 0 var(--k-radius-tag-sm) var(--k-radius-tag-sm) 0; }
#page-perf .pf-bar-v { font-size: var(--k-fs-aux); color: var(--k-ink-2); font-variant-numeric: tabular-nums; text-align: right; }
#page-perf .pf-bar.t-us .pf-bar-l, #page-perf .pf-bar.t-us .pf-bar-v { color: var(--k-ink); font-weight: 500; }
#page-perf .pf-bar.t-us .pf-bar-t i { background: var(--k-primary); }
@media (max-width: 1279px) {
  #page-perf .pf-bar { grid-template-columns: 120px minmax(0, 1fr) 48px; }
}
/* URL 视图的窄屏列优先级不写在这里:走 kit 通用钩子(列定义上的 k-hide-md / k-hide-sm /
   k-freeze2),见 260-urlview.js 的 UV2_COLUMNS 注释。 */
/* 加入队列弹窗里逐条列出的 URL:长链接要能换行,不许把弹窗撑宽 */
#k-dialog .k-fld .k-help-txt { overflow-wrap: anywhere; }
/* 指标条:五格等分时「本页 28 天曝光」那格放不下「8,376,350 + 环比 +7,327,577」(实测 eufy),
   副文会被省略号吃掉。两个大数格各多要一点,从只放两三位数的均位/队列两格里取
   (格序含最左的时窗片,故 3 与 4 是点击与曝光)。总权重仍是 5,整条宽度不变。 */
#page-urlview .k-metrics .k-mt:nth-child(2) { flex: 0.85; }
#page-urlview .k-metrics .k-mt:nth-child(3) { flex: 1.1; }
#page-urlview .k-metrics .k-mt:nth-child(4) { flex: 1.45; }
#page-urlview .k-metrics .k-mt:nth-child(5) { flex: 0.8; }
#page-urlview .k-metrics .k-mt:nth-child(6) { flex: 0.8; }
/* 1280–1439 档:格子宽度按比例缩了一档,「8,376,350 + 环比 +7,327,577」的副文会被省略号吃掉
   (kit 在 ≤1279 已经统一把指标副文收起,这一页的数字是全站最大的,提前一档收)。
   环比在表格的两个「变化」列里逐行还看得到,不是唯一出处。 */
@media (max-width: 1439px) {
  #page-urlview .k-metrics .k-mt-v small { display: none; }
}
/* URL 视图抽屉里的承接词表:抽屉只有 520 宽,词列必须能折行 —— 不折行的话长尾词全成
   「best outdoor sec…」,这张表就只剩数字了。数字列仍单行(折行会把 tabular-nums 对齐打乱)。 */
#k-overlay .uv-kwt td.uv-kw { white-space: normal; }
#k-overlay .uv-kwt td.uv-kw .k-linkact { text-align: left; }

/* 标签看板(265-tagboard.js)。表列与筛选片全部来自 kit,这里只有 kit 里没有的五件:
   第三档列优先级、已优化那一条横排统计、四象限散点画布、周交付那张只读表、标签筛选浮层里的手输框。 */
/* 滚动归属。这一页的固定高度子项相加约 1270px(页头 + 汇总卡 + 工具条 + 已批准改动 +
   趋势卡 461 + 四象限卡 524),1440×900 下页壳只有 822px —— 走默认的"表体接滚动"会把
   成员表卡挤成 2px、四象限卡被 .k-main 裁掉,窗口那根滚动条滚到的全是裁掉的空白。
   所以整页走 .k-scrolly(见 021-kit.css):图卡按自己的高度铺开,页内滚。
   成员表卡不能跟着铺开(50 行就是 3600px,一页翻到底才见下一张卡),写死 60vh 让它
   在 .k-tablewrap 内部自滚;min-height 兜住矮屏 —— 60vh 在 800px 高的屏上只有 480,
   扣掉卡头与分页条后表体剩不到 400,连十行都排不满。 */
#page-tagboard .k-pagewrap > .k-tablecard { height: 60vh; min-height: 520px; }
/* 第三档列优先级(tb2-p3):**比 kit 的 k-hide-md 早一整档让位**。这张表是全站列最多的一张
   (契约第 8 节点名 13 列),固定列合计 1268px;kit 的两个通用钩子在 ≤1439 与 ≤1279 才生效,
   而 1440 与 1512(最常见的两档笔记本宽)下可用宽只有 1185 / 1264 —— 铺开的话
   table-layout:fixed 把唯一的弹性列(URL,这张表的主语)压成 0px,整列凭空消失。
   所以首见日组 / 最近动作 / 备注三列在 1680 以下就先让出去;它们是明细,点开 URL 视图还看得到。 */
@media (max-width: 1679px) {
  #page-tagboard .k-table th.tb2-p3, #page-tagboard .k-table td.tb2-p3 { display: none; }
}
/* 汇总区一行:左边是五格指标条(.k-metrics),右边是「有已批准改动」紧凑条(.tb2-opt)。
   **换行由两条最小宽度自己决定,不写断点**:指标条至少 760(五格大数再窄就开始压数字),
   紧凑条至少 440(两行小字再窄就折成四行,实测 1440 档硬挤在一行时它只剩 297px)。
   两者加上间距放不下 —— 1440 档的可用宽只有 1196 —— 就自动换行,紧凑条独占一整行,
   两行小字铺得开,一个字都不裁。放得下时剩余宽按 3:1 分,大数那边多吃一些:
   五个大数才是这一屏的主语,紧凑条是注脚。
   写死断点在这里会错一档:1440 的视口在 max-width:1439 下不命中,而它恰恰是要换行的那一档。 */
#page-tagboard .tb2-sumrow { display: flex; flex-wrap: wrap; align-items: stretch; gap: var(--k-space-3); flex-shrink: 0; }
#page-tagboard .tb2-sumrow > .k-metrics { flex: 3 1 760px; min-width: 0; }
#page-tagboard .tb2-sumrow > .tb2-opt { flex: 1 1 440px; min-width: 0; }
/* 「有已批准改动 N 页:提升 · 持平 · 下降 · 数据不足」紧凑条。它不是指标条(那是 2-5 格
   等分的大数),是两行带状态点的小计数,所以自带一套度量而不是套 .k-metrics。
   两行都 flex+wrap:窄到放不下时在词之间断行,而不是把右端的数字裁掉。 */
#page-tagboard .tb2-opt { display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 9px 14px; flex-shrink: 0; }
#page-tagboard .tb2-optrow { display: flex; align-items: center; flex-wrap: wrap; gap: 2px var(--k-space-3); min-width: 0; }
#page-tagboard .tb2-opt b { font-size: var(--k-fs-card); font-weight: 500; color: var(--k-ink); }
#page-tagboard .tb2-optcell { display: inline-flex; align-items: baseline; gap: var(--k-space-1); }
#page-tagboard .tb2-optcell b { font-size: inherit; font-weight: 500; color: var(--k-ink); font-variant-numeric: tabular-nums; }
/* 第二行:按改动类别的分布 + 右端的 GA。GA 用 margin-left:auto 推到右端(它固定近 28 天,
   与上面那行跟随时间窗的判定不是一个窗口,拉开距离正是要让人看出这是另一码事);
   放不下时 flex-wrap 让它掉到下一行,仍在条内,不裁切。 */
#page-tagboard .tb2-optsub { font-size: var(--k-fs-aux); color: var(--k-ink-3); }
#page-tagboard .tb2-optsub .k-sub { margin-left: auto; text-align: right; }
#page-tagboard .tb2-optbreak { font-variant-numeric: tabular-nums; }
/* 集群趋势:一幅四指标合图。图本身与悬浮读数全部来自共享绘制器(.chart* 在 021-kit.css),
   这里只给外壳的内边距。 */
#page-tagboard .tb2-trendbox { padding: var(--k-space-3) var(--k-space-4) var(--k-space-1); }
/* 指标卡:四张一行,整张可点(button),勾选切换线的显隐。摆在图的正上方、卡头之下 ——
   GSC 的摆法,也是"先看数再看形状"的读图顺序。
   --tb2-mc 是这张卡对应那条线的颜色(渲染时内联在 style 上):顶条与选中态都用它,
   这是"哪张卡对哪条线"的唯一线索(与轴刻度的染色同一套)。未选中时顶条压到很淡,
   卡片仍可读 —— 未选中 ≠ 禁用,数字照样要能看。
   窄屏(≤1279)改两列:四张卡并排到 640px 以下时数字会折行。 */
#page-tagboard .tb2-mcards {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--k-space-2);
  padding: var(--k-space-3) var(--k-space-4) 0;
}
#page-tagboard .tb2-mcard {
  display: flex; flex-direction: column; align-items: flex-start; gap: 1px;
  padding: 8px 10px 9px; text-align: left; cursor: pointer;
  border: 1px solid var(--k-border-card); border-top: 3px solid var(--tb2-mc, var(--k-border));
  border-radius: var(--k-radius-control); background: var(--k-surface); color: inherit; font: inherit;
}
#page-tagboard .tb2-mcard:not(.on) { border-top-color: var(--k-border); background: var(--k-bg-soft); }
#page-tagboard .tb2-mcard:not(.on) .tb2-mcv { color: var(--k-ink-4); }
#page-tagboard .tb2-mcard:hover { background: var(--k-bg-hover); }
#page-tagboard .tb2-mcard.on { background: var(--k-surface); box-shadow: var(--k-shadow-1); }
#page-tagboard .tb2-mcard:focus-visible { outline: 2px solid var(--k-primary); outline-offset: 1px; }
#page-tagboard .tb2-mcn { font-size: var(--k-fs-aux); color: var(--k-ink-3); }
#page-tagboard .tb2-mcv { font-size: var(--k-fs-panel); font-weight: 500; font-variant-numeric: tabular-nums; }
#page-tagboard .tb2-mcs { font-size: var(--k-fs-aux); color: var(--k-ink-5); }
@media (max-width: 1279px) { #page-tagboard .tb2-mcards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* 散点画布:**viewBox 宽 = 这个图盒的实宽**(JS 量出来再重画,见 265 的 tb2FitCharts
   与 112 的 chartFitBind),1 viewBox 单位 = 1 CSS 像素 —— 所以这里既不设 max-width
   也不居中:图铺满整卡,宽屏上多出来的宽度全落到绘图区,字号线宽点径恒是设计值。
   原先是 max-width:900 居中,1920 的屏上两侧各空 500px 的死白。
   height:auto 跟着 viewBox 的高走(高度是常量,不随宽度长高)。 */
#page-tagboard .tb2-quadbox { padding: var(--k-space-3) var(--k-space-4) var(--k-space-1); }
#page-tagboard .tb2-quad { display: block; width: 100%; height: auto; }
/* 外框只描边不填:四个区的浅底由下面的 .tb2-qbg 各自铺(一区一色)。 */
#page-tagboard .tb2-quad .tb2-plot { fill: none; stroke: var(--k-border-card); }
#page-tagboard .tb2-quad .tb2-div { stroke: var(--k-border); stroke-width: 1; stroke-dasharray: 4 4; }
/* 象限角标是背景注记,不许挡住点也不许吃走鼠标(点才是这张图的可交互对象) */
#page-tagboard .tb2-quad .tb2-qn, #page-tagboard .tb2-quad .tb2-qa { pointer-events: none; }
#page-tagboard .tb2-quad .tb2-qn { font-size: 13px; font-weight: 500; }
#page-tagboard .tb2-quad .tb2-qa { fill: var(--k-ink-5); font-size: 11px; }
#page-tagboard .tb2-quad .tb2-ax { fill: var(--k-ink-4); font-size: 11px; font-variant-numeric: tabular-nums; }
#page-tagboard .tb2-quad .tb2-axname { fill: var(--k-ink-5); }
/* 点只用主色一种:红黄绿在这套界面里只表状态,拿来分象限会被读成"这批页出事了"。
   象限由两条分界线与角标表达,不靠颜色。 */
#page-tagboard .tb2-quad .tb2-dot { fill: var(--k-primary); fill-opacity: .62; stroke: var(--k-surface); stroke-width: 1; cursor: pointer; }
#page-tagboard .tb2-quad .tb2-dot:hover, #page-tagboard .tb2-quad .tb2-dot:focus-visible { fill-opacity: 1; stroke: var(--k-primary-hover); stroke-width: 2; outline: none; }
/* 集群健康:四象限方块图。与上面那张散点共用一套画布规矩(viewBox 宽 = 图盒实宽),
   但配色不同 —— 那张图一个点 = 一页,象限只表"在哪个格子",所以一律主色;
   这张图一个方块 = 一个集群,四格本身就是四条**动作**(优先处理 / 守住 / 观察 / 忽略),
   用 kit 的语义色把结论直接画出来,读者不用在图例与色阶之间来回对照。
   --tb2-chc 是该方块所属象限的颜色,渲染时内联在 style 上。 */
#page-tagboard .tb2-chbox { padding: var(--k-space-3) var(--k-space-4) var(--k-space-1); }
#page-tagboard .tb2-ch { display: block; width: 100%; height: auto; }
#page-tagboard .tb2-ch .tb2-plot { fill: none; stroke: var(--k-border-card); }
#page-tagboard .tb2-ch .tb2-div { stroke: var(--k-border); stroke-width: 1; stroke-dasharray: 4 4; }
/* 0 线("与全站一样跌")比中位数线更要紧:实线且深一档,两条分界线不会看混。 */
#page-tagboard .tb2-ch .tb2-zero { stroke: var(--k-ink-5); stroke-width: 1; }
#page-tagboard .tb2-ch .tb2-chqn, #page-tagboard .tb2-ch .tb2-chqa { pointer-events: none; }
#page-tagboard .tb2-ch .tb2-chqn { font-size: 13px; font-weight: 500; }
#page-tagboard .tb2-ch .tb2-chqa { fill: var(--k-ink-5); font-size: 11px; }
#page-tagboard .tb2-ch .tb2-chax { fill: var(--k-ink-4); font-size: 11px; font-variant-numeric: tabular-nums; }
#page-tagboard .tb2-ch .tb2-chaxname { fill: var(--k-ink-5); }
/* 方块 = 三行字的白底小卡(集群名 / 总点击 / 诊断),左侧一条 4px 象限色条。
   白底而不是象限色实填:卡片落在本格的浅底上,实填的黄 / 绿上写字对比度不够,白底深字在四种浅底上都清楚。
   --tb2-chc 是该方块所属象限的颜色,渲染时内联在 <g> 的 style 上。文字不接指针,点哪儿都落到 <g>。 */
#page-tagboard .tb2-ch .tb2-chtile { cursor: pointer; outline: none; }
#page-tagboard .tb2-ch .tb2-chtile text { pointer-events: none; }
#page-tagboard .tb2-ch .tb2-chsq {
  fill: var(--k-surface); stroke: var(--tb2-chc, var(--k-primary)); stroke-width: 1.5;
}
#page-tagboard .tb2-ch .tb2-chbar { fill: var(--tb2-chc, var(--k-primary)); }
/* 样本少的集群画成虚线框:1/2 = 50% 与 84/168 = 50% 在图上一样高,
   不把"这是两页算出来的"标在形上,两者就会被同等对待。 */
#page-tagboard .tb2-ch .tb2-chsq.small { stroke-dasharray: 4 3; }
#page-tagboard .tb2-ch .tb2-chtile:hover .tb2-chsq, #page-tagboard .tb2-ch .tb2-chtile:focus-visible .tb2-chsq {
  stroke: var(--k-ink); stroke-width: 2;
}
#page-tagboard .tb2-ch .tb2-chname { fill: var(--k-ink); font-size: 12px; font-weight: 500; }
#page-tagboard .tb2-ch .tb2-chclk { fill: var(--k-ink-3); font-size: 11px; font-variant-numeric: tabular-nums; }
#page-tagboard .tb2-ch .tb2-chdx { font-size: 11px; font-weight: 500; }
/* 错开摆放的卡片:细线连回真实位置上的小圆点(线与点都在卡片之下)。 */
#page-tagboard .tb2-ch .tb2-chlead { stroke: var(--k-ink-5); stroke-width: 1; pointer-events: none; }
#page-tagboard .tb2-ch .tb2-chpin { fill: var(--k-ink-3); pointer-events: none; }
/* 两张四象限图的四区底色与区名色(265 的 TB2_QUADRANTS / TB2_CH_QUADRANTS 的 cls)。
   一区一种浅底:bad 危险 / ok 成功 / warn 警告 / info 主色 / mute 中性;区名与诊断文字取同一族的深色。
   全部取 020-tokens 的令牌,不写字面色值 —— 以后加暗色令牌时这里跟着走。 */
#page-tagboard .tb2-qbg { pointer-events: none; }
#page-tagboard .tb2-qbg.tb2-q-bad { fill: var(--k-error-bg); }
#page-tagboard .tb2-qbg.tb2-q-ok { fill: var(--k-success-bg); }
#page-tagboard .tb2-qbg.tb2-q-warn { fill: var(--k-warning-bg); }
#page-tagboard .tb2-qbg.tb2-q-info { fill: var(--k-primary-bg); }
#page-tagboard .tb2-qbg.tb2-q-mute { fill: var(--k-bg-hover); }
#page-tagboard text.tb2-q-bad { fill: var(--k-error-text); }
#page-tagboard text.tb2-q-ok { fill: var(--k-success-text); }
#page-tagboard text.tb2-q-warn { fill: var(--k-warning-text); }
#page-tagboard text.tb2-q-info { fill: var(--k-primary-hover); }
#page-tagboard text.tb2-q-mute { fill: var(--k-ink-3); }
/* 流量口径三选一。拆分表没建时整组置灰(kitSeg 没有禁用态,靠外层 .off):
   按钮不接指针,悬停落在外层上看得到原因。 */
#page-tagboard .tb2-traffic { display: inline-flex; }
#page-tagboard .tb2-traffic.off { opacity: .5; cursor: not-allowed; }
#page-tagboard .tb2-traffic.off button { pointer-events: none; }
/* 流量口径那一句(选了品牌 / 非品牌才出):筛选条下方一行灰字,不占控件位。 */
#page-tagboard .tb2-trafnote { padding: 0 var(--k-space-3); margin-top: calc(-1 * var(--k-space-1)); font-size: var(--k-fs-aux); color: var(--k-ink-3); line-height: var(--k-lh-body); }
/* 集群健康工具条上那句「看全站」:窄屏下不许被挤成一字一行的竖条,放不下就省略(全文在悬停里)。 */
#page-tagboard .tb2-chsub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
/* 顶上那句口径常显(不折叠进 ⓘ):这张图的每个位置都建立在可比页门槛与全站基线上。 */
#page-tagboard .tb2-chintro {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--k-space-2) var(--k-space-3);
  padding: 10px var(--k-space-4) 0; font-size: var(--k-fs-aux); color: var(--k-ink-3); line-height: var(--k-lh-body);
}
#page-tagboard .tb2-chintro b { font-weight: 500; color: var(--k-ink-2); font-variant-numeric: tabular-nums; }
/* 图例:四个色块 + 计数 + 那一格的动作。颜色是这张图唯一的象限线索,图例必须带同一套色。 */
#page-tagboard .tb2-chkeys {
  display: flex; flex-wrap: wrap; gap: var(--k-space-2) var(--k-space-4);
  padding: var(--k-space-2) var(--k-space-4) 0; font-size: var(--k-fs-aux); color: var(--k-ink-3);
}
#page-tagboard .tb2-chkey { display: inline-flex; align-items: center; gap: 6px; }
#page-tagboard .tb2-chkey i { width: 10px; height: 10px; border-radius: 2px; background: var(--tb2-chc); }
#page-tagboard .tb2-chkey b { font-weight: 500; color: var(--k-ink); font-variant-numeric: tabular-nums; }
#page-tagboard .tb2-chkey em { font-style: normal; color: var(--k-ink-5); }
/* 「优先处理」那一行名字:这一屏的产出就是它,所以摆在图注之上、可直接点进去。 */
#page-tagboard .tb2-chfix {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px var(--k-space-2);
  padding: var(--k-space-2) var(--k-space-4) 0; font-size: var(--k-fs-aux); color: var(--k-ink-3);
}
#page-tagboard .tb2-chfix > b { font-weight: 500; color: var(--k-error-text); }
/* 周交付是只读统计表:不开自己的滚动条(跟随卡片),行也不可点,不给指针与悬停高亮。 */
#page-tagboard .tb2-wkcard .k-tablewrap { overflow: visible; }
#page-tagboard .tb2-wk tbody tr { cursor: default; }
#page-tagboard .tb2-wk tbody tr:hover td { background: transparent; }
/* 每周末尾那行合计:上一条实线把一周框起来,读表时一眼看到周界。 */
#page-tagboard .tb2-wk tbody tr.tb2-wktotal td { border-bottom: 1px solid var(--k-border); background: var(--k-bg-soft); }
#page-tagboard .tb2-wk tbody tr.tb2-wktotal td:first-child { color: var(--k-ink-3); }
/* 标签清单读不到时的手输框。浮层里的 .k-pop label 是"一行一个勾选项"的形态(去边框、
   去底色、hover 变灰),会把 .k-inp 的边框吃掉 —— 这里按输入框把那三条还原回来。 */
.k-pop .tb2-taginp { width: 100%; margin: 4px 0 6px; padding: 0 10px; border: 1px solid var(--k-border); background: var(--k-surface); }
.k-pop .tb2-taginp:hover { background: var(--k-surface); }
/* 意图集群:主从两栏(左簇清单定宽 + 右簇详情)。两列各自是独立的表卡,各滚各的。
   1280–1439 左列收到 340(再窄「确认 / 总」列的表头就折行);1080 以下改上下堆叠(简报 W2-C)。 */
#page-clusters .c2-grid { display: grid; grid-template-columns: 400px minmax(0, 1fr); gap: var(--k-space-3); flex: 1; min-height: 0; }
#page-clusters .c2-left, #page-clusters .c2-right { min-width: 0; }
@media (max-width: 1439px) {
  #page-clusters .c2-grid { grid-template-columns: 340px minmax(0, 1fr); }
}
@media (max-width: 1079px) {
  #page-clusters .c2-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(200px, 38%) minmax(0, 1fr); }
}
/* 左列 400px 装不下「计数 + 每页条数 + 翻页」一行,允许折行而不是让计数被挤没;
   1440 以下左列收到 340,连折行都会把上一页 / 下一页拆到两行 —— 这一档收起条数选择器
   (默认 100 条/页已覆盖现有簇量),计数与翻页留在一行。 */
#page-clusters .c2-left .k-pager { flex-wrap: wrap; row-gap: var(--k-space-1); }
@media (max-width: 1439px) {
  #page-clusters .c2-left .k-pager select, #page-clusters .c2-left .k-pager label { display: none; }
}
/* 左列的搜索框吃 kit 的 210 定宽会把同行的筛选片顶出卡片,这里按列宽收窄 */
#page-clusters .c2-left .c2-search { width: 128px; min-width: 96px; }
/* 分段片那行在 340 的左列里只放得下三段的文字,计数保留、片本身允许收窄 */
#page-clusters .c2-left .k-seg { min-width: 0; overflow: hidden; }
/* 当前簇:蓝底 + 左侧蓝条(与勾选态同色不同义 —— 勾选看复选框,当前看这条竖杠) */
#page-clusters .k-table tbody tr.c2-cur td { background: var(--k-primary-bg); }
#page-clusters .k-table tbody tr.c2-cur td:first-child { box-shadow: inset 3px 0 0 var(--k-primary); }
/* 簇名一列:状态点 + 主题名,主题名超长省略 */
#page-clusters .c2-topic { display: flex; align-items: center; gap: 6px; min-width: 0; }
#page-clusters .c2-topic-t { min-width: 0; overflow: hidden; text-overflow: ellipsis; color: var(--k-ink); font-weight: 500; }
/* 簇详情页头:标题 + 分类标签 + 状态一行(动作靠右),第二行是口径副文。
   它不是卡片头(k-cardhd 是单行、标题不换行),所以这一页自己排。 */
#page-clusters .c2-dhd { display: flex; flex-direction: column; gap: 6px; padding: 12px var(--k-space-4) 10px; border-bottom: 1px solid var(--k-border-card); flex-shrink: 0; }
#page-clusters .c2-dhd-t { display: flex; align-items: center; gap: 6px; min-width: 0; }
#page-clusters .c2-dhd-t h2 { margin: 0; font-size: var(--k-fs-panel); font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 动作组不许被压缩:簇名长起来该省略的是簇名,不是「归并到…」这个按钮的后半截 */
#page-clusters .c2-dhd-a { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; }
#page-clusters .c2-dhd-t > .k-tag, #page-clusters .c2-dhd-t > .k-st { flex-shrink: 0; }
#page-clusters .c2-dhd-m { display: flex; align-items: center; gap: var(--k-space-3); flex-wrap: wrap; font-size: var(--k-fs-aux); color: var(--k-ink-3); min-width: 0; }
#page-clusters .c2-dhd-m > span { display: inline-flex; align-items: center; gap: 5px; min-width: 0; max-width: 100%; }
/* 承接页页签没有表体,滚动由这一层接(卡片本身是 overflow:hidden 的表卡) */
#page-clusters .c2-scroll { flex: 1; min-height: 0; overflow-y: auto; padding: var(--k-space-3); display: flex; flex-direction: column; gap: var(--k-space-3); }
/* 词级覆盖清单的键列放的是关键词(不是字段名),88px 会把每个词折成三行 */
#page-clusters .c2-ovr div.k-kv { grid-template-columns: minmax(0, 240px) minmax(0, 1fr); }
/* 内链规划:四个页签共用一张表壳,只有「建议」页签的行可点开抽屉;另外三个页签是只读清单,
   不给指针与悬停高亮(否则整行看着可点、点了没反应)。窄屏列优先级不在这里写 —— 列定义里
   标 k-hide-md / k-hide-sm 即可,kit 的两档媒体查询已经通用地接住了。 */
#page-links .l2-plain .k-table tbody tr { cursor: default; }
#page-links .l2-plain .k-table tbody tr:hover td { background: transparent; }
/* 技术审计:问题类型页签有九个(全部 + 服务端八类),1440 也放不下一行 —— .k-toolbar 是
   flex-wrap:nowrap,不给这条自己的滚动容器就会把后面的东西挤出可视区。只有这一页的页签是
   "服务端类型全集"而不是固定四五个,故不进 kit。滚动条不占位(macOS 覆盖式)。 */
#page-techissues .ti2-segscroll { min-width: 0; overflow-x: auto; overflow-y: hidden; padding-bottom: 1px; }
/* 九组页签下面的组内问题类型排:可点的分段片 + 还判不了的类型(待诊断/未接入)灰标签,窄屏各自横向滚 */
#page-techissues .ti2-keys { display: flex; align-items: center; gap: 12px; min-width: 0; }
#page-techissues .ti2-pending { display: inline-flex; flex-wrap: nowrap; gap: 6px; min-width: 0; overflow-x: auto; }
/* 技术审计页头:左边九组概况(漏斗条,格子多了自己横向滚),右边 Semrush 健康分卡定宽。 */
#page-techissues .ti2-ov { display: flex; gap: var(--k-space-3); align-items: stretch; min-width: 0; }
#page-techissues .ti2-ov > .k-funnelcard { flex: 1 1 0; min-width: 0; }
#page-techissues .ti2-ov > .k-goal { flex: 0 0 248px; }
/* 九格的组色画成格子顶边一条 3px 线(不用圆点,省下 12px:1440 宽下一格内容约 88px,
   7 个字的组名放得下;最长的「结构化数据与安全」省略,悬停看全名)。 */
#page-techissues .ti2-ov .k-fn { padding: 8px; }
#page-techissues .ti2-ov .k-fn.ti2-g { box-shadow: inset 0 3px 0 var(--ti2-g); }
#page-techissues .ti2-ov .k-fn.ti2-g.on { box-shadow: inset 0 3px 0 var(--ti2-g), inset 0 -2px 0 var(--k-primary); }
/* 九组的类别色:分组是分类不是状态,只画一个圆点,标签底色仍是灰(红黄绿留给严重度)。
   同一组在页头格子、表格标签、抽屉卡片三处同色。宿主有全壳共用的 #k-overlay,故不加页容器前缀。 */
.ti2-g { --ti2-g: var(--k-cat-none); }
.ti2-g-crawl_index { --ti2-g: var(--k-cat-1); }
.ti2-g-response_redirect { --ti2-g: var(--k-cat-2); }
.ti2-g-canonical { --ti2-g: var(--k-cat-3); }
.ti2-g-hreflang { --ti2-g: var(--k-cat-4); }
.ti2-g-page_elements { --ti2-g: var(--k-cat-5); }
.ti2-g-content { --ti2-g: var(--k-cat-6); }
.ti2-g-internal_links { --ti2-g: var(--k-cat-7); }
.ti2-g-resources_perf { --ti2-g: var(--k-cat-8); }
.ti2-g-structured_security { --ti2-g: var(--k-cat-none); }
.ti2-gt.ti2-g .k-tag::before, .k-panel.ti2-g .k-cardhd .k-h2::before {
  content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--ti2-g); margin-right: 5px; vertical-align: 1px;
}
/* 问题列:最多 3 个标签,放不下换到第二行 */
#page-techissues td.ti2-c-issues { white-space: normal; }
#page-techissues .ti2-tags { display: inline-flex; flex-wrap: wrap; gap: 4px; max-width: 100%; }
#page-techissues .ti2-tags .k-tag { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 抽屉问题卡片下的诊断结论区 */
.ti2-diag { border-top: 1px solid var(--k-border-card); padding-top: 8px; display: flex; flex-direction: column; gap: 6px; }
.ti2-diagrow { flex-direction: row; align-items: center; gap: 8px; }
.ti2-diaghd { font-size: var(--k-fs-aux); }
/* 入队弹窗里的圈选理由清单(宿主是全壳共用的 #k-dialog,故只靠本页前缀的类名限定)。 */
.ti2-reason { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 3px; }
.ti2-reason li { font-size: var(--k-fs-aux); color: var(--k-ink-2); }
/* 内容优化:抽屉里的"一条一行"清单(前置数据包的八类证据、准入闸缺项、承接词 top5、输出规则)。
   这几处不是键值对:标题本身是一整句(「GSC 关键词表现」「候选优先级:现承接 > 我站已排名页…」),
   塞进 kitKv 的 88px 键列会被折成两三行。选择器按 c2- 类名而不按页容器 —— 抽屉挂在全壳共用的
   #k-overlay 上,不在 #page-content 里面。 */
.c2-list { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; font-size: var(--k-fs-aux); color: var(--k-ink-2); }
.c2-list > li { display: flex; flex-direction: column; gap: 2px; min-width: 0; overflow-wrap: anywhere; }
.c2-list > li > .c2-l1 { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.c2-list > li > .c2-l2 { color: var(--k-ink-3); }
/* 博客(四个页签一页):四张表的列在窄档下按优先级藏,主列(选题 / 文章 / 博客标题)恒在。
   与任务中心那套同形,列 key 不同故各写各的。 */
@media (max-width: 1439px) {
  #page-blogwriter .k-table .k-c-research,
  #page-blogwriter .k-table .k-c-assign,
  #page-blogwriter .k-table .k-c-words { display: none; }
}
/* 1279 以下不藏「搜索量」:它是这一页判断值不值得写的第一个数,先藏更宽的「竞品验证」(160px) */
@media (max-width: 1279px) {
  #page-blogwriter .k-table .k-c-comp,
  #page-blogwriter .k-table .k-c-owner,
  #page-blogwriter .k-table .k-c-impr,
  #page-blogwriter .k-table .k-c-kws { display: none; }
}
/* 抽屉里的阶段流步骤条(目前只有博客这一页这么用):520 宽里四步平分,内边距要比页面上的窄一档,
   否则「本地生成」这一步的文字被省略号吃掉。选择器落在抽屉正文上 —— 页面上的步骤条不受影响。 */
#k-overlay .k-drawer-body .k-steps .k-step { padding: 0 10px; gap: 6px; }
/* 数据中心:四个页签共用一张表,列数最多的「作业」在 1440 以下要按优先级让位。
   先藏「范围」(全局/按站在抽屉里仍看得到),再藏「类型」与「下次」—— 最后留下的是
   作业名 / 执行计划 / 最近执行 / 最近结果 / 产物,也就是"今天跑没跑、跑成什么样"。 */
@media (max-width: 1439px) {
  #page-jobs .k-table .k-c-scope { display: none; }
  #page-jobs .k-table .k-c-finished { display: none; }
}
@media (max-width: 1279px) {
  #page-jobs .k-table .k-c-kind, #page-jobs .k-table .k-c-next { display: none; }
  #page-jobs .k-table .k-c-dur { display: none; }
}
/* 数据产物那一格是若干灰标签,行高固定 36px 时要按行截断而不是撑高整行 */
#page-jobs .k-table td.k-c-products { overflow: hidden; }
/* 作业面板:过期未跑的行在首格左缘画一条黄线(按行上的 data-overdue 选,不新增类) */
#page-jobs .k-table tr[data-overdue="1"] td:first-child { box-shadow: inset 3px 0 0 var(--k-warning); }

/* 系统管理:五个页签里只有两个有接口,另外三个置灰。kitSeg 只透传 data-key,
   所以灰是按 key 选的一条页面私有规则(不动 kit) —— 点开仍给一段说明,不做死按钮。 */
#page-taskmcp .k-seg button[data-key="users"],
#page-taskmcp .k-seg button[data-key="notify"],
#page-taskmcp .k-seg button[data-key="audit"] { color: var(--k-ink-5); }
#page-taskmcp .k-seg button[data-key="users"].on,
#page-taskmcp .k-seg button[data-key="notify"].on,
#page-taskmcp .k-seg button[data-key="audit"].on { color: var(--k-ink-3); }
/* 密钥前缀是等宽短码,不跟正文同字体 */
#page-taskmcp .k-table td.k-c-prefix code { font-family: var(--k-font-mono); font-size: var(--k-fs-aux); color: var(--k-ink-2); }
/* 窄档让位顺序:先藏「最后使用」与「决策人」(都在行详情里),再藏「前缀」与「所需数据」。
   最后留下的是 名称 / 类型 / 权限 / 项目范围 / 状态 / 到期 与 能力 / 状态 / 执行方式 / 验收。 */
@media (max-width: 1439px) {
  #page-taskmcp .k-table .k-c-used, #page-taskmcp .k-table .k-c-owner { display: none; }
}
@media (max-width: 1279px) {
  #page-taskmcp .k-table .k-c-prefix, #page-taskmcp .k-table .k-c-data { display: none; }
}

/* 客户进度(周报视图):左主栏「本周完成」+ 右列 360(三张目标卡 + 下周计划)。
   1439 以下右列没有可读宽度,并成单列;两列各自是独立卡片流,滚动跟随页面。 */
#page-client .cp2-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--k-space-3); align-items: start; }
#page-client .cp2-col { display: flex; flex-direction: column; gap: var(--k-space-3); min-width: 0; }
@media (max-width: 1439px) {
  #page-client .cp2-grid { grid-template-columns: minmax(0, 1fr); }
}
/* 只读周报:表格不开自己的滚动条(跟随页面滚),行也不可点,不给指针与悬停高亮。 */
#page-client .k-tablewrap { overflow: visible; }
#page-client .k-table tbody tr { cursor: default; }
#page-client .k-table tbody tr:hover td { background: transparent; }
/* 「本周完成」卡尾还有一行口径说明,表格最后一行的分隔线与它叠在一起是两条线。 */
#page-client .cp2-donecard .k-table tbody tr:last-child td { border-bottom: 0; }
/* 指标条五格不等宽:第 1 格标题是「考核词逐词提升一档」这类长句,第 2 格的值是七位数会话数
   (1,789,614 + 副文),两格各多要一档;末两格是个位数,让出来的正好够(格序含最左的时窗片)。 */
#page-client .k-metrics .k-mt:nth-child(2) { flex: 1.25; }
#page-client .k-metrics .k-mt:nth-child(3) { flex: 1.3; }
#page-client .k-metrics .k-mt:nth-child(5),
#page-client .k-metrics .k-mt:nth-child(6) { flex: 0.85; }
/* 弹窗里的两个日期输入并排(周期开始 / 结束),窄档回落单列。 */
.cp2-form2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--k-space-3); }
@media (max-width: 480px) {
  .cp2-form2 { grid-template-columns: minmax(0, 1fr); }
}
/* 品牌总览(顶栏品牌 = 全部站点时的工作台形态,340-brands.js)。
   与工作台同形:页头留在滚动区外,卡片墙自己滚。卡片墙两列 → 窄档一列;
   卡内三格是"卡里的格"不是"卡里的卡"(套 .k-goal 会出现双层卡边),所以自带一套度量。 */
.bv-scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: var(--k-space-3); }
.bv-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--k-space-3); }
.bv-card { display: flex; flex-direction: column; overflow: hidden; min-width: 0; }
.bv-cells { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--k-rule-soft); }
.bv-cell { display: flex; flex-direction: column; gap: 4px; padding: 10px var(--k-space-4); border-right: 1px solid var(--k-rule-soft); min-width: 0; }
.bv-cell:last-child { border-right: 0; }
.bv-cell-t { color: var(--k-ink-3); font-size: var(--k-fs-aux); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bv-cell-v { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.bv-cell-f { color: var(--k-ink-3); font-size: var(--k-fs-aux); overflow-wrap: anywhere; }
.bv-tickets { display: flex; align-items: center; gap: var(--k-space-3); padding: 10px var(--k-space-4); border-bottom: 1px solid var(--k-rule-soft); font-size: var(--k-fs-body); color: var(--k-ink-2); min-width: 0; flex-wrap: wrap; }
.bv-tickets b { font-weight: 500; font-variant-numeric: tabular-nums; }
.bv-fresh { display: flex; align-items: center; gap: var(--k-space-3); padding: 8px var(--k-space-4); flex-wrap: wrap; }
.bv-fresh .k-fresh b { color: var(--k-ink-2); font-weight: 500; }
.bv-fresh .k-fresh-d { font-variant-numeric: tabular-nums; }
/* 1440 以下卡片墙收成一列:两列时每格只剩 ~200px,三格结果的大数会被挤成两行。 */
@media (max-width: 1439px) {
  .bv-cards { grid-template-columns: minmax(0, 1fr); }
}
/* 窄档让位顺序:先藏「已审批未领」与「考核词」(卡上都有),再藏「P0 问题」(与阻断同源)。
   最后留下的是 品牌 / 前 10 / GA 完成 / AIO / 待裁决 / 新鲜度。 */
@media (max-width: 1439px) {
  #page-overview .k-table .k-c-unclaimed { display: none; }
}
@media (max-width: 1279px) {
  #page-overview .k-table .k-c-scope, #page-overview .k-table .k-c-p0 { display: none; }
}
.bv-fresh .k-fresh-l { color: var(--k-ink-4); }
/* 通知中心(360-notifications.js)。表列与工具条全部来自 kit,这里只有三件 kit 里没有的:
   顶栏铃铛的角标、通知主列的「点 + 两行文字」、以及未读的加粗。 */
#notifbell { position: relative; }
.nt2-badge { position: absolute; top: 3px; right: 3px; min-width: 15px; height: 15px; padding: 0 3px; border-radius: 8px; background: var(--k-error); color: var(--k-surface); font-size: 10px; line-height: 15px; text-align: center; font-variant-numeric: tabular-nums; box-shadow: 0 0 0 2px var(--k-surface); pointer-events: none; }
/* 六路来源没齐时的空心点:有未读、但条数还算不准,所以只报"有",不报"几件"。
   实心带数字 = 准数,空心 = 还没算全,两种形态一眼分得开。 */
.nt2-badge-dot { min-width: 9px; width: 9px; height: 9px; padding: 0; top: 5px; right: 5px; border-radius: 50%; background: transparent; border: 2px solid var(--k-error); box-shadow: 0 0 0 2px var(--k-surface); }
/* 主列:状态点占一列宽,文字自己一列(两行会被 .k-cellsub 折下去,点要顶对齐第一行) */
.nt2-note { display: flex; align-items: flex-start; gap: 8px; min-width: 0; }
.nt2-note .k-st { flex-shrink: 0; margin-top: 4px; }
.nt2-note-x { display: flex; flex-direction: column; min-width: 0; }
/* 副文在这里是"第二行"不是"同行补一句",kit 的 6px 左边距会让它比标题缩进一格 */
.nt2-note-x .k-cellsub { margin-left: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 未读加粗是这一页唯一的"重量"信号(颜色已经被类型点占了) */
.nt2-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nt2-title.unread { font-weight: 500; color: var(--k-ink); }
/* ×N:同源重复失败折成一行后的条数。靠右贴住主列右边缘,不参与文字截断 */
.nt2-count { margin-left: auto; padding-left: var(--k-space-2); flex-shrink: 0; color: var(--k-ink-3); font-size: var(--k-fs-aux); font-variant-numeric: tabular-nums; }

/* 执行确认(370-confirm.js)。抽屉里是"一条工单一块":序号 + 动作标签 + 定位副文 + 执行态,
   下面挂现值/改为的键值对。块与块之间用细分隔线,不用卡 —— 520 宽里套卡会只剩 460 的可读宽。 */
.cf2-drawer { display: flex; flex-direction: column; gap: 2px; }
.cf2-order { padding: 10px 0; border-bottom: 1px solid var(--k-rule-soft); display: flex; flex-direction: column; gap: 6px; }
.cf2-order:last-child { border-bottom: 0; }
.cf2-order-h { display: flex; align-items: center; gap: 8px; min-width: 0; }
.cf2-order-h .k-tag { flex-shrink: 0; }
.cf2-order-h .k-st { flex-shrink: 0; }
/* 定位副文是这一行里唯一可以被压缩的东西:动作名与执行态都不许被截 */
.cf2-order-h .k-sub { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cf2-order-i { width: 18px; flex-shrink: 0; color: var(--k-ink-3); font-size: var(--k-fs-aux); font-variant-numeric: tabular-nums; }
.cf2-order .k-kv { padding-left: 26px; }
.cf2-order .k-details { margin-left: 26px; }

/* 页面资产(380-urls.js)。表列与工具条全部来自 kit,这里只有 kit 里没有的四件:
   分类页签的横向滚容器、抽屉里的两处清单(体检问题 / 资格阻断)、抽屉内嵌的窄表格、
   以及标注块的一行式排布。类名一律 u2- 前缀,宿主是全壳共用的 #k-overlay / #k-dialog 时
   只能靠前缀限定(不能靠 #page-urls 后代选择器)。 */
#page-urls .u2-segscroll { min-width: 0; overflow-x: auto; overflow-y: hidden; padding-bottom: 1px; }
/* 体检问题与资格阻断都是"一行一条、条内左标右文"的清单,与 kit 的 k-kv 不同:
   左边是带扣分的严重度标签(宽度不固定),右边可以折行。 */
.u2-list { margin: 0; padding-left: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.u2-list li { font-size: var(--k-fs-body); color: var(--k-ink-2); line-height: 1.55; overflow-wrap: anywhere; }
.u2-list li .k-tag { margin-right: 6px; vertical-align: 1px; }
.u2-list li b { font-weight: 500; color: var(--k-ink); }
/* 说明文字一律另起一行:标签+标题那一行本来就窄(抽屉 520、键值表的值列只剩 ~370),
   跟在后面会被挤成两三个字一行。kit 的 .k-sub 默认是同行补一句,这里按块用。 */
.u2-list li .k-sub { display: block; margin-left: 0; }
/* 抽屉里的窄表(实时 query / GSC 查询词 / 快照时间线)。kit 的 k-table 是页级主表的尺寸,
   520 宽里要把行高与字号收一档,并且允许词列折行 —— 词被截断这张表就没有主语了。 */
.u2-mini { table-layout: fixed; width: 100%; }
.u2-mini th { height: 26px; font-size: var(--k-fs-aux); }
.u2-mini td { height: 28px; font-size: var(--k-fs-aux); padding: 0 6px; }
.u2-mini td:first-child, .u2-mini th:first-child { padding-left: 0; }
.u2-mini td:first-child { white-space: normal; overflow-wrap: anywhere; line-height: 1.4; }
/* 标注块:标签 + 生效态 + 来源在一行,动作推到右端;主页面与备注各自另起一行。 */
.u2-tag { padding: 8px 0; border-bottom: 1px solid var(--k-rule-soft); display: flex; flex-direction: column; gap: 4px; }
.u2-tag:last-of-type { border-bottom: 0; }
.u2-tag-h { display: flex; align-items: center; gap: 8px; min-width: 0; }
.u2-tag-h .k-tag, .u2-tag-h .k-st { flex-shrink: 0; }
.u2-tag .k-sub { overflow-wrap: anywhere; }

/* 上线跟踪(395-launches.js):登记 / 编辑弹窗里两两并排的短字段(类型、负责人、两个日期)。弹窗宽 480,
   两列各 ~210 放得下日期控件;窄屏退回单列。其余全部是 kit。 */
.lw2-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--k-space-3); }
@media (max-width: 560px) { .lw2-grid2 { grid-template-columns: 1fr; } }
/* 优化页才显示的期望值一组:与弹窗正文同间距;hidden 时不能被 display 覆盖。 */
.lw2-stack:not([hidden]) { display: flex; flex-direction: column; gap: var(--k-space-3); }
/* 日程日历(107-schedule.js,顶栏右上角按钮开合的右侧面板 + 活动管理弹窗)。类名一律 sch- 前缀:
   面板挂在 body 上、弹窗宿主是全壳共用的 #k-dialog,都只能靠前缀限定。颜色只引用令牌:
   活动按品类取 --k-cat-*,其余类型用状态/主色令牌,由 JS 写进 --sch-c。 */
#schbtn[aria-expanded="true"] { background: var(--k-primary-bg); color: var(--k-primary); }
.sch-panel {
  position: fixed; top: var(--k-h-top); right: 0; bottom: 0; width: 420px; max-width: 100vw; z-index: 45;
  background: var(--k-surface); border-left: 1px solid var(--k-border-card); box-shadow: var(--k-shadow-drawer);
  display: flex; flex-direction: column; min-height: 0;
}
.sch-panel[hidden] { display: none; }
.sch-hd { display: flex; align-items: center; gap: var(--k-space-1); padding: 10px 12px 6px 16px; }
.sch-hd b { font-size: var(--k-fs-panel); font-weight: 500; color: var(--k-ink); margin-right: 6px; }
.sch-month { font-size: var(--k-fs-card); color: var(--k-ink-2); white-space: nowrap; }
.sch-types { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 16px 8px; }
.sch-tchip { gap: 6px; }
.sch-tchip:not(.on) { color: var(--k-ink-4); }
.sch-tchip:not(.on) .sch-sw { opacity: .35; }
.sch-sw { display: inline-block; width: 10px; height: 10px; border-radius: 3px; background: var(--sch-c); flex-shrink: 0; }
.sch-scroll { flex: 1; min-height: 0; overflow: auto; padding: 0 16px 12px; }
.sch-scroll > .k-banner { margin: 0 0 8px; }
.sch-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 0 0 8px; font-size: var(--k-fs-aux); color: var(--k-ink-3); }
.sch-legend span { display: inline-flex; align-items: center; gap: 5px; }
.sch-grid { border: 1px solid var(--k-border-card); border-radius: var(--k-radius-control); overflow: hidden; }
.sch-wk { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.sch-wk + .sch-wk { border-top: 1px solid var(--k-rule-soft); }
.sch-wkhd span { text-align: center; font-size: var(--k-fs-aux); color: var(--k-ink-4); padding: 4px 0; background: var(--k-bg-soft); }
.sch-cell { min-height: 76px; padding: 3px 3px 4px; display: flex; flex-direction: column; gap: 2px; min-width: 0; cursor: pointer; outline: none; }
.sch-cell + .sch-cell { border-left: 1px solid var(--k-rule-soft); }
.sch-cell:hover { background: var(--k-bg-soft); }
.sch-cell.out { background: var(--k-bg-soft); }
.sch-cell.out .sch-dn { color: var(--k-ink-5); }
.sch-cell.sel { box-shadow: inset 0 0 0 2px var(--k-primary); }
.sch-dn { font-size: var(--k-fs-aux); color: var(--k-ink-2); line-height: 18px; width: 20px; height: 18px; text-align: center; border-radius: 9px; font-variant-numeric: tabular-nums; }
.sch-cell.today .sch-dn { background: var(--k-primary); color: var(--k-surface); }
.sch-bar {
  display: block; width: 100%; min-width: 0; border: 0; border-left: 3px solid var(--sch-c); border-radius: 3px;
  background: var(--k-bg-soft); color: var(--k-ink-2); font: inherit; font-size: var(--k-fs-aux); line-height: 16px;
  padding: 0 3px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer;
}
.sch-cell.out .sch-bar, .sch-cell:hover .sch-bar { background: var(--k-surface); }
.sch-bar:hover { color: var(--k-ink); }
.sch-bar.cont { background: var(--sch-c); opacity: .35; height: 6px; margin: 5px 0; }
.sch-bar--dot { border-left-width: 0; padding-left: 12px; position: relative; background: transparent; }
.sch-bar--dot::before { content: ""; position: absolute; left: 2px; top: 4px; width: 7px; height: 7px; border-radius: 50%; background: var(--sch-c); }
.sch-cell.out .sch-bar--dot, .sch-cell:hover .sch-bar--dot { background: transparent; }
.sch-more { border: 0; background: transparent; color: var(--k-primary); font: inherit; font-size: var(--k-fs-aux); line-height: 16px; padding: 0 3px; text-align: left; cursor: pointer; }
.sch-sec { margin-top: 14px; }
.sch-sec h3 { margin: 0 0 4px; font-size: var(--k-fs-card); font-weight: 500; color: var(--k-ink); }
.sch-none { margin: 4px 0; font-size: var(--k-fs-aux); color: var(--k-ink-3); }
.sch-row {
  display: flex; align-items: flex-start; gap: 8px; width: 100%; padding: 7px 6px; border: 0; border-radius: var(--k-radius-control);
  background: transparent; font: inherit; text-align: left; cursor: pointer; color: var(--k-ink);
}
.sch-row:hover { background: var(--k-bg-hover); }
.sch-row .sch-sw, .sch-mrow .sch-sw { margin-top: 4px; }
.sch-row-m { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
.sch-row-m b { font-weight: 500; font-size: var(--k-fs-body); overflow-wrap: anywhere; }
.sch-row-m small { font-size: var(--k-fs-aux); color: var(--k-ink-3); overflow-wrap: anywhere; }
.sch-ft { display: flex; align-items: center; gap: var(--k-space-2); padding: 8px 16px; border-top: 1px solid var(--k-border-card); }
/* 管理弹窗 */
.sch-mbar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sch-mbar b { font-weight: 500; font-size: var(--k-fs-card); min-width: 64px; text-align: center; }
.sch-mlist { display: flex; flex-direction: column; }
.sch-mrow { display: flex; align-items: flex-start; gap: 10px; padding: 9px 0; border-top: 1px solid var(--k-rule-soft); }
.sch-mrow .k-st { flex-shrink: 0; margin-top: 1px; }
.sch-macts { display: flex; flex-wrap: wrap; gap: 2px; justify-content: flex-end; flex-shrink: 0; max-width: 250px; }
.sch-form { display: flex; flex-direction: column; gap: var(--k-space-3); }
.sch-form2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--k-space-3); }
@media (max-width: 640px) {
  .sch-panel { width: 100vw; border-left: 0; }
  .sch-mrow { flex-wrap: wrap; }
  .sch-macts { max-width: none; width: 100%; justify-content: flex-start; padding-left: 20px; }
  .sch-form2 { grid-template-columns: 1fr; }
}
/* 作业调度(322-jobsched.js,SEO-1481):排期格的人话 + 「编辑」、启用格的开关、两个写弹窗。
   开关是行内小件(kit 里没有开关元件,只有这一页要),点它弹确认,不直接改。 */
.jsc-sched { display: flex; align-items: center; gap: 4px; min-width: 0; }
.jsc-sched > span { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jsc-sched .jsc-edit { flex-shrink: 0; height: 22px; padding: 0 6px; }
.jsc-sw { display: inline-flex; align-items: center; gap: 6px; border: 0; background: transparent; padding: 2px 0; font: inherit; font-size: var(--k-fs-aux); color: var(--k-ink-3); cursor: pointer; }
.jsc-sw i { position: relative; width: 28px; height: 16px; border-radius: 8px; background: var(--k-ink-5); transition: background .15s; flex-shrink: 0; }
.jsc-sw i::after { content: ""; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%; background: #fff; transition: left .15s; }
.jsc-sw.on { color: var(--k-ink); }
.jsc-sw.on i { background: var(--k-primary); }
.jsc-sw.on i::after { left: 14px; }
.jsc-sw:focus-visible { outline: 2px solid var(--k-selection-line); outline-offset: 2px; border-radius: 4px; }
.jsc-modes { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.jsc-modeopt, .jsc-day { display: inline-flex; align-items: center; gap: 5px; font-size: var(--k-fs-body); cursor: pointer; }
.jsc-days { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.jsc-mode, .jsc-timewrap { display: flex; flex-direction: column; gap: var(--k-space-2); }
.jsc-mode[hidden], .jsc-timewrap[hidden] { display: none; }
.jsc-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--k-space-3); }
.jsc-cron { font-family: var(--k-font-mono); }
.jsc-reason { resize: vertical; min-height: 52px; font: inherit; }
.jsc-preview { padding: 8px 10px; border-radius: var(--k-radius-control); background: var(--k-bg-hover); display: flex; flex-direction: column; gap: 2px; }
.jsc-pv-main { font-weight: 500; color: var(--k-ink); }
.jsc-bad, .jsc-err { color: var(--k-error-text); font-size: var(--k-fs-aux); }
.jsc-err { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.jsc-err[hidden] { display: none; }
/* 页面优化页(385-pageopt.js)私有样式。单独一份而不是挤进 022:这一页按开关发布,
   开关关时这几条只是没有元素命中的选择器,对别的页面零影响。
   三栏:候选池 · 进行中 · 详情。中屏收成两栏(详情掉到下一行占满),窄屏一栏。
   壳的 .k-main 是 overflow:hidden,三栏各自竖滚,页头与指标条留在滚动区外。 */
#page-pageopt .k-pagewrap { min-height: 0; }
.po2-cols { flex: 1; min-height: 0; display: grid; gap: var(--k-space-3); grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.9fr) minmax(0, 1.1fr); align-items: stretch; }
.po2-col { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.po2-tools { display: flex; align-items: center; gap: var(--k-space-2); padding: 8px 14px; border-bottom: 1px solid var(--k-border-card); flex-wrap: wrap; }
.po2-list, .po2-stages, .po2-detail { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.po2-item { display: flex; flex-direction: column; gap: 4px; padding: 10px 14px; border-bottom: 1px solid var(--k-divider); cursor: pointer; }
.po2-item:hover { background: var(--k-bg-hover); }
.po2-item.on { background: var(--k-row-selected); box-shadow: inset 3px 0 0 var(--k-primary); }
.po2-l1 { display: flex; align-items: center; gap: 6px; min-width: 0; }
.po2-path { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.po2-l2 { min-width: 0; }
.po2-why { display: block; color: var(--k-ink-2); font-size: var(--k-fs-aux); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.po2-l3 { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: var(--k-fs-aux); color: var(--k-ink-3); }
.po2-kv { display: inline-flex; align-items: center; gap: 4px; }
.po2-kv > i { font-style: normal; color: var(--k-ink-4); }
.po2-days { font-variant-numeric: tabular-nums; }
.po2-stage { border-bottom: 1px solid var(--k-border-card); }
.po2-stage-h { display: flex; align-items: center; gap: 6px; padding: 8px 14px; background: var(--k-bg-soft); position: sticky; top: 0; z-index: 1; }
.po2-stage-h .k-cnt { color: var(--k-ink-4); font-size: var(--k-fs-aux); font-variant-numeric: tabular-nums; }
.po2-none { padding: 8px 14px; color: var(--k-ink-4); font-size: var(--k-fs-aux); }
.po2-detail { padding: 12px 14px; display: flex; flex-direction: column; gap: var(--k-space-3); }
.po2-dacts { display: flex; justify-content: flex-end; gap: var(--k-space-2); }
.po2-sec { border-top: 1px solid var(--k-divider); padding-top: var(--k-space-2); display: flex; flex-direction: column; gap: 6px; }
.po2-sec-h { font-size: var(--k-fs-card); font-weight: 500; color: var(--k-ink); }
.po2-sec .k-code { max-height: 320px; }
.po2-bsec { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 0; border-bottom: 1px dashed var(--k-divider); }
.po2-bsec > b { font-weight: 500; color: var(--k-ink); }
.po2-bsec p { flex-basis: 100%; margin: 0; color: var(--k-ink-2); font-size: var(--k-fs-aux); line-height: var(--k-lh-body); }
.po2-bsec p > i, .po2-cmp-r i { font-style: normal; color: var(--k-ink-4); margin-right: 6px; }
.po2-cmp { display: flex; flex-direction: column; gap: 8px; }
.po2-cmp-r { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 2px 10px; font-size: var(--k-fs-aux); }
.po2-cmp-r > b { grid-row: span 2; font-weight: 500; color: var(--k-ink-2); }
.po2-cmp-r span { color: var(--k-ink-2); word-break: break-word; }
.po2-cmp-r span.po2-new { color: var(--k-success-text); background: var(--k-success-bg); padding: 0 3px; border-radius: 3px; }
.po2-ev, .po2-wo { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: var(--k-fs-aux); }
.po2-ev li, .po2-wo li { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.po2-ev code { font-family: var(--k-font-mono); color: var(--k-ink-2); }
@media (max-width: 1439px) {
  .po2-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-auto-rows: minmax(0, 1fr); overflow-y: auto; }
  .po2-col--detail { grid-column: 1 / -1; min-height: 480px; }
}
@media (max-width: 1079px) {
  .po2-cols { grid-template-columns: minmax(0, 1fr); }
  .po2-col { min-height: 360px; }
}
