/* ============================================================
   design-v2.css · 视觉系统 v2（展示层，2026-09 追加）
   目标：建立明确的信息层级与尺度，清理 v1 的不一致，补齐状态与反馈
   约束：色相只取品牌紫 + 中性色（语义色 绿/黄/红 仅用于状态）；
        不改 class 语义；不动任何业务逻辑、接口、数据字段。
   规范：
     间距阶  4 / 8 / 12 / 20 / 28      --sp-1 … --sp-5
     圆角    2 级 + pill              --r-ctl 8 / --r-card 14 / --r-pill
     字号    3 级 + 数据级            --fs-1 12 / --fs-2 13.5 / --fs-3 15
     阴影    3 级                      --sh-1 / --sh-2 / --sh-3
     卡片    4 级重量                 L0 结论带 > L1 主卡 > L2 面板 > L3 行内
   ============================================================ */

/* ============================================================
   1 · 尺度令牌（唯一来源）
   ============================================================ */
:root{
  /* 间距阶 */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:20px; --sp-5:28px;
  /* 圆角（2 级 + pill） */
  --r-ctl:8px; --r-card:14px; --r-pill:999px;
  /* 字号（3 级 + 数据级） */
  --fs-1:12px; --fs-2:13.5px; --fs-3:15px;
  --fs-caption:11.5px; --fs-data:32px; --fs-hero:44px;
  /* 阴影（3 级，克制：卡片靠描边分层，阴影只用于浮起） */
  --sh-1:0 1px 2px rgba(20,22,26,.05);
  --sh-2:0 4px 16px rgba(20,22,26,.07);
  --sh-3:0 16px 38px rgba(110,31,145,.15);
  /* 覆盖 v1 不一致的密度令牌 */
  --pad:16px; --gap:16px; --radius:var(--r-card); --radius-sm:var(--r-ctl);
  --line-soft:color-mix(in srgb, var(--line) 62%, transparent);
  --ink-soft:color-mix(in srgb, var(--fg) 82%, var(--muted));
  --shadow-hover:var(--sh-3);
}
@media (prefers-color-scheme: dark){
  :root{
    --sh-1:0 1px 2px rgba(0,0,0,.4);
    --sh-2:0 4px 16px rgba(0,0,0,.45);
    --sh-3:0 16px 38px rgba(0,0,0,.5);
    /* 深色下把「品牌浅底」提到可读区间，避免紫底压紫字 */
    --brand-soft:#43224F; --brand-wash:#2A162F; --brand-100:#38203F;
  }
  body.skin-client{ --brand-wash:#2A162F; }
}

/* ============================================================
   2 · 基础排版：3 级字号 + 数据级，建立层级
   ============================================================ */
body{font-size:var(--fs-3);line-height:1.62;color:var(--fg)}
main{padding:var(--sp-4) var(--sp-4) 56px}
h1{font-size:18px;font-weight:700;letter-spacing:-.01em}
h2{
  font-size:var(--fs-2);font-weight:700;color:var(--fg2);
  letter-spacing:.02em;margin:var(--sp-5) 0 var(--sp-3);
}
h3{font-size:var(--fs-3);font-weight:700;margin:0 0 var(--sp-3)}
.muted{font-size:var(--fs-1);line-height:1.6}
code{background:var(--brand-wash);border-radius:5px;padding:1px 5px;font-size:.92em}
/* 长说明段落：限制行宽，避免一行 200 个字符 */
main > .panel > p.muted, .notice p, .state p{max-width:78ch}

/* 覆盖优先级兜底：个别新组件也带 .hidden，务必让 .hidden 一定赢 */
.hidden{display:none!important}

/* ============================================================
   3 · 卡片重量分级：不再所有卡片一样重
   L0 结论带（.concl） > L1 主卡（.kpi / .chart） > L2 面板（.tablewrap / .notice / .detail）
   ============================================================ */
.kpi,.chart,.tablewrap,.notice,.detail,.pricing-panel,.state{transition:box-shadow .2s ease,border-color .2s ease}

/* L2：面板类 —— 描边为主，几乎不用阴影 */
.notice,.detail,.tablewrap{box-shadow:none;border-color:var(--line)}
.notice{border-radius:var(--r-card);padding:var(--sp-3) var(--sp-4)}

/* L1：主卡 —— 轻微浮起 */
.chart,.kpi{box-shadow:var(--sh-1);border-radius:var(--r-card)}
.chart:hover,.kpi:hover{box-shadow:var(--sh-2)}
.chart{padding:var(--sp-4)}
.chart-hd{font-size:var(--fs-2);font-weight:700;margin-bottom:var(--sp-3)}
.chart-hd .muted{font-size:var(--fs-caption)}

/* ============================================================
   4 · L0 结论带：「一眼看到结论」——每页第一个看到的东西
   ============================================================ */
.concl{
  position:relative;overflow:hidden;
  display:grid;grid-template-columns:minmax(220px,.85fr) minmax(0,1.5fr);
  align-items:center;gap:var(--sp-4);
  margin:0 0 var(--sp-4);padding:var(--sp-4) var(--sp-4) var(--sp-4);
  border:1px solid var(--brand-200);border-radius:var(--r-card);
  background:
    radial-gradient(130% 150% at 0% 0%, var(--brand-wash) 0%, transparent 62%),
    var(--card);
  box-shadow:var(--sh-1);
}
.concl::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,var(--brand) 0%,var(--brand-deep) 100%);
}
.concl-main{min-width:0;padding-left:var(--sp-2)}
.concl-kicker{
  font-size:var(--fs-caption);font-weight:700;letter-spacing:.14em;
  color:var(--brand-deep);text-transform:uppercase;margin-bottom:var(--sp-1);
}
.concl-value{
  font-size:var(--fs-hero);font-weight:800;line-height:1.02;
  letter-spacing:-.03em;color:var(--brand-deep);
  font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;
}
.concl-value .unit{font-size:.46em;font-weight:700;letter-spacing:0;opacity:.72}
.concl-value .arrow{font-size:.5em;font-weight:700}
.concl-label{font-size:var(--fs-2);color:var(--fg2);font-weight:600;margin-top:var(--sp-2)}
.concl-side{min-width:0;display:flex;flex-direction:column;gap:var(--sp-2)}
.concl-delta{
  display:inline-flex;align-items:center;gap:var(--sp-2);align-self:flex-start;
  padding:5px 12px;border-radius:var(--r-pill);
  font-size:var(--fs-1);font-weight:600;
  background:var(--bg);border:1px solid var(--line);color:var(--fg2);
}
.concl-delta b{font-size:var(--fs-2);font-variant-numeric:tabular-nums}
.concl-delta.up{background:color-mix(in srgb,var(--ok) 9%,transparent);border-color:color-mix(in srgb,var(--ok) 32%,transparent);color:var(--ok)}
.concl-delta.down{background:color-mix(in srgb,var(--warn) 10%,transparent);border-color:color-mix(in srgb,var(--warn) 34%,transparent);color:var(--warn)}
.concl-note{margin:0;font-size:var(--fs-2);color:var(--fg2);line-height:1.6;max-width:80ch}
.concl-note b{color:var(--fg)}
.concl-note .muted{font-size:var(--fs-1)}
@media (prefers-color-scheme: dark){
  .concl-value,.concl-kicker{color:var(--accent-ink)}
  .concl{border-color:color-mix(in srgb,var(--brand) 40%,var(--line))}
}

