/* ============================================
   使命书 · The Book of Mission
   水墨淡雅 · 宣纸留白 · 呼吸感
   ============================================ */

:root{
  /* 水墨色板 — 冷灰青调 */
  --ink:        #2c2f33;
  --ink-soft:   #4a4f55;
  --ink-mist:   #8a9099;
  --ink-ghost:  #b5bcc5;
  --paper:      #f0eeea;
  --paper-warm: #e8e5df;
  --paper-deep: #ddd9d2;
  --cinnabar:   #8b3a2f;
  --cinnabar-d: #6e2d22;
  --gold:       #9e8c6c;
  --gold-soft:  #b8a88a;
  --shadow-ink: rgba(44,47,51,.08);
}

*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;}
body{
  font-family:"Noto Serif SC","Songti SC","SimSun",serif;
  background:#e6e3dd;
  color:var(--ink);
  overflow:hidden;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  user-select:none;
}

/* ---------- 手机舞台 ---------- */
.stage{
  position:fixed;inset:0;
  display:flex;align-items:center;justify-content:center;
  background:#dbd7d0;
}
.phone{
  position:relative;
  width:min(100vw, 420px);
  height:min(100vh, calc(420px * 19.5 / 9));
  max-height:100vh;
  overflow:hidden;
  background:var(--paper);
  box-shadow:
    0 20px 60px rgba(0,0,0,.12),
    0 0 0 1px rgba(0,0,0,.06);
}
@media (min-aspect-ratio: 9/16){
  .phone{height:100vh;width:calc(100vh * 9 / 19.5);}
}

/* ---------- 纸张肌理 — 极简一层 ---------- */
.paper-bg{
  position:absolute;inset:0;
  z-index:0;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(255,255,255,.35) 0%, transparent 60%),
    var(--paper);
}
.paper-bg::before{
  content:"";position:absolute;inset:0;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='2' seed='5'/><feColorMatrix values='0 0 0 0 0.4  0 0 0 0 0.38  0 0 0 0 0.35  0 0 0 0.04 0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");
  opacity:.6;mix-blend-mode:multiply;pointer-events:none;
}
.paper-bg::after{display:none;}

.paper-bg.dark{
  background:#1a1c20 !important;
}
.paper-bg.dark::before{
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='2'/><feColorMatrix values='0 0 0 0 0.7  0 0 0 0 0.68  0 0 0 0 0.65  0 0 0 0.03 0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");
  mix-blend-mode:screen;opacity:.2;
}

/* ---------- 页容器 · 跟手翻页架构 ---------- */
.book{position:absolute;inset:0;overflow:hidden;}
.page{
  position:absolute;inset:0;
  display:flex;flex-direction:column;
  padding:56px 36px 80px;
  overflow:hidden;
  opacity:0;
  pointer-events:none;
  transform:translateX(100%);
  will-change:transform;
  /* 默认无transition，切换状态时由JS临时加 */
}
.page.active{
  opacity:1;pointer-events:auto;transform:translateX(0);
  z-index:2;
}
.page.prev{opacity:1;transform:translateX(-100%);z-index:1;}
.page.next{opacity:1;transform:translateX(100%);z-index:1;}
/* 非邻页保持隐藏 */
.page.far-prev{opacity:0;transform:translateX(-100%);pointer-events:none;}
.page.far-next{opacity:0;transform:translateX(100%);pointer-events:none;}

/* 切换时启用动画：慢-快-慢惯性曲线 */
.page.animating{
  transition:transform .55s cubic-bezier(.32,.72,.24,1), opacity .4s ease;
}

/* 翻书阴影 —— 每页右边缘投影，让叠加有层次感 */
.page::before{
  content:"";position:absolute;top:0;bottom:0;right:-1px;width:22px;
  background:linear-gradient(to left,
    rgba(44,47,51,.14) 0%,
    rgba(44,47,51,.06) 40%,
    rgba(44,47,51,0) 100%);
  pointer-events:none;
  opacity:0;
  transition:opacity .4s ease;
}
.page.active::before,
.page.dragging::before{opacity:1;}

/* 拖动时临时取消动画 */
.page.dragging{transition:none !important;}

/* page内除了paper-bg都在其上层（paper-bg已设z-index:0） */
.page > *:not(.paper-bg){
  z-index:1;
}
/* 让非定位的内容容器能触发z-index */
.lead, .form, .short-story, .chapter, .paywall, .final, .loading-wrap, .mission-card, .mission-title-big, .one-line, .save-row, .page-kicker, .page-title, .toc, .vol{
  position:relative;
}

.page-scroll{flex:1;overflow-y:auto;overflow-x:hidden;}
.page-scroll::-webkit-scrollbar{display:none;}

/* ---------- 共用元件 ---------- */
.seal{
  display:inline-block;
  padding:10px 12px;
  color:rgba(240,228,210,.85);
  background:var(--cinnabar);
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:13px;line-height:1;
  letter-spacing:4px;
  writing-mode:vertical-rl;
  box-shadow:inset 0 0 0 1px rgba(240,228,210,.3), 0 2px 8px rgba(0,0,0,.08);
  position:relative;
  opacity:.65;
}
.seal::after{
  content:"";position:absolute;inset:0;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='60'><filter id='n'><feTurbulence baseFrequency='0.8'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.9 0'/></filter><rect width='60' height='60' filter='url(%23n)'/></svg>");
  mix-blend-mode:lighten;opacity:.2;
}

/* 翻页提示：右边缘小三角（呼吸+左右漂移） */
.turn-hint{
  position:absolute;
  right:4px;top:50%;
  transform:translateY(-50%);
  z-index:3;
  pointer-events:auto;
  cursor:pointer;
  font-size:0;
  line-height:0;
  color:transparent;
  animation:none;
  width:10px;height:14px;
}
.turn-hint.light{color:transparent;}
.turn-hint::before{display:none;}
/* 小三角用border画（左指） */
.turn-hint::after{
  content:"";
  position:absolute;
  right:0;top:50%;
  width:0;height:0;
  border-top:6px solid transparent;
  border-bottom:6px solid transparent;
  border-right:8px solid var(--ink-mist);
  transform:translateY(-50%);
  opacity:.4;
  animation:arrowBreath 2.2s ease-in-out infinite;
}
.turn-hint.light::after{
  border-right-color:rgba(220,218,214,.75);
}
@keyframes arrowBreath{
  0%,100%{transform:translate(4px,-50%);opacity:.3;}
  50%{transform:translate(-3px,-50%);opacity:.85;}
}

.v-rule{
  position:absolute;top:40px;bottom:40px;width:1px;
  background:linear-gradient(to bottom, transparent, var(--ink-ghost) 20%, var(--ink-ghost) 80%, transparent);
  opacity:.12;
}
.v-rule.left{left:20px;}
.v-rule.right{right:20px;}
.v-rule.light{background:linear-gradient(to bottom, transparent, var(--paper) 20%, var(--paper) 80%, transparent);opacity:.1;}

.corner{position:absolute;width:26px;height:26px;opacity:.15;}
.corner svg{width:100%;height:100%;}

/* ========= 页1 · 封面 ========= */
.cover-title{
  position:absolute;
  top:46%;left:50%;transform:translate(-50%,-50%);
  text-align:center;
  color:rgba(220,216,208,.88);
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:58px;letter-spacing:0;
  writing-mode:vertical-rl;
  text-orientation:upright;
  line-height:1.3;
  text-shadow:0 0 40px rgba(0,0,0,.12);
  white-space:nowrap;
}
.cover-title .char{display:inline;}
.cover-sub{
  position:absolute;
  bottom:22%;left:0;right:0;
  text-align:center;
  color:rgba(180,176,168,.4);
  font-family:"EB Garamond",serif;
  font-style:italic;
  letter-spacing:.35em;
  font-size:10px;
  padding-left:.35em;
}
.cover-sub::before, .cover-sub::after{
  content:"";display:inline-block;width:24px;height:1px;
  background:rgba(180,176,168,.25);
  vertical-align:middle;margin:0 12px;
}
.cover-seal-wrap{
  position:absolute;
  left:32px;bottom:110px;
}
.cover-star{
  position:absolute;
  top:14%;left:50%;transform:translateX(-50%);
  width:160px;height:160px;
  opacity:.15;
  animation:rotateSlow 120s linear infinite;
}
@keyframes rotateSlow{to{transform:translateX(-50%) rotate(360deg);}}

.cover-frame{
  position:absolute;inset:24px;
  border:1px solid rgba(180,176,168,.1);
  pointer-events:none;
}
.cover-frame::before{
  content:"";position:absolute;inset:6px;
  border:1px solid rgba(180,176,168,.05);
}

.cover-spine{
  position:absolute;left:0;top:0;bottom:0;width:24px;
  background:
    repeating-linear-gradient(to bottom,
      transparent 0 40px,
      rgba(180,176,168,.08) 40px 41px);
  border-right:1px solid rgba(180,176,168,.06);
}
.cover-spine::before, .cover-spine::after{
  content:"";position:absolute;left:7px;width:10px;height:1px;
  background:rgba(180,176,168,.2);
}
.cover-spine::before{top:60px;}
.cover-spine::after{bottom:60px;}

