/* ============================================================
   官网公共样式 site.css
   范围：index.html 及 pages/ 下所有官网页面。后台请勿引用本文件。
   ============================================================ */
* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --bg:#0a0616; --bg2:#141026; --ink:#e9e4f5; --dim:#a89fc4;
  --violet:#a78bfa; --violet2:#c4b5fd; --cyan:#67e8f9; --gold:#e8c468;
  --line:rgba(167,139,250,.18);
}
html { scroll-behavior:smooth; }
body {
  background:var(--bg); color:var(--ink);
  font-family:"Noto Serif SC","Songti SC","STSong",serif;
  line-height:1.8; overflow-x:hidden;
}

/* ---------- 星空 ---------- */
.stars, .stars2, .stars3 {
  position:fixed; border-radius:50%; pointer-events:none; z-index:0;
}
.stars  { width:1px; height:1px; box-shadow: 120px 80px #fff, 340px 220px #c4b5fd, 560px 40px #fff, 780px 300px #67e8f9, 950px 130px #fff, 80px 480px #a78bfa, 300px 620px #fff, 520px 540px #c4b5fd, 760px 700px #fff, 1050px 520px #67e8f9, 220px 860px #fff, 640px 900px #a78bfa, 900px 820px #fff, 40px 1020px #c4b5fd, 420px 1120px #fff, 820px 1200px #a78bfa; animation:tw 4s infinite; }
.stars2 { width:2px; height:2px; box-shadow: 200px 150px #fff, 500px 60px #c4b5fd, 720px 240px #fff, 1000px 380px #a78bfa, 140px 660px #67e8f9, 480px 760px #fff, 880px 640px #c4b5fd, 160px 1100px #fff, 700px 1050px #67e8f9; animation:tw 6s infinite 1s; }
.stars3 { width:2px; height:2px; box-shadow: 360px 300px #e8c468, 840px 180px #fff, 60px 420px #c4b5fd, 600px 480px #e8c468, 980px 720px #c4b5fd, 260px 940px #e8c468; animation:tw 8s infinite 2s; }
@keyframes tw { 0%,100%{opacity:.25} 50%{opacity:1} }

/* 主体容器：内页左右各留 30px；首页更宽（见下方 body[data-page="home"] 覆盖为 100px） */
.wrap { position:relative; z-index:1;  margin:0 auto; padding:0 30px; }
.wrap #detail-box { padding: 10px 0 0 0;  }

/* ---------- 顶部导航条（内页共用） ---------- */
.topbar {
  position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between;
  padding:16px 28px; border-bottom:1px solid var(--line);
}
.topbar .logo { color:var(--violet2); text-decoration:none; letter-spacing:3px; font-size:16px; }
.topbar .links { display:flex; gap:18px; flex-wrap:wrap; }
.topbar .links a { color:var(--dim); text-decoration:none; font-size:14px; letter-spacing:1px; transition:.25s; }
.topbar .links a:hover, .topbar .links a.active { color:var(--cyan); }

/* ---------- HERO（首页） ---------- */
header { text-align:center; padding:20px 24px 56px; position:relative; display: flex; justify-content: center; align-items: center;}
.hero-eq { color:var(--cyan); font-size:15px; letter-spacing:2px; font-style:italic; opacity:.85; }
.hero-eq img {
  display:block; margin:0 auto; max-width:100px; margin-right: 10px;
}

/* ---------- HERO LOGO：旋转光环 i² = −1 ---------- */
.ring {
  flex:none; width:120px; height:120px; margin:0 36px 0 0; position:relative;
  border:2px solid rgba(167,139,250,.55); border-radius:50%;
  box-shadow:0 0 40px rgba(167,139,250,.35), inset 0 0 30px rgba(103,232,249,.12);
  animation:spin 24s linear infinite;
}
.ring::before {
  content:""; position:absolute; inset:14px; border-radius:50%;
  border:1px dashed rgba(103,232,249,.4); animation:spin 14s linear infinite reverse;
}
.ring::after {
  content:"i² = −1"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  color:var(--cyan); font-size:15px; letter-spacing:1px; font-style:italic;
}
@keyframes spin { to { transform:rotate(360deg); } }
@media (max-width:640px) {
  header { flex-direction:column; }
  .ring { margin:0 0 28px; }
}
h1.slogan {
  font-size:clamp(26px,4.6vw,44px); font-weight:700; letter-spacing:2px;
  background:linear-gradient(120deg,#c4b5fd,#67e8f9 60%,#e8c468);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.sub { color:var(--dim); font-size:clamp(15px,2.2vw,19px); letter-spacing:1px; }
.sub b { color:var(--gold); font-weight:600; }

/* ---------- 分区 ---------- */
section { padding:56px 0; border-top:1px solid var(--line); }
h2 {
  font-size:26px; letter-spacing:4px; margin-bottom:8px; color:var(--violet2);
  display:flex; align-items:baseline; gap:12px;
}
h2 .no { font-size:13px; color:var(--cyan); letter-spacing:2px; font-family:ui-monospace,monospace; }
.sec-desc { color:var(--dim); font-size:14px; margin-bottom:28px; }

/* ---------- 首页面板布局（两行两列：预言|理论 / 著作|盟友） ---------- */
body[data-page="home"] .wrap { min-width: 1080px; padding:0 100px; }
.pw-row { display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-bottom:28px; }
.pw-row .panel { padding: 0 }
.panel {
  display:flex; flex-direction:column; overflow:hidden;
  border:1px solid var(--line); border-radius:14px;
  background:linear-gradient(160deg,rgba(167,139,250,.06),rgba(20,16,38,.55));
}
.panel-hd {
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  padding:15px 22px; border-bottom:1px solid var(--line); background:rgba(167,139,250,.05);
}
.panel-hd h2 { font-size:20px; letter-spacing:3px; margin:0; white-space:nowrap; }
.hd-tag { font-size:11px; letter-spacing:2px; color:var(--cyan); font-family:ui-monospace,monospace; opacity:.75; }

/* ---------- 面板头部：常显搜索框（放大镜内置于输入框，无展开按钮） ---------- */
.panel-hd .hd-tools { flex:none; display:flex; align-items:center; gap:8px; align-self:center; }
.hd-search { display:flex; align-items:center; gap:6px; }
.hd-search input {
  width:180px; padding:5px 12px; font-family:inherit; font-size:13px; letter-spacing:1px; line-height:1.6;
  color:var(--ink); background:rgba(10,6,22,.7);
  border:1px solid var(--line); border-radius:999px; outline:none; transition:.25s;
  -webkit-appearance:none; appearance:none;
}
.hd-search input::placeholder { color:rgba(168,159,196,.6); }
.hd-search input::-webkit-search-cancel-button,
.hd-search input::-webkit-search-decoration { -webkit-appearance:none; display:none; }
/* 聚焦时宽度保持不变（不放大），只做描边/光晕反馈 */
.hd-search input:focus { border-color:rgba(103,232,249,.5); box-shadow:0 0 14px rgba(103,232,249,.14); }
/* 常显搜索框：放大镜固定在输入框左侧内部 */
.hd-search.has-icon { position:relative; }
.hd-search .hd-search-icon {
  position:absolute; left:11px; top:50%; transform:translateY(-50%);
  width:14px; height:14px; color:var(--violet2); pointer-events:none; transition:.25s;
}
.hd-search.has-icon input { padding-left:32px; }
.hd-search.has-icon:focus-within .hd-search-icon { color:var(--cyan); }
@media (max-width:560px) {
  .hd-search input { width:120px; }
}
.panel-bd { flex:1; padding:16px 22px 22px; }

/* ---------- 编号列表 ---------- */
.pw-list { list-style:none; }
.pw-list li { font-size:15px; letter-spacing:1px; line-height:2.1; }
.pw-list li a { color:var(--ink); text-decoration:none; border-bottom:1px solid transparent; transition:.2s; }
.pw-list li a:hover { color:var(--cyan); border-bottom-color:var(--cyan); }
.pw-list .group-item { margin-top:14px; color:var(--violet2); font-size:13.5px; letter-spacing:2px; opacity:.92; }
.pw-list .group-item:first-child { margin-top:0; }
.pw-list .empty-item { color:var(--dim); font-size:13.5px; text-align:center; padding:24px 0; }
/* 列表条目名称后的状态图标：folder.png（已发布修正版）/ pdf.png（待修正）。
   vertical-align:middle 只按西文 x-height 定位（中文没有可用的 x-height，算出来的
   中线偏低约 3px），故再用 relative 把图标抬回中文字身的中线。 */
.pw-list .item-rev {
  display:inline-block; width:18px; height:18px;
  margin-left:7px; vertical-align:middle; position:relative; top:-3px;
  object-fit:contain;
}
/* folder.png 版本：宽度比默认大 2px（原图 64×64 正方形，height:auto 让它等比放大） */
.pw-list .item-rev.is-folder { width:20px; height:auto; }
.scroll-box { max-height:366px; overflow-y:auto; padding-right:8px; }
.scroll-box::-webkit-scrollbar { width:6px; }
.scroll-box::-webkit-scrollbar-thumb { background:rgba(167,139,250,.45); border-radius:3px; }
.scroll-box::-webkit-scrollbar-track { background:rgba(167,139,250,.08); }

/* 面板内的著作封面：固定三列，卡片随面板宽度等比缩小
 * （原先 minmax(320px,1fr) 在面板里只排得下一列，单张封面被拉成约 570px 宽、按 3/4.3 比例算高度会到 800+px，非常高） */
#book-list .books { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:0; }

/* ---------- 详情通用（预言/理论下拉） ---------- */
details {
  border:1px solid var(--line); border-radius:12px; margin-bottom:12px;
  background:linear-gradient(160deg,rgba(167,139,250,.05),rgba(20,16,38,.6));
  overflow:hidden; transition:.3s;
}
details[open] { border-color:rgba(167,139,250,.45); box-shadow:0 0 30px rgba(167,139,250,.08); }
summary {
  cursor:pointer; list-style:none; padding:16px 20px; display:flex; gap:14px; align-items:center;
  user-select:none;
}
summary::-webkit-details-marker { display:none; }
summary .pno { font-family:ui-monospace,monospace; color:var(--cyan); font-size:14px; white-space:nowrap; }
summary .pname { font-size:17px; letter-spacing:1px; flex:1; }
summary .cost { font-size:12px; color:var(--dim); white-space:nowrap; border:1px solid var(--line); border-radius:999px; padding:2px 12px; }
summary .pm { color:var(--violet); font-size:18px; transition:.25s; }
details[open] summary .pm { transform:rotate(45deg); color:var(--gold); }
.pbody { padding:0 20px 18px 20px; color:var(--dim); font-size:14.5px; border-top:1px dashed var(--line); padding-top:14px; margin:0 0 18px; }
.pbody b { color:var(--ink); font-weight:600; }
.pbody a { color:var(--cyan); text-decoration:none; border-bottom:1px dashed var(--cyan); }
.verdict { color:var(--cyan); }

/* ---------- 著作封面：圆角卡片 + 中心光晕（对齐设计稿） ----------
 * 卡片文字尺寸随卡片宽度等比缩放（cqw），因此面板内的小卡与详情页大卡风格一致。 */
.books { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:32px; margin-top:12px; }
.book { display:block; text-decoration:none; perspective:900px; }
.cover {
  container-type:inline-size;
  position:relative; display:flex; flex-direction:column;
  aspect-ratio:3/4.3; border-radius:18px; padding:8.5% 7.5% 9%;
  border:1px solid rgba(255,255,255,.09);
  /* background:
    radial-gradient(96% 60% at 42% 16%, var(--glow) 0%, rgba(0,0,0,0) 74%),
    linear-gradient(165deg,var(--base1) 0%,var(--base2) 100%); */
  box-shadow:0 24px 56px rgba(0,0,0,.6), 0 0 46px var(--aura), inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .4s, box-shadow .4s;
}
/* 书脊：左缘竖向高光条 */
.cover::before {
  content:''; position:absolute; top:0; bottom:0; left:0; width:5.5%; z-index:0;
  background:linear-gradient(90deg, rgba(255,255,255,.20), rgba(255,255,255,0));
  border-radius:18px 0 0 18px;
}
.book:hover .cover {
  transform:translateY(-6px);
  box-shadow:0 34px 70px rgba(0,0,0,.7), 0 0 64px var(--aura), inset 0 1px 0 rgba(255,255,255,.12);
}
.cover .brand, .cover .btitle, .cover .bsub, .cover .poem, .cover .bauthor { position:relative; z-index:1; }
/* 封面图：来自后端 coverUrl，未设置时不渲染（走渐变底） */
.cover .cover-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:18px; z-index:0; }
/* 三本书各自的色系：底色 / 顶部光晕 / 副标题强调色 / 外发光（对齐设计稿） */
.c1 { --base1:#2b5a78; --base2:#081826; --glow:rgba(96,168,200,.55); --accent:#cfe9f5; --aura:rgba(56,160,190,.10); }
.c2 { --base1:#8a5512; --base2:#241403; --glow:rgba(224,158,52,.68); --accent:#f2d9a2; --aura:rgba(200,132,40,.12); }
.c3 { --base1:#5a2fa8; --base2:#180a30; --glow:rgba(158,96,240,.62); --accent:#e0cdfa; --aura:rgba(140,80,230,.14); }
.cover .brand { font-size:11px; font-size:clamp(10px,3.9cqw,12px); letter-spacing:.18em; color:rgba(240,236,252,.88); }
.cover .done {
  position:absolute; top:8.5%; right:7.5%; z-index:1;
  font-size:11px; font-size:clamp(9px,3.5cqw,12px); letter-spacing:.16em;
  color:var(--gold); padding:.32em 1.15em; border-radius:999px;
  border:1px solid rgba(232,196,104,.55); background:rgba(232,196,104,.07);
}
.cover .btitle { margin-top:auto; color:#fff; font-family:"Noto Serif SC","Source Han Serif SC","Songti SC","SimSun",serif; font-size:19px; font-size:clamp(16px,10cqw,31px); font-weight:700; letter-spacing:.14em; line-height:1.5; }
.cover .bsub { margin-top:.5em; font-family:"Noto Serif SC","Source Han Serif SC","Songti SC","SimSun",serif; font-size:12px; font-size:clamp(10px,4.9cqw,15px); letter-spacing:.04em; color:var(--accent); }
.cover .poem { margin-top:1.5em; font-size:11px; font-size:clamp(10.5px,4.3cqw,13px); line-height:2; color:rgba(233,228,245,.62); }
.cover .bauthor { margin-top:1.6em; font-size:11px; font-size:clamp(10.5px,4.3cqw,13px); letter-spacing:.1em; color:rgba(233,228,245,.82); }
.book .actions { margin-top:14px; display:flex; gap:10px; justify-content:center; }
.book .actions a, .book .actions button {
  font-size:13px; color:var(--violet2); text-decoration:none; background:none; cursor:pointer;
  border:1px solid var(--line); border-radius:999px; padding:6px 18px; letter-spacing:1px; transition:.25s;
  font-family:inherit;
}
.book .actions a:hover, .book .actions button:hover { background:rgba(167,139,250,.12); border-color:var(--violet); }

/* ---------- 盟友 / 捐助 ---------- */
.ally { text-align:center; padding:72px 24px; }
.ally p.lead { font-size:19px; letter-spacing:2px; margin-bottom:8px; }
.btn {
  display:inline-block; font-size:18px; letter-spacing:3px; text-decoration:none;
  color:#1a1030; font-weight:700; padding:16px 52px; border-radius:999px; border:none; cursor:pointer;
  background:linear-gradient(120deg,#c4b5fd,#67e8f9); font-family:inherit;
  box-shadow:0 0 44px rgba(167,139,250,.45); transition:.3s;
}
.btn:hover { transform:translateY(-3px); box-shadow:0 6px 60px rgba(103,232,249,.5); }
/* 次级按钮（首页「捐赠记录」）：描边样式，不与主按钮抢视觉 */
.btn--ghost {
  color:var(--violet2); font-weight:400;
  background:rgba(167,139,250,.08); border:1px solid var(--line); box-shadow:none;
}
.btn--ghost:hover { color:var(--cyan); border-color:var(--cyan); box-shadow:none; }
/* 盟友面板按钮组（捐助 + 捐赠记录） */
.ally-actions { display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; }
.ally .note { margin-top:18px; font-size:12.5px; color:var(--dim); letter-spacing:1px; }

/* 盟友改为面板内的居中卡片 */
.panel.ally .panel-bd {
  display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center;
  padding:30px 22px 26px;
}
.panel.ally .lead { font-size:18px; }

/* 盟友文案（首页 #ally-lead / #ally-note）来自后台配置，允许换行：
   pre-line 保留文案里的 \n 原样换行（行内多余空白仍按默认折叠，不出现横向溢出）。 */
#ally-lead, #ally-note { white-space:pre-line; }

/* ---------- 捐助页 ---------- */
.donate-panel { max-width:520px; margin:0 auto; text-align:center; }
.amounts { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin:24px 0 18px; }
.amounts button {
  min-width:110px; padding:14px 10px; font-size:17px; letter-spacing:1px; cursor:pointer;
  color:var(--violet2); background:rgba(167,139,250,.06); border:1px solid var(--line);
  border-radius:12px; transition:.25s; font-family:inherit;
}
.amounts button:hover { border-color:var(--violet); }
.amounts button.on { color:#1a1030; font-weight:700; background:linear-gradient(120deg,#c4b5fd,#67e8f9); border-color:transparent; }

.donate-form { text-align:left; margin:0 auto 18px; max-width:340px; }
.donate-form .form-label { display:block; color:var(--dim); font-size:12.5px; margin-bottom:8px; letter-spacing:1px; }
.donate-form .form-label .opt { opacity:.7; }
.donate-form input {
  width:100%; padding:11px 14px; font-size:14px; font-family:inherit; color:var(--ink);
  background:rgba(167,139,250,.05); border:1px solid var(--line); border-radius:10px; transition:.25s;
}
.donate-form input::placeholder { color:rgba(168,159,196,.5); }
.donate-form input:focus { outline:none; border-color:var(--violet); background:rgba(167,139,250,.1); }

.donate-panel .btn { margin-top:6px; font-family:inherit; cursor:pointer; }
.donate-panel .btn:disabled { opacity:.55; cursor:not-allowed; transform:none; }
/* 支付方式卡片与表单同宽（表单是 340px），避免渠道条比输入框更宽显得突兀 */
.donate-panel .pw-pay-method { max-width:340px; margin:0 auto 18px; }

.donate-qrcode { margin-top:26px; color:var(--dim); font-size:13px; }
.order-info { margin-bottom:6px; font-size:13px; letter-spacing:1px; }
.order-info b { color:var(--ink); font-weight:600; }
.order-info .countdown { color:var(--cyan); font-size:12.5px; margin-top:4px; }
.qrcode-tip { margin-top:14px; font-size:13px; color:var(--dim); letter-spacing:1px; min-height:20px; }
.qrcode-tip.err { color:#ff8b8b; }
.link-btn {
  background:none; border:none; cursor:pointer; font-family:inherit; font-size:13px;
  color:var(--cyan); text-decoration:none; padding:0; margin-top:10px;
}
.link-btn:hover { text-decoration:underline; }
.restore-box { margin-top:14px; }

/* ---------- 支付渠道标识：微信支付 / 支付宝 ----------
   捐助页（pages/donate.html）与首页捐助弹框（donate-modal.js）共用：
     .pw-channels    弹框里的「支付方式」二选一卡片组（微信 / 支付宝）
     .pw-pay-method  捐助页的单条渠道说明卡片
     .pw-qr-card     微信二维码卡片：绿描边 + 「微信扫一扫」标题 + 三步指引用
     .pw-wechat      微信气泡图标（currentColor 上色，眼睛/描边取页面底色以形成分隔）
     .pw-alipay      支付宝图标（品牌蓝圆角方块 + 白色「支」字）
   全站主色是紫 + 青，这里刻意引入微信绿 #07C160 与支付宝蓝 #1677FF，
   让「这是哪家支付」一眼可辨。 */
.pw-wechat { display:inline-block; vertical-align:-.12em; }
.pw-wechat .eye { fill:var(--bg); }
.pw-wechat .sep { fill:currentColor; stroke:var(--bg); stroke-width:1.5; }
.pw-alipay { display:inline-block; vertical-align:-.12em; }
/* 「支」字用无衬线体：这是图形化的品牌标识，不跟着页面的宋体走 */
.pw-alipay text { font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif; }

/* 渠道二选一卡片：每个渠道自带品牌色变量（--c 主色 / --c-rgb 供 rgba 用），
   未选中是暗玻璃，选中整体转品牌色——边框、底纹、勾选点一次到位。 */
.pw-channels {
  display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0 0 16px;
}
.pw-channel {
  --c:#a78bfa; --c-rgb:167,139,250;
  position:relative; display:flex; align-items:center; gap:10px;
  padding:11px 12px; border:1px solid var(--line); border-radius:12px;
  background:rgba(167,139,250,.05); text-align:left; cursor:pointer; font-family:inherit;
  transition:border-color .25s, background .25s, box-shadow .25s;
}
.pw-channel--wechat { --c:#07c160; --c-rgb:7,193,96; }
.pw-channel--alipay { --c:#1677ff; --c-rgb:22,119,255; }
.pw-channel .ico { flex:none; display:flex; }
.pw-channel .ico svg { display:block; width:26px; height:26px; }
.pw-channel .ico .pw-wechat { color:var(--c); }
.pw-channel .txt { min-width:0; }
.pw-channel .txt b {
  display:block; font-size:14px; font-weight:600; letter-spacing:.5px; color:var(--ink);
}
.pw-channel .txt span {
  display:block; font-size:11px; letter-spacing:.5px; color:var(--dim);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
/* 右上角勾选点：未选中是空心圈，选中被品牌色填满并弹出对勾 */
.pw-channel .tick {
  position:absolute; top:9px; right:9px; width:14px; height:14px; border-radius:50%;
  border:1px solid rgba(167,139,250,.35); transition:.25s;
}
.pw-channel .tick::after {
  content:""; position:absolute; left:4px; top:1px; width:4px; height:8px;
  border:solid #fff; border-width:0 2px 2px 0; opacity:0;
  transform:rotate(45deg) scale(.5); transition:.25s;
}
.pw-channel:hover { border-color:rgba(var(--c-rgb),.45); background:rgba(var(--c-rgb),.08); }
.pw-channel.on {
  border-color:rgba(var(--c-rgb),.7);
  background:linear-gradient(140deg,rgba(var(--c-rgb),.22),rgba(var(--c-rgb),.04));
  box-shadow:inset 0 0 24px rgba(var(--c-rgb),.14);
}
.pw-channel.on .tick {
  border-color:transparent; background:var(--c); box-shadow:0 0 10px rgba(var(--c-rgb),.5);
}
.pw-channel.on .tick::after { opacity:1; transform:rotate(45deg) scale(1); }
.pw-channel:focus-visible {
  outline:none; border-color:var(--c); box-shadow:0 0 0 3px rgba(var(--c-rgb),.25);
}

.pw-pay-method {
  display:flex; align-items:center; gap:12px; text-align:left;
  margin:0 0 16px; padding:12px 14px;
  border:1px solid rgba(7,193,96,.42); border-radius:12px;
  background:linear-gradient(120deg,rgba(7,193,96,.16),rgba(7,193,96,.03));
}
.pw-pay-method .pw-wechat { width:28px; height:28px; flex:none; color:#07c160; }
.pw-pay-method .txt { flex:1 1 auto; min-width:0; }
.pw-pay-method .txt b {
  display:block; font-size:14.5px; font-weight:600; letter-spacing:1px; color:var(--ink);
}
/* 副标题单行不折行：渠道卡片要一眼看完，折行会把它撑成一大块 */
.pw-pay-method .txt span {
  display:block; font-size:11.5px; letter-spacing:.5px; color:var(--dim);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.pw-pay-method .ok {
  margin-left:auto; flex:none; padding:3px 9px; border-radius:999px;
  background:rgba(7,193,96,.18); color:#7dedaa;
  font-size:11px; letter-spacing:.5px; white-space:nowrap;
}

.pw-qr-card {
  margin:12px auto 0; padding:12px; max-width:264px;
  border:1px solid rgba(7,193,96,.4); border-radius:16px;
  background:linear-gradient(180deg,rgba(7,193,96,.14),rgba(7,193,96,.02));
  box-shadow:0 0 34px rgba(7,193,96,.16);
}
.pw-qr-card[hidden] { display:none; }
.pw-qr-card-hd {
  display:flex; align-items:center; justify-content:center; gap:8px;
  margin-bottom:12px; font-size:13.5px; letter-spacing:2px; color:#7dedaa;
}
.pw-qr-card-hd .pw-wechat { width:19px; height:19px; color:#07c160; }
/* 码本体：白底留出静区（不放大，避免二维码被插值糊掉），卡片只负责「这是微信的码」 */
.pw-qr-card canvas {
  display:block; margin:0 auto; max-width:100%; height:auto;
  padding:8px; background:#fff; border-radius:10px;
}

.pw-pay-steps {
  counter-reset:paystep; list-style:none;
  display:flex; justify-content:center; flex-wrap:wrap; gap:6px 12px;
  margin:12px 0 0; font-size:12px; letter-spacing:.5px; color:var(--dim);
}
.pw-pay-steps li { display:flex; align-items:center; gap:6px; }
.pw-pay-steps li::before {
  counter-increment:paystep; content:counter(paystep);
  display:inline-flex; align-items:center; justify-content:center;
  width:16px; height:16px; flex:none; border-radius:50%; line-height:1;
  background:rgba(7,193,96,.2); color:#7dedaa; font-size:11px;
}

/* 微信主色按钮：捐助页/弹框里那个「生成微信支付二维码」的动作按钮。
   不与其它主按钮（紫→青）混用，绿色直接把支付渠道写在按钮上。 */
.btn--wechat {
  color:#04240f; background:linear-gradient(120deg,#07c160,#3ddc84);
  box-shadow:0 0 44px rgba(7,193,96,.42);
}
.btn--wechat:hover { box-shadow:0 6px 60px rgba(7,193,96,.5); }
/* 弹框里同款的微信主按钮（生成二维码） */
.pw-modal-btn--wechat {
  border:none; color:#04240f; font-weight:700;
  background:linear-gradient(120deg,#07c160,#3ddc84);
}
.pw-modal-btn--wechat:hover { box-shadow:0 6px 30px rgba(7,193,96,.5); }
.pw-modal-btn--wechat:disabled { opacity:.55; cursor:not-allowed; box-shadow:none; }

/* ---------- 首页捐助弹框（微信 Native 扫码 / 支付宝电脑网站支付）
   结构由 assets/js/site/donate-modal.js 注入 body，此处只管外观 ---------- */
.pw-modal-overlay {
  position:fixed; inset:0; z-index:120; padding:24px;
  background:rgba(4,2,12,.68); backdrop-filter:blur(3px);
  display:flex; align-items:center; justify-content:center;
  animation:pw-fade .22s ease-out;
}
@keyframes pw-fade { from { opacity:0; } }
.pw-modal-overlay[hidden] { display:none; }
.pw-modal {
  /* 正文区底色：抽成变量，页面选中的页签（.pw-record-tabs-ink）也取这个值，两者同色才能连成一块 */
  --pw-surface:#141026;
  width:100%; max-width:420px; max-height:88vh; overflow:hidden;
  background:var(--bg2); border:1px solid var(--line); border-radius:16px;
  display:flex; flex-direction:column;
  /* 顶部一团紫光：弹框浮在星空上，自己也得有点光源，纯色底会显得像块砖 */
  background-image:radial-gradient(120% 90% at 50% -30%,rgba(167,139,250,.24),transparent 62%);
  box-shadow:0 24px 80px rgba(0,0,0,.62), inset 0 0 0 1px rgba(255,255,255,.03);
  animation:pw-pop .26s cubic-bezier(.22,1,.36,1);
}
@keyframes pw-pop { from { opacity:0; transform:translateY(10px) scale(.98); } }
.pw-modal-hd {
  flex:none; display:flex; align-items:center; justify-content:space-between;
  padding:16px 20px 13px; border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(167,139,250,.1),transparent);
}
.pw-modal-hd h3 { display:flex; align-items:center; font-size:17px; letter-spacing:2px; font-weight:700; }
/* 标题左侧一道紫青渐变竖条：给弹框一个小标题记号，别只靠字号区分层级 */
.pw-modal-hd h3::before {
  content:""; width:3px; height:13px; margin-right:9px; border-radius:2px;
  background:linear-gradient(180deg,#c4b5fd,#67e8f9);
}
.pw-modal-close {
  background:none; border:none; padding:0 4px; line-height:1; cursor:pointer;
  color:var(--dim); font-size:22px; font-family:inherit; transition:.25s;
}
.pw-modal-close:hover { color:var(--cyan); }
.pw-modal-bd { padding:18px 20px; overflow-y:auto; text-align:center; }
.pw-modal-lead { font-size:13px; color:var(--dim); letter-spacing:1px; margin-bottom:16px; }
.pw-modal-tip { margin-top:14px; font-size:13px; color:var(--dim); letter-spacing:1px; min-height:20px; }
.pw-modal-tip.err { color:#ff8b8b; }
.pw-modal-ft {
  flex:none; display:flex; justify-content:flex-end; gap:12px;
  padding:14px 20px 18px; border-top:1px solid var(--line);
}
.pw-modal-btn {
  min-width:124px; padding:9px 24px; border-radius:999px; font-size:14px; letter-spacing:1px;
  font-family:inherit; cursor:pointer; transition:.25s;
}
.pw-modal-btn--ghost { background:rgba(167,139,250,.08); border:1px solid var(--line); color:var(--ink); }
.pw-modal-btn--ghost:hover { background:rgba(167,139,250,.16); }
.pw-modal-btn--primary { border:none; color:#1a1030; font-weight:700; background:linear-gradient(120deg,#c4b5fd,#67e8f9); }
.pw-modal-btn--primary:hover { box-shadow:0 6px 30px rgba(103,232,249,.45); }
.pw-modal-btn--primary:disabled { opacity:.55; cursor:not-allowed; box-shadow:none; }
.pw-modal-btn[hidden] { display:none; }

/* 弹框内表单（沿用捐助页的 .amounts 按钮样式，输入框单独定义） */
.pw-field { margin-bottom:16px; }
.pw-modal .form-label {
  display:block; text-align:left; color:var(--dim); font-size:12.5px;
  letter-spacing:1px; margin-bottom:8px;
}
.pw-modal .form-label .opt { opacity:.7; }
.pw-modal input[type="text"], .pw-modal input[type="number"] {
  width:100%; padding:11px 14px; font-size:14px; font-family:inherit; color:var(--ink);
  background:rgba(167,139,250,.05); border:1px solid var(--line); border-radius:10px; transition:.25s;
}
.pw-modal input::placeholder { color:rgba(168,159,196,.5); }
.pw-modal input:focus { outline:none; border-color:var(--violet); background:rgba(167,139,250,.1); }
.pw-modal .amounts { margin:0 0 12px; gap:10px; flex-wrap:nowrap; }
.pw-modal .amounts button { flex:1 1 0; min-width:0; padding:11px 6px; font-size:15px; }

/* 支付二维码与金额（码本体样式在 .pw-qr-card canvas，见上方「支付渠道标识」） */
.pw-donate-amount { font-size:14px; letter-spacing:1px; color:var(--dim); }
.pw-donate-amount b { color:var(--ink); font-size:18px; font-weight:700; }
.pw-donate-qr[hidden] { display:none; }

/* 支付宝收银台：不跳走当前页面，直接把收银台嵌进弹框里的 iframe。
   这一屏要的地方比「填金额」那屏大得多，所以弹框临时放宽（.pw-modal--pay，
   由 donate-modal.js 的 showStep 按当前屏加/去类）。 */
.pw-modal--pay { max-width:1080px; height:94vh; max-height:94vh; }
/* 收银台屏：弹框高度锁死，正文区改成 flex 列，让 iframe 吃掉剩余高度。
   纵向滚动交给 iframe 里的支付宝页面本身——弹框再不出现第二条滚动条（两层滚动条很难用） */
.pw-modal--pay .pw-modal-bd {
  flex:1; min-height:0; display:flex; flex-direction:column;
  overflow:hidden; padding:14px 16px;
}
.pw-modal--pay .pw-modal-bd > [data-step="alipay"] {
  flex:1; min-height:0; display:flex; flex-direction:column;
}
.pw-modal--pay .pw-donate-amount,
.pw-modal--pay .pw-pay-frame-tip,
.pw-modal--pay .pw-modal-tip { flex:none; }
.pw-pay-frame {
  position:relative; margin:12px auto 0; width:100%; height:min(72vh, 680px);
  border:1px solid rgba(22,119,255,.35); border-radius:14px; overflow:hidden;
  background:#fff; box-shadow:0 0 34px rgba(22,119,255,.16);
}
/* 收银台屏里由 flex 定高，不用固定高度兜底 */
.pw-modal--pay .pw-pay-frame { flex:1; min-height:0; height:auto; }
.pw-pay-iframe { display:block; width:100%; height:100%; border:none; background:#fff; }
/* 支付宝页面还在路上时的遮罩：一直盖到 iframe 真的跨域到了支付宝才收起
   （写表单过渡页那一步也会触发 iframe 的 load，不能那时就收，见 onPayFrameLoad） */
.pw-pay-frame-loading {
  position:absolute; inset:0; z-index:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px;
  /* 必须是不透光的暗底：底下压着的是尚未渲染的白色 iframe，半透明会透出一片灰白 */
  background:
    radial-gradient(120% 70% at 50% 0%,rgba(22,119,255,.22),transparent 62%),
    linear-gradient(180deg,rgba(18,13,34,.98),rgba(9,5,20,.99));
  color:#a9a3c6; font-size:12.5px; letter-spacing:1px;
}
.pw-pay-frame-loading[hidden] { display:none; }
.pw-pay-frame-loading .pw-spinner { margin:0; }
.pw-pay-frame-tip { margin-top:10px; font-size:11.5px; letter-spacing:.5px; color:var(--dim); }

/* 转圈：支付宝蓝的半环，纯 CSS，不依赖任何图片或字体图标 */
.pw-spinner {
  display:block; width:28px; height:28px; margin:0 auto; border-radius:50%;
  border:2px solid rgba(77,157,255,.22); border-top-color:#7cb4ff;
  box-shadow:0 0 16px rgba(77,157,255,.35);
  animation:pw-spin .8s linear infinite;
}
@keyframes pw-spin { to { transform:rotate(360deg); } }

/* 支付宝主色按钮：与 .pw-modal-btn--wechat 对称，绿蓝各占一边 */
.pw-modal-btn--alipay {
  border:none; color:#fff; font-weight:700;
  background:linear-gradient(120deg,#1677ff,#4d9dff);
}
.pw-modal-btn--alipay:hover { box-shadow:0 6px 30px rgba(22,119,255,.5); }
.pw-modal-btn--alipay:disabled { opacity:.55; cursor:not-allowed; box-shadow:none; }

/* 捐赠记录弹框（--records）：内容盒压住页签栏的底边 1px，让选中的页签与内容连成一块；
   内容盒自带圆角，页签栏补 16px 左右内边距，首尾页签不会顶到弹框圆角上。
   （选中页签的底色取 .pw-modal 上的 --pw-surface，两者必须同色才能连成一块。） */
.pw-modal--records .pw-modal-hd { display:none; }
.pw-modal--records .pw-modal-bd {
  position:relative; z-index:1; margin-top:-1px;
  border-radius:14px 14px 0 0;
  background:var(--pw-surface);
}
/* 捐赠记录弹框：记录列表
   每条记录压成一行「名称 / 时间 / 金额」三列，列宽固定，逐列对齐；
   名字过长时省略号收尾（时间与金额都不压缩，悬停名字可看 title 全称）。 */
/* 无数据 / 加载中时用保底高度占住整块区域，弹框不随请求坍塌：保底高度挂在既有的
   .pw-record-list 上（不依赖新增的弹框类），任何层级的旧 DOM 都生效；刷新时保留旧
   列表只做整块淡化。两者配合，第一次打开与重复刷新全程都不会跳动。 */
.pw-modal-bd { transition:opacity .2s ease; }
.pw-modal.is-loading .pw-modal-bd { opacity:.5; }
.pw-record-list { list-style:none; text-align:left; min-height:190px; }
/* 空态（支出）：整块撑到与「结余」页签一样高，单行文案在块内左右 + 上下居中。
   168 ≈ 结余那两行字（收入行 ≈55.7 + 结余块 ≈93.5）加正文区上下 padding 36 ——
   结余块由内容撑开，这边给等高的保底，两个页签的弹框高度才对得上。
   乘 --fs 是因为首页统一放大了字号（≈1.1），结余页跟着变高，这里也要同步缩放。 */
.pw-record-list--empty {
  min-height:calc(168px * var(--fs, 1));
  display:flex; align-items:center; justify-content:center;
  text-align:center;
}
/* 空态文案：编号列表那套 .pw-list li 样式不在这个容器里，这里自己定一行字 */
.pw-record-empty { font-size:13px; letter-spacing:1px; color:var(--dim); line-height:1.8; }
/* 提示行只在有文案时占位（加载中 / 失败 / 无记录），平时整块折叠，不留空白。
   用 .pw-record-list 作兄弟选择器定位记录弹框，不依赖新增的弹框类名。 */
.pw-record-list + .pw-modal-tip:empty { display:none; }
/* 三列栅格：名称（可省略）/ 时间 / 金额。列宽固定，保证各条目同一列左边缘对齐；
   .pw-record-main 用 display:contents 展开，使名称与时间直接成为栅格项。 */
.pw-record-item {
  display:grid; grid-template-columns:minmax(0,1fr) 116px 96px;
  align-items:baseline; column-gap:10px;
  padding:10px 0; border-bottom:1px dashed var(--line);
  line-height:1.5;                       /* 单行不必跟着 body 的 1.8 撑高 */
}
.pw-record-item:last-child { border-bottom:none; }
.pw-record-main { display:contents; }
.pw-record-name {
  min-width:0; font-size:14px; color:var(--ink);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.pw-record-time { font-size:11.5px; letter-spacing:.5px; color:var(--dim); opacity:.8; white-space:nowrap; }
.pw-record-amount { font-size:15px; font-weight:700; letter-spacing:.5px; color:var(--gold); text-align:right; white-space:nowrap; }

/* 捐赠记录弹框的页签栏（捐赠记录 / 支出 / 结余）：
   照搬详情页 DocHeader 的「首个梯形 + 其余平行四边形」标签，改动只有尺寸与配色——
   详情页的页签是压在文档查看器顶边上的，弹框没有标题、内容盒又是圆角的，所以这里：
   · 页签比详情页小一号（弹框窄、要横向放下三个）；
   · 弹框整体有圆角，首尾页签不再贴到弹框边缘，页签栏补左右内边距；
   · 高亮滑块取弹框正文区底色（与 .pw-profile-bd 同色）并多盖 1px，
     当前页签因此与下方内容连成一块，像浏览器标签页。 */
.pw-record-tabs {
  flex:none; display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 16px 0;
  background:linear-gradient(180deg,rgba(167,139,250,.12),rgba(167,139,250,.03));
}
.pw-record-tabs-in {
  --tab-slant:11px;
  position:relative; display:inline-flex; align-items:flex-end; gap:0;
  min-width:0;
}
.pw-record-tabs-ink {
  position:absolute; top:0; bottom:-1px; left:0; width:0; z-index:1;
  background:var(--pw-surface);
  clip-path:polygon(0 0, calc(100% - var(--tab-slant)) 0, 100% 100%, var(--tab-slant) 100%);
  box-shadow:inset 0 1px 0 rgba(206,193,255,.5);   /* 只留顶部一道棱：形状仍看得见，底边完全交给内容 */
  will-change:transform;
  transition:transform .34s cubic-bezier(.22,1,.36,1), width .34s cubic-bezier(.22,1,.36,1);
}
/* 激活的是首个页签（左边是直角）时，滑块跟着换成直角那版形状 */
.pw-record-tabs-in:has(.pw-record-tab.on:first-of-type) .pw-record-tabs-ink {
  clip-path:polygon(0 0, calc(100% - var(--tab-slant)) 0, 100% 100%, 0 100%);
}
/* 页签本体（默认形状：平行四边形）；左棱线：斜线画不了边框，用 clip-path 抠 1px 窄条当描边 */
.pw-record-tab {
  --tab-edge:linear-gradient(180deg,rgba(206,193,255,.55),rgba(167,139,250,.06));
  position:relative; z-index:2; padding:7px 22px 8px; border:none; border-radius:0;
  font-family:inherit; font-size:12.5px; letter-spacing:2px; cursor:pointer;
  color:var(--dim);
  background-color:rgba(14,10,30,.5);
  background-image:linear-gradient(180deg,rgba(167,139,250,.13),rgba(103,232,249,.04));
  clip-path:polygon(0 0, calc(100% - var(--tab-slant)) 0, 100% 100%, var(--tab-slant) 100%);
  transition:color .25s, background-color .25s, box-shadow .25s, text-shadow .25s;
}
.pw-record-tab::before {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:var(--tab-edge);
  clip-path:polygon(0 0, 1px 0, calc(var(--tab-slant) + 1px) 100%, var(--tab-slant) 100%);
}
.pw-record-tab:first-of-type { clip-path:polygon(0 0, calc(100% - var(--tab-slant)) 0, 100% 100%, 0 100%); }
.pw-record-tab:first-of-type::before { clip-path:polygon(0 0, 1px 0, 1px 100%, 0 100%); }
/* 平行四边形的页签向左压进斜腰那点宽度，盒子与前一个页签重叠，两条腰才能共线 */
.pw-record-tab:not(:first-of-type) { margin-left:calc(-1 * var(--tab-slant)); }
.pw-record-tab:not(.on):hover {
  color:#fff;
  background-color:rgba(52,38,102,.62);
  box-shadow:
    inset 0 1px 0 rgba(222,213,255,.42),
    inset 0 -1px 0 rgba(167,139,250,.16);
}
/* 当前页签：底色让给滑块，形状只靠顶棱与左棱交代，底边彻底交给内容盒 */
.pw-record-tab.on {
  color:#fff; background-color:transparent; background-image:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5);
  --tab-edge:linear-gradient(180deg,rgba(255,255,255,.45),rgba(255,255,255,.04));
  text-shadow:0 1px 2px rgba(8,4,22,.45);
}
.pw-record-tab:focus-visible {
  outline:none; color:#fff; background-color:rgba(103,232,249,.14);
}
.pw-record-tab:focus-visible::after {
  content:""; position:absolute; left:50%; top:2px; width:22px; height:2px;
  margin-left:-11px; border-radius:2px; background:var(--cyan);
  box-shadow:0 0 8px rgba(103,232,249,.8);
}

/* 「结余」页签：累计收入 / 当前结余，结余单独一行放大居中 */
.pw-balance { list-style:none; }
.pw-balance-grid { margin:0; }
.pw-balance-item {
  display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  padding:11px 0; border-bottom:1px dashed var(--line);
}
.pw-balance-item dt { font-size:12.5px; letter-spacing:1px; color:var(--dim); }
.pw-balance-val { font-size:17px; font-weight:700; letter-spacing:.5px; color:var(--ink); }
.pw-balance-val--in { color:var(--gold); }
/* 结余是这一屏的主角：单独一行放大居中，不做成第二个列表项 */
.pw-balance-item--main {
  display:block; padding:18px 0 14px; text-align:center; border-bottom:none;
  background:radial-gradient(90% 140% at 50% 0%,rgba(167,139,250,.12),transparent 70%);
}
.pw-balance-item--main dt { margin-bottom:8px; }
.pw-balance-val--balance { display:block; font-size:26px; color:#fff; }
.pw-balance-val--balance.is-negative { color:#ff8b8b; }

/* 下载页列表 */
.dl-list { max-width:640px; margin:0 auto; }
.dl-item {
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  border:1px solid var(--line); border-radius:12px; padding:16px 20px; margin-bottom:12px;
  background:linear-gradient(160deg,rgba(167,139,250,.05),rgba(20,16,38,.6));
}
.dl-item .name { font-size:15px; letter-spacing:1px; }
.dl-item .size { color:var(--dim); font-size:12.5px; white-space:nowrap; }
.dl-item a, .dl-item button {
  color:var(--cyan); text-decoration:none; font-size:13px; white-space:nowrap;
  border:1px solid var(--line); border-radius:999px; padding:5px 18px; transition:.25s;
  background:none; font-family:inherit; cursor:pointer;
}
.dl-item a:hover, .dl-item button:hover { background:rgba(103,232,249,.1); border-color:var(--cyan); }
.dl-item button:disabled { opacity:.5; cursor:not-allowed; }

/* 详情页版本切换（原始 / 修正后） */
.ver-switch { display:flex; gap:10px; flex-wrap:wrap; margin:18px 0 14px; }
.ver-btn {
  font-family:inherit; cursor:pointer; font-size:13px; letter-spacing:1px;
  color:var(--violet2); background:rgba(167,139,250,.06);
  border:1px solid var(--line); border-radius:999px; padding:6px 20px; transition:.25s;
}
.ver-btn:hover:not(:disabled) { background:rgba(167,139,250,.12); border-color:var(--violet); }
.ver-btn.on { color:#1a1030; font-weight:700; border-color:transparent; background:linear-gradient(120deg,#c4b5fd,#67e8f9); }
.ver-btn:disabled { opacity:.45; cursor:not-allowed; }

/* 著作章节：勾选框 / 批量下载按钮组 / 章节内提示 */
summary .ch-check { flex:none; width:16px; height:16px; accent-color:var(--violet); cursor:pointer; }
.dl-item .btns { display:flex; gap:10px; flex-wrap:wrap; }
.ch-loading, .ch-empty { color:var(--dim); font-size:13px; }
.ch-tip { margin-top:10px; font-size:13px; color:var(--dim); min-height:18px; }
.ch-tip.err { color:#ff8b8b; }
.ch-tip.ok { color:var(--cyan); }

/* 下载态提示 / 返回链接（详情页通用） */
.dl-tip { margin-top:12px; font-size:13px; color:var(--dim); min-height:20px; }
.dl-tip.err { color:#ff8b8b; }
.dl-tip.ok { color:var(--cyan); }

/* 详情页大标题 */
.page-head { text-align:center; padding:64px 24px 24px; position:relative; z-index:1; }
.page-head h1 { font-size:clamp(24px,3.6vw,34px); letter-spacing:3px; color:var(--violet2); }
.page-head p { color:var(--dim); font-size:14px; margin-top:10px; }

/* 加载与空态 */
.loading { text-align:center; color:var(--dim); padding:48px 0; font-size:14px; letter-spacing:2px; }
.empty { text-align:center; color:var(--dim); padding:48px 0; font-size:14px; }

/* ---------- 文档查看器（详情页：左侧目录 + 右侧 PDF） ---------- */
.doc-viewer {
  /* 正文区底色：目录 / PDF 视口观感上的同一个底色。
     选中页签的底（.doc-tabs-ink）也取这个值，两者同色才能连成一块。 */
  --doc-surface:#100a1e;
  border:1px solid var(--line); border-radius:14px; overflow:hidden;
  background:linear-gradient(160deg,rgba(167,139,250,.06),rgba(20,16,38,.55));
}

/* ---------- 详情页通用头部 DocHeader：左 标题 / 中 页签 / 右 下载·返回 ----------
   结构由 assets/js/site/common.js 的 DocHeader 生成；
   三段等分（中间列按内容定宽并居中），左右都靠边。
   高度固定 40px：中间页签（39px）贴底后正好吃满，顶边与头部顶边齐平；
   头部不留上下内边距，页签底边直接压在下沿上。 */
.doc-header {
  position:relative; display:grid; text-align:left;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:end; gap:18px; padding: 0 20px;
  height:40px;
  background:linear-gradient(180deg,rgba(167,139,250,.12),rgba(167,139,250,.03));
}
/* 头部下沿一条流光：与星空主题呼应 */
.doc-header::after {
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px; pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(103,232,249,.55),transparent);
  opacity:.6;
}
.doc-header-l { min-width:0;}
.doc-header-title {
  margin:0; font-size:19px; font-weight:600; letter-spacing:3px; color:var(--violet2);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.doc-header-c { justify-self:center; min-width:0; }
/* 右段（按钮组）不跟着页签贴底：在头部高度里垂直居中，与贴底的页签错开一层 */
.doc-header-r {
  justify-self:end; align-self:center;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}

/* 页签：贴底的「首个梯形 + 其余平行四边形」标签（形状由 clip-path 切出，
   高亮滑块位置由 DocHeader.moveInk 计算）。
   --tab-slant：斜腰的横向偏移量，改大改小即调整「斜度」。
   首个页签左边是直角；其余页签做成同向倾斜的平行四边形，
   它们的左腰与前一页签的右腰是同一条线，因此严丝合缝地贴合。
   状态区分靠「亮/暗 + 颜色」而不是加粗：三个页签同字重，切换时行宽不会跳动。 */
.doc-tabs {
  --tab-slant:13px;
  position:relative; display:inline-flex; align-items:flex-end; gap:0;
  padding:0; border:none; background:none;
}

/* 高亮滑块：激活页签的底（形状与页签完全一致，宽度/位移由 JS 写入）。
   取正文区底色（--doc-surface），并向下多盖 1px：
   盖住头部的下边框与那条流光（见下方 z-index），选中页签因此与正文连成一块，
   像浏览器标签页——选中的那个标签和页面是同一个底。
   （形状是 clip-path 切出来的，辉光只能走内阴影——外阴影会被自己裁掉。） */
.doc-tabs-ink {
  position:absolute; top:0; bottom:-1px; left:0; width:0; z-index:1;
  /* background:var(--doc-surface,#100a1e);#282828 */
  background:#282828;
  clip-path:polygon(0 0, calc(100% - var(--tab-slant)) 0, 100% 100%, var(--tab-slant) 100%);
  box-shadow:inset 0 1px 0 rgba(206,193,255,.5);   /* 只留顶部一道棱：形状仍看得见，底边完全交给正文 */
  will-change:transform;
  transition:transform .34s cubic-bezier(.22,1,.36,1), width .34s cubic-bezier(.22,1,.36,1),
             clip-path .34s cubic-bezier(.22,1,.36,1);
}
/* 激活的是首个页签（左边是直角）时，滑块跟着换成直角那版形状；
   换形状与滑动同时进行，看起来就是滑块自己在变形。 */
.doc-tabs:has(.doc-tab.on:first-of-type) .doc-tabs-ink {
  clip-path:polygon(0 0, calc(100% - var(--tab-slant)) 0, 100% 100%, 0 100%);
}

/* 页签本体（默认形状：平行四边形）：底边贴合下沿。
   压暗的玻璃底 + 一条「上亮下暗」的左侧棱线：未激活也要能看清形状轮廓，
   否则斜切出来的形只在激活时可见，整排就散了。 */
.doc-tab {
  --tab-edge:linear-gradient(180deg,rgba(206,193,255,.55),rgba(167,139,250,.06));
  position:relative; z-index:2; padding:8px 30px 10px; border:none; border-radius:0;
  background-color:rgba(14,10,30,.5);
  background-image:linear-gradient(180deg,rgba(167,139,250,.13),rgba(103,232,249,.04));
  color:var(--dim); font-family:inherit; font-weight:600;
  font-size:14px; letter-spacing:3px; line-height:1.5; cursor:pointer;
  box-shadow:
    inset 0 1px 0 rgba(190,175,255,.24),
    inset 0 -1px 0 rgba(167,139,250,.16);
  clip-path:polygon(0 0, calc(100% - var(--tab-slant)) 0, 100% 100%, var(--tab-slant) 100%);
  transition:color .25s, background-color .25s, box-shadow .25s, text-shadow .25s;
}
/* 左侧棱线：斜线画不了边框，用 clip-path 从整块底色里抠出 1px 窄条来当描边 */
.doc-tab::before {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:var(--tab-edge);
  clip-path:polygon(0 0, 1px 0, calc(var(--tab-slant) + 1px) 100%, var(--tab-slant) 100%);
}
/* 首个页签：左边换成直角（上窄下宽的梯形），棱线也改成竖线 */
.doc-tab:first-of-type {
  clip-path:polygon(0 0, calc(100% - var(--tab-slant)) 0, 100% 100%, 0 100%);
}
.doc-tab:first-of-type::before { clip-path:polygon(0 0, 1px 0, 1px 100%, 0 100%); }
/* 平行四边形页签向左压进 --tab-slant：盒子与前一个页签重叠这么多，
   它的左上角才能正好落在前一个页签的右上角，两条腰共线。
   （形状本身也是斜的，重叠区域内两者互不覆盖，也各自只接管自己那半边点击热区） */
.doc-tab:not(:first-of-type) { margin-left:calc(-1 * var(--tab-slant)); }
/* 悬停：微微提亮 + 顶棱线变亮，像被灯照到；激活项不吃这条，免得压住滑块 */
.doc-tab:not(.on):hover:not(:disabled) {
  color:#fff;
  background-color:rgba(52,38,102,.62);
  box-shadow:
    inset 0 1px 0 rgba(222,213,255,.42),
    inset 0 -1px 0 rgba(167,139,250,.16);
}
/* 当前页签：底色与渐变图都让给滑块，滑块就是下方正文的底色，页签与正文连成一块；
   于是形状只靠顶部一道亮棱 + 左侧棱线交代，底边彻底交给正文。 */
.doc-tab.on {
  color:#fff; background-color:transparent; background-image:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5);
  --tab-edge:linear-gradient(180deg,rgba(255,255,255,.45),rgba(255,255,255,.04));
  text-shadow:0 1px 2px rgba(8,4,22,.45);
}
/* 不可用页签：压暗但仍可辨认，不额外加标记 */
.doc-tab:disabled { color:rgba(200,194,224,.5); cursor:not-allowed; }
/* 键盘聚焦：形状被裁掉，outline 会跟着缺角，改用底色 + 顶沿一条短线提示 */
.doc-tab:focus-visible {
  outline:none; color:#fff; background-color:rgba(103,232,249,.14);
}
.doc-tab:focus-visible::after {
  content:""; position:absolute; left:50%; top:2px; width:24px; height:2px;
  margin-left:-12px; border-radius:2px; background:var(--cyan);
  box-shadow:0 0 8px rgba(103,232,249,.8);
}

/* 头部按钮：辅助下载（可选）/ 下载（主）/ 返回（次）。
   比页签矮 8px（页签 39px / 按钮 31px），靠 padding 上下各减 4px 收下来；
   宽度跟着收一档（min-width 与左右 padding），跟着变矮才不会显得虚胖。 */
.doc-hd-btn {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:78px; padding:4px 16px; border:1px solid transparent; border-radius:999px;
  font-family:inherit; font-size:14px; letter-spacing:2px; line-height:1.5;
  cursor:pointer; transition:.25s; text-decoration:none; white-space:nowrap;
}
.doc-hd-btn--dl { background:linear-gradient(120deg,#3b82f0,#5aa9ff); color:#fff; }
.doc-hd-btn--dl:hover:not(:disabled) { background:linear-gradient(120deg,#2563eb,#3b82f0); box-shadow:0 6px 20px rgba(59,130,240,.35); }
/* 当前页签没有 PDF 下载链接时：按钮置灰不可点 */
.doc-hd-btn--dl:disabled { background:#5b5b6b; color:rgba(255,255,255,.7); opacity:.7; cursor:not-allowed; }
/* 辅助下载（描边蓝，如著作页的「单页下载」）：与主下载区分主次，不用渐变色块 */
.doc-hd-btn--sub { background:rgba(59,130,240,.12); border-color:rgba(90,169,255,.45); color:#9cc2ff; }
.doc-hd-btn--sub:hover:not(:disabled) { background:rgba(59,130,240,.22); border-color:#5aa9ff; color:#cfe4ff; }
.doc-hd-btn--sub:disabled { background:transparent; border-color:var(--line); color:var(--dim); opacity:.55; cursor:not-allowed; }
.doc-hd-btn--back { background:rgba(167,139,250,.08); border-color:var(--line); color:var(--ink); }
.doc-hd-btn--back:hover { border-color:rgba(103,232,249,.5); color:var(--cyan); }

.doc-viewer-bd { display:flex; min-height:560px; }
/* 默认 300px；宽度可由 DocPaneResizer 拖拽调整，这里给出 200~600px 的硬边界兜底。
   relative：给悬浮的展开/折叠按钮定位；width 过渡：让展开/折叠宽度动画（拖拽时另见 body.doc-resizing）。 */
.doc-sidebar {
  position:relative;
  width:300px; flex:none; min-width:200px; max-width:600px;
  border-right:1px solid var(--line); padding:14px 0;
  overflow-y:auto; overflow-x:hidden; background:rgba(10,6,22,.35);
  transition:width .28s cubic-bezier(.4,0,.2,1);
}
/* 宽度动画期间放开 min/max 兜底：否则展开时 min-width:200px 会立刻把宽度顶到 200px，
   过渡的 44px 起点被“抬高”，看起来就是「先跳到最小宽度，再从最小宽度动到目标宽度」。
   拖拽与稳态仍受 200~600px 约束（值本身已由 JS clamp 保证），折叠态另有 min-width:0。 */
.doc-sidebar.is-animating { min-width:0; max-width:none; }
/* 拖拽调宽要跟手，屏蔽宽度过渡 */
body.doc-resizing .doc-sidebar { transition:none; }
.doc-sidebar ul { list-style:none; }
/* 折叠 / 收缩过程：列表按展开态的内容宽度（--sb-inner，由 DocPaneResizer 写入）排版，
   超出的部分交给 overflow 裁掉，文字不随宽度逐帧重排 —— 这是「列表跳动」的根因。
   动画结束后会摘掉 .is-animating，让列表回到自然宽度（否则右侧选中条会被裁掉）。 */
.doc-sidebar.is-collapsed ul,
.doc-sidebar.is-collapsed .doc-sidebar-empty,
.doc-sidebar.is-collapsed .sidebar-foot,
.doc-sidebar.is-animating ul,
.doc-sidebar.is-animating .doc-sidebar-empty,
.doc-sidebar.is-animating .sidebar-foot { min-width:var(--sb-inner, 200px); }
/* 目录内容随折叠淡出（宽度收窄时被 overflow 裁掉），不用 display 才能连成一次动画 */
.doc-sidebar ul,
.doc-sidebar .doc-sidebar-empty,
.doc-sidebar .sidebar-foot { transition:opacity .2s ease; }
.doc-sidebar li {
  padding:10px 20px; font-size:15px; letter-spacing:1px; color:var(--dim);
  cursor:pointer; transition:.2s; display:flex; gap:8px;
  border-right:3px solid transparent; line-height:1.6;
}
.doc-sidebar li:hover { background:rgba(167,139,250,.08); color:var(--ink); }
.doc-sidebar li.on { background:rgba(167,139,250,.15); color:var(--cyan); border-right-color:var(--cyan); }
.doc-sidebar li .no { color:var(--cyan); white-space:nowrap; }
.doc-sidebar li .txt { min-width:0; word-break:break-all; }
.doc-sidebar .doc-sidebar-empty { padding:18px 20px; color:var(--dim); font-size:13.5px; text-align:center; }
.doc-sidebar .sidebar-foot {
  margin-top:auto; padding:14px 22px 18px; border-top:1px solid var(--line);
  background:rgba(10,6,22,.35);
}
.doc-sidebar .sidebar-foot .doc-hd-btn {
  width:100%; min-width:auto;
}

/* 展开 / 折叠按钮（由 DocSidebar 渲染）：脱离文档流，浮在目录右上角，不占一行。
   窄轨态 44 - 28 - 8 = 8px 正好居中，收放时按钮跟着目录右边框一起滑动。 */
.doc-sidebar-hd { position:absolute; top:8px; right:8px; z-index:2; margin:0; padding:0; }
.doc-sb-toggle {
  width:28px; height:28px; padding:0; display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(103,232,249,.45); border-radius:9px;
  background:linear-gradient(140deg,rgba(167,139,250,.3),rgba(103,232,249,.18));
  color:var(--cyan); cursor:pointer; opacity:.92;
  box-shadow:0 0 14px rgba(103,232,249,.22), inset 0 1px 0 rgba(255,255,255,.16);
  backdrop-filter:blur(6px);
  transition:opacity .2s, color .2s, border-color .2s, box-shadow .25s, background .25s, transform .2s;
}
/* 图标：折叠时由 .is-collapsed 旋转 180°，方向变化是连续动画 */
.doc-sb-ico { width:16px; height:16px; transition:transform .28s cubic-bezier(.22,1,.36,1); }
.doc-sidebar.is-collapsed .doc-sb-ico { transform:rotate(180deg); }
/* 悬停目录或聚焦按钮时点亮 */
.doc-sidebar:hover .doc-sb-toggle,
.doc-sb-toggle:hover,
.doc-sb-toggle:focus-visible { opacity:1; }
.doc-sb-toggle:hover, .doc-sb-toggle:focus-visible {
  color:#fff; border-color:rgba(103,232,249,.85);
  background:linear-gradient(140deg,rgba(167,139,250,.52),rgba(103,232,249,.38));
  box-shadow:0 0 22px rgba(103,232,249,.45), inset 0 1px 0 rgba(255,255,255,.26);
  transform:translateY(-1px);
}
.doc-sb-toggle:active { transform:translateY(0) scale(.94); }
/* 首条目录给悬浮按钮让出位置：两种状态都保留，避免切换瞬间首条高度变化 */
.doc-sidebar ul > .doc-chapter:first-child { padding-right:44px; }

/* 折叠态：目录收成一条窄轨，只留悬浮的折叠按钮（宽度移交 CSS，故 DocPaneResizer 会清掉内联宽度） */
.doc-sidebar.is-collapsed {
  width:44px; min-width:0; max-width:none;
  overflow:hidden;
}
/* 列表 / 页脚淡出而不是 display:none：内容被 overflow 裁掉的同时淡出，收回过程才连成一次动画 */
.doc-sidebar.is-collapsed ul,
.doc-sidebar.is-collapsed .doc-sidebar-empty,
.doc-sidebar.is-collapsed .sidebar-foot { opacity:0; pointer-events:none; }
/* 窄轨不需要拖拽条（紧随目录之后的就是它） */
.doc-sidebar.is-collapsed + .doc-resizer { display:none; }

.doc-main { flex:1; display:flex; flex-direction:column; min-width:0; }
/* 页签（.doc-header-c）有选中项时，给右侧 iframe 容器补一圈描边：
   颜色与页签棱线同款（上亮下暗的紫白渐变），让激活页签与正文连成一块。
   用 border-image 画渐变描边（四边自动带上同一套明暗走向），无选中页签时不出现。 */
.doc-viewer:has(.doc-tab.on) .doc-main {
  border:1px solid transparent;
  border-image:linear-gradient(180deg,rgba(206,193,255,.55),rgba(167,139,250,.12)) 1;
}
/* 目录与正文之间的拖拽分隔条（自定义目录宽度）：由 common.js 的 DocPaneResizer 注入。
   负外边距让它骑在 .doc-sidebar 的右边框上，左右各留 4px 抓取区，不改变原有视觉位置。 */
.doc-resizer {
  flex:none; width:9px; margin:0 -4px; position:relative; z-index:3;
  cursor:col-resize; background:transparent; touch-action:none;
}
.doc-resizer::after {
  content:''; position:absolute; top:0; bottom:0; left:4px; width:1px;
  background:transparent; transition:background .2s, box-shadow .2s;
}
.doc-resizer:hover::after,
.doc-resizer:focus-visible::after,
.doc-resizer.on::after { background:var(--cyan); box-shadow:0 0 10px rgba(103,232,249,.7); }
/* 拖拽中：禁选文本，并让右侧 PDF 视口不再抢指针事件（否则鼠标移到 iframe 上会丢失拖拽） */
body.doc-resizing { cursor:col-resize; user-select:none; }
body.doc-resizing .doc-viewport { pointer-events:none; }
.doc-viewport {
  flex:1; display:flex; align-items:center; justify-content:center;
  min-height:820px; background:rgba(0,0,0,.25); position:relative;
}
.doc-viewport iframe { position:absolute; inset:0; width:100%; height:100%; border:none; }
.doc-placeholder { color:var(--ink); font-size:15px; letter-spacing:2px; opacity:.7; }

/* PDF 内置工具栏切换按钮：固定在视口左上角（默认隐藏浏览器 PDF 工具栏） */
.pdf-bar-toggle {
  position:absolute; top:14px; left:22px; z-index:2;
  padding:6px 14px; border:1px solid rgba(255,255,255,.25); border-radius:6px;
  background:rgba(15,10,32,.75); color:#fff; font-size:12px; letter-spacing:1px;
  cursor:pointer; transition:.25s; font-family:inherit; backdrop-filter:blur(4px);
}
.pdf-bar-toggle:hover { border-color:#3b82f0; color:#9cc2ff; }

.doc-tip { padding:5px 22px; font-size:13px; color:var(--dim);  }

/* ---------- 批量下载弹框（著作详情） ---------- */
.dl-modal-overlay {
  position:fixed; inset:0; z-index:100;
  background:rgba(0,0,0,.55);
  display:flex; align-items:center; justify-content:center;
}
.dl-modal {
  background:var(--bg2); border:1px solid var(--line); border-radius:12px;
  width:90%; max-width:480px; max-height:80vh; overflow:hidden;
  display:flex; flex-direction:column; box-shadow:0 24px 80px rgba(0,0,0,.6);
}
.dl-modal h3 {
  padding:16px 22px 14px; margin:0; font-size:17px; letter-spacing:2px;
  color:var(--ink); border-bottom:1px solid var(--line);
}
.dl-modal-body { padding:18px 22px; overflow-y:auto; }
.dl-modal-body label {
  display:flex; align-items:center; gap:8px;
  margin-bottom:12px; color:var(--ink); font-size:14px; cursor:pointer;
}
.dl-modal-body input[type="radio"], .dl-modal-body input[type="checkbox"] {
  accent-color:var(--violet); width:16px; height:16px; cursor:pointer;
}
.dl-chapters-select {
  margin-top:8px; padding:12px 14px; border:1px solid var(--line); border-radius:8px;
  background:rgba(10,6,22,.35); display:none;
}
.dl-chapters-select.show { display:block; }
.dl-select-all {
  display:flex; align-items:center; gap:8px;
  margin-bottom:10px; color:var(--dim); font-size:13px; cursor:pointer;
}
.dl-chapter-list {
  display:flex; flex-direction:column; gap:8px; max-height:220px; overflow-y:auto;
}
.dl-chapter-list label { margin:0; color:var(--dim); }
.dl-modal-ft {
  padding:14px 22px 18px; display:flex; justify-content:flex-end; gap:12px;
  border-top:1px solid var(--line);
}
.dl-btn-cancel, .dl-btn-ok {
  padding:8px 26px; border-radius:6px; font-size:14px; cursor:pointer;
  font-family:inherit; letter-spacing:1px; transition:.25s;
}
.dl-btn-cancel { background:rgba(167,139,250,.08); color:var(--ink); border:1px solid var(--line); }
.dl-btn-cancel:hover { background:rgba(167,139,250,.16); }
.dl-btn-ok { background:#3b82f0; color:#fff; border:none; }
.dl-btn-ok:hover { background:#2563eb; }
.dl-btn-ok:disabled { opacity:.55; cursor:not-allowed; }
.doc-tip.ok { color:var(--cyan); }
.doc-tip.err { color:#ff8b8b; }

@media (max-width:900px) {
  .doc-viewer-bd { flex-direction:column; }
  .doc-sidebar {
    width:100%; min-width:0; max-width:none;       /* 窄屏占满整行，解除桌面端宽度边界 */
    border-right:none; border-bottom:1px solid var(--line); max-height:220px;
  }
  /* 窄屏上下堆叠，目录宽度由 CSS 接管，拖拽条隐藏 */
  .doc-resizer { display:none; }
  /* 窄屏不提供折叠：目录始终完整展开（宽度随容器，不做内容宽度冻结） */
  .doc-sidebar.is-collapsed ul,
  .doc-sidebar.is-collapsed .doc-sidebar-empty,
  .doc-sidebar.is-collapsed .sidebar-foot,
  .doc-sidebar.is-animating ul,
  .doc-sidebar.is-animating .doc-sidebar-empty,
  .doc-sidebar.is-animating .sidebar-foot { min-width:0; }
  .doc-sidebar-hd { display:none; }
  .doc-sidebar.is-collapsed { width:100%; overflow-y:auto; }
  .doc-sidebar.is-collapsed ul,
  .doc-sidebar.is-collapsed .doc-sidebar-empty,
  .doc-sidebar.is-collapsed .sidebar-foot { opacity:1; pointer-events:auto; }
  /* 头部：三段改竖排（放不下 40px，固定高度在这里失效）；页签排到最后一行，继续贴住头部下沿 */
  .doc-header {
    grid-template-columns:1fr; justify-items:center; align-items:stretch;
    row-gap:10px; padding:14px 16px 0; height:auto;
  }
  .doc-header-l { justify-self:center; padding-bottom:0; }
  .doc-header-r { justify-self:center; order:2; padding-bottom:0; }
  .doc-header-c { order:3; }
  .doc-tabs { --tab-slant:10px; }
  .doc-tab { padding:8px 18px 9px; letter-spacing:2px; }
}

/* ============================================================
   详情页「一屏」布局（理论 / 预言 / 著作详情，data-page 均以 -detail 结尾）
   思路与首页一致：页面高度锁定为视口高度，页脚压缩成一行，文档查看器占满剩余高度；
   左侧目录与右侧 PDF 各自内部滚动（滚动条留在各自区域内），页面本身不出滚动条。
   窄屏（≤900px）或矮屏（≤520px）自动放弃该限制，退回常规流式布局（见上方媒体查询）。
   ============================================================ */
@media (min-width:901px) and (min-height:521px) {
  body[data-page$="-detail"] { height:100vh; display:flex; flex-direction:column; overflow:hidden; }
  body[data-page$="-detail"] .wrap { width:100%; flex:1; min-height:0; display:flex; flex-direction:column; }
  body[data-page$="-detail"] #detail-box { flex:1; min-height:0; display:flex; flex-direction:column; }

  /* 页脚：压缩留白，把高度让给文档查看器（结语 .sub 样式见 footer .sub，各页统一） */
  body[data-page$="-detail"] > footer { flex:none; padding:10px 24px 8px; font-size:12.5px; }
  body[data-page$="-detail"] footer .icp { margin-top:4px; font-size:11.5px; }

  /* 查看器：头部固定，主体吃掉剩余高度（高度在这里被确定，不再由 820px 兜底撑开页面） */
  body[data-page$="-detail"] .doc-viewer { flex:1; min-height:0; display:flex; flex-direction:column; }
  body[data-page$="-detail"] .doc-header { flex:none; }
  body[data-page$="-detail"] .doc-viewer-bd { flex:1; min-height:0; }
  body[data-page$="-detail"] .doc-main { min-height:0; }
  body[data-page$="-detail"] .doc-tip { flex:none; }

  /* 左侧目录：整列不滚动，列表自己滚（滚动条固定在目录右缘），
     「整本下载」等页脚内容钉在底部（sidebar-foot 的 margin-top:auto 因此生效） */
  body[data-page$="-detail"] .doc-sidebar {
    display:flex; flex-direction:column; padding:10px 0 0;
    overflow:hidden;
  }
  body[data-page$="-detail"] .doc-sidebar ul,
  body[data-page$="-detail"] .doc-sidebar .doc-sidebar-empty { flex:1; min-height:0; }
  body[data-page$="-detail"] .doc-sidebar ul { overflow-y:auto; overflow-x:hidden; }
  body[data-page$="-detail"] .doc-sidebar .sidebar-foot { flex:none; }
  /* 目录滚动条：跟随主题的细滚动条（与首页列表 .scroll-box 一致） */
  body[data-page$="-detail"] .doc-sidebar ul::-webkit-scrollbar { width:6px; }
  body[data-page$="-detail"] .doc-sidebar ul::-webkit-scrollbar-thumb { background:rgba(167,139,250,.45); border-radius:3px; }
  body[data-page$="-detail"] .doc-sidebar ul::-webkit-scrollbar-track { background:rgba(167,139,250,.08); }

  /* PDF 视口：高度随容器，滚动交给 PDF 自身 */
  body[data-page$="-detail"] .doc-viewport { min-height:0; }
}

/* ---------- 轻提示（toast） ---------- */
.pw-toast {
  position:fixed; left:50%; bottom:56px; z-index:99;
  transform:translate(-50%,16px); opacity:0; pointer-events:none; transition:.25s;
  padding:12px 30px; border-radius:999px; font-size:14px; letter-spacing:2px;
  color:#1a1030; font-weight:600; background:linear-gradient(120deg,#c4b5fd,#67e8f9);
  box-shadow:0 8px 40px rgba(167,139,250,.4);
}
.pw-toast.show { opacity:1; transform:translate(-50%,0); }

/* ---------- 窄屏：面板堆叠为单列 ---------- */
@media (max-width:900px) {
  .pw-row { grid-template-columns:1fr; }
  #book-list .books { grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:12px; }
}

/* ---------- 页脚 ---------- */
footer { border-top:1px solid var(--line); padding:44px 24px 20px; text-align:center; color:var(--dim); font-size:13.5px; position:relative; z-index:1; }
/* 页脚结语（站点导语）：首页与各详情页完全是同一份样式，不要再按页面覆写 */
footer .sub { color:var(--violet2); font-size:clamp(14px,1.6vw,17px); line-height:1.6; letter-spacing:1px; margin-bottom:6px; }
footer .icp { font-size:12px; opacity:.55; margin-top:16px; }
footer .icp a.icp-link { color:inherit; text-decoration:none; border-bottom:1px solid transparent; transition:border-color .2s, opacity .2s; }
footer .icp a.icp-link:hover { border-bottom-color:currentColor; }

/* ============================================================
   首页「一屏」布局（仅 data-page="home" 生效）
   思路：页面高度锁定为视口高度（100vh），页头/页脚压缩，中间四个面板
   两行平分剩余高度；面板内容超出时在各自内部滚动，页面本身不出滚动条。
   窄屏或矮屏时自动放弃该限制，退回常规流式布局（见下方媒体查询）。
   ============================================================ */
body[data-page="home"] { height:100vh; display:flex; flex-direction:column; overflow-y:hidden; overflow-x:auto; }

/* 页头：压缩留白、缩小光环与标题 */
body[data-page="home"] > header { flex:none; padding:0px 24px 8px; }
body[data-page="home"] .ring { width:84px; height:84px; margin-right:28px; }
body[data-page="home"] .ring::after { font-size:13px; }
body[data-page="home"] .slogan { font-size:clamp(24px,3.2vw,34px); }

/* 主体：两行面板平分剩余高度 */
body[data-page="home"] .wrap { width:100%; flex:1; min-height:0; display:flex; flex-direction:column; gap:18px; }
body[data-page="home"] .pw-row { flex:1 1 0; min-height:0; gap:24px; margin-bottom:0; }
body[data-page="home"] .pw-row .panel { min-height:0; height:100%; }
body[data-page="home"] .panel-hd { flex:none; padding:12px 20px; }
body[data-page="home"] .panel-bd {
  flex:1; min-height:0; overflow:hidden;
  display:flex; flex-direction:column; padding:14px 20px 18px;
}

/* 列表：原固定高度改为撑满面板后内部滚动 */
body[data-page="home"] .scroll-box { flex:1; min-height:0; max-height:none; overflow-y:auto; }

/* 著作封面：高度撑满面板，宽度按 3/4.3 比例回算（不再出现超长封面） */
body[data-page="home"] #book-list { flex:1; min-height:0; }
body[data-page="home"] #book-list .books {
  height:100%; margin-top:0; gap:16px;
  grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:minmax(0,1fr);
}
body[data-page="home"] #book-list .book { min-height:0; display:flex; justify-content:center; }
body[data-page="home"] #book-list .cover { height:100%; max-height:100%; width:auto; max-width:100%; }

/* 盟友面板：按钮与文案同步收紧 */
body[data-page="home"] .panel.ally .panel-bd { padding:20px 22px; overflow-y:auto; }
body[data-page="home"] .panel.ally .btn { padding:11px 38px; font-size:16px; letter-spacing:2px; }
body[data-page="home"] .panel.ally .note { margin-top:14px; }
/* 加载态/失败提示：面板窄，收掉默认的 48px 上下留白 */
body[data-page="home"] .panel.ally .loading,
body[data-page="home"] .panel.ally .empty { padding:10px 0; font-size:13px; letter-spacing:1px; }

/* 页脚：压缩留白（页脚结语 .sub 与备案行 .icp 的样式见上方 footer .sub / footer .icp） */
body[data-page="home"] > footer { flex:none; padding:12px 24px; font-size:12.5px; }
body[data-page="home"] footer .icp { margin-top:6px; font-size:12px; }

/* 窄屏 / 矮屏：放弃一屏限制，恢复常规流式文档布局，避免内容被挤压或裁切 */
@media (max-width:1100px), (max-height:620px) {
  body[data-page="home"] { height:auto; min-height:100vh; display:block; overflow-x:hidden; overflow-y:visible; }
  body[data-page="home"] .wrap { min-width:0; display:block; }
  body[data-page="home"] .pw-row { display:grid; grid-template-columns:1fr 1fr; margin-bottom:28px; }
  body[data-page="home"] .pw-row .panel { height:auto; }
  body[data-page="home"] .panel-bd { display:block; overflow:visible; padding:16px 22px 22px; }
  body[data-page="home"] .scroll-box { max-height:300px; }
  body[data-page="home"] #book-list .books { height:auto; grid-auto-rows:auto; gap:20px; }
  body[data-page="home"] #book-list .cover { width:100%; height:auto; }
}
@media (max-width:900px) {
  body[data-page="home"] .pw-row { grid-template-columns:1fr; }
}

/* ============================================================
   首页字号整体放大（产品需求）
   背景：首页在浏览器默认 100% 缩放下字号偏小，缩放到 110% 才是需要的大小。
   做法：给首页（data-page="home"）定义字号系数 --fs:1.1，把本页所有可见文字的
        字号统一乘上它，等价于「把浏览器缩放调到 110% 之后，再把缩放调回 100%」。
   范围：只作用于首页本身与首页弹框（捐助 / 捐赠记录，两个弹框也都只挂在
        index.html 上）；下面每条规则都用 body[data-page="home"] 限定，其它页面不引用
        --fs，字号维持不变。
   排除：公共页脚 footer[data-component="site-footer"]（结语 + 备案行）不放大，
        见下方「页脚：整块排除」。
   注意：只放大字号，不动间距 / 圆角 / 宽度等尺寸，设计稿的骨架保持不变；
        书本封面里的文字用的是 cqw（随卡片宽度等比），不在这里重复放大。
   若以后要整体微调，只改下面这一个 --fs 值即可。
   ============================================================ */
body[data-page="home"] {
  --fs: 1.1;
  /* 未单独指定字号的文字（继承字号）也跟着放大 */
  font-size: calc(16px * var(--fs));
}

/* 页头 */
body[data-page="home"] .slogan { font-size: calc(clamp(24px,3.2vw,34px) * var(--fs)); }
body[data-page="home"] .ring::after { font-size: calc(13px * var(--fs)); }

/* 面板标题 / 搜索框 / 列表 */
body[data-page="home"] .panel-hd h2 { font-size: calc(20px * var(--fs)); }
body[data-page="home"] .hd-search input { font-size: calc(13px * var(--fs)); }
body[data-page="home"] .pw-list li { font-size: calc(15px * var(--fs)); }
body[data-page="home"] .pw-list .group-item,
body[data-page="home"] .pw-list .empty-item { font-size: calc(13.5px * var(--fs)); }
body[data-page="home"] .loading,
body[data-page="home"] .empty { font-size: calc(14px * var(--fs)); }

/* 盟友面板 */
body[data-page="home"] .panel.ally .lead { font-size: calc(18px * var(--fs)); }
body[data-page="home"] .panel.ally .btn { font-size: calc(16px * var(--fs)); }
body[data-page="home"] .panel.ally .note { font-size: calc(16px * var(--fs)); }
body[data-page="home"] .panel.ally .loading,
body[data-page="home"] .panel.ally .empty { font-size: calc(13px * var(--fs)); }

/* 页脚：整块排除，不参与放大
   页脚是公共组件（common.js 渲染进 footer[data-component="site-footer"]，
   含结语 .sub 与备案行 .icp），字号沿用原有规则；这里把 --fs 复位成 1，
   即使以后页脚内部再引用 --fs 也不会被放大。 */
body[data-page="home"] footer[data-component="site-footer"] { --fs: 1; }

/* 轻提示 */
body[data-page="home"] .pw-toast { font-size: calc(14px * var(--fs)); }

/* 捐助 / 捐赠记录弹框（结构由 donate-modal.js、donation-records.js 注入 body） */
body[data-page="home"] .pw-modal-hd h3 { font-size: calc(17px * var(--fs)); }
body[data-page="home"] .pw-modal-close { font-size: calc(22px * var(--fs)); }
body[data-page="home"] .pw-modal-lead,
body[data-page="home"] .pw-modal-tip { font-size: calc(13px * var(--fs)); }
body[data-page="home"] .pw-modal-btn { font-size: calc(14px * var(--fs)); }
body[data-page="home"] .pw-modal .form-label { font-size: calc(12.5px * var(--fs)); }
body[data-page="home"] .pw-modal input[type="text"],
body[data-page="home"] .pw-modal input[type="number"] { font-size: calc(14px * var(--fs)); }
body[data-page="home"] .pw-modal .amounts button { font-size: calc(15px * var(--fs)); }
body[data-page="home"] .pw-donate-amount { font-size: calc(14px * var(--fs)); }
body[data-page="home"] .pw-donate-amount b { font-size: calc(18px * var(--fs)); }
body[data-page="home"] .pw-channel .txt b { font-size: calc(14px * var(--fs)); }
body[data-page="home"] .pw-channel .txt span { font-size: calc(11px * var(--fs)); }
body[data-page="home"] .pw-pay-method .txt b { font-size: calc(14.5px * var(--fs)); }
body[data-page="home"] .pw-pay-method .txt span { font-size: calc(11.5px * var(--fs)); }
body[data-page="home"] .pw-pay-method .ok { font-size: calc(11px * var(--fs)); }
body[data-page="home"] .pw-qr-card-hd { font-size: calc(13.5px * var(--fs)); }
body[data-page="home"] .pw-pay-steps { font-size: calc(12px * var(--fs)); }
body[data-page="home"] .pw-pay-steps li::before { font-size: calc(11px * var(--fs)); }
body[data-page="home"] .pw-pay-frame-loading { font-size: calc(12.5px * var(--fs)); }
body[data-page="home"] .pw-pay-frame-tip { font-size: calc(11.5px * var(--fs)); }
body[data-page="home"] .pw-record-name { font-size: calc(14px * var(--fs)); }
body[data-page="home"] .pw-record-time { font-size: calc(11.5px * var(--fs)); }
body[data-page="home"] .pw-record-amount { font-size: calc(15px * var(--fs)); }
/* 捐赠记录弹框的页签栏与「结余」页签（结构见 donation-records.js） */
body[data-page="home"] .pw-record-tab { font-size: calc(12.5px * var(--fs)); }
body[data-page="home"] .pw-balance-item dt { font-size: calc(12.5px * var(--fs)); }
body[data-page="home"] .pw-balance-val { font-size: calc(17px * var(--fs)); }
body[data-page="home"] .pw-balance-val--balance { font-size: calc(26px * var(--fs)); }
body[data-page="home"] .link-btn { font-size: calc(13px * var(--fs)); }