/* ============================================================
   5 · KPI：组内第一张升级为「主指标」，其余为辅助
   ============================================================ */
.kpis{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--sp-3);margin:var(--sp-3) 0 var(--sp-2)}
.kpi{padding:var(--sp-3) var(--sp-3) var(--sp-4)}
.kpi .v{font-size:var(--fs-data);font-weight:800;letter-spacing:-.025em}
.kpi .k{font-size:var(--fs-1);font-weight:600;color:var(--fg2);margin-top:var(--sp-2)}
.kpi .n{font-size:var(--fs-caption);color:var(--muted);margin-top:var(--sp-1);line-height:1.55}
/* 主指标：跨 2 列、数字更大、品牌描边 */
.kpis > .kpi:first-child{
  grid-column:span 2;
  padding:var(--sp-4);
  border-color:var(--brand-200);
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--brand-wash) 70%,transparent) 0%,transparent 70%),
    var(--card);
}
.kpis > .kpi:first-child .v{font-size:calc(var(--fs-data) * 1.28)}
.kpis > .kpi:first-child .k{font-size:var(--fs-2)}
.kpis > .kpi:first-child .n{font-size:var(--fs-1)}
/* 文字型结论（如「⚠️ 未覆盖（亏本）」）与长数值不能让大字号换行破版 */
.kpi--text .v{font-size:calc(var(--fs-data) * .62);line-height:1.3;display:flex;align-items:center;gap:6px;flex-wrap:wrap;letter-spacing:-.01em}
.kpi--long .v{font-size:calc(var(--fs-data) * .78)}
.kpis > .kpi:first-child.kpi--long .v{font-size:calc(var(--fs-data) * 1.02)}
.kpis > .kpi:first-child.kpi--text .v{font-size:calc(var(--fs-data) * .78)}
body.skin-client .kpi--text .v{font-size:calc(var(--fs-data) * .58)}
body.skin-client .kpi--long .v{font-size:calc(var(--fs-data) * .72)}
@media (max-width:760px){ .kpis > .kpi:first-child{grid-column:span 2} }
@media (min-width:761px){ .kpis > .kpi:first-child{grid-column:span 2;max-width:none} }