/* ========= 页2 · 引导语 ========= */
.lead{
  flex:1;display:flex;flex-direction:column;justify-content:center;
  text-align:center;
  font-size:16px;line-height:2.4;
  color:var(--ink-soft);
  letter-spacing:.08em;
  padding:0 12px;
}
.lead p{
  opacity:0;
  transform:translateY(10px);
  transition:opacity 2s cubic-bezier(.25,.1,.25,1), transform 2s cubic-bezier(.25,.1,.25,1);
  will-change:opacity,transform;
}
.page.active .lead p.shown{opacity:1;transform:none;}
.lead p:last-child.shown{color:var(--cinnabar);font-weight:500;}

.page-title{
  text-align:center;
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:24px;letter-spacing:.5em;
  color:var(--ink);
  padding-left:.5em;
  margin-bottom:8px;
}
.page-title::after{
  content:"";display:block;width:20px;height:1px;
  background:var(--ink-mist);
  margin:16px auto 0;
  opacity:.4;
}
.page-kicker{
  text-align:center;
  font-family:"EB Garamond",serif;font-style:italic;
  color:var(--ink-ghost);font-size:10px;letter-spacing:.4em;
  margin-bottom:32px;text-transform:uppercase;padding-left:.4em;
}

/* ========= 页3 · 表单 ========= */
.form{
  margin-top:6px;flex:1;overflow-y:auto;
  display:flex;flex-direction:column;
}
.form::-webkit-scrollbar{display:none;}

.field{
  position:relative;
  margin-bottom:18px;
  padding:14px 14px 14px 46px;
  background:transparent;
  border-bottom:1px solid rgba(138,144,153,.1);
}
.field:last-of-type{border-bottom:none;}

.field-num{
  position:absolute;
  left:8px;top:50%;transform:translateY(-50%);
  width:24px;height:24px;
  background:var(--ink);
  color:var(--paper);
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:12px;
  display:flex;align-items:center;justify-content:center;
  opacity:.3;
}
.field-num::after{
  content:"";position:absolute;inset:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40'><filter id='n'><feTurbulence baseFrequency='0.8'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.9 0'/></filter><rect width='40' height='40' filter='url(%23n)'/></svg>");
  mix-blend-mode:lighten;opacity:.15;
}

.field-head{
  display:flex;align-items:baseline;
  margin-bottom:10px;
}
.field-label{
  color:var(--ink-soft);
  font-size:13px;letter-spacing:.5em;padding-left:.5em;
  font-weight:400;
}
.field-en{
  margin-left:auto;
  font-family:"EB Garamond",serif;font-style:italic;
  color:var(--ink-ghost);font-size:10px;letter-spacing:.15em;
}

.row3{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:0;}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:0;}

.cell{
  position:relative;
  display:flex;flex-direction:column;align-items:center;
}
.cell + .cell{
  border-left:1px solid rgba(138,144,153,.1);
}
.cell-unit{
  font-size:10px;letter-spacing:.3em;padding-left:.3em;
  color:var(--ink-ghost);
  margin-top:4px;
}
.select, .input{
  width:100%;
  background:transparent;
  border:none;
  padding:6px 4px 2px;
  font-family:"Noto Serif SC",serif;
  font-size:20px;
  color:var(--ink);
  text-align:center;
  letter-spacing:.02em;
  outline:none;
  appearance:none;-webkit-appearance:none;
  border-radius:0;
  font-weight:400;
}
.select{
  background-image:none;
  padding-right:4px;
  cursor:pointer;
}

.gender{
  display:grid;grid-template-columns:1fr 1fr;gap:0;
  position:relative;
}
.gender::after{
  content:"";position:absolute;left:50%;top:10%;bottom:10%;width:1px;
  background:rgba(138,144,153,.12);
}
.gender label{
  position:relative;
  text-align:center;padding:12px 0;
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:22px;letter-spacing:.4em;padding-left:.4em;
  color:var(--ink-ghost);
  cursor:pointer;
  transition:all .4s ease;
}
.gender input{position:absolute;opacity:0;pointer-events:none;}
.gender label:has(input:checked){
  color:var(--ink);
}
.gender label:has(input:checked)::before{
  content:"";position:absolute;
  left:50%;top:50%;transform:translate(-50%,-50%);
  width:50px;height:50px;
  border:1px solid var(--ink-mist);
  border-radius:50%;
  opacity:.25;
}
.gender label:has(input:checked)::after{
  content:"";position:absolute;
  left:50%;bottom:4px;
  width:5px;height:5px;background:var(--ink-mist);
  transform:translateX(-50%) rotate(45deg);
  opacity:.4;
}

/* 提交按钮 — 朱砂印章 */
.submit{
  margin:32px auto 0;
  display:flex;align-items:center;justify-content:center;
  width:auto;
  padding:14px 40px;
  background:var(--cinnabar);
  border:none;
  color:rgba(243,228,196,.92);
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:17px;letter-spacing:.35em;
  cursor:pointer;
  position:relative;
  text-align:center;
  box-shadow:
    inset 0 0 0 2px rgba(243,228,196,.22);
  transition:transform .15s ease;
}
/* 印章磨损纹理 */
.submit::after{
  content:"";position:absolute;inset:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='80' height='80'><filter id='n'><feTurbulence baseFrequency='0.65' numOctaves='3'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.9 0'/></filter><rect width='80' height='80' filter='url(%23n)'/></svg>");
  mix-blend-mode:lighten;opacity:.1;
  pointer-events:none;
}
.submit span{
  position:relative;
  color:rgba(243,228,196,.92);
  -webkit-text-fill-color:rgba(243,228,196,.92);
  letter-spacing:.35em;
  padding-left:.35em;
}
.submit .side{display:none;}
.submit:active{
  transform:scale(.96);
}

/* ========= 页4 · Loading ========= */
.loading-wrap{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  position:relative;
}
.ink-brush{
  width:120px;height:120px;
  position:relative;margin-bottom:44px;
}
.ink-brush .dot{
  position:absolute;top:50%;left:50%;
  width:70px;height:70px;
  border-radius:50%;
  background:radial-gradient(circle, var(--ink) 0%, var(--ink-soft) 35%, transparent 70%);
  transform:translate(-50%,-50%);
  filter:blur(3px);
  animation:inkPulse 3.5s ease-in-out infinite;
}
.ink-brush .ring{
  position:absolute;inset:0;
  border:1px solid var(--ink-ghost);
  border-radius:50%;
  opacity:.15;
}
.ink-brush .ring.r2{inset:14px;animation:rotateSlow 45s linear infinite;border-style:dashed;opacity:.1;}
.ink-brush .ring.r3{inset:28px;opacity:.08;}
@keyframes inkPulse{
  0%,100%{transform:translate(-50%,-50%) scale(.85);opacity:.6;}
  50%{transform:translate(-50%,-50%) scale(1);opacity:.85;}
}
.loading-text{
  font-size:15px;letter-spacing:.4em;padding-left:.4em;
  color:var(--ink-soft);
  min-height:26px;
  transition:opacity .8s ease;
  text-align:center;
}
.loading-sub{
  margin-top:20px;
  font-family:"EB Garamond",serif;font-style:italic;
  font-size:10px;letter-spacing:.3em;
  color:var(--ink-ghost);
  text-transform:uppercase;
}
.loading-bar{
  position:relative;
  width:200px;height:1px;
  margin-top:44px;
  background:rgba(138,144,153,.12);
  overflow:hidden;
}
.loading-bar-fill{
  position:absolute;left:0;top:0;bottom:0;width:0%;
  background:linear-gradient(to right, rgba(138,144,153,.5), var(--ink-mist));
  transition:width .8s ease;
}
.loading-bar-fill::after{
  content:"";position:absolute;right:0;top:-1px;bottom:-1px;width:10px;
  background:linear-gradient(to right, transparent, rgba(44,47,51,.15));
}
.loading-eta{
  margin-top:24px;
  font-size:11px;letter-spacing:.05em;
  color:var(--ink-ghost);
  opacity:.7;
  line-height:1.8;
}
/* 旧的loading-dots样式保留也无妨，HTML里去掉了 */
.loading-dots{display:none;}
.loading-dots i:nth-child(2){animation-delay:.2s;}
.loading-dots i:nth-child(3){animation-delay:.4s;}
.loading-dots i:nth-child(4){animation-delay:.6s;}
.loading-dots i:nth-child(5){animation-delay:.8s;}
@keyframes dotPulse{
  0%,60%,100%{opacity:.12;transform:scale(.8);}
  30%{opacity:.6;transform:scale(1.2);}
}

