/* ============================================================
   纸上 · 笔记站 —— 样式
   基调与作文站一致：暖旧纸 / 衬线 / 朱红 / 克制的留白
   ============================================================ */

:root{
  --paper:      #F6F1E5;
  --paper-hi:   #FCF9F2;
  --paper-dim:  #EFE8D8;
  --card:       #FEFCF7;
  --ink:        #241E18;
  --ink-2:      #5C5145;
  --ink-3:      #9C9083;
  --rule:       #DCD2BE;
  --rule-soft:  #EAE2D2;
  --seal:       #A63B2A;

  --serif: "Source Han Serif SC","Noto Serif SC","Songti SC",STSong,"SimSun",serif;
  --sans: "PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",system-ui,-apple-system,sans-serif;

  --ease: cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); font-size:15px; line-height:1.75;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a{color:inherit; text-decoration:none}
img{display:block; max-width:100%}

.wrap{max-width:760px; margin:0 auto; padding:0 24px}

/* ── 顶部标识 ── */
.masthead{position:relative; padding:64px 0 0}
.kicker{
  font-size:11px; letter-spacing:.32em; color:var(--ink-3);
  margin:0 0 18px; text-transform:uppercase;
}
.masthead h1{
  margin:0; font-family:var(--serif); font-weight:400;
  font-size:clamp(36px,7vw,54px); letter-spacing:.16em; line-height:1.15;
}
.tagline{
  margin:14px 0 0; font-family:var(--serif); font-size:15px;
  line-height:2; color:var(--ink-2);
}
.hairline{height:1px; background:var(--rule); margin:32px 0 0}

/* ── 分类 ── */
.cats{
  display:flex; flex-wrap:wrap; align-items:baseline;
  gap:8px 22px; padding:24px 0 4px;
}
.cat{
  position:relative; font-size:13.5px; color:var(--ink-3);
  padding:3px 0; letter-spacing:.06em; transition:color .2s var(--ease);
}
.cat::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background:var(--ink); transform:scaleX(0); transform-origin:left;
  transition:transform .3s var(--ease);
}
.cat:hover{color:var(--ink-2)}
.cat.on{color:var(--ink)}
.cat.on::after{transform:scaleX(1)}
.cat .n{font-size:10.5px; color:var(--ink-3); margin-left:4px; vertical-align:super}
.cat-desc{
  font-family:var(--serif); font-size:13px; color:var(--ink-3);
  margin:10px 0 0; min-height:1.7em;
}

/* ── 列表 ── */
.list{padding:20px 0 0}
.item{
  display:block; padding:26px 0 24px; border-top:1px solid var(--rule-soft);
  transition:opacity .2s var(--ease);
}
.item:first-child{border-top:0}
.item:hover .item-title{color:var(--seal)}
.item-title{
  margin:0; font-family:var(--serif); font-weight:400;
  font-size:clamp(19px,2.6vw,23px); line-height:1.55; letter-spacing:.02em;
  transition:color .25s var(--ease);
}
.item-sum{
  margin:14px 0 0; font-size:13.5px; color:var(--ink-2); line-height:1.9;
}
.item-meta{
  margin:14px 0 0; font-size:11.5px; color:var(--ink-3);
  letter-spacing:.08em; display:flex; flex-wrap:wrap; gap:6px 14px;
}
.item-meta .dot{color:var(--rule)}

/* ── 页脚 ── */
.foot{
  margin:56px 0 0; padding:26px 0 72px; border-top:1px solid var(--rule-soft);
  font-size:12.5px; color:var(--ink-3);
  display:flex; flex-wrap:wrap; gap:12px 26px; justify-content:space-between;
}
.foot a{border-bottom:1px solid transparent; transition:all .2s var(--ease)}
.foot a:hover{color:var(--ink); border-color:var(--rule)}

/* ══════════════ 阅读页 ══════════════ */
.bar{
  position:sticky; top:0; z-index:20;
  background:rgba(246,241,229,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--rule-soft);
}
.bar-in{
  max-width:var(--bar-w, 700px); margin:0 auto; padding:12px 24px;
  display:flex; align-items:center; gap:16px;
}
.back{font-size:13px; color:var(--ink-2); white-space:nowrap}
/* 顶栏的返回按钮单独贴着窗口左缘，不跟着版心居中；
   用 .bar .back 限定，免得正文里兜底用的 .back 链接也变成绝对定位 */