/* ============================================================
   6 · 表格：吸顶表头 / 数字右对齐 / 超长截断 / 斑马
   ============================================================ */
.tablewrap{
  position:relative;
  border-radius:var(--r-card);
  max-height:72vh;
  scrollbar-width:thin;
  overscroll-behavior-x:contain;
}
table{font-size:var(--fs-2)}
thead tr{background:var(--card)}
th{
  position:sticky;top:0;z-index:3;
  background:var(--card);
  color:var(--muted);font-size:var(--fs-caption);font-weight:700;letter-spacing:.04em;
  padding:11px var(--sp-3);
  /* 吸顶表头用 inset 阴影画下边框，避免 collapse 下边框随滚动消失 */
  box-shadow:inset 0 -1px 0 var(--line), 0 6px 12px -10px rgba(20,22,26,.35);
}
td{padding:10px var(--sp-3);border-bottom:1px solid var(--line-soft)}
tbody tr:last-child td{border-bottom:0}
/* 数字列：右对齐 + 等宽数字 */
th.num,td.num{text-align:right;font-variant-numeric:tabular-nums}
td.num{font-weight:600}
/* 超长文段：截断 + 悬浮全显（title）；实际宽度由内部 .ellip 约束 */
td.tlong{max-width:none;white-space:normal;overflow:visible;cursor:help}
td.ctr,th.ctr{text-align:center}
tr.total td{background:var(--brand-wash);font-weight:700;border-top:1px solid var(--brand-200)}
/* 行内条形与数值同高线对齐 */
.bar{vertical-align:middle;margin-top:5px}
td.num .bar{margin-left:auto}

/* 超长单元格的实际截断：auto 布局下 td 上的 max-width 无效（nowrap 会把 min-content 顶成全文宽度），
   所以由 enhanceTable 在单元格内包一层 .ellip，用它的 max-width 真正约束表格宽度 */
