/* EPR Rates — style.css · 依据 x仓 doc/产品/06_美术spec_v0.1.md（token 附录B；组件 §5；拍板 8-1A/8-2A/8-3A）
   + 工单 44 交互反馈层（43 号评审 M1-M23；:target/hover/sticky 表头/移动端修复；
   动效上限 ≤200ms、prefers-reduced-motion 豁免——user 2026-08-27 C2 拍板） */
:root{
  --ink:#10131a;--ink-muted:#4a5160;--link:#14508c;--link-visited:#4c2d8c;
  --paper:#ffffff;--paper-alt:#f6f7f9;--rule:#ccd2da;--rule-strong:#10131a;
  --malus:#8f2d21;--bonus:#145c3e;--caution:#7a5300;--focus:#ffdd00;
  --target-bg:#fff8dc;
  --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --fs-xl:30px;--lh-xl:36px;--fs-l:24px;--lh-l:30px;--fs-m:19px;--lh-m:26px;
  --fs-body:16px;--lh-body:25px;--fs-s:14px;--lh-s:20px;--fs-xs:13px;--lh-xs:18px;
  --measure:68ch;
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--sp-7:48px;--sp-8:64px;
  --rule-w:1px;--rule-w-strong:2px;--bar-w:4px;--radius:2px;
  --w-prose:720px;--w-wide:1140px;--gutter:16px;
}
@media (min-width:640px){
  :root{--fs-xl:40px;--lh-xl:46px;--fs-l:28px;--lh-l:34px;--fs-m:21px;--lh-m:28px;
        --fs-body:17px;--lh-body:26px;--fs-s:15px;--lh-s:21px;--gutter:24px;}
}
@media (min-width:1024px){:root{--gutter:32px;}}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--font-sans);font-size:var(--fs-body);line-height:var(--lh-body);
  color:var(--ink);background:var(--paper)}
a{color:var(--link);transition:color .15s,text-decoration-thickness .15s}
a:visited{color:var(--link-visited)}
a:hover{text-decoration-thickness:2px}
a:focus-visible,button:focus-visible{outline:3px solid var(--focus);outline-offset:0;
  box-shadow:0 2px 0 var(--ink);background:var(--focus);color:var(--ink)}
[id]{scroll-margin-top:var(--sp-7)}
.skip-link{position:absolute;left:-999em;top:0;z-index:10;background:var(--paper);
  padding:var(--sp-2) var(--sp-3)}
.skip-link:focus{left:0}
h1{font-size:var(--fs-xl);line-height:var(--lh-xl);margin:var(--sp-5) 0 var(--sp-2)}
h2{font-size:var(--fs-l);line-height:var(--lh-l);margin:var(--sp-7) 0 var(--sp-4)}
h3{font-size:var(--fs-m);line-height:var(--lh-m);margin:var(--sp-5) 0 var(--sp-3)}
p,ul,ol{margin:0 0 var(--sp-4)}
.wrap{max-width:var(--w-prose);margin:0 auto;padding:0 var(--gutter)}
.wrap-wide{max-width:var(--w-wide);margin:0 auto;padding:0 var(--gutter)}
.prose{max-width:var(--measure)}

/* 页头 */
.site-head{border-bottom:var(--rule-w-strong) solid var(--rule-strong)}
.site-head .wrap-wide{display:flex;flex-wrap:wrap;align-items:baseline;
  justify-content:space-between;padding-top:var(--sp-3);padding-bottom:var(--sp-3)}
.site-head .brand{font-weight:700;font-size:var(--fs-m);color:var(--ink);text-decoration:none}
.site-head nav a{margin-left:var(--sp-4);font-size:var(--fs-s);
  display:inline-flex;align-items:center;min-height:44px;padding:var(--sp-2) 0}
.breadcrumb{font-size:var(--fs-s);color:var(--ink-muted);margin-top:var(--sp-4)}
.breadcrumb a{color:var(--link)}