.bar .back{
  position:absolute; left:24px; top:0; bottom:0;
  display:flex; align-items:center;
}
.back:hover{color:var(--seal)}
.bar-title{
  flex:1; min-width:0; font-family:var(--serif); font-size:13px;
  color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.progress{
  position:absolute; left:0; bottom:-1px; height:1px; width:0;
  background:var(--seal); transition:width .1s linear;
}

.note{max-width:700px; margin:0 auto; padding:44px 24px 96px}

/* 文章头 */
.note-head{padding:0 0 34px; border-bottom:1px solid var(--rule)}
.note-kicker{
  font-size:11px; letter-spacing:.3em; color:var(--seal);
  margin:0 0 20px;
}
.note-head h1{
  margin:0; font-family:var(--serif); font-weight:400;
  font-size:clamp(26px,4.6vw,36px); line-height:1.45; letter-spacing:.01em;
}
.note-sub{
  margin:0; font-family:var(--serif); color:var(--ink); line-height:1.9;
  font-size:clamp(17px,2.7vw,19.5px); letter-spacing:.01em;
}
.note-head h1 + .note-sub{
  margin:16px 0 0; font-size:15.5px; color:var(--ink-2);
}
.note-byline{margin:22px 0 0; font-size:13px; color:var(--ink-2)}
.note-meta{
  margin:8px 0 0; font-size:11.5px; color:var(--ink-3); letter-spacing:.05em;
  line-height:1.9;
}

/* 提要 */
.insights{padding:38px 0 10px}
.insights h2{
  margin:0 0 16px; font-size:11px; letter-spacing:.3em; font-weight:400;
  color:var(--ink-3);
}
.lead{
  margin:0 0 26px; font-family:var(--serif); font-size:14.5px;
  color:var(--ink-2); line-height:2;
}
.insight-list{list-style:none; margin:0; padding:0; counter-reset:ins}
.insight-list li{
  position:relative; padding:0 0 24px 40px; counter-increment:ins;
}
.insight-list li::before{
  content:counter(ins); position:absolute; left:0; top:1px;
  font-family:var(--serif); font-size:13px; color:var(--seal);
  border:1px solid var(--rule); border-radius:2px;
  width:24px; height:24px; display:grid; place-items:center;
}
.insight-list h3{
  margin:0 0 10px; font-family:var(--serif); font-weight:400;
  font-size:16px; line-height:1.7;
}
.insight-list blockquote{margin:0}
.insight-list blockquote p{
  margin:0; font-family:var(--serif); font-size:14.5px;
  line-height:2; color:var(--ink-2);
  padding-left:14px; border-left:2px solid var(--rule);
}

/* 目录 */
.toc{margin:34px 0 0; padding:24px 0 26px; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule)}
.toc h2{
  margin:0 0 14px; font-size:11px; letter-spacing:.3em; font-weight:400;
  color:var(--ink-3);
}
.toc ol{list-style:none; margin:0; padding:0}
.toc li{margin:0}
.toc a{
  display:flex; align-items:baseline; gap:12px;
  padding:6px 0; font-size:13.5px; color:var(--ink-2);
  transition:color .2s var(--ease);
}
.toc a:hover{color:var(--seal)}
.toc-num{
  font-family:var(--serif); font-size:11.5px; color:var(--ink-3);
  min-width:18px; font-variant-numeric:tabular-nums;
}
.toc-t{flex:1; min-width:0}
.toc-ts{
  font-size:11px; color:var(--ink-3); letter-spacing:.06em;
  font-variant-numeric:tabular-nums;
}

/* 正文 */
.chapter{padding:46px 0 0; scroll-margin-top:76px}
.chapter h2{
  margin:0 0 12px; font-family:var(--serif); font-weight:400;
  font-size:clamp(20px,3.2vw,25px); line-height:1.55; letter-spacing:.02em;
  display:flex; align-items:baseline; gap:14px;
}
.ch-num{
  font-size:12px; color:var(--seal); letter-spacing:.1em;
  border-bottom:1px solid var(--rule); padding-bottom:2px;
  flex:none; font-variant-numeric:tabular-nums;
}
.ch-guide{
  margin:0 0 26px; font-size:12.5px; color:var(--ink-3);
  line-height:1.9; letter-spacing:.02em;
}
.ch-ts{
  color:var(--seal); margin-right:10px;
  font-variant-numeric:tabular-nums;
}
.chapter p{
  margin:0 0 20px; font-family:var(--serif); font-size:16.5px;
  line-height:2.05; color:var(--ink); text-align:justify;
}
.chapter p:last-child{margin-bottom:0}

/* 单篇散文（无小节，如刊载的短文） */
.prose{padding:40px 0 0}
.prose p{
  margin:0 0 20px; font-family:var(--serif); font-size:16.5px;
  line-height:2.05; color:var(--ink); text-align:justify;
}
.prose p:last-child{margin-bottom:0}
/* 长文开头的导读：借散文的排印，但不要那 40px 顶部留白 */
.note-lead{padding:0; margin:28px 0 0}

/* ── 公式：KaTeX 自托管（public/vendor/katex） ── */
.math-disp{
  margin:24px 0; text-align:center;
  overflow-x:auto; overflow-y:hidden;
}
.math-disp .katex-display{margin:0}
.katex{font-size:1.06em}
.chapter .katex, .prose .katex{color:var(--ink)}

/* 参考文献：悬挂缩进，编号在左边单独一列 */
.refs{
  margin:20px 0 0; padding:0; list-style:none;
  font-family:var(--serif); font-size:13.4px; line-height:1.95; color:var(--ink-2);
}
.refs li{margin:0 0 13px; padding-left:34px; text-indent:-34px}
.refs li:last-child{margin-bottom:0}
.sep{
  border:0; height:1px; width:40px; background:var(--rule);
  margin:34px auto 36px;
}

/* 插图 */
.figure{margin:38px 0 0}
.figure img{width:100%; height:auto; border:1px solid var(--rule); border-radius:2px}
.figure figcaption{
  margin:12px 0 0; font-size:12px; color:var(--ink-3); line-height:1.9;
}

/* 记录：考核计划表 —— 原截图缩到版心里字太小，改成真表格 */
.plan{margin:34px 0 0}
.plan-lead{
  margin:0 0 16px; font-family:var(--serif); font-size:13.5px;
  color:var(--ink-2); line-height:1.9;
}
.plan-tb{
  width:100%; border-collapse:collapse; table-layout:fixed;
  font-size:12.5px; line-height:1.8; color:var(--ink-2);
  background:var(--paper-hi);
  border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
}
.plan-tb th, .plan-tb td{
  padding:10px 12px; text-align:left; vertical-align:top;
  border-bottom:1px solid var(--rule-soft);
}
.plan-tb thead th{
  font-weight:400; font-size:11.5px; letter-spacing:.1em;
  color:var(--ink-3); border-bottom:1px solid var(--rule);
}
.plan-tb tbody th{
  font-weight:400; font-family:var(--serif); font-size:12px;
  color:var(--ink); white-space:nowrap;
}
.plan-tb .c-date{width:82px}
.plan-tb .c-out{width:36%}
.plan-tb tbody tr:last-child th, .plan-tb tbody tr:last-child td{border-bottom:0}
.plan-tb p{margin:0}
.plan-tb p + p{margin-top:5px}
/* 原件的 1./2./3. 保留，但做成悬挂缩进，不当成项目符号列表 */
.plan-tb .li{padding-left:1.15em; text-indent:-1.15em}
.plan-tb .soft{color:var(--ink-3); font-size:12px}
.plan-src{margin:12px 0 0; font-size:12px; color:var(--ink-3)}
.plan-src a{border-bottom:1px solid var(--rule); padding-bottom:1px}
.plan-src a:hover{color:var(--seal); border-color:var(--seal)}