td.tlong{max-width:none;white-space:normal;overflow:visible;cursor:help}
td.tlong > .ellip{display:block;max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ============================================================
   7 · 状态与反馈：加载 / 空 / 错误
   ============================================================ */
/* 7.1 顶部进度条 */
.bootbar{position:fixed;top:0;left:0;right:0;height:3px;z-index:99;overflow:hidden;background:transparent;pointer-events:none}
.bootbar>i{display:block;height:100%;width:34%;border-radius:999px;background:linear-gradient(90deg,transparent,var(--brand) 45%,var(--brand-deep) 60%,transparent);animation:bootslide 1.2s ease-in-out infinite}
@keyframes bootslide{0%{transform:translateX(-110%)}100%{transform:translateX(320%)}}

/* 7.2 骨架屏 */
.skel{position:relative;overflow:hidden;background:var(--line-soft)}
.skel::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--card) 70%,transparent),transparent);
  animation:skel 1.35s ease-in-out infinite;
}
@keyframes skel{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.skel-lines{display:flex;flex-direction:column;gap:10px}
.skel-lines>span{display:block;height:12px;border-radius:6px}
.skel-lines>span:nth-child(1){width:62%}
.skel-lines>span:nth-child(2){width:88%}
.skel-lines>span:nth-child(3){width:74%}
.skel-lines>span:nth-child(4){width:52%}
.tablewrap.is-loading{min-height:96px}
.tablewrap.is-loading table{opacity:.35}

/* 7.3 空数据 */
.tablewrap[data-empty]{min-height:0}
.tablewrap[data-empty]::after{
  content:attr(data-empty);
  display:block;padding:var(--sp-5) var(--sp-4);
  text-align:center;color:var(--muted);font-size:var(--fs-2);line-height:1.7;
}
.tablewrap[data-empty] table{display:none}
.empty-state{
  display:flex;align-items:center;gap:var(--sp-3);
  padding:var(--sp-4);border:1px dashed var(--line);border-radius:var(--r-card);
  background:color-mix(in srgb,var(--bg) 60%,transparent);
  color:var(--muted);font-size:var(--fs-2);
}
.empty-state .es-ico{
  flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;
  background:var(--brand-100);color:var(--brand-deep);font-size:15px;font-weight:700;
}
.empty-state b{color:var(--fg2);display:block;margin-bottom:2px;font-size:var(--fs-2)}

/* 7.4 错误 */
.state{
  display:flex;gap:var(--sp-3);align-items:flex-start;
  padding:var(--sp-3) var(--sp-4);border-radius:var(--r-card);
  border:1px solid color-mix(in srgb,var(--bad) 34%,transparent);
  background:color-mix(in srgb,var(--bad) 6%,transparent);
}
.state .es-ico{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--bad) 12%,transparent);color:var(--bad);font-weight:800}
.state b{display:block;color:var(--fg);font-size:var(--fs-2)}
.state p{margin:4px 0 0;font-size:var(--fs-1);color:var(--fg2)}
.state code{background:color-mix(in srgb,var(--bad) 10%,transparent);color:var(--fg2)}
.state .state-act{margin-top:8px}
.state.soft{border-color:var(--line);background:var(--card)}

/* 7.5 数值异常色彩：清晰但不刺眼（不改变原语义色用量） */
.is-none{color:var(--muted);font-weight:400}
td.is-none{font-weight:400}
.is-neg{color:var(--bad);font-weight:600}
td.is-neg{background:color-mix(in srgb,var(--bad) 5%,transparent)}
.is-warn{color:var(--warn);font-weight:600}
td.is-warn{background:color-mix(in srgb,var(--warn) 7%,transparent)}
.is-pos{color:var(--ok);font-weight:600}
td.is-pos{background:color-mix(in srgb,var(--ok) 6%,transparent)}
@media (prefers-color-scheme:dark){
  td.is-neg{background:color-mix(in srgb,var(--bad) 12%,transparent)}
  td.is-warn{background:color-mix(in srgb,var(--warn) 12%,transparent)}
  td.is-pos{background:color-mix(in srgb,var(--ok) 10%,transparent)}
}