/* meta 行（§5.4）：H1 正下方 */
.meta-line{font-size:var(--fs-s);line-height:var(--lh-s);color:var(--ink-muted);
  margin-bottom:var(--sp-5)}

/* 结论句块（§5.7）：无引号无斜体，4px 左竖条 */
.quotable{font-size:var(--fs-m);line-height:var(--lh-m);border-left:var(--bar-w) solid var(--rule-strong);
  padding:var(--sp-2) 0 var(--sp-2) var(--sp-4);margin:0 0 var(--sp-5);max-width:var(--measure)}
.quotable .basis{display:block;font-size:var(--fs-xs);line-height:var(--lh-xs);
  color:var(--ink-muted);margin-top:var(--sp-1)}

/* 费率表（§5.1）：border-collapse separate + inset box-shadow 行线（sticky 兼容） */
.table-scroll{overflow-x:auto;background:
  linear-gradient(to right,var(--paper) 30%,rgba(255,255,255,0)),
  linear-gradient(to right,rgba(255,255,255,0),var(--paper) 70%) 100% 0,
  linear-gradient(to right,rgba(16,19,26,.14),rgba(255,255,255,0) 16px),
  linear-gradient(to left,rgba(16,19,26,.14),rgba(255,255,255,0) 16px) 100% 0;
  background-repeat:no-repeat;background-size:40px 100%,40px 100%,16px 100%,16px 100%;
  background-attachment:local,local,scroll,scroll}
.rate-table{width:100%;border-collapse:separate;border-spacing:0;
  font-size:var(--fs-s);line-height:var(--lh-s)}
.rate-table caption{caption-side:top;text-align:left;color:var(--ink-muted);
  font-size:var(--fs-s);padding-bottom:var(--sp-3)}
.rate-table th,.rate-table td{padding:var(--sp-3) var(--sp-4) var(--sp-3) 0;
  vertical-align:top;text-align:left;background:var(--paper);
  box-shadow:inset 0 calc(-1 * var(--rule-w)) 0 var(--rule);
  transition:background-color .15s}
/* 行追踪（M6/C1 拍板：hover 整行浅底，不加斑马纹）与锚点落点反馈（M1/P1） */
.rate-table tbody tr:hover th,.rate-table tbody tr:hover td{background:var(--paper-alt)}
.rate-table tr:target th,.rate-table tr:target td{background:var(--target-bg)}
/* 长表粘性表头（M2/C3，06 §5.1 预授权方案；构建层对 >60 行的表注 .table-tall） */
.table-tall{max-height:85vh;overflow-y:auto}
.table-tall thead th{position:sticky;top:0;z-index:2}
.table-tall thead th:first-child{left:0;z-index:3}
/* 阶梯组行区分（M9）：行头区间记号 + 值格斜体 */
.row-band th[scope=row]::before{content:"▤ ";color:var(--ink-muted)}
.row-band .num{font-style:italic}
/* 行锚一键复制（L1-a/C5）：默认 hidden，JS 开启后仅 hover/focus 可见 */
.copy-anchor{font:inherit;font-size:var(--fs-xs);border:0;background:none;
  color:var(--link);cursor:pointer;padding:0 var(--sp-1);visibility:hidden}
tr:hover .copy-anchor,tr:focus-within .copy-anchor,.copy-anchor:focus{visibility:visible}
.rate-table th:last-child,.rate-table td:last-child{padding-right:0}
.rate-table thead th{font-weight:700;
  box-shadow:inset 0 calc(-1 * var(--rule-w-strong)) 0 var(--rule-strong)}
.rate-table th[scope=row]{position:sticky;left:0;z-index:1;font-weight:400;
  box-shadow:inset calc(-1 * var(--rule-w)) 0 0 var(--rule),
             inset 0 calc(-1 * var(--rule-w)) 0 var(--rule)}