/* 教程：阶段 + 步骤 + 公式卡 —— 思维导图改写成能照着做的操作手册 */
.guide{margin:46px 0 0}
.g-lead{
  margin:36px 0 0; padding:16px 0 16px 18px; border-left:2px solid var(--seal);
  font-family:var(--serif); font-size:15.5px; line-height:2; color:var(--ink-2);
}
.g-lead b{color:var(--ink); font-weight:600}

.g-stage{position:relative; margin:0 0 66px; scroll-margin-top:96px}
.g-stage:last-child{margin-bottom:0}
.g-head{
  display:flex; align-items:baseline; flex-wrap:wrap; gap:10px 12px;
  padding-bottom:13px; border-bottom:1px solid var(--rule);
}
.g-n{
  font-family:var(--serif); font-size:29px; line-height:1;
  color:var(--seal); opacity:.45; letter-spacing:-.01em;
}
.g-head h2{
  margin:0; font-family:var(--serif); font-size:23px; font-weight:600;
  letter-spacing:.04em;
}
.g-goal{
  flex:1 1 100%; margin:2px 0 0;
  font-size:13px; color:var(--ink-3); letter-spacing:.02em;
}

/* 分支导图：白色底板，整张按版心缩放到全部可见，不横滑 */
.g-map{margin:22px 0 34px}
.g-map-box{
  padding:12px;
  background:#fff; border:1px solid var(--rule);
}
.g-map-box img{display:block; width:100%; max-width:100%; height:auto; margin:0 auto}
.g-map figcaption{
  display:block; margin:9px 0 0;
  font-size:12.5px; color:var(--ink-3); line-height:1.8;
}

/* 步骤：左侧一条竖线串起编号圆点 */
.g-steps{position:relative; padding-left:38px; margin:24px 0 0}
.g-steps::before{
  content:""; position:absolute; left:12px; top:7px; bottom:16px; width:1px;
  background:linear-gradient(180deg, var(--rule) 0%, var(--rule) 70%, rgba(234,226,210,.1) 100%);
}
.g-step{position:relative; margin:0 0 30px}
.g-step:last-child{margin-bottom:0}
.g-step::before{
  content:attr(data-n); position:absolute; left:-38px; top:0;
  width:25px; height:25px; border:1px solid var(--seal); border-radius:50%;
  background:var(--paper); color:var(--seal);
  font-size:11.5px; line-height:23px; text-align:center;
}
.g-step h3{
  margin:0 0 9px; font-family:var(--serif); font-size:17px; font-weight:600;
  line-height:1.6;
}
.g-step p{
  margin:0 0 13px; font-family:var(--serif); font-size:15.8px;
  line-height:2.02; color:var(--ink); text-align:justify;
}
.g-step p:last-child{margin-bottom:0}

/* 小标题：底段用短线起头 */
.g-sub{
  display:flex; align-items:baseline; gap:11px;
  margin:40px 0 20px; font-family:var(--serif); font-size:18.5px;
  font-weight:600; letter-spacing:.03em;
}
.g-sub::before{
  content:""; flex:none; width:16px; height:1px; background:var(--seal);
  transform:translateY(-4px);
}
.g-say{
  margin:-4px 0 20px; font-size:13.5px; color:var(--ink-3); letter-spacing:.02em;
}

/* 三种块：一行三格 */
.pieces{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:0 0 6px}
.piece{border-top:2px solid var(--seal); padding-top:12px}
.piece b{display:block; font-family:var(--serif); font-size:16px; font-weight:600}
.piece i{display:block; margin-top:5px; font-size:12.8px; color:var(--ink-2); font-style:normal; line-height:1.8}

/* 公式卡 */
.fxs{display:grid; gap:16px}
.fx{border:1px solid var(--rule); background:var(--card); padding:18px 20px 17px}
.fx-top{display:flex; align-items:baseline; gap:10px; margin-bottom:13px}
.fx-id{font-size:11px; letter-spacing:.16em; color:var(--seal)}
.fx-top h3{margin:0; font-family:var(--serif); font-size:16.5px; font-weight:600}
.fx-mv{
  margin:0; font-family:var(--serif); font-size:25px; line-height:1.55;
  letter-spacing:.16em; color:var(--ink);
}
.fx-seq{
  margin:0; padding:0; list-style:none;
  display:flex; flex-wrap:wrap; align-items:center; gap:7px 0;
  font-family:var(--serif); font-size:15.5px; line-height:1.7;
}
.fx-seq li + li::before{
  content:"→"; margin:0 9px; color:var(--ink-3); font-family:var(--sans); font-size:11px;
}
.fx-use{margin:13px 0 0; font-size:13.3px; color:var(--ink-2); line-height:1.9}
.fx-use b{color:var(--ink); font-weight:600}

/* 情况卡：三层用，左细线 + 情况标 + 步骤 + 去向 */
.cs{margin:0 0 22px; padding-left:16px; border-left:1px solid var(--rule)}
.cs:last-child{margin-bottom:0}
.cs-tag{
  display:inline-block; padding:1px 7px; border-radius:2px;
  border:1px solid rgba(166,59,42,.32); color:var(--seal);
  font-size:11px; letter-spacing:.1em;
}
.cs-name{margin:9px 0 10px; font-family:var(--serif); font-size:16px; font-weight:600}
.cs-do{
  margin:0 0 10px; padding:0; list-style:none;
  font-family:var(--serif); font-size:15.5px; line-height:1.95; color:var(--ink);
}
.cs-do li{margin:0 0 3px; text-indent:-.1em}
.cs-out{margin:0; font-size:13.3px; color:var(--ink-2); line-height:1.9}
.cs-out b{color:var(--seal); font-weight:600}
.cs-warn{
  margin:4px 0 0; padding:12px 14px; border:1px dashed var(--rule);
  font-size:13.3px; color:var(--ink-2); line-height:1.9;
}
.cs-warn b{color:var(--seal); font-weight:600}