/* ========= 页5 · 使命卡 ========= */
.mission-card{
  position:relative;
  margin:8px auto 20px;
  width:78%;max-width:300px;aspect-ratio:3/4;
  background:
    radial-gradient(ellipse at 50% 40%, #3a3d42 0%, #1e2024 100%);
  overflow:hidden;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
  flex-shrink:0;
}
.mission-card .placeholder{
  position:absolute;inset:0;
  background-image:
    radial-gradient(ellipse at 50% 35%, rgba(180,176,168,.08), transparent 60%);
  display:flex;align-items:center;justify-content:center;
  color:rgba(180,176,168,.35);
  font-family:"Courier New",monospace;
  font-size:10px;letter-spacing:.3em;
}
.mission-card img{width:100%;height:100%;object-fit:cover;display:block;}
.mission-card .frame{
  position:absolute;inset:10px;
  border:1px solid rgba(180,176,168,.15);pointer-events:none;
}
.mission-card .frame::before{
  content:"";position:absolute;inset:3px;border:1px solid rgba(180,176,168,.08);
}
.mission-card .qr{
  position:absolute;right:12px;bottom:12px;
  width:48px;height:48px;
  background:#fff;padding:4px;
  display:flex;align-items:center;justify-content:center;
  opacity:.8;
}
.mission-card .qr img, .mission-card .qr canvas{width:100%;height:100%;}
.mission-card .card-corner{
  position:absolute;width:20px;height:20px;
  border-color:rgba(180,176,168,.3);
}
.mission-card .card-corner.tl{top:6px;left:6px;border-top:1px solid;border-left:1px solid;}
.mission-card .card-corner.tr{top:6px;right:6px;border-top:1px solid;border-right:1px solid;}
.mission-card .card-corner.bl{bottom:6px;left:6px;border-bottom:1px solid;border-left:1px solid;}
.mission-card .card-corner.br{bottom:6px;right:6px;border-bottom:1px solid;border-right:1px solid;}

.mission-title-big{
  text-align:center;
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:32px;letter-spacing:.25em;
  color:var(--ink);
  padding-left:.25em;
  margin-top:6px;
}
.mission-title-big::after{
  content:"";display:block;width:36px;height:1px;
  background:var(--ink-mist);margin:14px auto 0;
  opacity:.35;
}
.one-line{
  text-align:center;
  font-size:13px;letter-spacing:.15em;
  color:var(--ink-soft);
  margin-top:16px;line-height:2;
  padding:0 10px;
}
.save-row{
  display:flex;gap:10px;margin-top:22px;justify-content:center;
}
.ghost-btn{
  background:transparent;
  border:1px solid var(--ink-ghost);
  color:var(--ink-mist);
  font-family:inherit;
  font-size:11px;letter-spacing:.4em;padding:10px 20px 10px calc(20px + .4em);
  cursor:pointer;
}

/* ========= 页6 · 短故事 ========= */
.short-story{
  flex:1;
  display:flex;flex-direction:column;justify-content:center;
  text-align:center;
  font-size:16px;line-height:1.95;letter-spacing:.1em;
  color:var(--ink-soft);
  padding:0 10px;
}
.short-story p{margin:.18em 0;}
.short-story .ellipsis{
  margin-top:24px;color:var(--ink-soft);font-size:12px;letter-spacing:.6em;padding-left:.6em;
  font-style:italic;
}

/* ========= 页7 · 付费墙 · 重写 ========= */
.paywall{
  flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;
  padding:0 6px;
}
.paywall-kicker{
  font-family:"EB Garamond",serif;font-style:italic;
  font-size:10px;letter-spacing:.45em;padding-left:.45em;
  color:var(--ink-ghost);
  text-transform:uppercase;
  margin-bottom:22px;
}
.paywall-title{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:42px;letter-spacing:.22em;padding-left:.22em;
  color:var(--ink);
  line-height:1.3;
  margin-bottom:4px;
  white-space:nowrap;
  text-align:center;
}
.paywall-rule{
  width:1px;height:32px;
  background:linear-gradient(to bottom, var(--ink-mist), transparent);
  opacity:.5;
  margin:18px auto 24px;
}
.paywall-body{
  font-size:14px;line-height:2.4;letter-spacing:.25em;padding-left:.25em;
  color:var(--ink-soft);
}
.paywall-body .paywall-line{
  margin-top:14px;
  color:var(--ink);
  font-weight:500;
  letter-spacing:.35em;padding-left:.35em;
}
.paywall-divider{
  width:100%;
  display:flex;align-items:center;justify-content:center;
  margin:34px 0 24px;
}
.paywall-divider-line{
  display:inline-block;
  width:60px;height:1px;
  background:var(--ink-ghost);
  opacity:.4;
}
.paywall-price{
  font-family:"EB Garamond",serif;
  color:var(--ink);
  margin-bottom:32px;
}
.paywall-price .sym{
  font-size:18px;vertical-align:top;
  margin-right:3px;opacity:.7;
}
.paywall-price .num{
  font-size:40px;font-weight:400;
  letter-spacing:.02em;
}
/* "润笔"按钮：印章感 */
.paywall-seal{
  position:relative;
  display:inline-flex;align-items:center;justify-content:center;
  padding:14px 26px 14px calc(26px + .3em);
  background:var(--cinnabar);
  border:none;
  color:rgba(243,228,196,.95);
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:17px;letter-spacing:.3em;
  cursor:pointer;
  box-shadow:
    inset 0 0 0 2px rgba(243,228,196,.25),
    0 4px 14px rgba(139,58,47,.18);
  transition:transform .15s ease;
}
.paywall-seal::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='80' height='80'><filter id='n'><feTurbulence baseFrequency='0.7' numOctaves='3'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.9 0'/></filter><rect width='80' height='80' filter='url(%23n)'/></svg>");
  mix-blend-mode:lighten;opacity:.12;
}
.paywall-seal:active{transform:scale(.96);}
.paywall-seal:disabled{opacity:.6;cursor:not-allowed;}

/* —— 我有兑换码 入口链接 —— */
.paywall-redeem-link{
  display:block;
  margin:18px auto 0;
  background:transparent;border:none;
  color:var(--ink-mist);
  font-family:"Noto Serif SC",serif;
  font-size:11px;letter-spacing:.4em;padding-left:.4em;
  cursor:pointer;
  opacity:.7;
  transition:opacity .2s;
  border-bottom:1px solid rgba(138,144,153,.2);
  padding-bottom:4px;
}
.paywall-redeem-link:hover,
.paywall-redeem-link:active{
  opacity:1;
}