.rate-table .num{text-align:right;font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;white-space:nowrap}
.rate-table .orig{display:block;font-size:var(--fs-xs);line-height:var(--lh-xs);
  color:var(--ink-muted);font-weight:400}
.rate-table .malus{color:var(--malus)}
.rate-table .bonus{color:var(--bonus)}
.rate-table .caution{color:var(--caution)}
.rate-table .cell-note{display:block;font-size:var(--fs-xs);line-height:var(--lh-xs);
  color:var(--ink-muted)}
.rate-table sup{font-size:11px;line-height:0}
.src-cell{font-size:var(--fs-xs);line-height:var(--lh-xs)}
.src-cell .conf{color:var(--ink-muted)}
.src-cell .conf.caution{color:var(--caution)}
.legend{font-size:var(--fs-xs);line-height:var(--lh-xs);color:var(--ink-muted);
  margin:var(--sp-3) 0 var(--sp-5)}
ul.legend{list-style:none;padding:0}
ul.legend li{padding:var(--sp-1) 0}

/* 来源块（§5.2 L1 脚注引用制 / Provenance） */
.sources-block{font-size:var(--fs-s);line-height:var(--lh-s)}
.sources-block a{overflow-wrap:anywhere}
.sources-block li{list-style:none;padding:var(--sp-2) 0;
  border-bottom:var(--rule-w) solid var(--rule)}
.sources-block .conf{color:var(--ink-muted)}
.sources-block .conf.caution{color:var(--caution)}
.mono{font-family:var(--font-mono);font-size:var(--fs-xs)}

/* 区块底（§5.3 cite / §5.6 alerts / §5.8 download） */
.panel{background:var(--paper-alt);border-left:var(--bar-w) solid var(--rule-strong);
  border-radius:var(--radius);padding:var(--sp-4) var(--sp-5);margin:var(--sp-5) 0;
  max-width:var(--measure)}
.panel h2,.panel h3{margin-top:0}
.panel pre{font-family:var(--font-mono);font-size:var(--fs-xs);line-height:var(--lh-xs);
  white-space:pre-wrap;word-break:break-word;background:var(--paper);
  padding:var(--sp-3);margin:var(--sp-3) 0;border:var(--rule-w) solid var(--rule)}
.panel .third-party{font-size:var(--fs-xs);line-height:var(--lh-xs);color:var(--ink-muted)}
button[data-copy]{font:inherit;font-size:var(--fs-s);padding:var(--sp-1) var(--sp-3);
  border:var(--rule-w) solid var(--ink);background:var(--paper);color:var(--ink);
  border-radius:var(--radius);cursor:pointer}

/* 页脚（§5.5） */
.site-footer{border-top:var(--rule-w-strong) solid var(--rule-strong);
  margin-top:var(--sp-8);padding:var(--sp-6) 0;font-size:var(--fs-s);line-height:var(--lh-s)}
.site-footer .cols{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin-bottom:var(--sp-5)}
.site-footer .col{min-width:140px}
.site-footer .col b{display:block;margin-bottom:var(--sp-2)}
.site-footer .col a{display:block;padding:var(--sp-1) 0}
.site-footer .col-list{columns:2;column-gap:var(--sp-5)}
.back-top{margin:var(--sp-6) 0 0;font-size:var(--fs-s)}
.site-footer .legal{color:var(--ink-muted);border-top:var(--rule-w) solid var(--rule);
  padding-top:var(--sp-4)}

/* pricing 表复用 rate-table；勾叉列居中 */
.rate-table .ctr{text-align:center}

@media (max-width:639px){
  .rate-table{font-size:var(--fs-xs);line-height:var(--lh-xs)}
  .rate-table th,.rate-table td{padding:var(--sp-2) var(--sp-3) var(--sp-2) 0}
  .site-head nav a{margin-left:0;margin-right:var(--sp-4)}
}

