/* css/views/audview_chain.css — 视图私有样式,owner: W20 audit-views agent。
 * 只许 W20 写;本视图专属选择器前缀 .v-audchain / .v-cc;颜色/间距用 var(--*)。
 * 布局:左栏结果 + 右侧「链域办公群岛」等距场景(浅/深两版,--cc-* 变量成对)。
 * lint②:`color:` 一律 var(),裸 hex 只出现在 fill/stroke/background(允许)。 */

/* ---- 壳接管:本视图全出血(压掉 .main 限宽/内距与壳页头,只在本视图生效) ---- */
.main:has(.v-audchain) { max-width: none; padding: 0; display: flex; flex-direction: column; }
.main:has(.v-audchain) .page-header { display: none; }
.main:has(.v-audchain) .view { flex: 1; min-height: 0; display: flex; }

/* ============================ 左右分栏 ============================ */
.v-audchain { flex: 1; min-width: 0; display: flex; align-items: stretch; min-height: calc(100vh - 62px); }
.v-audchain-side {
  flex: 0 0 350px;
  min-width: 0;
  padding: var(--space-6) var(--space-6) var(--space-8);
  border-right: 1px solid var(--color-border);
  background: var(--color-surface);
  overflow-y: auto;
  max-height: calc(100vh - 62px);
}
@media (max-width: 1100px) {
  .v-audchain { flex-direction: column; }
  .v-audchain-side { flex: none; max-height: none; border-right: none; border-bottom: 1px solid var(--color-border); }
}

/* ---- 左栏:kicker / 标题 / 描述 ---- */
.v-audchain-kicker {
  font-family: var(--font-mono);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  margin-bottom: var(--space-3);
}
.v-audchain-title {
  font-size: 26px;
  font-weight: 700;
  margin: 0 0 var(--space-2);
  color: var(--color-text);
}
.v-audchain-desc {
  font-size: 13px;
  line-height: 1.6;
  color: var(--color-text-secondary);
  margin: 0 0 var(--space-4);
}
.v-audchain-desc code {
  font-family: var(--font-mono);
  font-size: 12px;
  padding: 1px 5px;
  border-radius: 5px;
  background: var(--color-accent-tint);
  color: var(--color-accent);
}
.v-audchain-desc code.v-audchain-code-danger {
  background: var(--color-danger-tint);
  color: var(--color-danger);
}

/* ---- 结果卡(ok 玉绿 / bad 绯红 / idle 中性) ---- */
.v-audchain-card {
  position: relative;
  border-radius: 14px;
  padding: var(--space-4) var(--space-4) var(--space-4);
  margin-bottom: var(--space-4);
  border: 1px solid var(--color-border);
  background: var(--color-surface);
}
/* ok 卡与 #/home 玉绿链带同宗(2026-07-12 用户定:两屏联通,视觉血缘让人知道是同一条链):
 * 同一条 --grad-verify 渐变 + 反白字 + 18px 圆角;语义词刻意不同(主页「已留痕」≠ 这里「已验真」)。 */
.v-audchain-card--ok {
  border: 0;
  border-radius: 18px;
  background: var(--grad-verify);
  box-shadow: none;
}
.v-audchain-card--ok .v-audchain-badge--ok { background: rgba(255,255,255,0.18); color: var(--color-text-inverse); }
.v-audchain-card--ok .v-audchain-card-title { color: var(--color-text-inverse); }
.v-audchain-card--ok .v-audchain-card-text { color: var(--color-text-inverse); opacity: 0.86; }
.v-audchain-card--ok .v-audchain-card-rule { background: rgba(255,255,255,0.28); }
.v-audchain-card--ok .v-audchain-bignum { color: var(--color-text-inverse); }
.v-audchain-card--ok .v-audchain-bignum-cap { color: var(--color-text-inverse); opacity: 0.75; }
.v-audchain-card--ok .v-audchain-demo-tag { color: var(--color-text-inverse); opacity: 0.85; border-color: rgba(255,255,255,0.45); }
.v-audchain-card--bad {
  border: 1.5px solid var(--color-danger);
  background: linear-gradient(180deg, rgba(192, 36, 28, 0.07), rgba(192, 36, 28, 0.02));
}
.v-audchain-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 999px;
  margin-bottom: var(--space-3);
}
.v-audchain-badge--ok { background: var(--color-success-tint); color: var(--color-success); }
.v-audchain-badge--bad { background: var(--color-danger-tint); color: var(--color-danger); }
.v-audchain-badge--idle { background: var(--color-bg); color: var(--color-text-muted); border: 1px solid var(--color-border); }
.v-audchain-demo-tag {
  position: absolute;
  top: var(--space-4);
  right: var(--space-4);
  font-size: 11px;
  color: var(--color-text-muted);
  border: 1px dashed var(--color-border-input);
  border-radius: 6px;
  padding: 1px 6px;
}
.v-audchain-card-title {
  font-size: 21px;
  font-weight: 700;
  margin: 0 0 var(--space-2);
  color: var(--color-text);
}
.v-audchain-card-text {
  font-size: 13px;
  line-height: 1.65;
  color: var(--color-text-secondary);
  margin: 0;
}
.v-audchain-card-rule { height: 1px; background: var(--color-border); margin: var(--space-4) 0; }
.v-audchain-bignum-row { display: flex; align-items: baseline; gap: var(--space-3); flex-wrap: wrap; }
.v-audchain-bignum {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 44px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.01em;
  color: var(--color-text);
}
.v-audchain-bignum-cap { font-size: 12.5px; color: var(--color-text-muted); }

