/* ══════════════════════════════════════════════════════════════════════════
   字醒啦 · 章节正文排版层  (reading.css)
   ---------------------------------------------------------------
   2026-10-28 九轮她：「关于爱丽丝漫游仙境的内页阅读，我希望你也改善一下排版，
   比如第一章的阅读显示排版等等，要做一个通用的统一的排版设计。」

   十六个章页本来就是同一个模板（字号那一组完全一致），所以这一层不改每章自己的
   戏，只把「读的部分」统一成一套规矩：

     一、字号与行距一套：正文 clamp(17,2.35vw,27) / 行高 1.92 / 字距 .035em
     二、行宽一套：正文一栏 23em（中文约 23 字一行），大字不设限
     三、对齐一套：
           · 短句（进门那一刻不到 60 字）—— 照旧居中，一句一屏，是这本书的语气
           · 长段（60 字以上）—— 改成左边一栏（.rd-prose），长文居中读不动
     四、对白：人名留在句首（.spk），整块跟着长段一起左对齐

   ⚠️ 标记是 reading.js 加的，不是手写：它数每屏进门时的字数与元素数
      （戏法屏动辄几十上百个元素，一律不碰）。
   ══════════════════════════════════════════════════════════════════════════ */

:root{
  --rd-body:clamp(17px,2.35vw,27px);
  --rd-lh:1.92;
  --rd-measure:23em;
  --rd-col:min(37rem,100%);
  --rd-lead:clamp(15px,1.8vw,20px);
  --rd-gap:clamp(8px,1.6vh,18px);
  --rd-gap-prose:clamp(7px,1.2vh,13px);
}

/* ── 一、基础的字 ─────────────────────────────────────── */
.blk{ gap:var(--rd-gap); }

.blk p{
  font-size:var(--rd-body);
  line-height:var(--rd-lh);
  letter-spacing:.035em;
  max-width:var(--rd-measure);
  text-wrap:pretty;
}
.blk .q{
  font-size:var(--rd-body);
  letter-spacing:.05em;
}
.blk .qb{
  font-size:clamp(28px,4.4vw,54px);
  line-height:1.5;
  letter-spacing:.05em;
}
.blk .sm{
  font-size:var(--rd-lead);
  line-height:1.9;
  letter-spacing:.04em;
}
.blk .sub{
  font-size:clamp(11.5px,1.4vw,14px);
  letter-spacing:.36em;
  text-indent:.36em;
}
.blk .hint,
.blk .hintline,
.blk .dimline{
  font-size:clamp(12.5px,1.45vw,14px);
  line-height:1.85;
  letter-spacing:.1em;
}
.blk .dimline{ letter-spacing:.16em; }

/* 对白：人名压成次级色，句子照旧 */
.blk .spk{
  color:var(--dim);
  letter-spacing:.06em;
  margin-right:.3em;
}

/* ── 二、长段：一栏居中、字向左排 ───────────────────────
   不是把整块推到左边，而是「栏宽固定、栏居中、栏里左对齐」——
   这样长段的左沿和上面那些居中短句的中线对得上。 */
.blk.rd-prose{
  text-align:left;
  gap:var(--rd-gap-prose);
}
.blk.rd-prose p{
  width:var(--rd-col);
  max-width:var(--rd-col);
}

/* ── 三、对白屏：说话的人留在句首，整块跟着左对齐 ─────── */
.blk.rd-dlg p{
  width:var(--rd-col);
}

/* ── 四、手机：行高与行宽都收一点 ─────────────────────── */
@media (max-width:600px){
  .blk{ padding-left:7vw; padding-right:7vw; }
  .blk p{ line-height:1.88; letter-spacing:.03em; }
}