/* ============================================================
   8 · 控件一致性（间距阶 + 2 级圆角 + 统一高度）
   ============================================================ */
select,input,textarea{border-radius:var(--r-ctl);padding:8px 12px;font-size:var(--fs-2);min-height:38px}
button,a.btn{border-radius:var(--r-ctl);padding:9px 16px;font-size:var(--fs-2);font-weight:500;min-height:38px}
button.small{padding:5px 11px;font-size:var(--fs-1);min-height:30px}
button.primary{background:linear-gradient(180deg,var(--brand) 0%,var(--accent) 100%);border-color:var(--brand-strong);box-shadow:0 1px 2px rgba(110,31,145,.25)}
button.primary:hover{background:linear-gradient(180deg,var(--brand-strong) 0%,var(--brand-deep) 100%);box-shadow:var(--sh-2)}
button.ghost{background:transparent;border-style:dashed}
.runbar,.filters,.settings,.effectform{gap:var(--sp-2);margin-bottom:var(--sp-4)}
.runbar label,.settings label,.filters label{font-size:var(--fs-1);font-weight:600;color:var(--muted)}
.tag{padding:2px 9px;font-size:var(--fs-caption);font-weight:600;border-radius:var(--r-pill)}
.banner{border-radius:var(--r-card);padding:var(--sp-3) var(--sp-4);font-size:var(--fs-2);box-shadow:var(--sh-1)}
.gaps{padding-left:var(--sp-4)}
.gaps li{margin:6px 0}
.kv{gap:6px var(--sp-3);font-size:var(--fs-2)}
.detail pre{font-size:12.5px;border-radius:var(--r-ctl)}

/* ============================================================
   9 · 页签：安静的分段控件
   ============================================================ */
.tabs{gap:var(--sp-1);padding:var(--sp-2) var(--sp-3) 0;backdrop-filter:saturate(1.1)}
.tab{padding:12px 16px;font-size:var(--fs-2);font-weight:600;border-radius:var(--r-ctl) var(--r-ctl) 0 0}
.tab.active{box-shadow:inset 0 -2px 0 var(--brand);background:linear-gradient(180deg,transparent,var(--brand-wash))}
.top{padding:var(--sp-3) var(--sp-4)}

/* ============================================================
   10 · 报价面板 / 成本构成（沿用 v1 结构，统一到 v2 尺度）
   ============================================================ */
.pricing-panel{border-radius:var(--r-card);padding:var(--sp-4);box-shadow:var(--sh-1);margin-top:var(--sp-4)}
.pp-head h3{font-size:var(--fs-3)}
.costbar{height:12px;border-radius:var(--r-pill);margin:var(--sp-2) 0 var(--sp-3)}
.costlegend{font-size:var(--fs-2);gap:var(--sp-2) var(--sp-4);margin-bottom:var(--sp-4)}
.pkgwrap{gap:var(--sp-3)}
.pkg{border-radius:var(--r-card);padding:var(--sp-3) var(--sp-3) var(--sp-4)}
.pkg-name{font-size:var(--fs-2)}
.pkg-price{font-size:30px}
.pp-foot{font-size:var(--fs-1);color:var(--fg2)}

/* ============================================================
   11 · 客户只读端（body.skin-client）：交付级报告
   大字、少控件、无后台感；不出现成本/报价/内部字段
   ============================================================ */