/* —— 兑换码弹窗 —— */
.redeem-modal{
  position:fixed;inset:0;
  background:rgba(20,18,15,.55);
  display:flex;align-items:center;justify-content:center;
  z-index:9999;
  opacity:0;pointer-events:none;
  transition:opacity .25s ease;
  padding:24px;
}
.redeem-modal.show{
  opacity:1;pointer-events:auto;
}
.redeem-modal-card{
  background:#f3e4c4;
  width:100%;max-width:340px;
  padding:32px 28px 24px;
  position:relative;
  box-shadow:0 10px 40px rgba(0,0,0,.25);
  transform:scale(.95);
  transition:transform .25s ease;
}
.redeem-modal.show .redeem-modal-card{
  transform:scale(1);
}
.redeem-modal-title{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:22px;letter-spacing:.4em;padding-left:.4em;
  text-align:center;
  color:var(--ink);
}
.redeem-modal-rule{
  width:32px;height:1px;
  background:var(--ink-ghost);
  margin:14px auto 22px;
  opacity:.5;
}
.redeem-input{
  width:100%;
  padding:12px 14px;
  border:1px solid rgba(138,144,153,.3);
  background:rgba(255,255,255,.4);
  font-family:"Courier New",monospace;
  font-size:14px;letter-spacing:.15em;
  color:var(--ink);
  text-align:center;
  text-transform:uppercase;
  outline:none;
  box-sizing:border-box;
}
.redeem-input:focus{
  border-color:var(--cinnabar);
}
.redeem-msg{
  text-align:center;
  margin-top:14px;
  font-size:12px;letter-spacing:.1em;
  color:var(--ink-mist);
  min-height:18px;
  font-family:"Noto Serif SC",serif;
}
.redeem-msg.err{color:var(--cinnabar);}
.redeem-msg.ok{color:#5a7a4a;}
.redeem-actions{
  display:flex;gap:12px;margin-top:22px;
}
.redeem-btn-cancel,
.redeem-btn-ok{
  flex:1;
  padding:12px 0 12px .3em;
  border:none;
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:15px;letter-spacing:.3em;
  cursor:pointer;
  transition:opacity .15s ease,transform .15s ease;
}
.redeem-btn-cancel{
  background:transparent;
  color:var(--ink-mist);
  border:1px solid rgba(138,144,153,.3);
}
.redeem-btn-ok{
  background:var(--cinnabar);
  color:rgba(243,228,196,.95);
  box-shadow:inset 0 0 0 2px rgba(243,228,196,.25);
}
.redeem-btn-cancel:active,
.redeem-btn-ok:active{transform:scale(.96);}

/* 保留旧.pay-btn class作晃动效果用（id相同） */
.paywall-seal.pay-shake{
  animation:payBtnShake .6s cubic-bezier(.36,.07,.19,.97);
  box-shadow:inset 0 0 0 2px rgba(243,228,196,.35),
             0 4px 28px rgba(139,58,47,.4),
             0 0 0 3px rgba(139,58,47,.18);
}

/* ========= 页8+ · 章节 ========= */
.chapter{flex:1;display:flex;flex-direction:column;padding-top:10px;}
.chapter-num{
  text-align:center;
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:44px;color:var(--ink);opacity:.15;
  margin-bottom:8px;letter-spacing:.1em;padding-left:.1em;
}
.chapter-name{
  text-align:center;
  font-size:18px;letter-spacing:1em;padding-left:1em;
  color:var(--ink);margin-bottom:20px;
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
}
.chapter-name::after{
  content:"";display:block;width:24px;height:1px;background:var(--ink-ghost);
  margin:16px auto 0;opacity:.35;
}
.chapter-body{
  flex:1;overflow-y:auto;
  font-size:15px;line-height:2.2;
  color:var(--ink-soft);
  text-indent:2em;
  text-align:justify;
  letter-spacing:.04em;
  padding:0 2px 10px;
}
.chapter-body::-webkit-scrollbar{display:none;}
.chapter-body p{margin-bottom:.6em;}
.chapter-footer{
  margin-top:14px;
  display:flex;align-items:center;justify-content:space-between;
  color:var(--ink-ghost);font-size:10px;letter-spacing:.3em;
  padding:12px 2px 0;
  border-top:1px solid rgba(138,144,153,.08);
}

/* ========= 末页 ========= */
.final{
  flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;
}
.final .echo-title{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:54px;letter-spacing:.25em;padding-left:.25em;
  color:var(--ink);
}
.final .echo-title::after{
  content:"";display:block;width:36px;height:1px;background:var(--ink-ghost);
  margin:24px auto;opacity:.4;
}
.final .echo-line{
  font-size:14px;letter-spacing:.15em;line-height:2.2;
  color:var(--ink-soft);max-width:270px;margin:0 auto;
}
.final .slogan{
  margin-top:60px;
  font-size:12px;letter-spacing:.3em;padding-left:.3em;
  color:var(--ink-mist);
  font-weight:400;
}
.final .slogan::before{
  content:"";display:block;width:18px;height:1px;background:var(--ink-ghost);margin:0 auto 20px;
  opacity:.35;
}

/* ========= 进度条 · 底部横向 ========= */
.progress{
  position:absolute;left:0;right:0;bottom:0;
  height:2px;
  background:rgba(138,144,153,.06);
  z-index:20;
}
.progress-fill{
  position:absolute;left:0;top:0;height:100%;
  background:var(--ink-mist);
  opacity:.35;
  transition:width .6s ease;
}
.progress-label{
  position:absolute;right:10px;bottom:8px;
  font-family:"EB Garamond",serif;
  font-size:9px;letter-spacing:.3em;
  color:var(--ink-ghost);
  white-space:nowrap;
  opacity:.5;
}

/* ========= 书签 ========= */
.bookmark{
  position:absolute;top:0;right:36px;
  width:18px;padding:8px 0 14px;
  background:var(--cinnabar);
  color:rgba(240,230,210,.75);
  text-align:center;
  font-size:9px;letter-spacing:.4em;padding-left:.4em;
  writing-mode:vertical-rl;
  clip-path:polygon(0 0, 100% 0, 100% 100%, 50% 88%, 0 100%);
  z-index:15;
  opacity:.5;
}
.bookmark.hidden{display:none;}

/* ========= 翻页动画 ========= */
.page-enter{animation:pageIn .9s ease forwards;}
.page-exit{animation:pageOut .9s ease forwards;}
@keyframes pageIn{
  from{opacity:0;transform:translateY(6%);}
  to{opacity:1;transform:translateY(0);}
}
@keyframes pageOut{
  from{opacity:1;transform:translateY(0);}
  to{opacity:0;transform:translateY(-6%);}
}

.star-map{
  position:absolute;inset:0;pointer-events:none;opacity:.12;
}

/* ========= Input 样式 ========= */
.input{
  width:100%;
  background:transparent;
  border:none;
  border-bottom:1px solid rgba(138,144,153,.18);
  color:var(--ink);
  font-family:inherit;
  font-size:16px;
  padding:8px 2px;
  text-align:center;
  outline:none;
  letter-spacing:.1em;
}
.input::placeholder{color:var(--ink-ghost);opacity:.5;}
.input:focus{border-bottom-color:var(--ink-mist);}
.input[type="number"]::-webkit-inner-spin-button,
.input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;}
.input[type="number"]{-moz-appearance:textfield;}

/* ========= 上传区域 ========= */
.upload-area{
  display:flex;align-items:center;justify-content:center;
  border:1px dashed rgba(138,144,153,.18);
  padding:14px 0;
  cursor:pointer;
  flex:1;
  text-align:center;
  position:relative;          /* 给删除按钮做绝对定位锚 */
  overflow:hidden;            /* 缩略图圆角裁剪 */
  min-height:48px;            /* 缩略图模式下保持高度 */
}
.upload-area:active{background:rgba(138,144,153,.03);}
.upload-text{
  font-size:12px;
  color:var(--ink-ghost);
  letter-spacing:.2em;
}