/* ===================== C 端工具壳（110 号 §5 组件 / §6 token，工单 111）=====================
   **只加不改**：本节全是新 token 与新类，上面既有选择器一条未删未改（唯一例外 = 站头导航
   触控高度，43 号 E2，就地改在 .site-head nav a 那一条）。数据壳（费率页 / 体系页 / 年份页 /
   本地语页 / 法律页）沿 06 形制不动，本节对它们只多一枚 .page-action。 */
:root{
  --accent:#0b6e4f;          /* 深绿，110 §10-① user 拍 A；与 --bonus 同族，与链接蓝区分 */
  --accent-ink:#ffffff;      /* 主按钮文字：#0b6e4f 上 6.3:1，过 AA */
  --radius-card:8px;         /* 卡片；表格与行内元素仍 --radius 2px */
  --shadow-card:0 1px 2px rgba(16,19,26,.06);
  --w-tool:960px;            /* 工具壳内容宽（首屏两栏） */
}
.wrap-tool{max-width:var(--w-tool);margin:0 auto;padding:0 var(--gutter)}
.wrap-wide .wrap-tool{padding-left:0;padding-right:0}

/* 首屏两栏（110 §3）：≥1024 并排，其下单列且结果面板紧随输入 */
.calc-hero{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-5);
  margin:var(--sp-5) 0 var(--sp-6);max-width:var(--w-tool)}
/* grid 子项默认 min-width:auto，会被表的 min-content 撑破栏宽 → 窄屏整页横向漂移
   （43 号 E1 的同一根因）。两栏都显式 min-width:0，横滚只许发生在 .table-scroll 里。 */
.calc-hero > *{min-width:0}
@media (min-width:1024px){
  /* 输入栏比结果栏宽一档：材料行那张表要装下"材料 / 费率 / 公斤 / 金额 / 出处行"五列，
     两栏等宽会把出处列挤进横滚，而逐行出处正是本站唯一的护城河，不许被挤走。 */
  .calc-hero{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);align-items:start}
}

/* 计算器卡（110 §5） */
.calc-card{background:var(--paper);border:var(--rule-w) solid var(--rule);
  border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:var(--sp-5)}
.calc-card > :last-child{margin-bottom:0}
.calc-card .field{margin:0 0 var(--sp-4)}
.calc-card .field > label,.calc-card .field > .fl{display:block;font-size:var(--fs-s);
  line-height:var(--lh-s);color:var(--ink-muted);margin-bottom:var(--sp-1)}
.calc-card select,.calc-card input[type=text]{font:inherit;font-size:var(--fs-body);
  line-height:var(--lh-body);min-height:44px;width:100%;max-width:100%;
  padding:var(--sp-2) var(--sp-3);border:var(--rule-w) solid var(--rule);
  border-radius:var(--radius);background:var(--paper);color:var(--ink)}
.calc-card .calc-rows{margin:var(--sp-4) 0;font-size:var(--fs-xs);line-height:var(--lh-xs)}
.calc-card .calc-rows caption{font-size:var(--fs-xs);line-height:var(--lh-xs)}
.calc-card .calc-rows td,.calc-card .calc-rows th{vertical-align:middle;
  padding:var(--sp-2) var(--sp-3) var(--sp-2) 0}
.calc-card .calc-rows input[type=text]{min-width:4.5rem;width:auto;text-align:right;
  font-size:var(--fs-s);padding:var(--sp-1) var(--sp-2)}
.calc-card .calc-rows th[scope=row]{min-width:9rem}
.calc-card .calc-rows .src-cell .conf{display:block}
/* .rate-table .orig 是块级（副行用），卡内那个 kg 标签要与输入框同一行 */
.calc-card .calc-rows label.orig{display:inline}
.row-del{display:block;font:inherit;font-size:var(--fs-xs);border:0;background:none;
  color:var(--link);cursor:pointer;padding:var(--sp-2) var(--sp-2) var(--sp-2) 0;
  min-height:44px;text-align:left}