/* 断点 kv(tampered) */
.v-audchain-kv {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-2) var(--space-3);
  font-size: 12.5px;
}
.v-audchain-kv .mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.v-audchain-kv-label { color: var(--color-text-secondary); white-space: nowrap; }
.v-audchain-kv-detail { white-space: pre-wrap; word-break: break-word; }

/* ---- 耗时/时间双格 ---- */
.v-audchain-duo {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: var(--space-4);
  background: var(--color-bg);
}
.v-audchain-duo-cell { padding: var(--space-3) var(--space-4); }
.v-audchain-duo-cell + .v-audchain-duo-cell { border-left: 1px solid var(--color-border); }
.v-audchain-duo-label { font-size: 12px; color: var(--color-text-muted); margin-bottom: 3px; }
.v-audchain-duo-val { font-size: 13.5px; font-weight: 700; color: var(--color-text); white-space: nowrap; }
.v-audchain-duo-val.mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

/* ---- 动作行 / 导出链接 / 机制说明 / 脚注 ---- */
.v-audchain-actions { display: flex; gap: var(--space-3); margin-bottom: var(--space-3); }
.v-audchain-actions .btn { flex: 1; justify-content: center; }
.v-audchain-export-slot { margin-bottom: var(--space-4); }
.v-audchain-export-link {
  border: none;
  background: none;
  padding: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-accent);
  cursor: pointer;
}
.v-audchain-export-link:hover { text-decoration: underline; }
.v-audchain-mech {
  border: 1px solid var(--color-border);
  border-radius: 12px;
  margin-bottom: var(--space-6);
  background: var(--color-surface);
}
.v-audchain-mech summary {
  padding: var(--space-3) var(--space-4);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--color-text);
  cursor: pointer;
  list-style-position: inside;
}
.v-audchain-mech-body { padding: 0 var(--space-4) var(--space-4); }
.v-audchain-mech-body p { font-size: 12.5px; line-height: 1.65; color: var(--color-text-secondary); margin: 0 0 var(--space-2); }
.v-audchain-mech-body ul { margin: 0; padding-left: 18px; }
.v-audchain-mech-body li { font-size: 12.5px; line-height: 1.7; color: var(--color-text-secondary); }
.v-audchain-mech-body code { font-family: var(--font-mono); font-size: 11.5px; }
.v-audchain-footnote {
  display: flex;
  gap: 7px;
  align-items: flex-start;
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--color-text-muted);
  margin: 0;
}
.v-audchain-footnote .icon, .v-audchain-footnote svg { flex: none; margin-top: 2px; }