/* 缩略图模式 */
.upload-thumb-wrap{
  position:absolute;
  inset:0;
  border-radius:inherit;
  overflow:hidden;
}
.upload-thumb{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.upload-remove{
  position:absolute;
  top:6px;
  right:6px;
  width:22px;
  height:22px;
  border-radius:50%;
  border:none;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:12px;
  line-height:22px;
  cursor:pointer;
  padding:0;
  z-index:2;
  font-family:inherit;
}
.upload-remove:hover{background:rgba(0,0,0,.75);}
.upload-area.has-image .upload-text{display:none;}

/* ========= 目录页 · Table of Contents ========= */
.toc{
  position:relative;
  flex:1;display:flex;flex-direction:column;justify-content:center;
  padding:0 8px;
}
.toc-head{
  text-align:center;
  margin-bottom:56px;
}
.toc-head-zh{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:22px;letter-spacing:.45em;padding-left:.45em;
  color:var(--ink);
}
.toc-head-en{
  margin-top:14px;
  font-family:"EB Garamond",serif;font-style:italic;
  font-size:10px;letter-spacing:.4em;padding-left:.4em;
  color:var(--ink-ghost);
  text-transform:uppercase;
}
.toc-head::after{
  content:"";display:block;width:20px;height:1px;
  background:var(--ink-mist);margin:22px auto 0;opacity:.4;
}
.toc-list{
  display:flex;flex-direction:column;
}
.toc-item{
  text-align:center;
  padding:20px 0;
}
.toc-num{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:13px;letter-spacing:.5em;padding-left:.5em;
  color:var(--ink-mist);
  margin-bottom:10px;
}
.toc-name{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:22px;letter-spacing:.35em;padding-left:.35em;
  color:var(--ink);
  margin-bottom:8px;
}
.toc-desc{
  font-size:11px;letter-spacing:.25em;padding-left:.25em;
  color:var(--ink-soft);
  opacity:.75;
}
.toc-sep{
  width:14px;height:1px;
  background:var(--ink-ghost);
  opacity:.3;
  margin:0 auto;
}

/* ========= 卷扉页 · Volume Cover ========= */
.vol{
  position:relative;
  flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;
  padding:0 16px;
}
.vol-num{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:14px;letter-spacing:.6em;padding-left:.6em;
  color:var(--ink-mist);
  margin-bottom:36px;
}
.vol-name{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:42px;letter-spacing:.25em;padding-left:.25em;
  color:var(--ink);
  line-height:1.4;
  white-space:nowrap;
}
.vol-en{
  margin-top:26px;
  font-family:"EB Garamond",serif;font-style:italic;
  font-size:11px;letter-spacing:.35em;padding-left:.35em;
  color:var(--ink-ghost);
  text-transform:uppercase;
}
.vol-rule{
  width:1px;height:42px;
  background:linear-gradient(to bottom, var(--ink-mist), transparent);
  opacity:.4;
  margin:40px auto 32px;
}
.vol-line{
  font-size:13px;letter-spacing:.25em;padding-left:.25em;
  color:var(--ink-soft);
  line-height:2;
}

/* ========= 免责弹窗 · Agreement Modal ========= */
.agreement-modal{
  position:fixed;inset:0;
  z-index:999;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  opacity:0;
  transition:opacity .3s ease;
}
.agreement-modal.show{opacity:1;}
.agreement-backdrop{
  position:absolute;inset:0;
  background:rgba(44,47,51,.42);
  backdrop-filter:blur(14px) saturate(110%);
  -webkit-backdrop-filter:blur(14px) saturate(110%);
}
.agreement-panel{
  position:relative;
  width:100%;max-width:360px;
  max-height:85vh;
  display:flex;flex-direction:column;
  background:
    radial-gradient(ellipse at 30% 18%, rgba(255,255,255,.5) 0%, transparent 55%),
    linear-gradient(180deg, #f4f2ee 0%, #ece9e3 100%);
  box-shadow:
    0 20px 60px rgba(0,0,0,.28),
    0 0 0 1px rgba(0,0,0,.08);
  padding:26px 22px 20px;
}
/* 宣纸肌理叠一层 */
.agreement-panel::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='2' seed='3'/><feColorMatrix values='0 0 0 0 0.4  0 0 0 0 0.38  0 0 0 0 0.35  0 0 0 0.045 0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");
  opacity:.55;mix-blend-mode:multiply;
}
/* 内描边 */
.agreement-panel::after{
  content:"";position:absolute;inset:10px;pointer-events:none;
  border:1px solid rgba(138,144,153,.14);
}
.agreement-head{
  position:relative;text-align:center;
  padding-bottom:14px;
  margin-bottom:12px;
  border-bottom:1px solid rgba(138,144,153,.15);
}
.agreement-title{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:17px;letter-spacing:.25em;padding-left:.25em;
  color:var(--ink);
}
.agreement-sub{
  margin-top:5px;
  font-family:"EB Garamond",serif;font-style:italic;
  font-size:9px;letter-spacing:.35em;padding-left:.35em;
  color:var(--ink-ghost);
  text-transform:uppercase;
}
.agreement-body{
  position:relative;
  flex:1;overflow-y:auto;
  padding:4px 4px 10px;
  font-size:11.5px;line-height:1.75;
  color:var(--ink-soft);
  letter-spacing:.02em;
  text-align:justify;
}
.agreement-body::-webkit-scrollbar{width:3px;}
.agreement-body::-webkit-scrollbar-track{background:transparent;}
.agreement-body::-webkit-scrollbar-thumb{background:rgba(138,144,153,.2);border-radius:2px;}
.agreement-body p{margin:0 0 .55em;}
.agreement-body p.ag-sec{
  margin-top:.85em;
  color:var(--ink);
  font-weight:500;
  letter-spacing:.1em;
  font-size:12px;
}
.agreement-body p.ag-final{
  margin-top:1.2em;
  padding-top:.8em;
  border-top:1px solid rgba(138,144,153,.15);
  font-size:10.5px;
  letter-spacing:.05em;
  color:var(--ink-mist);
  text-align:right;
  font-style:normal;
}

/* 复选框 */
.agreement-check{
  position:relative;
  display:flex;align-items:center;gap:10px;
  padding:12px 4px 10px;
  cursor:not-allowed;
  border-top:1px solid rgba(138,144,153,.12);
  margin-top:6px;
  opacity:.4;
  transition:opacity .3s ease;
}
.agreement-check.enabled{
  opacity:1;
  cursor:pointer;
}
.agreement-check input{position:absolute;opacity:0;pointer-events:none;}
.agreement-check.enabled input{pointer-events:auto;}
.ag-box{
  width:14px;height:14px;
  border:1px solid var(--ink-mist);
  background:transparent;
  position:relative;
  flex-shrink:0;
  transition:all .2s ease;
}
.agreement-check input:checked ~ .ag-box{
  background:var(--cinnabar);
  border-color:var(--cinnabar);
}
.agreement-check input:checked ~ .ag-box::after{
  content:"";position:absolute;
  left:3px;top:0px;
  width:5px;height:9px;
  border:solid rgba(243,228,196,.95);
  border-width:0 1.5px 1.5px 0;
  transform:rotate(45deg);
}
/* 朱砂印章小纹理 */
.agreement-check input:checked ~ .ag-box::before{
  content:"";position:absolute;inset:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40'><filter id='n'><feTurbulence baseFrequency='0.9'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.85 0'/></filter><rect width='40' height='40' filter='url(%23n)'/></svg>");
  mix-blend-mode:lighten;opacity:.18;
}
.ag-text{
  font-size:11.5px;letter-spacing:.05em;
  color:var(--ink-soft);
}

/* 翻开按钮 */
.agreement-btn{
  position:relative;
  display:block;
  margin:0 auto;
  padding:12px 36px 12px calc(36px + .4em);
  background:var(--cinnabar);
  border:none;
  color:rgba(243,228,196,.92);
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:14px;letter-spacing:.4em;
  cursor:pointer;
  box-shadow:
    inset 0 0 0 2px rgba(243,228,196,.22),
    0 4px 14px rgba(139,58,47,.18);
  transition:opacity .25s ease, transform .15s ease;
}
.agreement-btn::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='80' height='80'><filter id='n'><feTurbulence baseFrequency='0.7' numOctaves='3'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.9 0'/></filter><rect width='80' height='80' filter='url(%23n)'/></svg>");
  mix-blend-mode:lighten;opacity:.1;
}
.agreement-btn:disabled{
  opacity:.28;
  cursor:not-allowed;
}
.agreement-btn:not(:disabled):active{transform:scale(.97);}

/* ========= 封面刊记 · KnowHow Studio · 左上角 ========= */
.cover-imprint{
  position:absolute;
  left:36px;top:36px;
  z-index:3;
  display:flex;flex-direction:column;align-items:flex-start;gap:6px;
}
.imprint-en{
  font-family:"Space Grotesk","Inter",sans-serif;
  font-weight:400;
  font-size:13px;letter-spacing:.08em;
  color:rgba(220,216,208,.78);
  line-height:1;
}
.imprint-line{
  width:22px;height:1px;
  background:rgba(200,196,188,.38);
  margin:3px 0;
}
.imprint-zh{
  font-family:"Noto Sans SC","PingFang SC",sans-serif;
  font-weight:300;
  font-size:9px;letter-spacing:.25em;padding-left:.25em;
  color:rgba(180,176,168,.5);
}

/* ========= 目录页勾选同意行 ========= */
.toc-agreement-row{
  margin-top:56px;
  display:flex;justify-content:center;
  transition:transform .1s ease;
}
.toc-agreement-row.shake{
  animation:shakeRow .5s ease;
}
@keyframes shakeRow{
  0%,100%{transform:translateX(0);}
  15%{transform:translateX(-6px);}
  30%{transform:translateX(6px);}
  45%{transform:translateX(-5px);}
  60%{transform:translateX(5px);}
  75%{transform:translateX(-3px);}
  90%{transform:translateX(3px);}
}
.toc-agreement{
  position:relative;
  display:flex;align-items:center;gap:9px;
  cursor:pointer;
}
.toc-agreement input{
  position:absolute;opacity:0;pointer-events:none;
}
.toc-agreement-box{
  width:13px;height:13px;
  border:1px solid var(--ink-mist);
  background:transparent;
  position:relative;
  flex-shrink:0;
  transition:all .2s ease;
}
.toc-agreement input:checked ~ .toc-agreement-box,
.toc-agreement-box.checked{
  background:var(--cinnabar);
  border-color:var(--cinnabar);
}
.toc-agreement input:checked ~ .toc-agreement-box::after,
.toc-agreement-box.checked::after{
  content:"";position:absolute;
  left:3px;top:0px;
  width:4px;height:8px;
  border:solid rgba(243,228,196,.95);
  border-width:0 1.5px 1.5px 0;
  transform:rotate(45deg);
}
.toc-agreement-text{
  font-size:11px;letter-spacing:.1em;
  color:var(--ink-mist);
}
.toc-agreement-text a{
  color:var(--ink-soft);
  text-decoration:underline;
  text-decoration-color:rgba(138,144,153,.4);
  text-underline-offset:3px;
  cursor:pointer;
}
.toc-agreement-text a:hover{
  color:var(--cinnabar);
  text-decoration-color:var(--cinnabar);
}

/* ========= 表单 · 选填标签 ========= */
.optional-tag{
  font-family:"Noto Serif SC",serif;
  font-style:normal;
  font-size:10px;letter-spacing:.15em;padding-left:.15em;
  color:var(--cinnabar);
  margin-left:6px;
  opacity:.85;
  font-weight:500;
}
/* 生辰日·农历小字标注 */
.lunar-tag{
  font-family:"Noto Serif SC",serif;
  font-style:normal;
  font-size:10px;letter-spacing:.12em;padding-left:.12em;
  color:var(--ink-mist);
  margin-left:4px;
  opacity:.75;
}

/* ========= 表单 · 首屏滚动提示 ========= */
.scroll-hint{
  position:absolute;
  left:50%;bottom:22px;
  transform:translateX(-50%);
  display:flex;align-items:center;gap:8px;
  padding:7px 16px 7px calc(16px + .3em);
  font-size:11px;letter-spacing:.3em;
  color:var(--ink-soft);
  background:rgba(240,238,234,.85);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border:1px solid rgba(138,144,153,.15);
  box-shadow:0 2px 10px rgba(44,47,51,.06);
  border-radius:20px;
  pointer-events:none;
  opacity:0;
  transition:opacity .4s ease;
  z-index:5;
  animation:hintBreathe 2s ease-in-out infinite;
}
.scroll-hint.visible{opacity:.95;}
.scroll-hint .scroll-arrow{
  font-size:14px;letter-spacing:0;padding:0;
  line-height:1;
  color:var(--cinnabar);
  font-weight:500;
  animation:arrowDown 1.2s ease-in-out infinite;
}
@keyframes hintBreathe{
  0%,100%{box-shadow:0 2px 10px rgba(44,47,51,.06);}
  50%{box-shadow:0 2px 14px rgba(139,58,47,.12);}
}
@keyframes arrowDown{
  0%,100%{transform:translateY(-2px);}
  50%{transform:translateY(3px);}
}

