@charset "UTF-8";
/* ══════════════════════════════════════════════════════════════
   layout.css —— 页面外壳：进度条、移动顶栏、侧栏、正文容器、
                 封面、面包屑、翻页、页脚、媒体查询、打印
   ══════════════════════════════════════════════════════════════ */

/* ── 顶部进度条 ──────────────────────────────────────────── */
.prog{position:fixed;top:0;left:0;height:3px;background:#B8892B;width:0;z-index:60;}

/* ── 移动端顶栏 ──────────────────────────────────────────── */
.top{display:none;position:sticky;top:0;z-index:50;background:#0E3B38;
  padding:11px 15px;align-items:center;gap:10px;color:#FBFAF7;}
.top .tt{flex:1;font-size:13px;letter-spacing:.04em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.top button{font-family:inherit;font-size:12px;color:#0E3B38;background:#FBFAF7;
  border:0;padding:6px 13px;border-radius:2px;letter-spacing:.06em;cursor:pointer;}

/* ── 整体栅格 ────────────────────────────────────────────── */
.layout{display:flex;max-width:1280px;margin:0 auto;background:#fff;
  box-shadow:0 0 0 1px #E3E5DF;}

/* ── 侧栏 ────────────────────────────────────────────────── */
.side{width:256px;flex:0 0 256px;background:#FBFAF7;border-right:1px solid #E4E6E0;
  position:sticky;top:0;height:100vh;overflow-y:auto;padding:26px 0 50px;}
.side .bd{padding:0 22px 20px;border-bottom:1px solid #E4E6E0;margin-bottom:14px;}
.side .bd a{display:block;}
.side .bd .n{font-family:'Source Han Serif SC','Noto Serif SC','Songti SC',serif;
  font-size:21px;font-weight:800;color:#0E3B38;letter-spacing:.04em;}
.side .bd .s{font-size:11px;color:#6E7B77;margin-top:5px;line-height:1.6;letter-spacing:.03em;}
.side nav a{display:flex;gap:9px;padding:7px 22px;font-size:12.6px;color:#3B4945;
  border-left:2px solid transparent;}
.side nav a:hover{background:#F2F1EA;}
.side nav a.on{background:#F2F1EA;border-left-color:#B8892B;color:#0E3B38;font-weight:700;}
.side nav a i{font-style:normal;
  font-family:'Source Han Serif SC','Noto Serif SC','Songti SC',serif;
  font-size:11px;color:#A8894B;flex:0 0 17px;padding-top:1px;}
/* 目录分段标题（如「V12 对照」） */
.side nav .sep{font-size:9.5px;letter-spacing:.18em;color:#A9B1AC;
  padding:14px 22px 5px;text-transform:uppercase;}
/* 二级条目：只论证的主题，挂在第 17 章的锚点上 */
.side nav a.l2{padding:4px 22px 4px 31px;font-size:11.4px;color:#6E7B77;}
.side nav a.l2 i{font-size:9.5px;color:#C0C7C2;flex:0 0 10px;}
.side nav a.l2 span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* 可折叠的论证索引。
   视觉原则：与普通目录行同构（图标占编号列 + 文字块），只是多一行副标题；
   不用整块底色，避免在窄侧栏里形成一块突兀的色斑。
   引导语分两行：第一行提问，第二行说明去哪找——折行时悬挂缩进对齐。 */
.side nav details.fold{margin:5px 0 0;border-top:1px solid #E8E9E2;}
.side nav details.fold>summary{display:flex;gap:9px;align-items:flex-start;
  padding:8px 22px 9px;cursor:pointer;list-style:none;}
.side nav details.fold>summary::-webkit-details-marker{display:none;}
.side nav details.fold>summary:hover{background:#F6F5EF;}
.side nav details.fold>summary .mk{flex:0 0 17px;font-style:normal;font-size:9px;
  color:#B8892B;line-height:1.85;transition:transform .15s;}
.side nav details.fold[open]>summary .mk{transform:rotate(90deg);}
.side nav details.fold>summary .tx{flex:1;min-width:0;}
.side nav details.fold>summary .t1{display:block;font-size:12px;font-weight:700;
  color:#0E3B38;line-height:1.6;letter-spacing:.01em;}
.side nav details.fold>summary .t2{display:block;font-size:10.8px;color:#93A09B;
  line-height:1.6;margin-top:1px;}
.side nav details.fold>summary .t2 em{font-style:normal;color:#B08A3C;}
/* 展开后的 10 条论证：整体左缩进一级，弱化到「附属清单」的层级 */
.side nav details.fold .l2{padding-left:31px;}
/* 资源中心：目录里唯一一个"取件"入口，给金色竖线，与章节区分 */
.side nav a.x{background:#FBF6E8;border-left-color:#D8C9A6;margin-top:6px;}
.side nav a.x i{color:#8A6B22;font-weight:700;}
.side nav a.x:hover{background:#F6EFD9;}
.side nav a.x.on{background:#F6EFD9;border-left-color:#B8892B;}
.side .foot{padding:16px 22px 0;font-size:10.5px;color:#9AA5A0;line-height:1.7;}
.side .foot a{color:#8A6B22;border-bottom:1px solid #DCD3B8;}
.side .foot a:hover{color:#0E3B38;}

/* 抽屉关闭按钮（只在手机出现） */
.side-x{display:none;position:absolute;top:14px;right:14px;width:36px;height:36px;
  border:1px solid #DCDDD6;border-radius:2px;background:#fff;color:#0E3B38;
  font-family:inherit;font-size:19px;line-height:1;cursor:pointer;}
.side-x:hover{background:#F2F1EA;}

/* ── 正文容器 ────────────────────────────────────────────── */
.main{flex:1;min-width:0;padding:0 clamp(18px,4.4vw,54px) 90px;}
/* 多页站：每页只有一个 .ch，去掉它在长文档里的章间距 */
.main>.ch{padding-top:0;margin-top:0;border-top:0;}

/* ── 封面（仅 index.html） ───────────────────────────────── */
.cover{padding:clamp(38px,6vw,72px) 0 30px;border-bottom:1px solid #E4E6E0;}
.cover .kick{font-size:11.5px;letter-spacing:.34em;color:#B8892B;font-weight:700;}
.cover h1{font-family:'Source Han Serif SC','Noto Serif SC','Songti SC',serif;
  font-weight:900;color:#0E3B38;font-size:clamp(38px,7.4vw,68px);
  line-height:1.02;margin-top:16px;letter-spacing:.02em;}
.cover .sub{font-family:'Source Han Serif SC','Noto Serif SC','Songti SC',serif;
  font-size:clamp(15px,2.2vw,20px);color:#4A5652;margin-top:16px;line-height:1.7;}
.cover .meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px;}
.cover .meta span{font-size:11.5px;color:#4A5652;border:1px solid #DCDDD6;
  padding:4px 10px;border-radius:2px;background:#FBFAF7;}
.cover .meta span b{color:#0E3B38;}

/* ── 三类读者 ────────────────────────────────────────────── */
.howto{margin-top:26px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.howto div{border:1px solid #E4E6E0;border-top:3px solid #0E3B38;padding:14px 15px;background:#FBFAF7;}
.howto h4{font-size:13px;color:#0E3B38;letter-spacing:.05em;margin:0 0 6px;}
.howto p{font-size:12px;color:#4A5652;line-height:1.75;}
.howto em{font-style:normal;color:#B8892B;font-weight:700;}
.howto a{border-bottom:1px solid #DCD3B8;}

/* ── 日期换算器 ──────────────────────────────────────────── */
.clock{margin-top:14px;border:1px solid #E4E6E0;background:#fff;padding:14px 16px;
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.clock .lbl{font-size:12.5px;color:#0E3B38;font-weight:700;}
.clock input{font-family:inherit;font-size:13px;padding:6px 9px;border:1px solid #C9CDBF;
  border-radius:2px;color:#0E3B38;background:#FBFAF7;}
.clock .out{font-size:12px;color:#4A5652;line-height:1.7;}
.clock .out b{color:#B4453C;
  font-family:'Source Han Serif SC','Noto Serif SC','Songti SC',serif;font-size:15px;}
.clock.head{margin:22px 0 0;}
.clock-next{flex:1 1 100%;font-size:11.5px;line-height:1.8;color:#B4453C;
  border-top:1px dashed #E4E6E0;padding-top:8px;}
.clock-next:empty{display:none;}
.clock-next b{color:#8D332B;}
body.lock{overflow:hidden;}

/* ── 目录卡（首页 + 章节页头） ───────────────────────────── */
.ch{padding-top:38px;margin-top:38px;border-top:1px solid #E4E6E0;}
.ch-hd{display:flex;gap:16px;align-items:flex-start;padding-top:22px;}
.ch-no{font-family:'Source Han Serif SC','Noto Serif SC','Songti SC',serif;
  font-size:clamp(30px,5vw,44px);font-weight:900;color:#E7E1CE;line-height:.9;flex:0 0 auto;}
.ch-hd h2{font-family:'Source Han Serif SC','Noto Serif SC','Songti SC',serif;
  font-size:clamp(21px,3.2vw,29px);color:#0E3B38;font-weight:800;line-height:1.25;letter-spacing:.01em;}
.ch-hd .q{font-size:12px;color:#6E7B77;margin-top:6px;letter-spacing:.04em;}

/* 全站目录（13 张卡） */
.toc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:#E4E6E0;
  border:1px solid #E4E6E0;margin-top:22px;}
.toc-grid a{background:#fff;padding:15px 17px;display:block;position:relative;}
/* 目录分段：跨整行，把「执行章 / 对照」分开 */
.toc-grid .toc-sep{grid-column:1/-1;background:#F4F3EC;padding:9px 17px;
  font-size:9.5px;letter-spacing:.2em;color:#8E9893;text-transform:uppercase;}
/* 对照章跨整行：它是索引，不是普通一章 */
.toc-grid a.wide{grid-column:1/-1;}
.toc-grid a.wide .no{display:inline-block;vertical-align:baseline;margin-right:9px;}
.toc-grid a.wide .tt{display:inline-block;vertical-align:baseline;}
/* 资源中心卡：金色底，视觉上不是"一章"，是一件工具 */
.toc-grid a.x{background:#FBF6E8;}
.toc-grid a.x .no{color:#B8892B;}
.toc-grid a.x:hover{background:#F6EFD9;}
.toc-grid a:hover{background:#FBFAF7;}
.toc-grid a:hover .tt{color:#B8892B;}
.toc-grid .no{font-family:'Source Han Serif SC','Noto Serif SC','Songti SC',serif;
  font-size:11.5px;font-weight:800;color:#B8892B;letter-spacing:.1em;}
.toc-grid .tt{font-size:14.2px;font-weight:800;color:#0E3B38;margin-top:3px;line-height:1.4;}
.toc-grid .dd{font-size:11.5px;color:#6E7B77;margin-top:4px;line-height:1.6;}
.toc-grid .ar{position:absolute;right:15px;top:50%;transform:translateY(-50%);
  color:#C6CBBE;font-size:14px;}

/* ── 面包屑 ──────────────────────────────────────────────── */
.crumbs{display:flex;gap:7px;align-items:center;font-size:11.5px;color:#9AA5A0;
  padding:20px 0 0;flex-wrap:wrap;letter-spacing:.02em;}
.crumbs a{color:#6E7B77;border-bottom:1px solid #DCDDD6;}
.crumbs a:hover{color:#B8892B;border-color:#B8892B;}
.crumbs .sep{color:#C6CBBE;}
.crumbs b{color:#0E3B38;font-weight:700;}

/* ── 上一章 / 下一章 ─────────────────────────────────────── */
.pager{display:flex;gap:10px;margin-top:46px;padding-top:22px;border-top:1px solid #E4E6E0;}
.pager a{flex:1 1 0;min-width:0;border:1px solid #E4E6E0;background:#FBFAF7;padding:13px 15px;display:block;}
.pager a:hover{border-color:#0E3B38;background:#fff;}
.pager span{display:block;font-size:10.5px;letter-spacing:.16em;color:#B8892B;font-weight:700;}
.pager b{display:block;font-size:13.2px;color:#0E3B38;margin-top:4px;line-height:1.45;}
.pager a.next{text-align:right;}
.pager a:only-child{text-align:left;}
.pager .ph{flex:1 1 0;}

/* ── 页脚 ────────────────────────────────────────────────── */
.end{margin-top:56px;padding-top:26px;border-top:2px solid #0E3B38;
  font-size:11.5px;color:#9AA5A0;line-height:1.9;}
.end b{color:#0E3B38;}
.end .open{color:#B4453C;}

/* ── 回到顶部 ────────────────────────────────────────────── */
#toTop{display:none;position:fixed;right:15px;bottom:18px;width:42px;height:42px;z-index:40;
  border:0;border-radius:50%;background:#0E3B38;color:#FBFAF7;font-size:17px;line-height:1;
  box-shadow:0 3px 12px rgba(14,59,56,.28);cursor:pointer;opacity:0;pointer-events:none;
  transition:opacity .18s;}
#toTop.show{opacity:1;pointer-events:auto;}

/* ── 平板与手机 ──────────────────────────────────────────── */
@media (max-width:960px){
  #toTop{display:block;}
  body{background:#fff;}
  .layout{display:block;box-shadow:none;}
  .side{display:none;position:fixed;inset:0;width:100%;height:100%;z-index:70;
    border-right:0;padding-top:0;}
  .side.open{display:block;}
  .side .bd{padding-top:22px;}
  .side-x{display:block;}
  body.lock{overflow:hidden;}
  .top{display:flex;}
  .main{padding-left:16px;padding-right:16px;}
  .ch-hd{padding-top:16px;}
  .ch-no{font-size:26px;}
  .toc-grid{grid-template-columns:1fr;}
  .pager{flex-direction:column;}
  .pager a.next{text-align:left;}
  /* 回到顶部按钮在移动端压住正文右下角，且它位于 body 开头
     （改 static 会跑到正文最前面）。窄屏直接不显示：
     顶部已有「目录」按钮，页面本身也不长。 */
  #toTop{display:none;}
}

/* ── 手机（≤ 480px）：把「能看」升级成「好读」 ─────────────── */
@media (max-width:480px){
  /* 1. 正文字号整体抬一档：11px 级的小字在手机上读不动 */
  body{font-size:15.5px;line-height:1.9;}
  .main{padding-left:13px;padding-right:13px;}

  /* 1b. 封面「三种人怎么读」三卡在窄屏并排会把字挤成一条竖线，
         改成单列堆叠，每张卡独占一行。 */
  .cover .howto{grid-template-columns:1fr;gap:9px;}

  /* 2. 所有标注/说明类小字，统一提到 13px 下限 */
  a.lk,a.lk-s,.tip,.tl .ev,.end,.sc .nm,.sc .bar,.pkg .meta,
  .gate .d,.role .d,.risk .d,.aud .d,.cols span,.ges span,
  .top3 .d,.ol li,.pack .b span,.fact span{font-size:13px;}

  /* 3. 触控目标：行内链接与按钮至少 40px 高，符合手指点击 */
  a.lk,a.lk-s{display:inline-block;min-height:40px;line-height:40px;
    padding:0 2px;border-bottom-width:1px;}
  a.lk-s{padding:0 12px;}
  .side-x{width:44px;height:44px;font-size:26px;}
  /* 「下载」「逐页看」这类小方块按钮：撑到 40px 高才点得准 */
  td a.lk-s,.tw a.lk-s{min-height:40px;line-height:38px;padding:0 14px;
    display:inline-flex;align-items:center;}
  /* 表格卡片里的下载按钮占满一行更好按 */
  td a.lk-s{width:100%;justify-content:center;}

  /* 4. 翻页按钮在手机上更实一点 */
  .pager a{padding:15px 14px;}
  .pager b{font-size:14px;}

  /* 5. 长英文/网址不撑破版面 */
  .tw code,.pack code,code{word-break:break-all;}
}

/* ── 打印（每页一份 A4） ─────────────────────────────────── */
@media print{
  body{background:#fff;font-size:9.5pt;}
  .prog,.top,.side,.crumbs,.pager,.filt,.clock,#toTop{display:none !important;}
  .layout{display:block;max-width:none;box-shadow:none;}
  .main{padding:0;}
  .ch{break-before:auto;border-top:0;padding-top:0;margin-top:0;}
  .cover{break-after:page;}
  .ch-hd{break-after:avoid;}
  h3{break-after:avoid;}
  table{min-width:0;font-size:8.4pt;}
  .tw{overflow:visible;border:0;}
  a{color:#0E3B38;}
  .end{break-before:avoid;}
}
