:root{
  --bg:#fdfcfa; --surface:#f7f5f0; --raised:#fff;
  --fg:#2b2b28; --fg-soft:#4a4944; --muted:#8a887f;
  --rule:#e8e5dd; --rule-soft:#f0ede6;
  --accent:#9c6b3c; --link:#2f6f8f;
  --q-bg:#fcf5ea; --q-bar:#d3a061; --q-fg:#5c4526;
  --note-bar:#cfd8d4;
  --code-bg:#f2efe8;
  --shadow:0 1px 2px rgba(60,50,30,.05), 0 6px 20px rgba(60,50,30,.05);
  --measure:42rem;
  --grain:.05;                     /* 纸纹强度 */
  --glow:rgba(156,107,60,.07);     /* 顶部暖光 */
  --card-top:rgba(255,255,255,.75);/* 卡片高光 */
  --scripture:rgba(120,84,46,.55);  /* 背景词颜色 */
  --scripture-op:.42;               /* 整层不透明度（在对比页里逐档试出来的） */
}
@media (prefers-color-scheme:dark){:root{
  --bg:#16161a; --surface:#1d1d22; --raised:#202027;
  --fg:#e4e3df; --fg-soft:#c6c5bf; --muted:#918f88;
  --rule:#2b2b32; --rule-soft:#232329;
  --accent:#c9975f; --link:#83b6d4;
  --q-bg:#221d16; --q-bar:#9c7238; --q-fg:#e0cfb4;
  --note-bar:#3a4442;
  --code-bg:#232329;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 6px 20px rgba(0,0,0,.22);
  --grain:.055;
  --glow:rgba(201,151,95,.09);
  --card-top:rgba(255,255,255,.035);
  --scripture:rgba(214,176,124,.62);
  --scripture-op:.5;                /* 暗底上要略实一点才看得见 */
}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; color:var(--fg);
  /* 顶部一层极淡的暖光，避免大片纯色显得寡淡 */
  background:
    radial-gradient(1100px 420px at 50% -140px, var(--glow), transparent 70%),
    var(--bg);
  background-attachment:fixed;
  font:400 17px/1.85 -apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB",
       "Microsoft YaHei","Source Han Sans SC","Noto Sans CJK SC",sans-serif;
  font-feature-settings:"kern" 1;
  text-rendering:optimizeLegibility;
}

/* 纸纹：固定在视口上的一层噪点，滚动时不跟着动，像纸的底色而非贴图 */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  opacity:var(--grain);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
/* ---------- 动态背景：关键词浮现 ----------
   位置固定不动，只有透明度在变——没有持续运动，周边视觉不会被牵着走。
   横向遮罩再把中央阅读栏压到 10%，正文永远清爽。 */