/* 原则：导图上那三条"目标是……"的批注 */
.principle{
  margin:0 0 20px; padding:11px 0 11px 15px; border-left:2px solid var(--seal);
  background:var(--paper-dim);
  font-family:var(--serif); font-size:15.5px; line-height:1.95; color:var(--ink);
}

.g-tip{
  margin:20px 0 0; padding:13px 16px; background:var(--paper-dim);
  border-left:2px solid var(--seal);
  font-size:13.5px; color:var(--ink-2); line-height:1.95;
}
.g-tip b{color:var(--ink); font-weight:600}

/* 条目：不加符号，用短横起头 */
.g-ul{
  margin:0; padding:0; list-style:none;
  font-family:var(--serif); font-size:15.6px; line-height:2.02; color:var(--ink);
}
.g-ul li{position:relative; padding-left:18px; margin:0 0 2px}
.g-ul li::before{
  content:""; position:absolute; left:0; top:1.02em; width:7px; height:1px;
  background:var(--seal); opacity:.55;
}

/* 单独一行结论：「并入情况二处理」那种去处 */
.g-out{margin:14px 0 0; font-size:13.3px; color:var(--ink-2); line-height:1.9}
.g-out b{color:var(--seal); font-weight:600}

/* 很高的导图也不再裁切/滚动，一律整张显示 */

/* 记录：周记时间线 —— 每一段时间一个节点，左侧一条渐隐的竖线 */
.timeline{position:relative; margin:46px 0 0; padding-left:30px}
.timeline::before{
  content:""; position:absolute; left:4px; top:9px; bottom:12px; width:1px;
  background:linear-gradient(180deg, var(--rule) 0%, var(--rule) 45%, rgba(234,226,210,.15) 100%);
}
.wk{position:relative; margin:0 0 52px}
.wk:last-child{margin-bottom:0}
.wk::before{
  content:""; position:absolute; left:-30px; top:7px; width:9px; height:9px;
  border-radius:50%; background:var(--paper); border:1px solid var(--seal);
}
.wk-head{
  display:flex; align-items:baseline; gap:13px;
  margin:0 0 20px; padding:0 0 12px;
}
.wk-head::after{
  content:""; flex:1; height:1px;
  background:linear-gradient(90deg, var(--rule) 0%, rgba(220,210,190,0) 100%);
}
.wk-n{
  flex:none; font-size:11px; letter-spacing:.16em; color:var(--seal);
  font-variant-numeric:tabular-nums;
}
.wk-date{
  flex:none; margin:0; font-family:var(--serif); font-weight:400;
  font-size:clamp(18px,2.8vw,21px); letter-spacing:.03em; color:var(--ink);
}
.wk-dash{color:var(--ink-3); margin:0 3px; font-style:normal}

.wk p{
  margin:0 0 18px; font-family:var(--serif); font-size:16px;
  line-height:2.05; color:var(--ink); text-align:justify;
}
.wk p:last-child{margin-bottom:0}
.wk p.sub{
  padding-left:16px; border-left:1px solid var(--rule-soft);
  font-size:15px; color:var(--ink-2);
}
.wk p.num .pn{
  color:var(--seal); font-size:11px; letter-spacing:.06em;
  margin-right:6px; vertical-align:2px;
}
.wk-sub{
  margin:26px 0 14px; font-family:var(--serif); font-weight:400;
  font-size:15.5px; line-height:1.7; color:var(--ink);
  display:flex; align-items:baseline; gap:9px;
}
.wk-sub-n{
  flex:none; font-size:11.5px; color:var(--seal); border:1px solid var(--rule);
  border-radius:2px; padding:0 5px; line-height:1.65;
  font-variant-numeric:tabular-nums;
}
.stack{margin:0 0 18px}
.stack p{margin:0 0 9px; font-size:15px; line-height:1.9}
.stack p:last-child{margin-bottom:0}
.stack p.sub{
  padding-left:14px; border-left:1px solid var(--rule-soft); color:var(--ink-2);
}

/* 回到顶部 */
.totop{
  display:block; margin:44px auto 0; padding:9px 22px;
  border:1px solid var(--rule); border-radius:2px;
  font-size:12.5px; color:var(--ink-2); background:none; cursor:pointer;
  transition:all .22s var(--ease); font-family:var(--serif);
}
.totop:hover{background:var(--paper-dim); border-color:var(--ink-3); color:var(--ink)}

/* 顶栏变窄之后，返回按钮会压到标题上，给标题让出左边一截 */
@media (max-width:880px){
  .bar-in{padding-left:78px}
}