/* ============================ 右侧:链域办公群岛 ============================ */
/* 场景配色变量:浅色版默认,.v-cc--dark 成对覆写。全部 fill/stroke 走 var()。 */
.v-cc {
  --cc-canvas: #F4F1EB;
  --cc-grid: rgba(120, 140, 180, 0.14);
  --cc-road: rgba(255, 255, 255, 0.75);
  --cc-block-top: #FFFFFF;
  --cc-block-l: #E3DFD6;
  --cc-block-r: #EFEBE2;
  --cc-block-edge: rgba(28, 30, 36, 0.06);
  --cc-route: #3E9A6E;
  --cc-route-bad: #C0241C;
  --cc-desk-top: #DCCA9F;
  --cc-desk-l: #C3B084;
  --cc-desk-r: #CFBD91;
  --cc-drawer: #F3F1EA;
  --cc-kb: #FFFFFF;
  /* 浅色版椅子走浅灰白系(对齐参考稿 4 的浅色岛面道具;深色版仍是深椅) */
  --cc-stool-base: #AEB6C2;
  --cc-stool-stem: #9AA3AF;
  --cc-stool-top: #E8EBF0;
  --cc-stool-dk: #C6CCD6;
  --cc-mon-metal: #6E7680;
  --cc-plat-rim: rgba(110, 175, 240, 0.6);
  --cc-board: #262B33;
  --cc-screen: #20262E;
  --cc-server-top: #3A3F49;
  --cc-server-l: #23272F;
  --cc-server-r: #2E333C;
  --cc-sign-bg: #FFFFFF;
  --cc-sign-edge: rgba(90, 110, 150, 0.45);
  --cc-sign-ink: #33506E;
  --cc-pin: #2F8C63;
  /* 侧壁(-l)与台面同色系只略暗一档 —— 岛体读作一整块厚立方体 */
  /* 岛台糖果色(2026-07 按参考稿提饱和;透明度同步提浓见 .cc-plat-top) */
  --cc-p-rd-top: #F2B4AA; --cc-p-rd-l: #E29A90; --cc-p-rd-r: #E6A096;
  --cc-p-mkt-top: #F0D98F; --cc-p-mkt-l: #DDC375; --cc-p-mkt-r: #E1C77A;
  --cc-p-fin-top: #B9DFB0; --cc-p-fin-l: #A3CB98; --cc-p-fin-r: #A8D09D;
  --cc-p-risk-top: #B7CDF0; --cc-p-risk-l: #A0B8DE; --cc-p-risk-r: #A5BDE3;
  --cc-p-head-top: #F0C084; --cc-p-head-l: #DCA96C; --cc-p-head-r: #E0AE71;
  --cc-lg-rd: #E08578; --cc-lg-mkt: #DCC258; --cc-lg-fin: #77B96F; --cc-lg-risk: #7BA3DC;
  --cc-hud-ink: #3B424D;
  --cc-hud-muted: #79818D;
  --cc-hud-bg: rgba(252, 250, 248, 0.55);
  --cc-hud-edge: rgba(28, 30, 36, 0.08);
  --cc-panel-bg: rgba(253, 252, 250, 0.72);
  --cc-panel-edge: rgba(28, 30, 36, 0.10);
  --cc-panel-ink: #1B1E24;
  --cc-panel-muted: #6E7682;
  --cc-gauge-track: rgba(110, 118, 130, 0.22);
  --cc-gauge-arc: #5B7C9E;
  --cc-toggle-bg: rgba(255, 255, 255, 0.85);
  position: relative;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  background: var(--cc-canvas);
}
.v-cc--dark {
  --cc-canvas: #0C1118;
  --cc-grid: rgba(120, 150, 200, 0.09);
  --cc-road: rgba(160, 185, 220, 0.05);
  --cc-block-top: #1B222C;
  --cc-block-l: #10151C;
  --cc-block-r: #151B23;
  --cc-block-edge: rgba(170, 200, 240, 0.06);
  --cc-route: #3ED08E;
  --cc-route-bad: #F87171;
  --cc-desk-top: #2A313C;
  --cc-desk-l: #171C24;
  --cc-desk-r: #20262F;
  --cc-drawer: #3D4754;
  --cc-kb: #8FA3B8;
  --cc-stool-base: #1F252E;
  --cc-stool-stem: #39414B;
  --cc-stool-top: #333B46;
  --cc-stool-dk: #232A33;
  --cc-mon-metal: #55606E;
  --cc-plat-rim: rgba(122, 214, 255, 0.75);
  --cc-board: #0B0F15;
  --cc-screen: #6FD3FF;
  --cc-server-top: #10141A;
  --cc-server-l: #05070A;
  --cc-server-r: #0B0E13;
  --cc-sign-bg: #101823;
  --cc-sign-edge: rgba(170, 200, 240, 0.35);
  --cc-sign-ink: #D7E4F4;
  --cc-pin: #3ED08E;
  /* 侧壁(-l)与台面同色系只略暗一档 —— 岛体读作一整块厚立方体(对齐原版帧) */
  --cc-p-rd-top: #4C383C; --cc-p-rd-l: #3F2E32; --cc-p-rd-r: #3B2B2E;
  --cc-p-mkt-top: #4B4633; --cc-p-mkt-l: #3D3929; --cc-p-mkt-r: #3A3626;
  --cc-p-fin-top: #31463A; --cc-p-fin-l: #28392F; --cc-p-fin-r: #26382E;
  --cc-p-risk-top: #33404F; --cc-p-risk-l: #2A3541; --cc-p-risk-r: #283240;
  --cc-p-head-top: #4A3D2C; --cc-p-head-l: #3C3223; --cc-p-head-r: #392F21;
  --cc-hud-ink: #D9E2EE;
  --cc-hud-muted: #8B96A5;
  --cc-hud-bg: rgba(12, 18, 28, 0.42);
  --cc-hud-edge: rgba(170, 200, 240, 0.14);
  --cc-panel-bg: rgba(22, 25, 31, 0.72);
  --cc-panel-edge: rgba(170, 200, 240, 0.14);
  --cc-panel-ink: #E8EEF6;
  --cc-panel-muted: #97A2B2;
  --cc-gauge-track: rgba(150, 170, 200, 0.25);
  --cc-gauge-arc: #7FB4E8;
  --cc-toggle-bg: rgba(16, 24, 35, 0.85);
}
.v-cc-canvas { position: absolute; inset: 0; }
/* user-select:none 修拖拽误框选路牌数字/链头文字的 bug(SVG text 默认可选) */
.cc-svg {
  width: 100%;
  height: 100%;
  display: block;
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.cc-svg--grab { cursor: grabbing; }
/* 拖拽/缩放走整组 transform,提示浏览器提层合成 */
.cc-world {
  /* 相机:JS 只写 --cc-cam-* 变量,transform 走 CSS → 合成器可整层 GPU 搬运,
   * 不再逐帧重画整棵 SVG。transform-box/origin 锚到 view-box 原点,
   * 与旧 transform 属性的坐标语义完全一致。 */
  will-change: transform;
  transform-box: view-box;
  transform-origin: 0 0;
  transform: translate(var(--cc-cam-x, 750px), var(--cc-cam-y, 380px)) scale(var(--cc-cam-k, 0.5));
}
/* 地面布景与链路不参与指针命中:拖拽掠过时少一大片 hover 命中测试 */
.cc-ground-layer, .cc-routes { pointer-events: none; }

/* ---- 场景元素配色(几何在 JS,颜色全在此) ---- */
.cc-grid line { stroke: var(--cc-grid); stroke-width: 1; }
.cc-road { fill: var(--cc-road); }
.cc-block polygon { stroke: var(--cc-block-edge); stroke-width: 1; }
.cc-block .f-t { fill: var(--cc-block-top); }
.cc-block .f-l { fill: var(--cc-block-l); }
.cc-block .f-r { fill: var(--cc-block-r); }
.cc-route { fill: none; stroke: var(--cc-route); stroke-width: 3; stroke-linejoin: round; }
.cc-route-dot { fill: var(--cc-route); }
.v-cc--dark .cc-routes { filter: drop-shadow(0 0 4px rgba(62, 208, 142, 0.55)); }
.cc-route--bad { stroke: var(--cc-route-bad); stroke-dasharray: 7 5; }
circle.cc-route--bad { fill: var(--cc-route-bad); stroke: none; }

/* outline:none 同时盖掉鼠标点击的 UA 焦点蓝框(SVG g 带 tabindex 时 Chrome 会画);
 * 键盘可达性由 :focus-visible 的描边环补足,不丢。 */
.cc-isle { cursor: grab; outline: none; } /* 岛台可拖拽重摆 */
.cc-isle--lift { opacity: 0.88; cursor: grabbing; }
.cc-isle:focus { outline: none; }
.cc-isle:focus-visible { outline: none; }
.cc-isle:focus-visible .cc-plat-ring { stroke: var(--cc-plat-rim); stroke-width: 3.5; }
/* (岛底悬停落影已按用户要求移除:不再有「整岛上浮」效果,悬停反馈只余轻提亮+浮层) */
/* 岛台 = 扁立方体线框:填充压得很透(下层网格/链路清晰透出),读感靠荧光棱线;
 * 台面只余一层部门色轻染 —— 对齐工业数字孪生的线框底座 */
/* 浅色版岛台明度(两轮定稿):0.30 轻染隐形 → 0.88 又过饱和;落在 0.62/0.52
 * —— 柔和粉彩厚台,主体清楚又不糖果化(对齐参考稿 4);深色版维持原轻染。 */
.cc-plat-top { fill: var(--cc-p-rd-top); fill-opacity: 0.62; }
.cc-plat-side { fill: var(--cc-p-rd-l); fill-opacity: 0.52; }
/* 深色版盒身要够实:侧面太透(旧 0.24)时顶圈/底圈之间没有墙体连接,
 * 荧光棱线读作两个漂浮的框 —— 提到 0.5/0.55,玻璃盒读作一整块。 */
.v-cc--dark .cc-plat-top { fill-opacity: 0.5; }
.v-cc--dark .cc-plat-side { fill-opacity: 0.55; }
.cc-dept-mkt .cc-plat-top { fill: var(--cc-p-mkt-top); }
.cc-dept-mkt .cc-plat-side { fill: var(--cc-p-mkt-l); }
.cc-dept-fin .cc-plat-top { fill: var(--cc-p-fin-top); }
.cc-dept-fin .cc-plat-side { fill: var(--cc-p-fin-l); }
.cc-dept-risk .cc-plat-top { fill: var(--cc-p-risk-top); }
.cc-dept-risk .cc-plat-side { fill: var(--cc-p-risk-l); }
.cc-isle--head .cc-plat-top { fill: var(--cc-p-head-top); }
.cc-isle--head .cc-plat-side { fill: var(--cc-p-head-l); }
/* (侧壁随圆角回归单路径,右侧面 -r 分色规则随之移除;-r 变量保留备用) */
/* 线框:浅色版无常态描边(岛缘由略深一档的侧面自然收边),仅选中/键盘聚焦/
 * 断链时描边作为信号出现;深色版 ring(顶缘) + rim2(侧壁上下缘/竖棱)合起来
 * 把圆角立方体的全部棱边描成荧光线框。 */
.cc-plat-ring { fill: none; stroke: transparent; stroke-width: 2; transition: stroke 120ms ease; }
.cc-plat-rim2 { fill: none; stroke: transparent; stroke-width: 1.4; opacity: 0.9; }
.v-cc--dark .cc-plat-ring, .v-cc--dark .cc-plat-rim2 { stroke: var(--cc-plat-rim); }
.cc-isle--broken .cc-plat-ring { stroke-width: 3; }
.v-cc--dark .cc-plat-ring, .v-cc--dark .cc-plat-rim2 { filter: drop-shadow(0 0 3px rgba(110, 200, 255, 0.75)); }
.cc-isle:hover { filter: brightness(1.05); }
.v-cc--dark .cc-isle:hover { filter: brightness(1.3); }
/* 拖拽中掠过群岛不触发悬停提亮(brightness 建离屏缓冲,拖拽帧内反复触发是卡顿源之一) */
.cc-svg--grab .cc-isle:hover { filter: none; }
/* 选中岛:不用信号色描边(用户定稿:选中无红/橙线框)—— 同色系荧光棱线加粗提亮
 * + 台面轻染略浓,「当前段」以发光强度区分,不以色相区分 */
.cc-isle--sel .cc-plat-ring {
  stroke: var(--cc-plat-rim); /* 浅色常态无描边 → 选中时描边现身作信号 */
  stroke-width: 3.5;
  filter: drop-shadow(0 0 6px var(--cc-plat-rim));
}
.v-cc--dark .cc-isle--sel .cc-plat-ring { filter: drop-shadow(0 0 9px var(--cc-plat-rim)); }
.cc-isle--sel .cc-plat-top { fill-opacity: 1; } /* 浅色基础已提到 0.88,选中须更实 */
.v-cc--dark .cc-isle--sel .cc-plat-top { fill-opacity: 0.55; }
.cc-isle--broken .cc-plat-ring { stroke: var(--cc-route-bad); stroke-dasharray: 8 6; }

/* ---- 悬停信息浮层(段号 · 日期 · 条目 · 主导部门) ---- */
.cc-tip { pointer-events: none; opacity: 0; transition: opacity 120ms ease; }
.cc-tip--on { opacity: 1; }
.cc-tip-bg, .cc-tip-tick { fill: var(--cc-sign-bg); stroke: var(--cc-plat-rim); stroke-width: 1.2; }
.cc-tip-tick { stroke: none; }
.cc-tip { filter: drop-shadow(0 6px 14px rgba(20, 24, 32, 0.22)); }
.v-cc--dark .cc-tip { filter: drop-shadow(0 6px 16px rgba(0, 0, 0, 0.6)); }
.cc-tip-l1 { fill: var(--cc-panel-ink); font-family: var(--font-ui); font-size: 12.5px; font-weight: 700; }
.cc-tip-l2 { fill: var(--cc-panel-muted); font-family: var(--font-ui); font-size: 11px; }
.cc-tip-dot { fill: var(--cc-panel-muted); }
.cc-tip.cc-dept-rd .cc-tip-dot { fill: var(--cc-lg-rd); }
.cc-tip.cc-dept-mkt .cc-tip-dot { fill: var(--cc-lg-mkt); }
.cc-tip.cc-dept-fin .cc-tip-dot { fill: var(--cc-lg-fin); }
.cc-tip.cc-dept-risk .cc-tip-dot { fill: var(--cc-lg-risk); }

.cc-desk-table .f-t, .cc-desk-ped .f-t { fill: var(--cc-desk-top); }
.cc-desk-table .f-l, .cc-desk-ped .f-l { fill: var(--cc-desk-l); }
.cc-desk-table .f-r, .cc-desk-ped .f-r { fill: var(--cc-desk-r); }
/* 抽屉面板:柜体立面上三格浅色小板(实拍模型的三屉柜) */
.cc-drawer { fill: var(--cc-drawer); stroke: var(--cc-block-edge); stroke-width: 0.8; }
.cc-keyboard { fill: var(--cc-kb); }
.cc-mouse { fill: var(--cc-kb); }
/* 曲面屏:底座/立柱金属灰,面板浅色版近黑(实拍监视器)、深色版发光青(既有 glow 规则) */
.cc-mon-base polygon, .cc-mon-neck polygon { fill: var(--cc-mon-metal); }
/* 白色办公椅:五爪星足/气压柱金属灰,座侧微灰,座面与弧顶靠背亮白 */
/* 简化款办公凳(圆盘底座 + 单柱 + 凳面):深色系,对齐用户参考图 */
.cc-stool-base { fill: var(--cc-stool-base); }
.cc-stool-stem polygon { fill: var(--cc-stool-stem); }
.cc-stool-seat .f-l, .cc-stool-seat .f-r { fill: var(--cc-stool-dk); }
.cc-stool-seat .f-t { fill: var(--cc-stool-top); }
/* 靠背是带厚度的棱柱背板:三面按明暗着色,与坐垫同色系 */
.cc-stool-back .f-t { fill: var(--cc-stool-top); }
.cc-stool-back .f-l { fill: var(--cc-stool-dk); }
.cc-stool-back .f-r { fill: var(--cc-stool-top); }
.cc-screen { fill: var(--cc-screen); }
.v-cc--dark .cc-screen { filter: drop-shadow(0 0 3px rgba(111, 211, 255, 0.8)); }
.cc-board { fill: var(--cc-board); }
.cc-server .f-t { fill: var(--cc-server-top); }
.cc-server .f-l { fill: var(--cc-server-l); }
.cc-server .f-r { fill: var(--cc-server-r); }
/* 机柜灯带:链路同色,深色版发光 */
.cc-server-led { stroke: var(--cc-route); stroke-width: 2.5; stroke-linecap: round; }
.v-cc--dark .cc-server-led { filter: drop-shadow(0 0 4px rgba(62, 208, 142, 0.9)); }

.cc-sign-pole { stroke: var(--cc-sign-edge); stroke-width: 2; }
.cc-sign { fill: var(--cc-sign-bg); stroke: var(--cc-sign-edge); stroke-width: 1.5; }
.cc-sign-num {
  fill: var(--cc-sign-ink);
  font-family: var(--font-mono);
  font-size: 17px;
  font-weight: 700;
  text-anchor: middle;
}
/* 链头信标:旗杆 + 燕尾旗 + 地面双层脉冲光环(替代旧大头针) */
.cc-beacon-pole { stroke: var(--cc-pin); stroke-width: 2.5; stroke-linecap: round; }
.cc-beacon-flag { fill: var(--cc-pin); }
.cc-beacon-cap { fill: var(--cc-pin); }
.cc-beacon-base { fill: var(--cc-pin); opacity: 0.5; }
.cc-beacon-ring {
  fill: none;
  stroke: var(--cc-pin);
  stroke-width: 2;
  transform-box: fill-box;
  transform-origin: center;
  animation: cc-beacon-pulse 2.4s ease-out infinite;
}
.cc-beacon-ring--late { animation-delay: -1.2s; }
@keyframes cc-beacon-pulse {
  0% { transform: scale(0.35); opacity: 0.9; }
  70% { transform: scale(1.15); opacity: 0.18; }
  100% { transform: scale(1.35); opacity: 0; }
}
.cc-beacon-label {
  fill: var(--cc-sign-ink);
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 700;
}
.v-cc--dark .cc-beacon-flag,
.v-cc--dark .cc-beacon-cap { filter: drop-shadow(0 0 6px rgba(62, 208, 142, 0.7)); }
.v-cc--dark .cc-beacon-pole { filter: drop-shadow(0 0 3px rgba(62, 208, 142, 0.5)); }
.cc-head-tag { fill: var(--cc-pin); opacity: 0.9; }
.cc-head-tag-text {
  fill: var(--cc-sign-bg);
  font-family: var(--font-mono);
  font-size: 9.5px;
  font-weight: 700;
  text-anchor: middle;
}
.v-cc--dark .cc-head-tag-text { fill: #06110C; }

/* ---- 顶部 HUD ---- */
/* 顶部状态条:通栏置顶毛玻璃(不卡片化);只留一道底部发丝线 */
.v-cc-head {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-6);
  pointer-events: none;
  /* 真毛玻璃:静止时磨砂质感;运动中由 .v-cc--moving 临时关掉(文件尾规则),
   * 避免场景每帧被重算模糊 —— 磨砂观感与顺滑两头兼顾。 */
  background: var(--cc-hud-bg);
  -webkit-backdrop-filter: blur(16px) saturate(1.15);
  backdrop-filter: blur(16px) saturate(1.15);
  border-bottom: 1px solid var(--cc-hud-edge);
}
.v-cc-head-main { min-width: 0; }
.v-cc-head-row { display: flex; align-items: center; gap: var(--space-4); flex-wrap: wrap; }
.v-cc-head-title { font-size: 16px; font-weight: 700; color: var(--cc-hud-ink); }
.v-cc-pill {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--cc-hud-ink);
  border: 1px solid var(--cc-panel-edge);
  background: var(--cc-toggle-bg);
  border-radius: 999px;
  padding: 2px 10px;
}
/* (head-hint / head-note 已随 2026-07 HUD 减负移除) */
.v-cc-legend { display: flex; align-items: center; gap: var(--space-6); row-gap: 6px; flex-wrap: wrap; }
.v-cc-lg { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; color: var(--cc-hud-muted); }
.v-cc-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--cc-hud-muted); }
.v-cc-lg-rd .v-cc-dot { background: var(--cc-lg-rd); }
.v-cc-lg-mkt .v-cc-dot { background: var(--cc-lg-mkt); }
.v-cc-lg-fin .v-cc-dot { background: var(--cc-lg-fin); }
.v-cc-lg-risk .v-cc-dot { background: var(--cc-lg-risk); }
.v-cc-dash { width: 16px; height: 0; border-top: 2px solid var(--cc-route); }
.v-cc-head-ops { display: flex; align-items: center; gap: var(--space-3); flex: none; pointer-events: auto; }
.v-cc-ops-hint { font-size: 12px; color: var(--cc-hud-muted); }
.v-cc-toggle {
  border: 1px solid var(--cc-panel-edge);
  background: var(--cc-toggle-bg);
  color: var(--cc-hud-ink);
  font-size: 12.5px;
  font-weight: 600;
  border-radius: 999px;
  padding: 5px 14px;
  cursor: pointer;
}
.v-cc-toggle:hover { border-color: var(--cc-hud-muted); }
.v-cc-toggle:disabled { opacity: 0.45; cursor: default; }
.v-cc-toggle:disabled:hover { border-color: var(--cc-panel-edge); }
/* 有未保存的岛位改动:保存钮点亮成链路绿,提示待保存 */
.v-cc-toggle--attn { border-color: var(--cc-pin); color: var(--cc-pin); }