body.skin-client{--fs-2:14.5px;--fs-3:16px;--fs-1:13px;--fs-caption:12px;--fs-data:38px;--fs-hero:52px;--pad:24px;--gap:24px}
body.skin-client::after{content:"客户专属 · 请勿外传";position:fixed;right:18px;bottom:14px;z-index:9999;color:rgba(110,31,145,.38);font-size:12px;font-weight:800;letter-spacing:.12em;pointer-events:none;user-select:none}
body.skin-client main{max-width:1180px;margin:0 auto;padding:var(--sp-4) var(--sp-4) 64px}
body.skin-client h1{font-size:20px}
body.skin-client h2{font-size:16px;margin:var(--sp-5) 0 var(--sp-3)}
/* 报告头 */
.report-head{
  display:flex;justify-content:space-between;align-items:flex-start;gap:var(--sp-4);flex-wrap:wrap;
  padding:var(--sp-4);margin-bottom:var(--sp-4);
  border:1px solid var(--brand-200);border-radius:var(--r-card);
  background:linear-gradient(135deg,var(--brand-wash) 0%,var(--card) 62%);
  box-shadow:var(--sh-1);
}
.report-head .rh-brand{display:flex;align-items:center;gap:var(--sp-3)}
.report-head .rh-logo{width:42px;height:42px;border-radius:12px;flex:none}
.report-head .rh-name{font-size:12px;letter-spacing:.18em;color:var(--brand-deep);font-weight:700;text-transform:uppercase}
.report-head h2{margin:2px 0 0;font-size:22px;color:var(--fg);letter-spacing:-.01em}
.report-head .rh-meta{font-size:var(--fs-1);color:var(--muted);margin-top:6px}
.report-head .rh-tags{display:flex;gap:var(--sp-2);flex-wrap:wrap;justify-content:flex-end}
.report-head .rh-tags span{
  padding:5px 12px;border-radius:var(--r-pill);font-size:var(--fs-1);font-weight:600;
  background:var(--card);border:1px solid var(--brand-200);color:var(--brand-deep);
}
@media (prefers-color-scheme: dark){ .report-head .rh-name,.report-head .rh-tags span{color:var(--accent-ink)} }
/* 客户链接：藏起后台控件，保留只读浏览所需 */
body.skin-client .projsel,
body.skin-client #schedMin,
body.skin-client .muted#hostInfo{display:none}
body.skin-client .tabs{position:static;justify-content:center;border-bottom:1px solid var(--line);background:var(--card)}
body.skin-client .tab{font-size:var(--fs-2);padding:14px 18px}
body.skin-client .foot{max-width:1180px;margin:0 auto;font-size:var(--fs-1)}
body.skin-client .kpis{gap:var(--sp-3)}
body.skin-client .kpi{padding:var(--sp-4)}
body.skin-client .kpi .v{font-size:var(--fs-data)}
body.skin-client .kpis > .kpi:first-child .v{font-size:calc(var(--fs-data) * 1.15)}
body.skin-client .chart{padding:var(--sp-4)}
body.skin-client .tablewrap table{font-size:var(--fs-2)}
body.skin-client td.tlong > .ellip{max-width:380px}
body.skin-client .concl{grid-template-columns:1fr;gap:var(--sp-3);padding:var(--sp-4) var(--sp-4)}
body.skin-client .concl-value{font-size:var(--fs-hero)}
body.skin-client .empty-state,body.skin-client .state{font-size:var(--fs-2)}
/* 客户只读端的 banner：用 class 承载色值（内联色值在深色模式下会掉到 2.6:1） */
.banner--client{background:var(--brand-wash);border-color:var(--brand-300);color:var(--brand-deep);box-shadow:none}
@media (prefers-color-scheme: dark){ .banner--client{color:var(--accent-ink);background:color-mix(in srgb,var(--brand) 14%,var(--card))} }

/* ============================================================
   12 · 移动端 ≤640px：一屏看到关键指标，表格横滑不撑破
   ============================================================ */