/* 打印 */
@media print{
  .bar,.totop,.foot{display:none}
  body{background:#fff}
  .chapter{break-inside:avoid-page}
}

@media (max-width:560px){
  .wrap{padding:0 20px}
  .masthead{padding-top:44px}
  .note{padding:32px 20px 80px}
  .chapter p{font-size:16px; line-height:2}
  .prose p{font-size:16px; line-height:2}
  /* 时间线在窄屏去掉竖线与节点，省出阅读宽度 */
  .timeline{padding-left:0; margin-top:34px}
  .timeline::before, .wk::before{display:none}
  .wk{margin-bottom:40px}
  .wk-head{gap:10px}
  .wk p{font-size:15.5px; line-height:1.95}
  /* 三列表格在窄屏挤成一团，改成每行一块：日期当小标题，内容与产出依次往下排 */
  .plan-tb, .plan-tb tbody, .plan-tb tr, .plan-tb th, .plan-tb td{
    display:block; width:auto; table-layout:auto;
  }
  .plan-tb{border:0; background:transparent; font-size:14.5px; line-height:1.95}
  .plan-tb thead{display:none}
  .plan-tb tr{
    border-top:1px solid var(--rule); padding:16px 0 4px;
  }
  .plan-tb tbody th.c-date{
    padding:0 0 8px; font-size:13px; letter-spacing:.06em; color:var(--ink);
  }
  .plan-tb td{border:0; padding:0 0 10px}
  .plan-tb .c-out{color:var(--ink-3); font-size:13px}
  /* 教程页在窄屏收窄编号与留白 */
  .guide{margin-top:34px}
  .g-lead{font-size:15px; padding-left:14px}
  .g-stage{margin-bottom:48px}
  .g-n{font-size:25px}
  .g-head h2{font-size:20px}
  .g-steps{padding-left:31px}
  .g-step::before{left:-31px; width:22px; height:22px; line-height:20px; font-size:11px}
  .g-step h3{font-size:16px}
  .g-step p{font-size:15.5px; line-height:1.95}
  .pieces{grid-template-columns:1fr; gap:12px}
  .fx{padding:15px 16px}
  .fx-mv{font-size:21px; letter-spacing:.12em}
  .fx-seq{font-size:14.5px}
  .g-map-box{padding:8px}
  .g-sub{font-size:17px; margin-top:32px}
  .toc-ts{display:none}
}

/* ════════════════════════════════════════════════════════════
   PDF 原文阅读（note.js 的 initPdf 生成这段 DOM）
   纸感不变：PDF 页面本身是白纸，外面仍是暖纸底 + 细边框
   ════════════════════════════════════════════════════════════ */
.pdf-bar{
  position:sticky; top:var(--bar-h,46px); z-index:15;
  display:flex; align-items:center; flex-wrap:wrap; gap:8px;
  margin:24px 0 14px; padding:9px 10px;
  background:rgba(246,241,229,.94); backdrop-filter:blur(8px);
  border:1px solid var(--rule); border-radius:3px;
}
.pdf-btn{
  appearance:none; border:1px solid var(--rule); border-radius:2px; background:var(--card);
  color:var(--ink-2); font-family:var(--sans); font-size:13px; line-height:1;
  padding:8px 12px; cursor:pointer; transition:border-color .2s var(--ease), color .2s var(--ease);
}
.pdf-btn:hover{border-color:var(--seal); color:var(--seal)}
.pdf-btn:active{transform:translateY(1px)}
.pdf-pos{
  display:flex; align-items:center; gap:5px;
  font-size:13px; color:var(--ink-2); font-variant-numeric:tabular-nums;
}
.pdf-pos em{font-style:normal; color:var(--ink-3)}
.pdf-input{
  width:46px; padding:7px 6px; text-align:center;
  font-family:var(--sans); font-size:13px; color:var(--ink);
  background:var(--paper-hi); border:1px solid var(--rule); border-radius:2px;
  font-variant-numeric:tabular-nums;
}
.pdf-input:focus{outline:none; border-color:var(--seal)}
.pdf-dl{margin-left:auto}
.pdf-stage{overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:4px}
.pdf-stack{margin:0 auto}
.pdf-page{
  margin:0 0 16px; background:#fff;
  border:1px solid var(--rule-soft);
  box-shadow:0 1px 2px rgba(36,30,24,.06), 0 10px 24px -14px rgba(36,30,24,.22);
}
.pdf-page canvas{display:block; width:100%; height:auto}
.pdf-page.is-err{min-height:140px; background:var(--paper-dim)}
.pdf-err{padding:16px 2px; font-size:13.5px; color:var(--ink-2); line-height:1.8}
.pdf-err a{color:var(--seal); text-decoration:underline}

@media (max-width:640px){
  .pdf-bar{gap:6px; padding:8px; margin-top:20px}
  .pdf-btn{padding:8px 10px; font-size:12.5px}
  .pdf-dl{margin-left:0}
  .pdf-page{margin-bottom:12px}
}

/* ── PDF 笔记：正文介绍 + 附件卡片 ────────────────────────── */
.pdf-intro{margin:26px 0 0}
.pdf-intro p{margin:0 0 1.1em; font-size:16px; line-height:1.95; color:var(--ink)}
.pdf-intro p:last-child{margin-bottom:0}

.att{
  display:flex; align-items:center; gap:14px; width:100%;
  margin:26px 0 0; padding:14px 16px;
  background:var(--card); border:1px solid var(--rule); border-radius:3px;
  font-family:var(--sans); text-align:left; cursor:pointer;
  transition:border-color .22s var(--ease), box-shadow .22s var(--ease), transform .22s var(--ease);
}
.att:hover{
  border-color:var(--seal);
  box-shadow:0 2px 3px rgba(36,30,24,.05), 0 12px 26px -16px rgba(36,30,24,.28);
}
.att:active{transform:translateY(1px)}
.att-ico{
  flex:none; width:44px; height:52px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--rule); border-radius:2px; background:var(--paper-hi);
  font-family:var(--sans); font-size:10.5px; letter-spacing:.14em; color:var(--seal);
  position:relative;
}
.att-ico::after{
  content:""; position:absolute; top:-1px; right:-1px;
  border-width:0 9px 9px 0; border-style:solid;
  border-color:transparent var(--paper) transparent transparent;
  box-shadow:-1px 1px 0 var(--rule);
}
.att-main{flex:1; min-width:0; display:flex; flex-direction:column; gap:5px}
.att-name{
  font-size:14.5px; color:var(--ink); line-height:1.45;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; word-break:break-word;
}
.att-meta{font-size:11.5px; letter-spacing:.04em; color:var(--ink-3)}
.att-act{
  flex:none; font-size:12.5px; color:var(--seal);
  border:1px solid var(--rule); border-radius:2px; padding:6px 12px;
  transition:background .2s var(--ease), border-color .2s var(--ease);
}
.att:hover .att-act{border-color:var(--seal); background:var(--paper-hi)}
.att.is-open .att-act{color:var(--ink-2); border-color:var(--rule)}