/* 快捷 chip（110 §5 / §10-③） */
.chips{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin:0 0 var(--sp-4)}
.chip{font:inherit;font-size:var(--fs-s);line-height:var(--lh-s);min-height:44px;
  padding:var(--sp-2) var(--sp-4);border:var(--rule-w) solid var(--rule-strong);
  border-radius:999px;background:var(--paper);color:var(--ink);cursor:pointer;
  transition:background-color .15s,color .15s}
.chip:hover{background:var(--paper-alt)}
.chip[aria-pressed=true]{background:var(--accent);border-color:var(--accent);
  color:var(--accent-ink)}

/* 结果面板（110 §5） */
.result-panel{background:var(--paper-alt);border:var(--rule-w) solid var(--rule);
  border-radius:var(--radius-card);padding:var(--sp-5)}
.result-panel > :last-child{margin-bottom:0}
.result-panel .rp-head{font-size:var(--fs-s);line-height:var(--lh-s);color:var(--ink-muted);
  margin-bottom:var(--sp-2)}
.result-panel .rp-total{font-size:var(--fs-xl);line-height:var(--lh-xl);font-weight:700;
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;margin:0}
.result-panel .rp-sub{font-size:var(--fs-s);line-height:var(--lh-s);color:var(--ink-muted);
  margin:0 0 var(--sp-4)}
.result-panel .panel{margin:var(--sp-4) 0;background:var(--paper)}
.result-panel .rp-next{font-size:var(--fs-s);line-height:var(--lh-s);margin:var(--sp-4) 0 0;
  padding-top:var(--sp-3);border-top:var(--rule-w) solid var(--rule)}

/* 按钮（110 §5）：焦点环沿 06 §7.5，由上面的 a:focus-visible/button:focus-visible 统一供给 */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;
  padding:var(--sp-2) var(--sp-5);border-radius:6px;font:inherit;font-size:var(--fs-body);
  line-height:var(--lh-s);text-decoration:none;cursor:pointer;
  border:var(--rule-w-strong) solid var(--ink);background:var(--paper);color:var(--ink);
  transition:background-color .15s,color .15s}
.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn-primary:visited{color:var(--accent-ink)}
.btn-primary:hover{background:#095a41;border-color:#095a41}
.btn-secondary{background:var(--paper);border-color:var(--ink);color:var(--ink)}
.btn-secondary:visited{color:var(--ink)}
.btn-secondary:hover{background:var(--paper-alt)}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin:var(--sp-4) 0}
.btn .price{font-size:var(--fs-s);opacity:.9}

/* 事实块（110 §5）：两列 dl，每项值 + 出处小链 */
.fact-block{background:var(--paper-alt);border:var(--rule-w) solid var(--rule);
  border-radius:var(--radius-card);padding:var(--sp-4) var(--sp-5);margin:var(--sp-5) 0;
  font-size:var(--fs-s);line-height:var(--lh-s)}
.fact-block dl{display:grid;grid-template-columns:1fr;gap:0;margin:0}
@media (min-width:640px){.fact-block dl{grid-template-columns:14rem minmax(0,1fr)}}
.fact-block dt{font-weight:700;padding:var(--sp-3) var(--sp-4) 0 0}
.fact-block dd{margin:0;padding:0 0 var(--sp-3)}
@media (min-width:640px){.fact-block dt,.fact-block dd{padding-top:var(--sp-3);
  box-shadow:inset 0 calc(-1 * var(--rule-w)) 0 var(--rule)}}
.fact-block .src{display:block;font-size:var(--fs-xs);line-height:var(--lh-xs);
  color:var(--ink-muted)}
.fact-block .src.caution{color:var(--caution)}