/* ---- 底部段面板 ---- */
.v-cc-panel {
  position: absolute;
  left: var(--space-6);
  right: auto;
  bottom: var(--space-4);
  width: min(1120px, calc(100% - 40px));
  border: 1px solid var(--cc-panel-edge);
  border-radius: 16px;
  background: var(--cc-panel-bg);
  backdrop-filter: blur(18px) saturate(1.15);
  -webkit-backdrop-filter: blur(18px) saturate(1.15);
  box-shadow: 0 16px 40px -18px rgba(20, 24, 32, 0.35);
  overflow: hidden;
}
.v-cc-tabs { display: flex; gap: var(--space-2); padding: var(--space-3) var(--space-6) 0; border-bottom: 1px solid var(--cc-panel-edge); }
.v-cc-tab {
  border: none;
  background: none;
  font-size: 13px;
  font-weight: 600;
  color: var(--cc-panel-muted);
  padding: 8px 14px 11px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
.v-cc-tab--on { color: var(--cc-panel-ink); border-bottom-color: var(--color-accent-bright); }
.v-cc-panel-body {
  display: grid;
  grid-template-columns: auto auto auto minmax(320px, auto);
  justify-content: start;
  column-gap: var(--space-8);
  row-gap: var(--space-4);
  align-items: start;  /* 各列标签顶对齐,一条基线,不再高低错落 */
  padding: var(--space-4) var(--space-6) var(--space-6) var(--space-6);
}
.v-cc-cell { min-width: 0; }
.v-cc-cell-big { white-space: nowrap; }
.v-cc-cell-gauge { align-self: center; }
/* 部门分布限宽:刻度条与百分比贴近成一组,不再被 1fr 拉到贴边 */
.v-cc-cell-dist { max-width: 460px; }
.v-cc-cell-label { font-size: 11.5px; letter-spacing: 0.06em; color: var(--cc-panel-muted); margin-bottom: 7px; }
.v-cc-cell-label.mono { font-family: var(--font-mono); text-transform: uppercase; }
.v-cc-cell-big { font-size: 16px; font-weight: 700; color: var(--cc-panel-ink); }
.v-cc-cell-big b { font-size: 20px; }
.v-cc-cell-sub { font-size: 12px; color: var(--cc-panel-muted); margin-top: 3px; }
.v-cc-cell-sub.mono, .v-cc-cell-sub .mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.v-cc-sub-ok { color: var(--color-success); }
.v-cc-sub-bad { color: var(--color-danger); }
.v-cc-cell-gauge { display: flex; align-items: center; gap: var(--space-3); }
.v-cc-gauge { width: 58px; height: 58px; flex: none; }
.v-cc-gauge-track { fill: none; stroke: var(--cc-gauge-track); stroke-width: 6; }
.v-cc-gauge-arc { fill: none; stroke: var(--cc-gauge-arc); stroke-width: 6; stroke-linecap: round; }
.v-cc-gauge-meta b { display: block; font-size: 22px; font-weight: 700; color: var(--cc-panel-ink); line-height: 1.1; }
.v-cc-gauge-meta span { font-size: 12px; color: var(--cc-panel-muted); }

/* 部门分布:刻度条(根数编码占比,免内联宽度) */
.v-cc-cell-dist { justify-self: stretch; }
/* 中列固定宽(30 格满刻度的宽度):% 列紧跟刻度条区,不再被 1fr 拉到面板边缘 */
.v-cc-dist-row { display: grid; grid-template-columns: 76px 186px 44px; align-items: center; gap: var(--space-3); margin-top: 5px; }
.v-cc-dist-name { font-size: 12px; color: var(--cc-panel-muted); white-space: nowrap; }
.v-cc-dist-pct { font-size: 12px; font-weight: 600; color: var(--cc-panel-ink); text-align: right; font-family: var(--font-mono); }
.v-cc-ticks { display: flex; gap: 2.5px; overflow: hidden; }
.v-cc-tick { width: 3.5px; height: 11px; border-radius: 1px; background: var(--cc-panel-muted); flex: none; }
.v-cc-ticks-rd .v-cc-tick { background: var(--cc-lg-rd); }
.v-cc-ticks-mkt .v-cc-tick { background: var(--cc-lg-mkt); }
.v-cc-ticks-fin .v-cc-tick { background: var(--cc-lg-fin); }
.v-cc-ticks-risk .v-cc-tick { background: var(--cc-lg-risk); }

/* 全链概览:迷你柱 + 堆叠占比条 */
.v-cc-cell-cols { justify-self: stretch; }
.v-cc-cols { width: 100%; max-width: 420px; height: 74px; display: block; }
.v-cc-col { cursor: pointer; }
.v-cc-col-hit { fill: transparent; }
.v-cc-col-bar { fill: var(--cc-panel-muted); }
.v-cc-col-rd .v-cc-col-bar { fill: var(--cc-lg-rd); }
.v-cc-col-mkt .v-cc-col-bar { fill: var(--cc-lg-mkt); }
.v-cc-col-fin .v-cc-col-bar { fill: var(--cc-lg-fin); }
.v-cc-col-risk .v-cc-col-bar { fill: var(--cc-lg-risk); }
.v-cc-col:hover .v-cc-col-bar { filter: brightness(1.12); }
.v-cc-col--sel .v-cc-col-bar { stroke: var(--cc-gauge-arc); stroke-width: 2; }
.v-cc-col-num {
  fill: var(--cc-panel-muted);
  font-family: var(--font-mono);
  font-size: 9px;
  text-anchor: middle;
}
.v-cc-stack { width: 100%; max-width: 320px; height: 12px; border-radius: 6px; display: block; overflow: hidden; }
.v-cc-stack-rd { fill: var(--cc-lg-rd); }
.v-cc-stack-mkt { fill: var(--cc-lg-mkt); }
.v-cc-stack-fin { fill: var(--cc-lg-fin); }
.v-cc-stack-risk { fill: var(--cc-lg-risk); }
.v-cc-stack-legend { display: flex; gap: var(--space-3); flex-wrap: wrap; margin-top: 6px; }
.v-cc-stack-legend .v-cc-lg { color: var(--cc-panel-muted); }

@media (max-width: 1420px) {
  .v-cc-panel-body { grid-template-columns: auto auto 1fr; }
  .v-cc-cell-dist { grid-column: 1 / -1; }
}

/* 降级态告知块(W-A):绿章之下「本次未证明的部分」(无检查点锚 / 窗口校验未跑成 /
 * SM2 异常)。临界语义 = 深琥珀 + △ 字形 —— DESIGN §7 红线:色非唯一编码,灰度影印
 * 与色盲下靠 △ 与标题文字仍可读。 */
.v-audview-chain-caveat {
  border-radius: var(--radius-surface);
  padding: var(--space-3) var(--space-4);
  margin-bottom: var(--space-4);
  background: var(--color-warning-tint);
  border: 1px solid var(--color-warning);
}
.v-audview-chain-caveat-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: 13px;
  font-weight: 600;
  color: var(--color-warning);
}
.v-audview-chain-caveat-glyph {
  font-size: 15px;
  line-height: 1;
}
.v-audview-chain-caveat-text {
  margin-top: var(--space-2);
  font-size: 13px;
  line-height: 1.6;
  color: var(--color-text-secondary);
}