.pdf-viewer{margin:8px 0 0}
.pdf-viewer[hidden]{display:none}

@media (max-width:640px){
  .pdf-intro p{font-size:15.5px; line-height:1.95}
  .att{gap:11px; padding:12px 13px}
  .att-ico{width:38px; height:46px; font-size:9.5px}
  .att-name{font-size:13.5px}
  .att-act{padding:6px 9px; font-size:12px}
}

/* ════════════════════════════════════════════════════════════
   专业 / 工作 —— docx 复刻的长文档
   桌面：正文 + 右侧脚注栏（sticky，随阅读高亮）
   移动：脚注栏收起，点角标弹底部抽屉
   ════════════════════════════════════════════════════════════ */
.note-pro{max-width:700px}
.pro-cols{margin:30px 0 0}
.pro-main{min-width:0}

/* 正文块（由 docx2article.py 生成，类名以 d 开头） */
.note-pro .dh{
  font-family:var(--serif); font-weight:700; line-height:1.4;
  margin:46px 0 14px; color:var(--ink);
  scroll-margin-top:calc(var(--bar-h,48px) + 16px);
}
.note-pro h2.dh{font-size:30px; letter-spacing:.01em; margin-top:56px}
.note-pro h3.dh{font-size:23px; margin-top:40px}
.note-pro h4.dh{font-size:19px; margin-top:32px}
.note-pro h5.dh{font-size:16.5px; margin-top:26px; color:var(--ink-2)}
.note-pro .dp{margin:0 0 .78em; line-height:1.95; font-size:16px; color:var(--ink)}
.note-pro .dp:empty{display:none}
.note-pro .dtab{display:inline-block; width:1.6em}
.note-pro .dlink{color:var(--seal); text-decoration:underline; text-underline-offset:2px}
.note-pro .dformula{
  display:inline-block; margin:.15em 0; padding:2px 8px;
  background:var(--paper-dim); border-radius:2px;
  font-family:"Cambria Math",Georgia,serif; font-size:15px;
  white-space:pre-wrap;
}

/* 自动编号（保留原编号样式：一、 / 1. / • ） */
.note-pro .dli{display:flex; gap:.55em; margin:.22em 0; line-height:1.95; font-size:16px}
.note-pro .dli-1{padding-left:1.5em}
.note-pro .dli-2{padding-left:3em}
.note-pro .dli-3{padding-left:4.5em}
.note-pro .dli-4{padding-left:6em}
.note-pro .dli-5{padding-left:7.5em}
.note-pro .dli-mk{flex:none; color:var(--ink-3); font-variant-numeric:tabular-nums}
.note-pro .dli-bd{min-width:0}

/* 表格 */
.dtw{overflow-x:auto; margin:18px 0 24px}
.dt{
  width:100%; border-collapse:collapse; table-layout:fixed;
  font-size:13px; line-height:1.75; color:var(--ink-2);
  background:var(--paper-hi);
  border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
}
.dt td{padding:8px 10px; vertical-align:top; border-bottom:1px solid var(--rule-soft)}
.dt tr:last-child td{border-bottom:0}
.dt td p{margin:0}
.dt td p + p{margin-top:5px}
.dt .dp{font-size:13px; line-height:1.75}
.dt .dli{font-size:13px; line-height:1.75; margin:.1em 0}

/* 目录：两级 */
.toc .toc-sub{list-style:none; margin:6px 0 0; padding:0}
.toc .toc-sub li{margin:0}
.toc .toc-sub a{
  display:block; padding:3px 0 3px 2.4em; font-size:12.5px; color:var(--ink-3);
  border-bottom:0;
}
.toc .toc-sub a:hover{color:var(--seal)}

/* ── 左侧固定标签（导航 / 注释） ── */
.side-tabs{
  position:fixed; left:0; top:50%; transform:translateY(-50%);
  z-index:52; display:flex; flex-direction:column; gap:6px;
}
.side-tab{
  writing-mode:vertical-rl; text-orientation:upright;
  padding:13px 7px; font-family:var(--sans); font-size:11.5px; letter-spacing:.26em;
  color:var(--ink-3); background:var(--paper-hi);
  border:1px solid var(--rule); border-left:0;
  border-radius:0 9px 9px 0; cursor:pointer;
  transition:color .2s var(--ease), border-color .2s var(--ease), background .2s var(--ease);
}
.side-tab:hover{color:var(--ink); background:var(--card)}
.side-tab.is-on{
  color:var(--seal); border-color:var(--seal); background:var(--card);
  box-shadow:2px 3px 12px -8px rgba(36,30,24,.3);
}
.side-tab[data-panel="note"]{display:none}
@media (min-width:1080px){
  .side-tab[data-panel="note"]{display:block}
}