@media (max-width:760px){
  main{padding:var(--sp-3) var(--sp-3) 40px}
  /* 移动端把「结论 + 关键指标」提到控件之前：一屏就能看到关键数字（纯 CSS 排序，不改 DOM/逻辑） */
  .panel.active{display:flex;flex-direction:column}
  .panel.active > *{order:20;min-width:0}
  .panel.active > .concl{order:1}
  .panel.active > .kpis{order:2}
  .panel.active > .runbar,.panel.active > .filters{order:3}
  .panel.active > .banner{order:4}
  .concl{grid-template-columns:1fr;gap:var(--sp-3);padding:var(--sp-3)}
  .concl-value{font-size:calc(var(--fs-hero) * .72)}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-2)}
  .kpis > .kpi:first-child{grid-column:span 2;padding:var(--sp-3)}
  .kpis > .kpi:first-child .v{font-size:calc(var(--fs-data) * .95)}
  .kpi{padding:var(--sp-3)}
  .kpi .v{font-size:calc(var(--fs-data) * .82)}
  .chart{padding:var(--sp-3)}
  body{font-size:var(--fs-2)}
  h1{font-size:16px}
  /* 顶栏瘦身：手机上一屏要留给数据，不留给元信息（结论带已给出同样信息） */
  .top{padding:var(--sp-2) var(--sp-3);gap:var(--sp-2)}
  .topinfo{max-width:100%;min-width:0;flex-wrap:wrap}
  .top .sub,.top #lastRun,.top #projMeta{display:none}
  .projsel{max-width:100%;min-width:0}
  .projsel select{max-width:190px;min-width:0;text-overflow:ellipsis}
  .topinfo{gap:var(--sp-2)}
  .tabs{padding:var(--sp-1) var(--sp-2) 0;position:sticky;top:auto}
  .tab{padding:10px 12px}
  .runbar,.filters,.settings{gap:var(--sp-2)}
  .tablewrap{max-height:none;border-radius:var(--r-card)}
  td.tlong > .ellip{max-width:180px}
  body.skin-client .concl-value{font-size:calc(var(--fs-hero) * .6)}
  body.skin-client main{padding:var(--sp-3) var(--sp-3) 40px}
  .report-head{padding:var(--sp-3)}
  .report-head h2{font-size:18px}
  .report-head .rh-tags{justify-content:flex-start}
  .tablewrap{overflow-x:auto}
  table{min-width:0}
}
@media (max-width:430px){
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi .v{font-size:24px}
  .concl-value{font-size:34px}
  th,td{padding:9px 10px}
}

/* 横向安全网：宽表格只在容器内横滑（不在 body 上设 overflow，避免破坏 sticky 吸顶） */
main{overflow-x:clip}
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.heat-wrap{overflow-x:auto}
/* 语义色对齐 DESIGN.md：事实错误用琥珀（#D97706 上白字只有 3.2:1，不达标） */
.h-err{background:var(--warn)}

/* ============================================================
   13 · 深色模式对比度兜底（正文 ≥ 4.5:1）
   ============================================================ */
@media (prefers-color-scheme: dark){
  /* 品牌深紫在深色底上不达标 → 文字统一走 accent-ink
     （选择器要压过 design-plus 的 .tabs button[aria-selected="true"]） */
  .concl-kicker,.pkg-price,.pkg-meta > span,button:hover,a.btn:hover{color:var(--accent-ink)}
  .tabs .tab.active,.tabs .tab[aria-selected="true"]{color:var(--accent-ink)}
  td.num{color:var(--fg)}
  .h-miss{background:#5C6470}
  /* 深色下 --warn 是亮琥珀，白字只有 1.7:1 → 热力图错误格改深色文字
     （选择器要压过 style.css 的 table.heat td{color:#fff}） */
  table.heat td.h-err{background:var(--warn);color:#3A2500}
  th{color:#B8C0CB}
  .muted,.kpi .n,.concl-note{color:#A9B2BD}
  .banner{background:color-mix(in srgb,var(--warn) 16%,transparent);color:#FCD34D}
  .empty-state .es-ico{background:var(--brand-soft);color:var(--accent-ink)}
}

/* ============================================================
   14 · 动效可关闭 + 打印
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
@media print{
  .concl{break-inside:avoid;box-shadow:none}
  .kpi,.chart,.tablewrap{box-shadow:none}
  .tablewrap{max-height:none}
  th{position:static}
}