/* ============================================================
 * 可打印「链验真报告」卷宗(FU-ADMIN-VERIFY-REPORT)
 * 屏上 display:none;仅经「导出验真报告」按钮的 body.printing-verify-report
 * 在 @media print 显形 —— 故本 css 虽全局引入,常规 Ctrl+P / 其它页打印不受影响。
 * 纸面 = 档纸米 --color-bone,字 = 墨档黑 Ink --color-bg;母题(DESIGN §9d):
 * 钢印封缄 + 细金线 + 等宽哈希/时间戳。灰度红线(§7):结论用 ✓/✗ 字形 + 文字标签
 * + 环型编码,绝不以颜色作唯一信息编码。
 * ============================================================ */

/* 卷宗:屏上隐藏(打印时由下方 @media print 接管显形) */
.verify-report {
  display: none;
}

/* 卷宗内部排版/配色(全部 scoped 于 .verify-report;屏上随父 display:none 惰性) */
.verify-report {
  background: var(--color-bone);
  color: var(--color-bg);
  font-family: var(--font-ui);
  padding: 28px 32px 24px;
  line-height: 1.5;
}
.verify-report-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-4);
}
.verify-report-brand {
  font-family: var(--font-serif);
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--color-bronze);
}
.verify-report-org {
  font-size: 11px;
  letter-spacing: 1px;
  opacity: 0.7;
}
/* 细金线:DESIGN §9d 母题②(配给的一道决定性细金线,非装饰发光) */
.verify-report-rule {
  height: 2px;
  background: var(--color-bronze);
  margin: 10px 0 18px;
}
.verify-report-title {
  font-family: var(--font-serif);
  font-size: 26px;
  font-weight: 700;
  margin: 0;
}
.verify-report-subtitle {
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  opacity: 0.6;
  margin-top: 2px;
}