/* ── 导航面板（可收起） ── */
.nav-panel{
  position:fixed; left:36px; top:72px; bottom:26px; width:290px; z-index:51;
  display:flex; flex-direction:column;
  background:rgba(252,249,242,.86);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  backdrop-filter:blur(18px) saturate(1.4);
  border:1px solid rgba(255,255,255,.5);
  border-radius:12px;
  box-shadow:0 4px 16px rgba(36,30,24,.08), 0 28px 60px -30px rgba(36,30,24,.4);
  overflow:hidden;
}
.nav-panel[hidden]{display:none}
.nav-hd{
  display:flex; align-items:center; gap:10px;
  padding:13px 16px; border-bottom:1px solid var(--rule-soft);
  font-family:var(--sans); font-size:10.5px; letter-spacing:.26em; color:var(--ink-3);
}
.nav-x{
  margin-left:auto; width:22px; height:22px;
  border:1px solid rgba(36,30,24,.16); border-radius:50%;
  background:rgba(255,255,255,.5); color:var(--ink-2);
  font-family:var(--sans); font-size:11px; line-height:1; cursor:pointer;
}
.nav-x:hover{border-color:var(--seal); color:var(--seal)}
.nav-list{
  flex:1; overflow-y:auto; overscroll-behavior:contain;
  padding:8px 0 14px; scrollbar-width:thin;
}
.nav-list::-webkit-scrollbar{width:5px}
.nav-list::-webkit-scrollbar-thumb{background:var(--rule); border-radius:3px}
.nav-a{
  display:block; padding:6px 18px 6px 16px;
  font-family:var(--sans); font-size:13px; line-height:1.55; color:var(--ink-2);
  border-left:2px solid transparent;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  transition:color .18s var(--ease), border-color .18s var(--ease);
}
.nav-a:hover{color:var(--seal)}
.nav-a.lv1{padding-left:30px; font-size:12.5px; color:var(--ink-3)}
.nav-a.lv2{padding-left:44px; font-size:12px; color:var(--ink-3)}
.nav-a.lv3{padding-left:58px; font-size:11.5px; color:var(--ink-3)}
.nav-a.is-cur{
  color:var(--seal); border-left-color:var(--seal);
  background:rgba(166,59,42,.05);
}
@media (max-width:720px){
  .nav-panel{left:8px; right:8px; width:auto; top:64px; bottom:16px}
  .side-tabs{left:0}
  .side-tab{padding:11px 6px; font-size:11px; letter-spacing:.2em}
}

/* ── 标题层级数字：淡灰、花体（衬线斜体），让读者一眼看出几级 ── */
.note-pro .dh::before{
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic; font-weight:400;
  color:#D5CAB6;
  margin-right:.3em; letter-spacing:.02em;
}
.note-pro h2.dh::before{content:"1"; font-size:1.5em}
.note-pro h3.dh::before{content:"2"; font-size:1.36em}
.note-pro h4.dh::before{content:"3"; font-size:1.26em}
.note-pro h5.dh::before{content:"4"; font-size:1.18em}

/* ── 表格：字号统一、取较小的一档（docx 里的 run 级字号一律压平） ── */
.dt, .dt td, .dt td p, .dt td span, .dt td .dli, .dt td .dli-mk{
  font-size:12.5px !important; line-height:1.72 !important;
}
.dt td{padding:7px 9px}

/* ── 注释栏本体：对照式（每条注释对齐自己的角标） ── */
.fn-rail{display:none}
@media (min-width:1080px){
  .note-pro.rail-on{max-width:1080px}
  .note-pro.rail-on .pro-cols{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:40px; align-items:start}
  .note-pro.rail-off{max-width:700px}
  .note-pro.rail-on .fn-rail{
    display:block; position:relative; min-height:100%;
    border-left:1px solid var(--rule-soft);
  }
  .fn-rail-in{position:relative; width:100%}
}
.fn-item{
  position:absolute; left:0; width:100%;
  padding-left:18px;
  font-family:"Kaiti SC",KaiTi,STKaiti,"Songti SC",serif;
  font-size:16px; line-height:1.85; color:var(--ink-2);
  cursor:pointer;
}
.fn-item .fn-n{
  color:var(--seal); margin-right:.25em;
  font-family:var(--sans); font-size:13px; font-weight:600;
}
.fn-item.is-flash{
  animation:fnFlash 1.1s var(--ease);
}
@keyframes fnFlash{
  0%{background:rgba(166,59,42,.16)}
  100%{background:transparent}
}

/* ── 角标：[N] 全部在右上角，做成圆润的小胶囊 ── */
.fnref{
  display:inline-block; vertical-align:super;
  margin:0 1px; padding:1px 5px 2px;
  font-family:var(--sans); font-size:10.5px; font-weight:600; line-height:1.25;
  color:var(--seal); background:rgba(166,59,42,.10);
  border:1px solid rgba(166,59,42,.26); border-radius:999px;
  cursor:pointer; font-variant-numeric:tabular-nums;
  transition:background .16s var(--ease), border-color .16s var(--ease), transform .16s var(--ease);
}
.fnref:hover{background:rgba(166,59,42,.18); border-color:var(--seal)}
.fnref.is-on{background:var(--seal); border-color:var(--seal); color:var(--paper)}
.fnref:focus-visible{outline:2px solid var(--seal); outline-offset:2px}
/* 触发范围：胶囊周围再放大一点点，够手指点，又不至于误弹 */
.fnref{position:relative}
.fnref::after{content:""; position:absolute; inset:-6px -5px}

/* ── 悬浮框：液态玻璃 ── */
.fn-pop{
  position:absolute; z-index:60;
  max-width:340px;
  padding:13px 15px 15px;
  background:rgba(252,249,242,.72);
  -webkit-backdrop-filter:blur(16px) saturate(1.5);
  backdrop-filter:blur(16px) saturate(1.5);
  border:1px solid rgba(255,255,255,.55);
  border-radius:10px;
  box-shadow:0 4px 14px rgba(36,30,24,.08), 0 22px 46px -22px rgba(36,30,24,.34);
  opacity:0; transform:translateY(6px) scale(.98); pointer-events:none;
  transition:opacity .2s var(--ease), transform .2s var(--ease);
}
.fn-pop.is-on{opacity:1; transform:none; pointer-events:auto}
.fn-pop-hd{display:flex; align-items:center; gap:10px; margin-bottom:7px}
.fn-pop-n{
  font-family:var(--sans); font-size:10.5px; letter-spacing:.14em;
  color:var(--seal); font-weight:600;
}
.fn-pop-x{
  display:none;
  margin-left:auto; width:22px; height:22px;
  border:1px solid rgba(36,30,24,.16); border-radius:50%;
  background:rgba(255,255,255,.5); color:var(--ink-2);
  font-family:var(--sans); font-size:11px; line-height:1; cursor:pointer;
}
.fn-pop.has-x .fn-pop-x{display:inline-flex; align-items:center; justify-content:center}
.fn-pop-x:hover{border-color:var(--seal); color:var(--seal)}
.fn-pop-bd{
  font-family:"Kaiti SC",KaiTi,STKaiti,"Songti SC",serif;
  font-size:15.5px; line-height:1.95; color:var(--ink);
}