/* 结论条（110 §5）：左竖条取语义色，颜色永不是唯一载体——措辞本身即结论 */
.verdict{border-left-color:var(--rule-strong)}
.verdict-no{border-left-color:var(--bonus)}
.verdict-yes{border-left-color:var(--malus)}
.verdict-maybe{border-left-color:var(--caution)}

/* 方案卡（110 §4.2） */
.plan-grid{display:grid;gap:var(--sp-4);margin:var(--sp-5) 0}
@media (min-width:640px){.plan-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.plan-card{display:flex;flex-direction:column;background:var(--paper);
  border:var(--rule-w) solid var(--rule);border-radius:var(--radius-card);
  box-shadow:var(--shadow-card);padding:var(--sp-5)}
.plan-card h3{margin:0 0 var(--sp-2);font-size:var(--fs-m);line-height:var(--lh-m)}
.plan-card .price{font-size:var(--fs-l);line-height:var(--lh-l);font-weight:700;
  font-variant-numeric:tabular-nums;display:block;margin-bottom:var(--sp-3)}
.plan-card ul{list-style:none;padding:0;margin:0 0 var(--sp-4);font-size:var(--fs-s);
  line-height:var(--lh-s)}
.plan-card li{padding:var(--sp-2) 0;box-shadow:inset 0 calc(-1 * var(--rule-w)) 0 var(--rule)}
.plan-card .btn{margin-top:auto}
.plan-card .legend{margin:var(--sp-3) 0 0}

/* 步骤条（110 §5） */
.stepper{display:flex;flex-wrap:wrap;gap:var(--sp-3);list-style:none;padding:0;
  margin:var(--sp-4) 0 var(--sp-5);font-size:var(--fs-s);line-height:var(--lh-s)}
.stepper li{display:flex;align-items:center;gap:var(--sp-2);color:var(--ink-muted)}
.stepper a{display:inline-flex;align-items:center;min-height:44px}
.stepper .n{display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:999px;border:var(--rule-w) solid var(--rule-strong);
  font-size:var(--fs-xs);font-weight:700}
.stepper .is-now{color:var(--ink);font-weight:700}
.stepper .is-now .n{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}

/* 粘底合计（移动端，渐进增强；无 JS 时不出现） */
.sticky-total{position:sticky;bottom:0;z-index:4;min-height:48px;display:flex;
  align-items:center;justify-content:space-between;gap:var(--sp-3);
  background:var(--paper);border-top:var(--rule-w-strong) solid var(--rule-strong);
  padding:var(--sp-2) var(--gutter);margin:0 calc(-1 * var(--gutter));
  font-size:var(--fs-s);line-height:var(--lh-s);font-variant-numeric:tabular-nums}
@media (min-width:1024px){.sticky-total{display:none}}

/* 页顶动作按钮（数据壳，110 §2 / §4.4）：H1 之下一枚，不与正文争层级 */
.page-action{margin:0 0 var(--sp-5)}

@media (max-width:639px){
  .calc-card,.result-panel{padding:var(--sp-4)}
  .calc-card .calc-rows input[type=text]{min-width:4.5rem}
}

@media print{
  .calc-card,.chips,.btn,.sticky-total,.page-action,.row-del{display:none}
  .result-panel{border:var(--rule-w) solid var(--rule);background:none}
}

/* C2 拍板同步条款：reduced-motion 下无 transition（41 §D7） */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none !important}
}

@media print{ /* §7.6 */
  .site-head nav,.panel button,.alerts-cta,.download-row,.copy-anchor,.back-top,.skip-link{display:none}
  .table-scroll{overflow:visible;background:none}
  .table-tall{max-height:none;overflow:visible}
  .table-tall thead th{position:static}
  .src-cell a::after{content:none !important}
  .rate-table th[scope=row]{position:static}
  .rate-table thead{display:table-header-group}
  .rate-table tr{break-inside:avoid}
  .rate-table{font-size:10pt}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;color:var(--ink-muted)}
}