/* 主区:元数据网格 + 钢印并排 */
.verify-report-main {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-8);
  margin-top: 22px;
}
.verify-report-grid {
  flex: 1;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 20px;
  margin: 0;
}
.verify-report-dt {
  font-size: 12px;
  opacity: 0.65;
  white-space: nowrap;
}
.verify-report-dd {
  font-size: 13px;
  margin: 0;
  word-break: break-word;
}
/* 哈希/链高/时间戳/数字:等宽 tabular(DESIGN §9d「机器签发不可改」取证质感) */
.verify-report-mono {
  font-family: var(--font-mono-tabular);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.3px;
}

/* 钢印/封缄圆章:验真 = 实线双环「封」;链断 = 虚线破环「断」(环型 = 非色编码) */
.verify-report-seal {
  flex: none;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: rotate(-8deg);
}
.verify-report-seal-glyph {
  font-family: var(--font-serif);
  font-size: 38px;
  font-weight: 700;
  line-height: 1;
}
.verify-report-seal--ok {
  border: 3px double var(--color-seal);
  color: var(--color-seal);
}
.verify-report-seal--bad {
  border: 3px dashed var(--color-tamper);
  color: var(--color-tamper);
}

/* 结论块:✓/✗ 字形 + 标签 + 描述(灰度可读,颜色仅辅助) */
.verify-report-verdict {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-top: 22px;
  padding: 14px 16px;
  border-radius: var(--radius-surface);
  border: 1.5px solid var(--color-bronze);
}
.verify-report-verdict--ok {
  border-color: var(--color-verify);
  color: var(--color-verify);
}
.verify-report-verdict--bad {
  border-color: var(--color-tamper);
  color: var(--color-tamper);
}
.verify-report-mark {
  flex: none;
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
}
.verify-report-verdict-body {
  min-width: 0;
}
.verify-report-verdict-label {
  font-size: 16px;
  font-weight: 700;
  /* 墨 ink:验真青 #3E8E7E on 档纸米仅 3.17:1 < WCAG AA → 结论标题走墨字保可读;
   * 验真/篡改的色信号交给边框 + ✓/✗ 大字形 + 钢印(其尺寸/角色均达标)。 */
  color: var(--color-bg);
}
.verify-report-verdict-text {
  margin: 4px 0 0;
  font-size: 12.5px;
  color: var(--color-bg);
  opacity: 0.85;
  word-break: break-word;
}

