/* ═══════════════════════════════════════════
   「silhouette」· 诗集样式（单点维护，2026.8.16 改造为虚拟分页版）
   - 依赖：warm.css（token/字体/杂志分页 .mag-* 组件）
   - 页面结构：.container.mag-source 直接子元素 = 页首 + 各 .poem
     （配合 js/paginate.js：桌面端自动分页双栏，无 JS / 移动端整篇滚动）
   - 分页导航（.mag-nav / .mag-page / .mag-col 等）样式一律由
     warm.css 提供，本文件不重复定义、不覆盖
   - ⚠️ 唯一例外：.mag-page 的 max-width 覆盖为 1180px（warm.css 为 1040px），
     silhouette 页特调——栏宽 444→514px，让中英对照行全部单行装下（详见分页适配节）
   - 样式修改一律进本文件，页面零内联 <style>
   ═══════════════════════════════════════════ */

/* ── 基础 ── */
body { line-height: 2.2; color: #3a3129; }

/* ── 页首 ── */
.back { font-size: 0.85rem; color: #6b6155; text-decoration: none; margin-bottom: 48px; display: inline-block; }
.back:hover { color: var(--hover); }
h1 {
    font-size: 1.4rem;
    font-weight: 400;
    letter-spacing: 2px;
    margin-bottom: 56px; /* 副标已删，原副标留白并入 h1 */
    color: #3a3129;
}
.subtitle {
    font-size: 0.85rem;
    color: #6b6155;
    letter-spacing: 2px;
    margin-bottom: 56px;
    text-align: right;
}

/* ── 诗墙核心：连绵的意识流 ── */
.poem {
    margin-bottom: 68px;
    position: relative;
}
.poem:last-child { margin-bottom: 0; }

/* 诗题：楷体、略大于正文（1.1rem vs 正文 0.98rem），与诗句明显区分；
   诗名朱红印章色（对齐 v0.2 .zh-side .p-title），作者墨蓝（对齐 --ink 钢笔字） */
.poem-title {
    font-family: var(--font-kai);
    font-size: 1.1rem;
    color: #AE1300;
    letter-spacing: 2px;
    margin-bottom: 14px;
    font-weight: 400;
    text-align: right;
}
.poem-title .author { color: #4a6b80; }

/* 诗句：极细字重，右对齐，像写在纸边 */
.poem-body { font-family: 'Noto Serif SC', serif; font-weight: 300; }

/* 行级对照：每行「中文+英文」作为一个整体靠右（flex-end）
   只有英文右缘一条对齐线（纸边），中文跟随各自英文，不对齐 */
.line {
    display: flex;
    justify-content: flex-end;
    align-items: baseline;
    gap: 30px;
    padding: 4px 0;
}
.line .cn {
    font-size: 1.05rem;
    color: #3a3129;
    line-height: 2.2;
    letter-spacing: 2px;
    font-weight: 300;
    text-align: right;
    white-space: pre-wrap;
}
.line .en {
    font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    font-size: 1.1rem;
    font-weight: 400;
    color: #6b6155;
    line-height: 2.0;
    text-align: right;
    white-space: pre-wrap;
}
.line.blank { visibility: hidden; padding: 2px 0; }

/* 渐入效果：诗句逐行从下方滑入 */
.line {
    opacity: 0;
    transform: translateY(5px);
    transition: opacity 1s ease var(--reveal-delay, 0s),
                transform 0.3s ease 0s,
                color 0.3s ease 0s;
}
.line.revealed {
    opacity: 1;
    transform: translateY(0);
}

/* 指针滑过：短暂触感，像指尖划过水面（仅桌面端）
   整行（中英一体）变色 + 微放大 1.05
   transform-origin: right（100% 50%）—— 以右缘为轴向左放大：纸边线不动
   「浮起」兜底：行带暖纸底衬 + 提升层级，放大后自盖在内容上，
   任何浏览器（含 Safari origin/overflow 兼容差异）都完整显示、不被覆盖 */
@media (hover: hover) {
    .line:hover {
        transform: scale(1.05);
        transform-origin: right center;
        transform-origin: 100% 50%;
        position: relative;
        z-index: 5;
        background: #FEFDFA;
        border-radius: 4px;
    }
    .line:hover .cn { color: var(--ink); }
    .line:hover .en { color: var(--ink); }
}

/* 移动端触摸：整首诗浸染蓝墨水色 */
.poem.ink-active .line .cn,
.poem.ink-active .line .en {
    color: var(--ink) !important;
}

/* 首字特写：诗首行中文首字放大（古籍刻本感），静态保持
   用独立类 .first-line（行级流拆版后行会脱离 .poem，结构位置选择器不可靠） */
.line.first-line { line-height: 2.2; }
.line.first-line .cn::first-letter {
    font-size: 1.5em;
    font-weight: 500;
    line-height: 36.96px; /* = 1.05rem × 2.2 */
}

/* ── 插图块（书页插图，按诗灵活选型）──
   图随诗走：诗题下、诗行前；行级流模式下作为独立块参与填版 */
.fig { margin: 0 0 16px; }
.fig img {
    width: 100%; height: auto; display: block;
    border-radius: 6px;
}
.fig-hero img { max-width: 260px; margin-left: auto; }  /* 题头大图：右对齐小图，防超高 */
.fig-band img { max-width: 100%; opacity: 0.92; }       /* 顶部装饰条：全宽细带 */
.fig-thin img { max-width: 200px; margin: 0 auto; }     /* 间隔窄图：居中窄图 */

/* 占位诗（待核对） */
.poem-pending {
    font-size: 0.8rem;
    color: rgba(58, 49, 41, 0.45);
    letter-spacing: 2px;
    font-weight: 300;
    text-align: right;
    font-style: normal;
}

/* 分隔用极细线，像毛笔提起来时的飞白 */
.poem::after {
    content: "";
    display: block;
    width: 24px;
    height: 1px;
    background: #e3ddd0;
    margin: 68px auto 0;
}
.poem:last-child::after { display: none; }

/* ── 诗目（「目」）：滚动模式（移动端 / 无 JS）用
   桌面分页模式下隐藏——锚点跳转对非当前页无效，由翻页条的
   页码列表（mag-list）承担导航 ── */
.sep { margin: 0 6px; color: rgba(58, 49, 41, 0.45); font-size: 0.85rem; }
.sha-list-btn {
    font-size: 0.85rem; letter-spacing: 1px; color: #6b6155;
    background: none; border: 0; font-family: inherit; cursor: pointer; padding: 0;
}
.sha-list-btn:hover { color: var(--ink); }
.sha-list {
    position: fixed; top: 64px; left: 32px; z-index: 30;
    background: #f7f4ec;
    border: 1px solid #e3ddd0;
    border-radius: 12px;
    padding: 18px 22px;
    min-width: 240px;
    box-shadow: 0 8px 28px rgba(58, 49, 41, 0.08);
    opacity: 0; pointer-events: none;
    transform: translateY(-6px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}
.sha-list.open { opacity: 1; pointer-events: auto; transform: translateY(0); }
.sha-list .vol { font-size: 0.7rem; letter-spacing: 2px; color: rgba(58, 49, 41, 0.45); margin-bottom: 12px; }
.sha-list ol { list-style: none; }
.sha-list li { font-size: 0.85rem; line-height: 2.1; }
.sha-list li a { color: #6b6155; text-decoration: none; }
.sha-list li a:hover { color: var(--ink); }
@media (min-width: 601px) {
    .sep, .sha-list-btn, .sha-list { display: none; }
}

/* ═══ 虚拟分页适配（paginate.js + warm.css .mag-* 组件）═══
   桌面端由引擎分页：每页双栏，栏宽 ≈ (1040 − 48×2 − 56) / 2 ≈ 444px
   行级流下栏内行宽 ≤ 栏宽，hover 放大（scale 1.05）以右纸边为轴向左扩展，
   溢出部分落进栏间 gap / 页边距空白（栏级 overflow: visible + 页级裁剪兜底） */
/* ── 栏高加固（Safari flex 溢出坑，2026.8.16 复发修复）：
   .mag-col 是 flex 子项，默认 min-height:auto + 内容超高会把栏自身撑高，
   导致 clientHeight 随内容增长、fits 永远判定放得下（症状：左栏无限延伸、右栏空白）。
   ⚠️ 复发教训：height:100% 在 overflow:visible 下不可靠（百分比高度解析异常），
   改用 flex 约束锁高——.mag-cols 固定高度（warm.css calc(100vh-88px)）+
   .mag-col 去掉 height:100%、加 max-height:100% 硬上限，min-height 归零。
   栏级与列级 overflow: visible：hover 放大（scale 1.05，右纸边为轴向左扩展）
   的溢出部分一路落进页边距 / 栏间 gap 空白，不被任何内层容器裁剪；
   页面级裁剪由 .mag-page 的 overflow: hidden 兜底 ── */
.mag-page { overflow: hidden; max-width: 1180px; } /* silhouette 页特调：覆盖 warm.css 的 1040px → 栏宽 444→514px，让中英对照行全部单行装下 */
.mag-col { min-height: 0; max-height: 100%; overflow: visible; }
.mag-cols { overflow: visible; }
.mag-col .subtitle { margin-bottom: 24px; }
.mag-col .poem { margin-bottom: 56px; }
.mag-col .poem::after { margin-top: 56px; }
.mag-col .line { gap: 40px; padding: 3px 0; }
.mag-col .line .cn { font-size: 0.95rem; letter-spacing: 1.5px; }
.mag-col .line .en { font-size: 1rem; }
.mag-col .line.first-line .cn::first-letter { line-height: 33.44px; } /* = 0.95rem × 2.2 */
.mag-col .poem-title { margin-bottom: 70px; }
/* 行级流模式：不同诗歌之间用短横线分割，线浮于上下留白中
   （拆版后 .poem 容器被引擎移除，.poem::after 失效，改由下一首诗题承载分隔）
   每页左栏首首诗不显示线（页面顶部干净起首），右栏首首诗保留线 */
.mag-col .poem-title::before {
    content: "";
    display: block;
    width: 24px;
    height: 1px;
    background: #e3ddd0;
    margin: 60px auto 50px;
}
.mag-page > .mag-cols > .mag-col:first-child .poem-title:first-child::before { display: none; }
.mag-col .fig { margin-bottom: 12px; }
.mag-col .fig-hero img { max-width: 220px; }
.mag-col .poem-pending { font-size: 0.78rem; }

/* ═══ 滚动模式（移动端 / 无 JS 回退）═══ */
/* 手机端：中英由并排改为上下，仍整体右对齐 */
@media (max-width: 600px) {
    .line { flex-direction: column; align-items: flex-end; gap: 0; }
    .line .en { margin-top: 4px; }
}

@media (max-width: 500px) {
    .container { padding: 32px 20px 64px; }
    .line .cn { font-size: 0.95rem; line-height: 2.2; }
    .poem { margin-bottom: 48px; }
    .poem::after { margin-top: 48px; }
}