/* ========= 书架徽标入口 ========= */
.library-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 12px;
  font-family:"Noto Serif SC",serif;
  font-size:10px;letter-spacing:.2em;
  color:var(--ink-soft);
  background:rgba(240,238,234,.7);
  border:1px solid rgba(138,144,153,.22);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  cursor:pointer;
  transition:all .2s ease;
}
.library-badge:active{
  transform:scale(.96);
}
/* 封面上的书架：深色封面配色 */
.library-badge.cover-library{
  position:absolute;
  left:36px;bottom:36px;
  z-index:3;
  color:rgba(220,216,208,.8);
  background:rgba(30,32,36,.45);
  border-color:rgba(200,196,188,.3);
}
.library-badge.cover-library:active{
  background:rgba(30,32,36,.7);
}
.library-badge .lib-icon{
  font-family:"Noto Serif SC",serif;
  font-size:11px;
  opacity:.9;
}

/* ========= 书架面板 ========= */
.library-panel{
  position:fixed;inset:0;
  z-index:998;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  opacity:0;
  transition:opacity .3s ease;
}
.library-panel.show{opacity:1;}
.library-backdrop{
  position:absolute;inset:0;
  background:rgba(44,47,51,.4);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  cursor:pointer;
}
.library-panel-inner{
  position:relative;
  width:100%;max-width:360px;max-height:80vh;
  display:flex;flex-direction:column;
  background:
    radial-gradient(ellipse at 30% 18%, rgba(255,255,255,.5) 0%, transparent 55%),
    linear-gradient(180deg, #f4f2ee 0%, #ece9e3 100%);
  box-shadow:0 20px 60px rgba(0,0,0,.28), 0 0 0 1px rgba(0,0,0,.08);
  padding:28px 22px 22px;
}
.library-panel-inner::before{
  content:"";position:absolute;inset:10px;pointer-events:none;
  border:1px solid rgba(138,144,153,.14);
}
.library-head{
  position:relative;text-align:center;
  padding-bottom:16px;margin-bottom:12px;
  border-bottom:1px solid rgba(138,144,153,.15);
}
.library-title{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:20px;letter-spacing:.35em;padding-left:.35em;
  color:var(--ink);
}
.library-sub{
  margin-top:5px;
  font-family:"EB Garamond",serif;font-style:italic;
  font-size:10px;letter-spacing:.35em;padding-left:.35em;
  color:var(--ink-ghost);
  text-transform:uppercase;
}
.library-close{
  position:absolute;top:-6px;right:-4px;
  width:28px;height:28px;
  background:transparent;border:none;
  font-size:24px;line-height:1;color:var(--ink-mist);
  cursor:pointer;
}
.library-list{
  flex:1;overflow-y:auto;
  padding:4px 2px 8px;
}
.library-list::-webkit-scrollbar{width:3px;}
.library-list::-webkit-scrollbar-thumb{background:rgba(138,144,153,.2);}
.library-empty{
  text-align:center;padding:40px 0;
  font-size:12px;letter-spacing:.25em;padding-left:.25em;
  color:var(--ink-ghost);
}
.library-item{
  padding:16px 12px;
  border-bottom:1px solid rgba(138,144,153,.1);
}
.library-item:last-child{border-bottom:none;}
.library-item-title{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:18px;letter-spacing:.2em;padding-left:.2em;
  color:var(--ink);
  margin-bottom:4px;
}
.library-item-meta{
  font-size:10px;letter-spacing:.15em;
  color:var(--ink-mist);
  margin-bottom:10px;
}
.library-item-actions{
  display:flex;gap:10px;align-items:stretch;
}
.lib-btn{
  flex:1;
  padding:7px 12px;
  font-family:"Noto Serif SC",serif;
  font-size:11px;letter-spacing:.3em;padding-left:calc(12px + .3em);padding-right:calc(12px - .3em);
  background:transparent;
  border:1px solid var(--ink-ghost);
  color:var(--ink-soft);
  cursor:pointer;
}
.lib-btn.lib-open{
  background:var(--cinnabar);
  color:rgba(243,228,196,.92);
  border-color:var(--cinnabar);
  flex:2;  /* 翻开按钮占主导位 */
}
.lib-btn:active{transform:scale(.97);}

/* 图标按钮(PDF/删除) */
.lib-icon-btn{
  flex:0 0 auto;
  width:54px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  padding:6px 6px;
  background:transparent;
  border:1px solid var(--ink-ghost);
  color:var(--ink-soft);
  cursor:pointer;
  font-family:"Noto Serif SC",serif;
}
.lib-icon-btn:active{transform:scale(.97);}
.lib-icon-btn .lib-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:0;
}
.lib-icon-btn .lib-icon-label{
  font-size:10px;
  letter-spacing:.15em;
  padding-left:.15em;
  color:var(--ink-soft);
  line-height:1;
}
/* PDF 按钮:朱砂调,呼应"已珍藏" */
.lib-icon-btn.lib-pdf{
  color:var(--cinnabar);
  border-color:rgba(139,58,47,.4);
}
.lib-icon-btn.lib-pdf .lib-icon-label{
  color:var(--cinnabar);
}
.lib-icon-btn.lib-pdf:hover{
  background:rgba(139,58,47,.04);
}
/* 删除按钮:灰调克制 */
.lib-icon-btn.lib-del{
  color:var(--ink-ghost);
}
.lib-icon-btn.lib-del:hover{
  color:var(--ink-soft);
  background:rgba(138,144,153,.04);
}