/* 页脚:诚实范围说明 + 导出戳 */
.verify-report-foot {
  margin-top: 26px;
  border-top: 1px solid var(--color-bronze);
  padding-top: 10px;
}
.verify-report-note {
  margin: 0 0 6px;
  font-size: 10.5px;
  line-height: 1.45;
  opacity: 0.6;
}
.verify-report-gen {
  font-size: 11px;
  opacity: 0.75;
}

/* ---- 打印接管:仅「导出验真报告」流程(body.printing-verify-report) ----
 * 全选 visibility:hidden 后只放行卷宗子树 → 隐藏 app 壳(nav/sidebar/topbar)。
 * .verify-report 绝对定位到页原点:经核 .main/.section/#app 均 static,故锚定页面
 * 初始包含块(非壳偏移)。print-color-adjust:exact 让档纸米底与朱印真实打印。 */
@media print {
  body.printing-verify-report * {
    visibility: hidden !important;
  }
  body.printing-verify-report .verify-report,
  body.printing-verify-report .verify-report * {
    visibility: visible !important;
  }
  body.printing-verify-report .verify-report {
    display: block !important;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    min-height: 100%;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  /* 抹掉 app 壳里仅有的两处 100vh in-flow 盒(.shell min-height / .sidebar height,
   * app.css:27,36):visibility:hidden 保留布局盒,默认页边距下 100vh 盒高于可打印区
   * → 尾随空白页。collapse 后隐藏流塌到自然内容高(短),绝对定位卷宗仍锚页面初始
   * 包含块(无定位/transform 祖先,已核),故塌缩安全、定位不受影响。 */
  body.printing-verify-report .shell {
    min-height: 0 !important;
  }
  body.printing-verify-report .sidebar {
    height: auto !important;
    min-height: 0 !important;
  }
}

/* ---- 相机运动性能兜底 ---- */
/* 平移/缩放的每一帧,HUD·段面板的 backdrop blur 与场景发光滤镜都要整块重算,
 * 是缩放顿挫的主要来源;运动期间(.v-cc--moving,由 JS 挂/停稳 140ms 摘)临时停掉。
 * 本块必须留在文件末尾:与 .v-cc--dark 各发光规则同特异性,靠后置生效。 */
.v-cc--moving .v-cc-head,
.v-cc--moving .v-cc-panel {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.v-cc--moving .cc-screen,
.v-cc--moving .cc-server-led,
.v-cc--moving .cc-beacon-pole,
.v-cc--moving .cc-beacon-flag,
.v-cc--moving .cc-beacon-cap,
.v-cc--moving .cc-isle:hover,
.v-cc--moving .cc-isle--sel .cc-plat-ring { filter: none; }
.v-cc--moving .cc-beacon-ring { animation-play-state: paused; }