/* 整段公式块（docx 里的 OMML 公式，线性表达式，不走 KaTeX） */
.note-pro .dfx-blk{
  margin:18px 0 22px !important; padding:15px 18px;
  background:var(--paper-hi); border:1px solid var(--rule-soft); border-radius:3px;
}
.note-pro .dfx-blk .dformula{
  display:block; background:none; padding:0; margin:0;
  font-size:17px; line-height:2.2; letter-spacing:.02em; white-space:pre-wrap;
}
.note-pro .dfx-blk .dformula + .dformula{margin-top:.6em}

/* ════════════════════════════════════════════════════════════
   站内搜索
   主页：masthead 右上，搜标题 + 摘要 + 正文，结果内联替换列表
   文章页：顶栏内，只搜本文，命中段落面板 + 跳转
   ════════════════════════════════════════════════════════════ */
.search-box{position:relative; display:flex; align-items:center}
.masthead-top{display:flex; align-items:flex-start; justify-content:space-between; gap:16px}
.masthead .search-box{position:static; margin-top:1px}
.search-in{
  width:196px; padding:8px 30px 8px 14px;
  font-family:var(--sans); font-size:13px; color:var(--ink);
  background:var(--paper-hi); border:1px solid var(--rule); border-radius:999px;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.search-in::placeholder{color:var(--ink-3)}
.search-in:focus{
  outline:none; border-color:var(--seal);
  box-shadow:0 2px 10px -6px rgba(166,59,42,.35);
}
.search-in::-webkit-search-cancel-button{display:none}
.search-clr{
  position:absolute; right:8px; width:18px; height:18px;
  border:0; border-radius:50%; background:var(--rule);
  color:var(--paper); font-family:var(--sans); font-size:10px;
  line-height:1; cursor:pointer; padding:0;
}
.search-clr:hover{background:var(--seal)}
.search-box--bar{margin-left:auto}
.search-box--bar .search-in{width:168px; padding-top:6px; padding-bottom:6px; font-size:12.5px}

/* 结果列表（主页） */
.search-res{margin:0 0 8px}
.search-hint{
  margin:26px 0 18px; font-size:12px; letter-spacing:.12em; color:var(--ink-3);
}
.sr-item{
  display:block; padding:20px 0; border-bottom:1px solid var(--rule-soft);
}
.sr-item:first-of-type{padding-top:6px}
.sr-title{
  margin:0 0 8px; font-family:var(--serif); font-weight:600;
  font-size:19px; line-height:1.5; color:var(--ink);
}
.sr-item:hover .sr-title{color:var(--seal)}
.sr-meta{margin:0 0 9px; font-size:11.5px; letter-spacing:.05em; color:var(--ink-3)}
.sr-snip{
  margin:5px 0 0; font-size:13.5px; line-height:1.9; color:var(--ink-2);
  padding-left:12px; border-left:2px solid var(--rule-soft);
}
mark{
  background:rgba(166,59,42,.14); color:var(--seal);
  padding:1px 2px; border-radius:2px;
}

/* 命中段落面板（文章页） */
.search-panel{
  position:fixed; z-index:58;
  left:50%; transform:translateX(-50%);
  top:calc(var(--bar-h,48px) + 8px);
  width:min(var(--bar-w,700px), calc(100vw - 24px));
  max-height:min(58vh, 520px); overflow-y:auto; overscroll-behavior:contain;
  background:rgba(252,249,242,.92);
  -webkit-backdrop-filter:blur(16px) saturate(1.5);
  backdrop-filter:blur(16px) saturate(1.5);
  border:1px solid rgba(255,255,255,.5);
  border-radius:10px;
  box-shadow:0 4px 16px rgba(36,30,24,.08), 0 26px 56px -30px rgba(36,30,24,.42);
}
.search-panel[hidden]{display:none}
.search-panel .search-hint{margin:12px 16px 10px}
.sp-item{
  display:flex; gap:10px; width:100%; text-align:left;
  padding:11px 16px; background:none; border:0;
  border-top:1px solid var(--rule-soft);
  font-family:var(--sans); cursor:pointer;
}
.sp-item:first-of-type{border-top:0}
.sp-item:hover{background:rgba(166,59,42,.06)}
.sp-n{
  flex:none; width:18px; height:18px; margin-top:3px;
  border:1px solid var(--rule); border-radius:50%;
  font-size:10px; color:var(--ink-3);
  display:flex; align-items:center; justify-content:center;
}
.sp-tx{
  flex:1; min-width:0; font-size:13px; line-height:1.85; color:var(--ink-2);
}
.is-hit{
  animation:hitFlash 1.6s var(--ease);
  border-radius:3px;
}
@keyframes hitFlash{
  0%{background:rgba(166,59,42,.18)}
  100%{background:transparent}
}

@media (max-width:720px){
  .masthead-top{flex-direction:column; align-items:stretch; gap:14px}
  .masthead .search-box{margin:0}
  .masthead .search-in{width:100%}
  .search-box--bar .search-in{width:130px}
  .sr-title{font-size:17px}
}

/* inline-block 会继承段落的 text-indent（docx 首行缩进），
   导致胶囊内部被推出 20 多像素、看着「特别宽」。统一归零。 */
.fnref, .dformula, .dtab, .att, .pdf-btn{ text-indent:0 }