/* ========= 继续等待小弹窗 ========= */
.resume-modal{
  position:fixed;inset:0;
  z-index:998;
  display:flex;align-items:center;justify-content:center;
  padding:24px;
  opacity:0;
  transition:opacity .3s ease;
}
.resume-modal.show{opacity:1;}
.resume-backdrop{
  position:absolute;inset:0;
  background:rgba(44,47,51,.42);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.resume-panel{
  position:relative;
  width:100%;max-width:320px;
  padding:28px 24px 22px;
  background:
    radial-gradient(ellipse at 30% 18%, rgba(255,255,255,.5) 0%, transparent 55%),
    linear-gradient(180deg, #f4f2ee 0%, #ece9e3 100%);
  box-shadow:0 20px 60px rgba(0,0,0,.28), 0 0 0 1px rgba(0,0,0,.08);
  transform:translateY(10px);
  transition:transform .3s ease;
  text-align:center;
}
.resume-modal.show .resume-panel{transform:translateY(0);}
/* 宣纸肌理 */
.resume-panel::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='2' seed='3'/><feColorMatrix values='0 0 0 0 0.4  0 0 0 0 0.38  0 0 0 0 0.35  0 0 0 0.045 0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");
  opacity:.55;mix-blend-mode:multiply;
}
.resume-title{
  position:relative;
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:20px;letter-spacing:.35em;padding-left:.35em;
  color:var(--ink);
}
.resume-title::after{
  content:"";display:block;width:20px;height:1px;
  background:var(--ink-mist);margin:12px auto 0;opacity:.4;
}
.resume-sub{
  position:relative;
  margin-top:8px;
  font-family:"EB Garamond",serif;font-style:italic;
  font-size:10px;letter-spacing:.35em;padding-left:.35em;
  color:var(--ink-ghost);
  text-transform:uppercase;
}
.resume-body{
  position:relative;
  margin:22px 0 24px;
  font-size:12px;line-height:1.9;letter-spacing:.1em;
  color:var(--ink-soft);
}
.resume-body p{margin:0 0 10px;}
.resume-body .resume-small{
  font-size:11px;
  color:var(--ink-mist);
  margin-top:12px;
}
.resume-info{
  margin:14px 0;
  font-family:"EB Garamond","Noto Serif SC",serif;
  font-size:11px;letter-spacing:.2em;
  color:var(--ink-mist);
  padding:8px 10px;
  border-top:1px solid rgba(138,144,153,.15);
  border-bottom:1px solid rgba(138,144,153,.15);
}
.resume-actions{
  position:relative;
  display:flex;gap:10px;
}
.resume-btn{
  flex:1;
  padding:11px 10px 11px calc(10px + .3em);
  font-family:"Noto Serif SC",serif;
  font-size:12px;letter-spacing:.3em;
  cursor:pointer;
  border:none;
  transition:transform .15s ease;
}
.resume-btn:active{transform:scale(.97);}
.resume-ghost{
  background:transparent;
  border:1px solid var(--ink-ghost);
  color:var(--ink-soft);
}
.resume-primary{
  background:var(--cinnabar);
  color:rgba(243,228,196,.92);
  box-shadow:inset 0 0 0 1.5px rgba(243,228,196,.22);
}

/* ========= 付费按钮晃动强调 ========= */
.pay-btn.pay-shake,
.paywall-seal.pay-shake{
  animation:payBtnShake .6s cubic-bezier(.36,.07,.19,.97);
}
@keyframes payBtnShake{
  0%,100%{transform:translateX(0);}
  10%{transform:translateX(-6px);}
  20%{transform:translateX(6px);}
  30%{transform:translateX(-5px);}
  40%{transform:translateX(5px);}
  50%{transform:translateX(-4px);}
  60%{transform:translateX(4px);}
  70%{transform:translateX(-3px);}
  80%{transform:translateX(3px);}
  90%{transform:translateX(-1px);}
}

/* 付费墙滑动拦截气泡提示 */
.paywall-hint{
  position:absolute;
  left:50%;top:42%;
  transform:translate(-50%,-50%) translateY(-8px);
  padding:8px 14px 8px calc(14px + .3em);
  background:rgba(44,47,51,.9);
  color:rgba(240,228,210,.95);
  font-family:"Noto Serif SC",serif;
  font-size:11px;letter-spacing:.3em;
  white-space:nowrap;
  pointer-events:none;
  opacity:0;
  z-index:10;
  transition:opacity .3s ease, transform .3s ease;
}
.paywall-hint.show{
  opacity:1;
  transform:translate(-50%,-50%) translateY(0);
}
.paywall-hint::after{
  content:"";position:absolute;
  left:50%;bottom:-5px;transform:translateX(-50%);
  width:0;height:0;
  border-left:5px solid transparent;
  border-right:5px solid transparent;
  border-top:5px solid rgba(44,47,51,.9);
}

/* ========= 使命卡左上角阴刻方章 ========= */
.card-seal{
  position:absolute;
  top:10px;left:10px;
  z-index:3;
  width:9%;
  min-width:28px;max-width:40px;
  padding:6px 0;
  background:rgba(139,58,47,.82);
  border:1px solid rgba(243,228,196,.25);
  display:flex;flex-direction:column;align-items:center;gap:2px;
  box-shadow:0 2px 6px rgba(0,0,0,.12);
}
.card-seal::after{
  content:"";position:absolute;inset:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='60'><filter id='n'><feTurbulence baseFrequency='0.85'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.9 0'/></filter><rect width='60' height='60' filter='url(%23n)'/></svg>");
  mix-blend-mode:lighten;opacity:.2;pointer-events:none;
}
.card-seal span{
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:10px;line-height:1.1;
  color:rgba(243,228,196,.92);
  letter-spacing:0;
  writing-mode:horizontal-tb;
}

/* ========= 使命卡下方引导 ========= */
.card-guide{
  position:relative;
  margin:20px auto 0;
  text-align:center;
  padding:12px 16px 12px calc(16px + .2em);
  font-size:12px;letter-spacing:.25em;
  color:var(--ink-soft);
  border-top:1px solid rgba(138,144,153,.15);
  border-bottom:1px solid rgba(138,144,153,.15);
  display:flex;align-items:center;justify-content:center;gap:10px;
  flex-wrap:wrap;
  line-height:1.7;
}
.card-guide > span:first-child{
  font-weight:500;
  color:var(--ink);
}
.card-guide .card-guide-sub{
  color:var(--ink-mist);
  font-size:11px;
}
.card-guide .card-guide-arrow{
  color:var(--cinnabar);
  font-size:13px;letter-spacing:0;padding:0;
  animation:guideArrow 1.8s ease-in-out infinite;
}
@keyframes guideArrow{
  0%,100%{transform:translateX(-2px);opacity:.55;}
  50%{transform:translateX(4px);opacity:1;}
}

/* ========= 分享图模态窗 ========= */
.share-modal{
  position:fixed;inset:0;
  z-index:999;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  opacity:0;
  transition:opacity .3s ease;
}
.share-modal.show{opacity:1;}
.share-backdrop{
  position:absolute;inset:0;
  background:rgba(20,22,26,.8);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.share-panel{
  position:relative;
  width:100%;max-width:340px;
  max-height:92vh;
  display:flex;flex-direction:column;align-items:center;gap:14px;
}
.share-hint{
  font-family:"Noto Serif SC",serif;
  font-size:12px;letter-spacing:.3em;padding-left:.3em;
  color:rgba(240,238,234,.85);
}
.share-img-wrap{
  width:100%;
  max-height:76vh;
  overflow:hidden;
  box-shadow:0 16px 50px rgba(0,0,0,.5);
}
.share-img-wrap img{
  width:100%;height:auto;display:block;
}
.share-close{
  padding:9px 24px 9px calc(24px + .3em);
  background:transparent;
  border:1px solid rgba(240,238,234,.4);
  color:rgba(240,238,234,.85);
  font-family:"Noto Serif SC",serif;
  font-size:12px;letter-spacing:.3em;
  cursor:pointer;
}
.share-close:active{transform:scale(.96);}

/* ========= 末页刊记 ========= */
.final-imprint{
  position:absolute;
  left:0;right:0;bottom:34px;
  text-align:center;
  z-index:2;
}
.final-imprint-line{
  width:1px;height:28px;
  background:linear-gradient(to bottom, transparent, rgba(138,144,153,.35));
  margin:0 auto 14px;
}
.final-imprint-en{
  font-family:"Space Grotesk","Inter",sans-serif;
  font-weight:400;
  font-size:12px;letter-spacing:.12em;
  color:var(--ink-mist);
  margin-bottom:5px;
}
.final-imprint-zh{
  font-family:"Noto Sans SC","PingFang SC",sans-serif;
  font-weight:300;
  font-size:9px;letter-spacing:.3em;padding-left:.3em;
  color:var(--ink-ghost);
}

/* Loading 锁住时的居中 toast */
.loading-lock-toast{
  position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(.95);
  background:rgba(30,32,36,.78);color:#f6f1e6;
  padding:13px 26px;border-radius:4px;
  font-family:"Noto Serif SC","SimSun",serif;
  font-size:13px;letter-spacing:.3em;
  opacity:0;pointer-events:none;z-index:10000;
  transition:opacity .28s ease,transform .28s ease;
  box-shadow:0 14px 36px rgba(0,0,0,.22);
}
.loading-lock-toast.show{opacity:1;transform:translate(-50%,-50%) scale(1);}

/* 付费后装帧动画层 */
.binding-overlay{
  position:fixed;inset:0;z-index:9999;
  background:linear-gradient(180deg,#f6f1e6 0%,#ede5d4 100%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;
  transition:opacity .6s ease;
}
.binding-overlay.show{opacity:1;pointer-events:auto;}
.binding-overlay .stage-text{
  font-family:"Noto Serif SC","SimSun",serif;
  font-size:18px;letter-spacing:.35em;
  color:#1e2024;margin-top:30px;
  opacity:0;transition:opacity .6s ease;
}
.binding-overlay .stage-text.show{opacity:1;}
.binding-overlay .stage-sub{
  font-family:"Noto Sans SC",sans-serif;font-weight:300;
  font-size:11px;letter-spacing:.2em;
  color:#8a8578;margin-top:14px;
  opacity:0;transition:opacity .6s ease;
}
.binding-overlay .stage-sub.show{opacity:1;}
.binding-overlay .ink-seal{
  width:60px;height:60px;
  background:linear-gradient(135deg,#c1553e,#8b3a2f);
  border-radius:4px;box-shadow:0 8px 24px rgba(139,58,47,.4);
  transform:scale(0);transition:transform .4s cubic-bezier(.34,1.56,.64,1);
}
.binding-overlay .ink-seal.drop{transform:scale(1);}

/* Loading 失败时出现的"返回封面"按钮 */
.loading-retry-btn{
  margin-top:0;
  background:transparent;
  border:.5px solid var(--ink-sub);
  color:var(--ink-sub);
  padding:10px 28px;
  font-family:"Noto Serif SC","SimSun",serif;
  font-size:13px;letter-spacing:.3em;
  cursor:pointer;
  transition:all .25s ease;
  border-radius:2px;
}
.loading-retry-btn:hover{
  background:var(--ink);
  color:#f6f1e6;
  border-color:var(--ink);
}
.loading-retry-btn:active{
  transform:scale(.97);
}

/* 失败按钮组:重新生成 + 返回封面 */
.loading-fail-actions{
  display:none;
  margin-top:28px;
  gap:12px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
}

/* "重新生成"按钮:朱砂主调,跟"返回封面"形成主次区分 */
.loading-regen-btn{
  background:var(--cinnabar);
  border-color:var(--cinnabar);
  color:rgba(243,228,196,.92);
}
.loading-regen-btn:hover{
  background:#6e2d24;
  border-color:#6e2d24;
  color:#fff;
}

/* 命盘释读 · 小标题样式 */
.analysis-title{
  font-family:"Noto Serif SC","SimSun",serif;
  font-size:26px;letter-spacing:.35em;padding-left:.35em;
  font-weight:500;color:var(--ink);
  margin-top:18px;margin-bottom:4px;
  text-align:center;
}
.analysis-subtitle{
  font-family:"Space Grotesk","Noto Sans SC",sans-serif;
  font-size:10px;letter-spacing:.4em;padding-left:.4em;
  color:var(--ink-ghost);
  text-align:center;
  margin-bottom:22px;
  text-transform:uppercase;
}
.chapter .analysis-title + .analysis-subtitle + .chapter-body{
  padding-top:4px;
}

/* ============================================
   付费后星盘点亮仪式（20秒）
   沿用生成 Loading 的水墨宣纸底色
============================================ */
.star-chart-overlay{
  position:fixed;inset:0;z-index:9999;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;
  transition:opacity .8s ease;
  overflow:hidden;
}
.star-chart-overlay.show{opacity:1;pointer-events:auto;}
.star-chart-overlay .paper-bg{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(255,255,255,.35) 0%, transparent 60%),
    var(--paper);
  z-index:0;
}
.star-chart-wrap{
  position:relative;z-index:1;
  display:flex;flex-direction:column;align-items:center;
  max-width:90vw;
}
.star-chart{
  width:min(420px, 80vw);
  height:auto;
  aspect-ratio:1/1;
  color:#1e2024;
}
.star-chart-text{
  margin-top:48px;
  font-family:"Noto Serif SC","SimSun",serif;
  font-size:20px;letter-spacing:.35em;padding-left:.35em;
  color:#1e2024;
  opacity:0;
  transition:opacity .6s ease;
  text-align:center;
}
.star-chart-text.show{opacity:1;}
.star-chart-sub{
  margin-top:14px;
  font-family:"Noto Sans SC",sans-serif;font-weight:300;
  font-size:12px;letter-spacing:.22em;
  color:#8a8578;
  opacity:0;
  transition:opacity .6s ease;
  text-align:center;
}
.star-chart-sub.show{opacity:1;}

/* 取代旧的 binding-overlay（保留class以防万一其他地方还引用，但视觉样式走新的） */
.binding-overlay{display:none !important;}

/* 表单字段辅助提示（出生地颗粒度引导用） */
.field-hint{
  font-family:"Noto Sans SC",sans-serif;font-weight:300;
  font-size:10px;letter-spacing:.08em;
  color:#a8a59e;
  padding-left:46px;margin-top:6px;
  line-height:1.4;
}

/* ============================================
   章节续页（chapter-continue）样式
   弱化标题区，正文从上方紧贴开始
============================================ */
.chapter-continue{padding-top:48px;}
.chapter-cont{
  display:flex;justify-content:center;align-items:baseline;gap:14px;
  font-family:"Noto Serif SC","SimSun",serif;
  color:var(--ink-ghost);
  margin-bottom:18px;font-size:14px;letter-spacing:.32em;padding-left:.32em;
}
.chapter-cont .cont-mark{
  font-size:11px;letter-spacing:.18em;color:var(--ink-faint);
}


/* 目录页 · 勾选同意后的引导按钮 */
.toc-cta{
  display:block;
  margin:20px auto 0;
  padding:12px 28px 12px calc(28px + .3em);
  background:var(--cinnabar);
  border:none;
  color:rgba(243,228,196,.95);
  font-family:"Ma Shan Zheng","Noto Serif SC",serif;
  font-size:15px;letter-spacing:.3em;
  cursor:pointer;
  box-shadow:
    inset 0 0 0 2px rgba(243,228,196,.25),
    0 4px 14px rgba(139,58,47,.18);
  /* 默认隐藏 + 不可点击 */
  opacity:0;
  pointer-events:none;
  transform:translateY(8px);
  transition:opacity .5s ease, transform .5s ease;
  position:relative;
  z-index:2;
}
.toc-cta.show{
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
  animation:tocCtaPulse 2.4s ease-in-out infinite 1s;
}
.toc-cta:active{transform:scale(.96);}
@keyframes tocCtaPulse{
  0%,100%{box-shadow:inset 0 0 0 2px rgba(243,228,196,.25), 0 4px 14px rgba(139,58,47,.18);}
  50%{box-shadow:inset 0 0 0 2px rgba(243,228,196,.4), 0 4px 22px rgba(139,58,47,.32);}
}

/* 勾选后右侧 turn-hint 箭头变朱砂 */
.turn-hint.toc-active::before,
.turn-hint.toc-active::after{
  border-left-color:var(--cinnabar) !important;
  opacity:.85 !important;
}

/* 短故事页底部"翻开未竟之章"引导按钮 · 实心朱砂 */
.story-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  margin:14px auto 18px;
  padding:11px 22px 11px calc(22px + .25em);
  background:var(--cinnabar);
  border:none;
  color:rgba(243,228,196,.95);
  font-family:"Noto Serif SC",serif;
  font-size:13px;letter-spacing:.25em;
  cursor:pointer;
  box-shadow:
    inset 0 0 0 1.5px rgba(243,228,196,.22),
    0 4px 14px rgba(139,58,47,.18);
  transition:transform .15s ease;
  position:relative;
  z-index:2;
  opacity:0;
  animation:storyCtaFadeIn 1.5s ease 1.8s forwards;
  max-width:78%;
}
.story-cta-arrow{
  font-size:14px;
  letter-spacing:0;
  transition:transform .25s ease;
}
.story-cta:hover .story-cta-arrow{
  transform:translateX(4px);
}
.story-cta:active{transform:scale(.96);}
@keyframes storyCtaFadeIn{
  from{opacity:0;transform:translateY(8px);}
  to{opacity:1;transform:translateY(0);}
}

/* ============================================ */
/* PDF 相关样式(书架按钮 + 末章按钮 + 装订动画) */
/* ============================================ */

/* —— 书架: 名字旁的 PDF 小印章 —— */
.lib-pdf-mark{
  display:inline-block;
  margin-left:10px;
  padding:1px 6px;
  font-size:9px;
  letter-spacing:.15em;
  color:var(--cinnabar, #8b3a2f);
  border:1px solid var(--cinnabar, #8b3a2f);
  border-radius:2px;
  vertical-align:middle;
  font-weight:500;
  font-family:serif;
}

/* —— 书架: "珍藏 PDF" 按钮(同 lib-btn 风格,但稍朱砂) —— */
.lib-pdf{
  color:var(--cinnabar, #8b3a2f) !important;
  border-color:rgba(139,58,47,.4) !important;
}
.lib-pdf:hover{
  background:rgba(139,58,47,.04) !important;
}

/* —— 末章页: "珍藏此书" 朱砂印章 —— */
.final-pdf-stamp{
  position:absolute;
  bottom:30px;
  right:24px;
  z-index:5;
  cursor:pointer;
  user-select:none;
  text-align:center;
  opacity:1;
}
.final-pdf-seal{
  width:64px;
  height:64px;
  border:1.5px solid var(--cinnabar, #8b3a2f);
  background:rgba(139,58,47,.04);
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto;
  position:relative;
  transition:transform .25s ease, background .25s ease;
}
.final-pdf-seal::before{
  content:"";
  position:absolute;
  inset:3px;
  border:0.6px solid rgba(139,58,47,.3);
  pointer-events:none;
}
.final-pdf-seal-text{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:1px;
  font-family:"Ma Shan Zheng","Noto Serif SC","SimSun",serif;
  font-size:14px;
  color:var(--cinnabar, #8b3a2f);
  font-weight:500;
  line-height:1;
  letter-spacing:0;
}
.final-pdf-seal-text > span{
  display:flex;
  align-items:center;
  justify-content:center;
  width:14px;
  height:14px;
}
.final-pdf-tip{
  margin-top:6px;
  font-size:8.5px;
  letter-spacing:.18em;
  padding-left:.18em;
  color:var(--ink-mist);
  font-family:"Noto Sans SC","PingFang SC",sans-serif;
  font-weight:400;
  white-space:nowrap;
}
.final-pdf-stamp:hover .final-pdf-seal{
  background:rgba(139,58,47,.10);
  transform:rotate(-3deg);
}
.final-pdf-stamp:active .final-pdf-seal{
  transform:scale(.94);
}
@keyframes finalPdfFadeIn{
  from{opacity:0;transform:translateY(8px);}
  to{opacity:1;transform:translateY(0);}
}

/* —— 装订动画 modal —— */
.binding-modal{
  position:fixed;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:999;
  opacity:0;
  transition:opacity .3s ease;
}
.binding-modal.show{
  opacity:1;
}
.binding-backdrop{
  position:absolute;
  inset:0;
  background:rgba(28,22,18,.75);
  backdrop-filter:blur(4px);
}
.binding-panel{
  position:relative;
  background:#f4ede0;
  padding:50px 64px;
  text-align:center;
  border:1px solid rgba(0,0,0,.1);
  box-shadow:0 12px 40px rgba(0,0,0,.4);
  min-width:240px;
}
.binding-mark{
  font-size:14px;
  letter-spacing:.4em;
  color:var(--cinnabar, #8b3a2f);
  margin-bottom:18px;
  font-family:serif;
  animation:bindingMark 1.6s ease infinite;
}
.binding-text{
  font-size:14px;
  letter-spacing:.35em;
  padding-left:.35em;
  color:#1a1a1a;
  font-weight:400;
  font-family:"Noto Serif SC",serif;
  line-height:1.6;
  margin-bottom:8px;
}
.binding-en{
  font-size:9px;
  letter-spacing:.3em;
  color:#999;
  font-family:serif;
}
@keyframes bindingMark{
  0%,100%{opacity:.4;}
  50%{opacity:1;}
}