/* reader.css — 阅读页 */
html{--reader-fs:18px;--reader-lh:1.9;--reader-w:800px;
  --rd-bg:#f5f5f7;--rd-paper:#fff;--rd-text:#262626;--rd-muted:#8c8c8c;--rd-line:#eee;--rd-bar:rgba(255,255,255,.96);--rd-panel:#fff}
html[data-theme="green"]{--rd-bg:#c7edcc;--rd-paper:#d3f0d7;--rd-text:#243324;--rd-muted:#5f7a62;--rd-line:#b4d9ba;--rd-bar:rgba(211,240,215,.96);--rd-panel:#dff4e2}
html[data-theme="paper"]{--rd-bg:#efe6d0;--rd-paper:#f8f1e0;--rd-text:#3b2f21;--rd-muted:#8a7a63;--rd-line:#e2d6ba;--rd-bar:rgba(248,241,224,.96);--rd-panel:#faf5e8}
html[data-theme="night"]{--rd-bg:#121212;--rd-paper:#1a1a1a;--rd-text:#a8a8a8;--rd-muted:#6b6b6b;--rd-line:#2a2a2a;--rd-bar:rgba(26,26,26,.96);--rd-panel:#222;
  /* 黛青在 #1a1a1a 上只有 2.9 的对比度，夜间需要一个提亮变体 */
  --brand:#66b3ab;--brand-hover:#7cc4bd;--brand-soft:#23302f;--brand-line:#334745;
  --bg:#1a1a1a;--bg-2:#121212;--bg-3:#2a2a2a;--line:#2a2a2a;--line-2:#242424;--text-1:#c8c8c8;--text-2:#a8a8a8;--text-3:#7a7a7a;--text-4:#555}
html[data-lh="tight"]{--reader-lh:1.6}
html[data-lh="loose"]{--reader-lh:2.2}
html[data-width="narrow"]{--reader-w:720px}
html[data-width="wide"]{--reader-w:960px}
html[data-font="serif"] .reader-content,html[data-font="serif"] .reader-title{font-family:var(--font-serif)}
html[data-font="kai"] .reader-content,html[data-font="kai"] .reader-title{font-family:var(--font-kai)}

body.reader{background:var(--rd-bg);color:var(--rd-text);transition:background .2s}
.reader-top{position:fixed;left:0;right:0;top:0;height:44px;background:var(--rd-bar);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--rd-line);z-index:100;transition:transform .25s}
.reader-top__inner{max-width:var(--reader-w);margin:0 auto;height:44px;display:flex;align-items:center;gap:12px;padding:0 12px;font-size:13px}
.reader-top__back{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;color:var(--rd-muted);flex:none}
.reader-top__back svg{width:20px;height:20px}
.reader-top__back:hover{color:var(--brand)}
.reader-top__title{flex:1;min-width:0;display:flex;align-items:center;gap:6px;color:var(--rd-muted);overflow:hidden;white-space:nowrap}
.reader-top__title a{color:var(--rd-text);flex:none;font-size:16px;font-weight:600}
.reader-top__title .sep{color:var(--rd-line)}
.reader-top__actions{display:flex;align-items:center;gap:4px;flex:none}
.reader-top__actions a,.reader-top__actions button{padding:6px 8px;border-radius:var(--r-sm);color:var(--rd-text);font-size:13px}
.reader-top__actions a:hover,.reader-top__actions button:hover{color:var(--brand)}
/* 阅读页顶栏只保留登录入口：注册按钮(.btn)隐藏，且不加左分割线 */
.reader-top__actions .user_link{display:flex;gap:4px}
.reader-top__actions .user_link a{padding:4px 6px}
.reader-top__actions .user_link .btn{display:none}
.reader-progress{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--brand);transition:width .1s linear}

.reader-body{padding:64px 0 40px;position:relative}
.reader-paper{max-width:var(--reader-w);margin:0 auto;background:var(--rd-paper);border-radius:var(--r-lg);padding:36px 56px 40px;box-shadow:0 1px 3px rgba(0,0,0,.04);transition:max-width .2s,background .2s}
.reader-title{font-size:18px;font-weight:600;line-height:1.5;text-align:left;margin-bottom:10px;color:var(--rd-text)}
.reader-meta{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:6px 18px;font-size:12px;color:var(--rd-muted);margin-bottom:28px}
.reader-meta a{color:var(--rd-muted)}
.reader-meta a:hover{color:var(--brand)}
.reader-meta__page{color:var(--brand)}
/* 章首宣传图：原图 7:3。桌面在正文宽度内裁成 3:1（出图时上下各留了约 15% 的低信息区，裁掉不伤主体），
   圆角；手机端左右出血，保持原比例 */
.reader-promo{position:relative;margin:0 0 28px;aspect-ratio:3/1;border-radius:var(--r-lg);overflow:hidden;background:var(--rd-line)}
.reader-promo img{display:block;width:100%;height:100%;object-fit:cover}
html[data-theme="night"] .reader-promo img{filter:brightness(.8)}
.reader-content{font-size:var(--reader-fs);line-height:var(--reader-lh);color:var(--rd-text);text-align:justify;overflow-wrap:anywhere;word-break:break-word;transition:font-size .15s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}
.reader-content ::selection,.reader-content::selection{background:transparent}
.reader-content ::-moz-selection,.reader-content::-moz-selection{background:transparent}
.reader-content p{margin:0 0 1em;text-indent:2em}
.reader-content p:last-child{margin-bottom:0}
.reader-content img{margin:1em auto}
/* 登录墙试读片段：只展示约 10 行（服务端下发 400 字），末尾渐隐。
   高度跟随读者自选的字号行高，所以用 calc 而不是写死 px */
.reader-preview{max-height:calc(var(--reader-fs) * var(--reader-lh) * 10);overflow:hidden;margin-bottom:24px;
-webkit-mask-image:linear-gradient(180deg,#000 0,#000 45%,transparent 100%);
mask-image:linear-gradient(180deg,#000 0,#000 45%,transparent 100%)}
.reader-paywall{--paywall-btn-h:53px;text-align:center;padding:56px 24px;border:1px dashed var(--rd-line);border-radius:var(--r);color:var(--rd-text)}
.reader-paywall h3{font-size:20px;margin-bottom:18px}
.reader-paywall p{color:var(--rd-muted);margin-bottom:32px}
.reader-paywall__btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
/* 比章节导航的「上一章」(btn--lg) 大 20%：44*1.2=53、28*1.2=34、16*1.2=19 */
.reader-paywall__btns .btn{height:var(--paywall-btn-h);padding:0 34px;font-size:19px}
/* 按钮下方留出 1.5 个按钮高度的空白 */
.reader-paywall__btns{margin-bottom:calc(var(--paywall-btn-h) * 1.5)}
.reader-pagenav{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:32px;padding-top:24px;border-top:1px solid var(--rd-line);font-size:14px;color:var(--rd-muted);flex-wrap:wrap}
.reader-pagenav__pos{display:inline-flex;align-items:center;gap:6px}
.reader-pagenav .select{width:auto;height:32px;padding:0 28px 0 10px;background-color:var(--rd-paper);border-color:var(--rd-line);color:var(--rd-text)}
.reader-chapternav{display:flex;gap:16px;justify-content:center;margin-top:32px}
.reader-chapternav .btn{flex:1;max-width:220px}
.reader-chapternav__next{position:relative;display:flex;flex:1;max-width:220px}
.reader-chapternav__next .btn{max-width:none}
/* 键盘翻页提示气泡：读者第一次用左右键切章后不再出现 */
.reader-tip{position:absolute;bottom:calc(100% + 12px);left:50%;transform:translateX(-50%);white-space:nowrap;background:#22262e;color:#fff;font-size:14px;line-height:1.4;padding:12px 18px;border-radius:8px;box-shadow:0 6px 20px rgba(0,0,0,.18);pointer-events:none;z-index:5;animation:readerTipIn .3s ease-out}
.reader-tip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:7px solid transparent;border-top-color:#22262e}
@keyframes readerTipIn{from{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%,0)}}
.reader-chapternav .btn--ghost{background:transparent;border-color:var(--rd-line);color:var(--rd-text)}
.reader-chapternav .btn--ghost:hover{border-color:var(--brand);color:var(--brand)}
html[data-theme="night"] .btn--ghost{background:transparent}

.reader-dock{position:fixed;top:50%;transform:translateY(-50%);left:calc(50% + var(--reader-w) / 2 + 16px);display:flex;flex-direction:column;gap:4px;background:var(--rd-paper);border:1px solid var(--rd-line);border-radius:var(--r-lg);padding:6px;z-index:90;box-shadow:var(--shadow)}
.reader-dock a,.reader-dock button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:52px;height:52px;border-radius:var(--r);color:var(--rd-muted);font-size:11px;line-height:1}
.reader-dock a:hover,.reader-dock button:hover{background:var(--brand-soft);color:var(--brand)}
html[data-theme="night"] .reader-dock a:hover,html[data-theme="night"] .reader-dock button:hover{background:#2a2a2a}
.reader-dock svg{width:20px;height:20px}
.reader-dock #cFavs.is-done a{color:var(--brand)}

.reader-bar{display:none;position:fixed;left:0;right:0;bottom:0;height:calc(50px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--rd-bar);backdrop-filter:saturate(180%) blur(8px);border-top:1px solid var(--rd-line);z-index:100;transition:transform .25s}
.reader-bar a,.reader-bar button{flex:1;display:flex;align-items:center;justify-content:center;height:50px;font-size:14px;color:var(--rd-text)}
.reader-bar a:first-child,.reader-bar a:last-child{color:var(--brand);font-weight:500}

.reader-mask{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:150;display:none}
.reader-panel{position:fixed;z-index:160;display:none;background:var(--rd-panel);color:var(--rd-text);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);width:420px;left:50%;top:50%;transform:translate(-50%,-50%);padding:16px 20px 20px}
.reader-panel.is-open,.reader-mask.is-open{display:block}
.reader-panel__hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:16px}
.reader-panel__hd button{font-size:22px;color:var(--rd-muted);width:32px;height:32px;line-height:1}
.reader-panel__row{display:flex;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid var(--rd-line)}
.reader-panel__row:last-of-type{border-bottom:0}
.reader-panel__label{width:40px;flex:none;color:var(--rd-muted);font-size:13px}
.theme-swatches{display:flex;gap:14px}
.theme-swatches button{width:34px;height:34px;border-radius:50%;border:2px solid var(--rd-line);transition:border-color .15s,transform .15s}
.theme-swatches button.on{border-color:var(--brand);transform:scale(1.1)}
.seg{display:flex;gap:8px;flex:1}
.seg button{flex:1;height:32px;border-radius:var(--r);border:1px solid var(--rd-line);color:var(--rd-text);font-size:13px;background:transparent}
.seg button.on{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
html[data-theme="night"] .seg button.on{background:#2a2a2a}
.stepper{display:flex;align-items:center;gap:8px;flex:1}
.stepper button{width:64px;height:32px;border-radius:var(--r);border:1px solid var(--rd-line);color:var(--rd-text);font-size:14px}
.stepper button:hover{border-color:var(--brand);color:var(--brand)}
.stepper span{flex:1;text-align:center;font-size:15px;font-weight:600}
.reader-panel__tip{font-size:12px;color:var(--rd-muted);padding-top:10px}

/* 隐藏顶栏/底栏（移动端点击正文切换） */
body.chrome-hidden .reader-top{transform:translateY(-100%)}
body.chrome-hidden .reader-bar{transform:translateY(100%)}

/* 目录抽屉：点击目录就地展开，不再跳走 */
.cat-mask{position:fixed;inset:0;background:rgba(0,0,0,.35);opacity:0;visibility:hidden;transition:opacity .25s;z-index:200}
.cat-mask.is-open{opacity:1;visibility:visible}
.cat-drawer{position:fixed;top:0;right:0;bottom:0;width:420px;max-width:88vw;display:flex;flex-direction:column;background:var(--rd-paper);border-left:1px solid var(--rd-line);box-shadow:-8px 0 28px rgba(0,0,0,.10);transform:translateX(100%);transition:transform .28s ease;z-index:201}
.cat-drawer.is-open{transform:none}
.cat-drawer__hd{display:flex;gap:14px;padding:22px 24px 18px;flex:none}
.cat-drawer__hd .cover{width:64px;flex:none}
.cat-drawer__info{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:5px}
.cat-drawer__name{display:flex;align-items:center;gap:4px;font-size:18px;font-weight:600;color:var(--rd-text);min-width:0}
.cat-drawer__name span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cat-drawer__name i{font-style:normal;color:var(--rd-muted);flex:none}
.cat-drawer__name:hover{color:var(--brand)}
.cat-drawer__sub{font-size:13px;color:var(--rd-muted)}
.cat-drawer__bar{display:flex;align-items:center;justify-content:space-between;padding:6px 24px 12px;flex:none}
.cat-drawer__count{font-size:17px;font-weight:600;color:var(--rd-text)}
.cat-drawer__bar button{font-size:14px;color:var(--rd-muted)}
.cat-drawer__bar button:hover{color:var(--brand)}
.cat-drawer__list{flex:1;overflow-y:auto;overscroll-behavior:contain;padding-bottom:24px}
.cat-drawer__list a{display:flex;align-items:center;gap:8px;padding:15px 24px;font-size:15px;line-height:1.5;color:var(--rd-text);border-top:1px solid var(--rd-line);content-visibility:auto;contain-intrinsic-size:auto 51px}
.cat-drawer__list a:hover{background:var(--rd-bg)}
.cat-drawer__list a.is-current{color:var(--brand);font-weight:600}
.cat-drawer__list a>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cat-drawer__list svg{width:16px;height:16px;flex:none}
.cat-drawer__list .lock{margin-left:auto;color:var(--rd-muted)}
.cat-drawer__tip{padding:32px 24px;text-align:center;color:var(--rd-muted);font-size:14px}
body.cat-open{overflow:hidden}

@media (max-width:1180px){
  .reader-dock{left:auto;right:12px}
}
@media (max-width:1024px){
  .reader-panel__row--width{display:none}
}
@media (max-width:768px){
  html{--reader-fs:17px}
  .reader-top__inner{gap:8px;padding:0 8px}
  .reader-top__actions .user_link,.reader-top__actions button{display:none}
  .reader-top__actions a{padding:6px 6px}
  .reader-body{padding:52px 0 70px}
  .reader-paper{max-width:none;border-radius:0;padding:20px 16px 28px;box-shadow:none}
  .reader-title{font-size:21px;margin-top:4px}
  .reader-meta{padding-bottom:14px;margin-bottom:18px;gap:4px 12px;font-size:12px}
  .reader-promo{margin:0 -16px 20px;aspect-ratio:7/3;border-radius:0}
  .reader-dock{display:none}
  .reader-bar{display:flex}
  .cat-drawer{width:100%;max-width:none}
  .cat-drawer__hd{padding:16px 16px 12px}
  .cat-drawer__bar{padding:4px 16px 10px}
  .cat-drawer__list a{padding:14px 16px}
  .reader-paywall{--paywall-btn-h:48px;padding:40px 16px}
  .reader-paywall__btns .btn{padding:0 24px;font-size:18px}
  .reader-chapternav{gap:10px}
  .reader-chapternav .btn{max-width:none;padding:0 8px}
  .reader-pagenav{gap:10px}
  .reader-panel{width:auto;left:0;right:0;top:auto;bottom:0;transform:none;border-radius:var(--r-lg) var(--r-lg) 0 0;padding-bottom:calc(20px + env(safe-area-inset-bottom))}
  .theme-swatches{gap:12px}
}

/* ---- 未登录墙：只引导下载 App（网页端不再给登录入口） ---- */
.reader-paywall--app .reader-paywall__btns{margin-bottom:16px}
.reader-paywall--app .btn--primary{min-width:220px}
.reader-paywall__qr{display:none}
/* 二维码自带白底白边，否则 night 主题下扫不出来 */
@media (min-width:769px){
  .reader-paywall__qr{display:flex;justify-content:center;margin-bottom:22px}
  .reader-paywall__qr img{width:140px;height:140px;background:#fff;padding:4px;border-radius:var(--r-sm)}
}
.reader-paywall__legal{color:var(--rd-muted);font-size:13px;margin-bottom:calc(var(--paywall-btn-h) * .8)}
.reader-paywall__legal a{color:var(--rd-muted)}
.reader-paywall__legal a:hover{color:var(--brand)}
.reader-paywall__legal .sep{margin:0 8px;color:var(--rd-line)}
/* 手机上不显示二维码，"扫码"二字也跟着去掉 */
@media (max-width:768px){.pw-scan{display:none}}
/* 夜间把 --brand 提亮成 #66b3ab，白字只有 2.3:1，改深色字 */
html[data-theme="night"] .btn--primary,html[data-theme="night"] .btn--primary:hover{color:#10211f}