.scripturebg{
  position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden;
  opacity:var(--scripture-op);
  -webkit-mask-image:linear-gradient(90deg,#000 0,rgba(0,0,0,.1) 32%,rgba(0,0,0,.1) 68%,#000 100%);
          mask-image:linear-gradient(90deg,#000 0,rgba(0,0,0,.1) 32%,rgba(0,0,0,.1) 68%,#000 100%);
}
.wd{
  position:absolute; font-size:var(--fs); font-weight:400;
  color:var(--scripture); opacity:0; white-space:nowrap;
  font-family:"Times New Roman",Georgia,"Noto Serif","Palatino Linotype",serif;
  animation:surface var(--t) ease-in-out var(--d) infinite;
}
.wd.heb{
  direction:rtl;
  font-family:"Arial Hebrew","Noto Sans Hebrew","Noto Serif Hebrew","David","Frank Ruehl CLM","Times New Roman",serif;
}
/* 淡入 → 驻留约 6 秒 → 淡出 → 长时间隐没，一轮里只亮四成 */
@keyframes surface{
  0%{opacity:0; transform:translateY(6px) scale(.98)}
  9%{opacity:1}
  30%{opacity:1}
  44%{opacity:0; transform:translateY(-6px) scale(1.02)}
  100%{opacity:0; transform:translateY(-6px) scale(1.02)}
}

/* 缺希伯来文字体时撤掉那 12 个，剩下 18 个希腊词仍是 R2 前缀，依然均匀 */
.no-heb .wd.heb{display:none}
/* 尊重系统的「减弱动态效果」 */
@media (prefers-reduced-motion:reduce){ .scripturebg{display:none} }

/* 内容要浮在纸纹之上 */
.top,main,footer{position:relative; z-index:1}

/* ---------- 页头：吸顶 + 毛玻璃 ---------- */
.top{
  position:sticky; top:0; z-index:20;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  -webkit-backdrop-filter:saturate(1.6) blur(10px);
  backdrop-filter:saturate(1.6) blur(10px);
  border-bottom:1px solid var(--rule-soft);
}
/* 顶端一道渐隐的细金线，给整页定个调子 */
.top::before{
  content:""; position:absolute; inset:0 0 auto; height:2px;
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
  opacity:.55;
}
.top .inner{max-width:var(--measure); margin:0 auto; padding:.85rem 1.25rem}
.crumb{font-size:.82rem; color:var(--muted); display:flex; flex-wrap:wrap; align-items:center; gap:.1rem}
.crumb a{color:var(--muted); text-decoration:none; border-radius:4px; padding:.1rem .25rem; transition:color .15s,background .15s}
.crumb a:hover{color:var(--accent); background:var(--surface)}
.crumb .sep{margin:0 .15em; opacity:.45}
.crumb span:last-child{color:var(--fg-soft)}

main{max-width:var(--measure); margin:0 auto; padding:0 1.25rem}

/* ---------- 标题 ---------- */
h1{
  font-size:clamp(1.65rem,4.5vw,2.15rem); font-weight:700; line-height:1.35;
  letter-spacing:-.015em; margin:2.4rem 0 .6rem; text-wrap:pretty;
}
h1::after{
  content:"◆"; display:block; width:9rem; margin-top:.75rem;
  font-size:.58rem; line-height:1; color:var(--accent); opacity:.85;
  /* 菱形右侧接一条渐隐细线 */
  background:linear-gradient(90deg, var(--accent), transparent) no-repeat;
  background-size:calc(100% - 1.3rem) 1px;
  background-position:1.3rem center;
}
h2,h3,h4,h5{line-height:1.45; letter-spacing:-.01em; text-wrap:pretty; color:var(--fg)}
h2{font-size:1.3rem; font-weight:650; margin:2.6rem 0 .7rem}
h3{font-size:1.12rem; font-weight:650; margin:2rem 0 .5rem}
h4,h5{font-size:1rem; font-weight:650; margin:1.6rem 0 .4rem; color:var(--fg-soft)}

p{margin:1.05rem 0; color:var(--fg)}
a{color:var(--link); text-decoration-thickness:1px; text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
ul,ol{padding-left:1.5rem; margin:1rem 0}
li{margin:.4rem 0}
li::marker{color:var(--muted)}
strong{font-weight:650}
hr{
  border:0; height:1px; margin:3.2rem 0; position:relative; overflow:visible;
  background:linear-gradient(90deg, transparent, var(--rule) 18%, var(--rule) 82%, transparent);
}
hr::after{
  content:"❦";   /* 叶形花饰 */
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  padding:0 .7rem; background:var(--bg);
  color:var(--accent); font-size:.85rem; opacity:.7;
}
blockquote{
  margin:1.5rem 0; padding:.35rem 0 .35rem 1.15rem;
  border-left:3px solid var(--rule); color:var(--fg-soft);
}

/* ---------- 问题卡片 ----------
   全站 528 处「问题N：」，是查经时真正要用的部分，给它独立的视觉身份。
   作者在不同时期用了橙/蓝/红/棕/黄甚至不上色，这里统一收敛成一种样式。 */
p.q{
  position:relative; margin:1.5rem 0; padding:.95rem 1.15rem .95rem 1.3rem;
  background:var(--q-bg); border-radius:0 8px 8px 0;
  border-left:3px solid var(--q-bar);
  color:var(--q-fg); font-size:.97rem; line-height:1.8;
}
p.q .hl{color:inherit; background:none}  /* 收敛原有的杂色 */
p.q::after{
  content:"?"; position:absolute; right:.7rem; top:.1rem;
  font-size:2.4rem; line-height:1; font-weight:700;
  color:var(--q-bar); opacity:.13; pointer-events:none;
}

/* ---------- 评注段：整段单色但不是问题 ---------- */
p.note{
  padding-left:1rem; border-left:2px solid var(--note-bar);
  color:var(--fg-soft); font-size:.96rem;
}

/* ---------- 图片 ---------- */
figure{margin:2rem 0}
img{max-width:100%; height:auto; display:block; border-radius:8px}
figure img{box-shadow:var(--shadow); background:var(--raised)}
figcaption{font-size:.83rem; color:var(--muted); margin-top:.7rem; text-align:center}

/* ---------- 代码 / 表格 ---------- */
code{background:var(--code-bg); padding:.15em .38em; border-radius:4px;
     font-size:.88em; font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
pre.code{background:var(--code-bg); padding:1rem 1.15rem; border-radius:8px; overflow-x:auto; line-height:1.6}
pre.code code{background:none; padding:0}
.table-wrap{overflow-x:auto; margin:1.8rem 0; border:1px solid var(--rule); border-radius:8px}
table{border-collapse:collapse; width:100%; font-size:.94rem}
td{border-bottom:1px solid var(--rule-soft); padding:.6rem .85rem}
tr:last-child td{border-bottom:0}
.columns{display:flex; gap:1.75rem; flex-wrap:wrap}
.columns .col{flex:1 1 14rem; min-width:0}
.callout{background:var(--surface); border-radius:8px; padding:1.1rem 1.3rem; margin:1.5rem 0}
audio{width:100%; margin:1.2rem 0}
.missing{color:#c0392b; font-size:.9rem}
.embed a{word-break:break-all}

/* ---------- 目录卡片 ---------- */
.children{margin:3.5rem 0 1rem; border-top:1px solid var(--rule); padding-top:2rem}
/* 页面没有正文时（分卷首页），目录紧跟 h1，那条分隔线就是多余的 */
h1 + .children{border-top:0; margin-top:2.4rem; padding-top:0}
.children h2{margin:0 0 1.1rem; font-size:1.05rem; color:var(--muted);
             font-weight:600; letter-spacing:.06em}
.children ul{list-style:none; padding:0; margin:0; display:grid; gap:.5rem}
.children.cards ul{grid-template-columns:repeat(auto-fill,minmax(13rem,1fr))}
.children li{margin:0}
.children a{
  display:flex; align-items:baseline; justify-content:space-between; gap:.75rem;
  padding:.75rem .95rem; border-radius:8px; text-decoration:none; color:var(--fg);
  background:var(--surface); border:1px solid transparent;
  transition:border-color .15s, transform .15s, box-shadow .15s;
}
.children a{
  background-image:linear-gradient(var(--card-top), transparent 60%);
  position:relative; overflow:hidden;
}
/* 悬停时左缘滑出一道色条 */
.children a::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:var(--accent); transform:translateX(-3px); transition:transform .18s;
}
.children a:hover::before{transform:none}
.children a:hover{border-color:var(--rule); transform:translateY(-1px); box-shadow:var(--shadow)}
.children .count{font-size:.78rem; color:var(--muted); white-space:nowrap}

/* ---------- 上一篇 / 下一篇 ---------- */
.pager{
  display:flex; gap:.75rem; margin:3rem 0 0; padding-top:1.75rem;
  border-top:1px solid var(--rule);
}
.pager a{
  flex:1 1 0; min-width:0; padding:.85rem 1rem; border-radius:8px;
  background:var(--surface); text-decoration:none; color:var(--fg);
  border:1px solid transparent; transition:border-color .15s, transform .15s;
}
.pager a:hover{border-color:var(--rule); transform:translateY(-1px)}
.pager .dir{display:block; font-size:.74rem; color:var(--muted); margin-bottom:.2rem}
.pager .t{display:block; font-size:.92rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.pager .next{text-align:right}

/* 页脚只剩一个花饰，作为「读完了」的收尾标记 */
footer{
  max-width:var(--measure); margin:3.5rem auto 3rem; padding:0 1.25rem;
  border-top:1px solid var(--rule-soft); position:relative;
}
/* 骑在分隔线上的小花饰 */
footer::before{
  content:"❦"; position:absolute; top:0; left:50%;
  transform:translate(-50%,-50%); padding:0 .7rem; background:var(--bg);
  color:var(--accent); font-size:.8rem; opacity:.6;
}

/* ---------- Notion 文字色板 ---------- */
.hl-gray{color:#787774}.hl-brown{color:#9f6b53}.hl-orange{color:#d9730d}
.hl-yellow{color:#cb912f}.hl-green{color:#448361}.hl-blue{color:#337ea9}
.hl-purple{color:#9065b0}.hl-pink{color:#c14c8a}.hl-red{color:#d44c47}
.hl-teal{color:#0f7b7b}.hl-default{color:inherit}
[class*="hl-"][class*="_background"]{padding:.05em .28em; border-radius:4px}
.hl-gray_background{background:#f1f1ef}.hl-brown_background{background:#f4eeee}
.hl-orange_background{background:#faebdd}.hl-yellow_background{background:#fbf3db}
.hl-green_background{background:#edf3ec}.hl-blue_background{background:#e7f3f8}
.hl-purple_background{background:#f6f3f9}.hl-pink_background{background:#faf1f5}
.hl-red_background{background:#fdebec}.hl-teal_background{background:#e5f3f3}
@media (prefers-color-scheme:dark){
.hl-gray{color:#9b9b9b}.hl-brown{color:#ba856f}.hl-orange{color:#c77d48}
.hl-yellow{color:#ca9849}.hl-green{color:#529e72}.hl-blue{color:#5e87c9}
.hl-purple{color:#9d68d3}.hl-pink{color:#d15796}.hl-red{color:#df5452}
.hl-teal{color:#4a9e9e}
.hl-gray_background{background:#2f2f2f}.hl-brown_background{background:#4a3228}
.hl-orange_background{background:#5c3b23}.hl-yellow_background{background:#56452f}
.hl-green_background{background:#243d30}.hl-blue_background{background:#143a4e}
.hl-purple_background{background:#3c2d49}.hl-pink_background{background:#4e2c3c}
.hl-red_background{background:#522e2a}.hl-teal_background{background:#1f4444}
}

@media (max-width:34rem){
  body{font-size:16px}
  main,.top .inner,footer{padding-left:1.05rem; padding-right:1.05rem}
  .pager{flex-direction:column}
  .pager .next{text-align:left}
}
@media print{
  .top,.pager,.children{display:none}
  body{font-size:11pt; background:#fff; color:#000}
}