/* ============================================================
   刘律 ｜ ZOE_AT_LAW · 电子书馆 — 统一阅读引擎样式 reader.css
   顶栏＝统一夜蓝金线（品牌识别）；阅读区底色随书变化(--bg1/2/3)
   一处修改，全部电子书同步。请勿在单本书里复制样式。
   ============================================================ */
:root{
  --navy:#111d40; --navy2:#0c1531; --navy3:#182750;
  --gold:#e2a94d; --gold-soft:#f2d98c; --ink:#eef1fa; --muted:#a9b2ca;
  --bg1:#3b0f27; --bg2:#4a1330; --bg3:#2c0a1c;   /* 由 book.js 覆盖 */
  --headh:52px; --footh:60px;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;overflow:hidden}
body{
  background:linear-gradient(170deg,var(--bg1),var(--bg2) 55%,var(--bg3));
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink);-webkit-user-select:none;user-select:none;
}

/* ── 顶栏：统一夜蓝＋金色细线 ── */
.zbar{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;
  gap:10px;padding:calc(env(safe-area-inset-top) + 9px) 14px 9px;
  background:linear-gradient(180deg,var(--navy),var(--navy2));
  border-bottom:1px solid rgba(226,169,77,.42);box-shadow:0 2px 14px rgba(0,0,0,.4)}
.zbar .back{flex:none;color:var(--gold-soft);text-decoration:none;font-size:13px;font-weight:700;
  white-space:nowrap;border:1px solid rgba(226,169,77,.5);border-radius:99px;
  padding:6px 13px;background:rgba(226,169,77,.06);transition:opacity .15s}
.zbar .back:active{opacity:.6}
.zbar .tt{flex:1;min-width:0;text-align:center;font-family:"Songti SC","Noto Serif SC",serif;
  font-weight:900;font-size:15px;color:#fff;letter-spacing:.03em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zbar .pi{flex:none;min-width:52px;text-align:right;font-family:"Courier New",monospace;
  font-weight:bold;font-size:12px;color:var(--gold);white-space:nowrap}

/* ── 进度线 ── */
.zprog{position:fixed;left:0;height:2px;background:var(--gold);z-index:41;width:0;
  top:calc(env(safe-area-inset-top) + var(--headh));transition:width .3s}

/* ── 阅读舞台（3D 翻书） ── */
.zstage{position:fixed;inset:calc(env(safe-area-inset-top) + var(--headh)) 0
  calc(env(safe-area-inset-bottom) + var(--footh)) 0;perspective:1600px;overflow:hidden}
.zsingle{position:absolute;inset:0}
.scr{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  transform-origin:left center;
  transition:transform .5s cubic-bezier(.4,.1,.3,1),opacity .5s;
  will-change:transform,opacity}
.scr img{max-width:94vw;max-height:calc(var(--vh,720px) - var(--headh) - var(--footh) - 34px);
  width:auto;height:auto;object-fit:contain;border-radius:10px;
  box-shadow:0 12px 38px rgba(0,0,0,.5);-webkit-user-drag:none}
.scr.past{transform:rotateY(-105deg);opacity:0;pointer-events:none}
.scr.fut{opacity:0;pointer-events:none}
.scr.off{display:none}
.znoanim .scr{transition:none}

/* ── 文本页（序言 / 尾声等） ── */
.txt{width:min(92vw,560px);max-height:calc(var(--vh,720px) - var(--headh) - var(--footh) - 24px);
  overflow:auto;background:#faf6ec;border-radius:16px;padding:26px 24px;
  box-shadow:0 12px 38px rgba(0,0,0,.5);color:#2c2a22;-webkit-user-select:text;user-select:text}
.txt .kick{font-family:"Courier New",monospace;font-weight:bold;font-size:12px;letter-spacing:.5em;color:#d62f80}
.txt h2{font-size:21px;font-weight:800;border-bottom:3px solid #1a1813;padding-bottom:8px;margin:6px 0 10px;color:#1a1813}
.txt .av{width:84px;float:right;margin:0 0 6px 10px;border-radius:8px}
.txt p{font-size:14.5px;line-height:1.95;color:#2c2a22;text-indent:2em;margin-bottom:6px}
.txt .signh{text-align:right;margin-top:10px}
.txt .signh img{width:150px;height:auto;opacity:.9}
.txt .pfc{margin-top:8px;text-align:center}
.txt .qr{width:116px;border-radius:8px;box-shadow:0 4px 14px rgba(74,19,48,.18)}
.txt .sc{font-size:10.5px;color:#8a8270;letter-spacing:.05em;margin-top:4px}
.txt .nm{font-weight:800;color:#4a1330;font-size:15px;margin-top:4px}
.txt .cr{font-size:11.5px;color:#5b5444;line-height:1.7}
.txt.end{background:transparent;box-shadow:none;color:#fff;text-align:center}
.txt.end h2{border:none;color:#fff;font-size:22px;line-height:1.8}
.txt.end h2 span{color:var(--gold)}
.txt.end .line{width:52px;height:3px;background:var(--gold);margin:14px auto}
.txt.end .c{color:#f3cfe0;text-indent:0}
.txt.end .small{font-size:12px;color:#d9a8c4}

/* ── 宽屏双页 · 真·翻书（纸张从右向左翻转） ── */
.zstage.spread{overflow:hidden}
.zspreadwrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  perspective:2600px}
.zbook{position:relative;height:min(calc(var(--vh,720px) - var(--headh) - var(--footh) - 26px),128vw);
  aspect-ratio:3/2;max-width:96vw;transform-style:preserve-3d}
.zbook::before,.zbook::after{content:"";position:absolute;top:.5%;height:99%;width:49.6%;
  border-radius:6px 14px 14px 6px;background:#f6f0e2;z-index:0;
  box-shadow:0 10px 26px rgba(0,0,0,.4),2px 2px 0 #e7dfcd,4px 4px 0 #efe8d6}
.zbook::before{right:0}
.zbook::after{left:0;border-radius:14px 6px 6px 14px;
  box-shadow:0 10px 26px rgba(0,0,0,.4),-2px 2px 0 #e7dfcd,-4px 4px 0 #efe8d6}
.zbook.at-start::after,.zbook.at-end::before{visibility:hidden}
.zsheet{position:absolute;top:0;left:50%;width:50%;height:100%;transform-origin:left center;
  transform-style:preserve-3d;will-change:transform;
  transition:transform .8s cubic-bezier(.35,.1,.2,1)}
.zsheet.flipped{transform:rotateY(-180deg)}
.znoanim .zsheet{transition:none}
.zface{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;
  border-radius:6px 14px 14px 6px;overflow:hidden;background:#faf6ec}
.zface.back{transform:rotateY(180deg);border-radius:14px 6px 6px 14px}
.zface.front::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(0,0,0,.13),transparent 9%)}
.zface.back::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(-90deg,rgba(0,0,0,.13),transparent 9%)}
.zpg{width:100%;height:100%;display:flex;flex-direction:column;background:#faf6ec}
.zpg.img img{width:100%;height:100%;object-fit:contain;background:#faf6ec}
/* 文本页(序言/尾声)在书页里填满并自适应缩小,保留二维码/签名 */
.zface .txt{width:100%;height:100%;max-height:100%;border-radius:0;box-shadow:none;
  overflow:hidden;padding:6% 7.5%;display:flex;flex-direction:column;background:#faf6ec}
.zface .txt .kick{font-size:clamp(9px,1vw,12px)}
.zface .txt h2{font-size:clamp(14px,1.7vw,20px);padding-bottom:5px;margin:4px 0 6px}
.zface .txt p{font-size:clamp(8.5px,1.02vw,12.5px);line-height:1.62;margin-bottom:2px;text-indent:2em}
.zface .txt .av{width:clamp(48px,6vw,80px)}
.zface .txt .signh{margin-top:auto;padding-top:4px}
.zface .txt .signh img{width:clamp(104px,14vw,165px)}
.zface .txt .pfc{margin-top:4px}
.zface .txt .qr{width:clamp(62px,7vw,90px)}
.zface .txt.end{background:linear-gradient(160deg,#5c1a3e,#4a1330 55%,#350d22);
  justify-content:center;padding:9% 10%}

/* ── 底部翻页栏（← 目录 →＋页码） ── */
.zfoot{position:fixed;bottom:0;left:0;right:0;z-index:40;display:flex;align-items:center;
  justify-content:center;gap:clamp(5px,2.2vw,10px);
  padding:9px clamp(8px,3vw,14px) calc(env(safe-area-inset-bottom) + 10px);
  background:linear-gradient(0deg,var(--navy),transparent)}
.zfoot .fb{display:flex;align-items:center;justify-content:center;gap:clamp(3px,1.4vw,6px);
  background:rgba(255,255,255,.14);backdrop-filter:blur(8px);color:#fff;border:none;
  border-radius:999px;padding:clamp(7px,2.2vw,9px) clamp(11px,3.8vw,18px);
  font-size:clamp(12px,3.5vw,13.5px);font-weight:800;white-space:nowrap;cursor:pointer;
  user-select:none;transition:opacity .15s}
.zfoot .fb:active{opacity:.6}
.zfoot .fb:disabled{opacity:.28;cursor:default}
.zfoot .fnum{font-family:"Courier New",monospace;font-weight:bold;font-size:clamp(11px,3.2vw,13px);
  color:var(--gold-soft);min-width:clamp(50px,15vw,64px);text-align:center;letter-spacing:.02em;
  white-space:nowrap}

/* ── 目录抽屉（底部升起） ── */
.zdw{position:fixed;inset:0;z-index:60;background:rgba(9,14,30,.6);display:none}
.zdw.open{display:block}
.zdw .panel{position:absolute;bottom:0;left:0;right:0;max-height:78dvh;
  background:#faf6ec;border-radius:18px 18px 0 0;display:flex;flex-direction:column;
  box-shadow:0 -10px 40px rgba(0,0,0,.5);animation:zup .28s ease}
@keyframes zup{from{transform:translateY(30px);opacity:.6}to{transform:none;opacity:1}}
.zdw h3{padding:16px 20px 10px;font-size:16px;font-weight:800;color:#4a1330;
  display:flex;justify-content:space-between;align-items:center}
.zdw h3 .x{font-size:20px;color:#9a8f76;cursor:pointer;padding:0 6px}
.zdw ul{list-style:none;overflow:auto;padding:0 12px calc(env(safe-area-inset-bottom) + 16px)}
.zdw li{display:flex;gap:10px;align-items:baseline;padding:11px 10px;font-size:14.5px;
  font-weight:600;color:#3a3428;border-radius:10px;cursor:pointer}
.zdw li:active{background:#f0e4ee}
.zdw li.on{background:rgba(214,47,128,.08);color:#b5245f}
.zdw li.chh{display:block;padding:14px 6px 5px;margin-top:4px;border-top:2px solid #eadff2;cursor:default}
.zdw li.chh:first-of-type{border-top:none;margin-top:0}
.zdw li.chh:active{background:none}
.zdw li.chh .ct{font-weight:800;color:#4a1330;font-size:15px}
.zdw li.chh .cs{color:#9a8f76;font-weight:600;font-size:11px;margin-left:8px}
.zdw .n{font-family:"Courier New",monospace;font-weight:bold;color:#d62f80;font-size:12px;flex:none;width:36px}

@media(min-width:900px){
  .zbar .tt{font-size:16px}
  .zdw .panel{max-width:560px;left:50%;transform:translateX(-50%);border-radius:18px 18px 0 0}
}

/* ── 分享按钮(顶栏) ── */
.zbar .zshare{flex:none;width:30px;height:30px;border-radius:50%;border:1px solid rgba(226,169,77,.5);
  background:rgba(226,169,77,.06);color:var(--gold-soft);font-size:15px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:opacity .15s;padding:0}
.zbar .zshare:active{opacity:.6}

/* ── 目录工具：搜索 + 跳页 ── */
.zdwtools{display:flex;flex-wrap:wrap;gap:8px;padding:2px 20px 10px;align-items:center}
.zsearch{flex:1 1 170px;min-width:0;font-size:14px;color:#4a1330;background:#fff;
  border:1px solid #e3d6ea;border-radius:99px;padding:8px 14px;outline:none}
.zsearch:focus{border-color:#d6a5c0}
.zsearch::placeholder{color:#b3a894}
.zjump{flex:none;display:flex;align-items:center;gap:4px}
.zjump input{width:50px;font-size:14px;color:#4a1330;background:#fff;border:1px solid #e3d6ea;
  border-radius:8px;padding:8px 4px;text-align:center;outline:none;-moz-appearance:textfield}
.zjump input::-webkit-outer-spin-button,.zjump input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.zjump .jtot{font-size:12px;color:#9a8f76;white-space:nowrap}
.zjump button{font-size:13px;font-weight:700;color:#fff;background:#4a1330;border:none;
  border-radius:8px;padding:8px 12px;cursor:pointer}
.zjump button:active{opacity:.7}

/* ── toast 轻提示 ── */
.ztoast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom) + var(--footh) + 14px);
  transform:translate(-50%,10px);z-index:80;background:rgba(17,29,64,.96);color:#eef1fa;
  font-size:13.5px;font-weight:700;padding:10px 18px;border-radius:99px;
  border:1px solid rgba(226,169,77,.4);box-shadow:0 8px 26px rgba(0,0,0,.5);
  opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;
  white-space:nowrap;max-width:92vw;overflow:hidden;text-overflow:ellipsis}
.ztoast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.ztoast b#ztostart{color:var(--gold-soft);cursor:pointer;border-bottom:1px solid rgba(242,217,140,.55);font-weight:800;margin-left:4px}

/* ── 图片加载失败 · 点击重试 ── */
.zfail{position:relative}
.zfail img{visibility:hidden}
.zfail::after{content:"⟳ 图片加载失败 · 点此重试";position:absolute;inset:0;margin:auto;
  width:max-content;height:max-content;max-width:80%;padding:12px 20px;border-radius:12px;
  background:rgba(250,246,236,.96);color:#4a1330;font-size:14px;font-weight:700;text-align:center;
  box-shadow:0 8px 24px rgba(0,0,0,.35);pointer-events:none}