/* =========================================================
   blog.css — 单篇博客文章的排版规则
   作用域：仅 .single-article 范围内
   设计参照：Pentagram 编辑站典型字号体系
   ========================================================= */

/* ---- 文章主体：标题与正文 ---- */
.single-article h1,
.single-article .h1 {
    font-size: 3.8rem;
    line-height: 1.18;
    letter-spacing: -0.005em;
    margin-bottom: 2.4rem;
    font-weight: 700;
}

.single-article h2,
.single-article .h2,
.single-article h2.wp-block-heading {
    font-size: 2.2rem;
    line-height: 1.32;
    letter-spacing: -0.005em;
    margin-top: 3.2rem;
    margin-bottom: 1rem;
    font-weight: 700;
}

.single-article h3,
.single-article .h3 {
    font-size: 1.8rem;
    line-height: 1.35;
    letter-spacing: -0.005em;
    margin-top: 2.4rem;
    margin-bottom: 0.8rem;
    font-weight: 700;
    font-family: inherit;
}

/* ====================================================
   about.html · payz-travel 风格覆写
   关于鲁蛇页用大标题（与 payz-travel 一致），
   其他 blog 文章保留原来 3.8rem 的小标题。
   ==================================================== */
.about-article.single-article h1,
.about-article.single-article .h1 {
    font-size: 6.4rem;
    line-height: 1;
    margin-bottom: 3.2rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}
.about-article.single-article h2,
.about-article.single-article h2.wp-block-heading {
    font-size: 2.8rem;
    line-height: 1.2;
    font-weight: 700;
    margin-top: 4.8rem;
    margin-bottom: 1.2rem;
    padding-top: 1.6rem;
    border-top: 1px solid rgba(10,10,10,0.08);
}
.about-article.single-article h3 {
    font-size: 1.8rem;
    font-weight: 600;
    margin-top: 2.4rem;
    margin-bottom: 0.8rem;
    color: #4a4540;
}
.about-article .single-article-meta {
    font-size: 1.2rem;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: #8a8580;
    font-weight: 600;
    padding-bottom: 2.4rem;
}
.about-article .single-article-body p {
    font-size: 1.6rem;
    line-height: 1.85;
    margin-bottom: 1.6rem;
    color: #1f1f1f;
}
.about-article .single-article-image {
    border-radius: 0.4rem;
}
.about-article .single-article-image--secondary {
    margin-top: 1.6rem !important;
}
@media (max-width: 991.98px) {
    .about-article.single-article h1,
    .about-article.single-article .h1 { font-size: 4.4rem; }
    .about-article.single-article h2 { font-size: 2.4rem; margin-top: 3.6rem; }
}
@media (max-width: 767.98px) {
    .about-article.single-article h1,
    .about-article.single-article .h1 { font-size: 3.6rem; }
}

.single-article .single-article-body p {
    font-size: 1.6rem;
    line-height: 1.9;
    margin-bottom: 1.4rem;
    color: #1a1a1a;
}

.single-article .single-article-body p:has(strong) strong {
    font-weight: 700;
}

/* ---- 文章元信息（分类 · 日期） ---- */
.single-article-meta {
    font-size: 1.2rem;
    margin-bottom: 2.8rem;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    opacity: 0.6;
    font-weight: 500;
}

/* =========================================================
   blog/index.html ——— 文章目录卡片网格
   ========================================================= */

.blog-index {
    padding: 8rem 0 6rem;
}
.blog-index__head {
    max-width: 78rem;
    margin: 0 0 6rem;
}
.blog-index__eyebrow {
    font-size: 1.2rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    opacity: 0.55;
    font-weight: 500;
    margin: 0 0 1.6rem;
}
.blog-index__title {
    font-size: 9rem;
    font-weight: 800;
    line-height: 0.95;
    letter-spacing: -0.015em;
    margin: 0 0 2.4rem;
    color: #0a0a0a;
}
.blog-index__dot {
    color: #dcfa14;
    margin-left: 0.05em;
}
.blog-index__lead {
    font-size: 1.8rem;
    line-height: 1.6;
    color: #4a4a4a;
    max-width: 56rem;
    margin: 0;
}

/* ---- 搜索框 ---- */
.blog-search {
    position: relative;
    margin: 3.2rem 0 2.4rem;
    max-width: 56rem;
}
.blog-search__input {
    width: 100%;
    padding: 1.5rem 4.2rem 1.5rem 2rem;
    font-size: 1.6rem;
    line-height: 1.4;
    color: #0a0a0a;
    background: #ffffff;
    border: 1px solid #e0e0d8;
    border-radius: 999px;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
    -webkit-appearance: none;
    appearance: none;
    /* 内置搜索图标（CSS-only 圆+柄） */
}
.blog-search__input::placeholder {
    color: #9a978f;
}
.blog-search__input:focus {
    border-color: #0a0a0a;
    box-shadow: 0 0 0 4px rgba(220, 250, 20, 0.35);
}
.blog-search__clear {
    position: absolute;
    top: 50%; right: 0.8rem;
    transform: translateY(-50%);
    width: 3.2rem; height: 3.2rem;
    border: 0;
    background: #1a1a1a;
    color: #ffffff;
    border-radius: 50%;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
}
.blog-search__clear:hover { background: #dcfa14; color: #0a0a0a; }
.blog-search__count {
    margin: 1rem 0 0;
    font-size: 1.25rem;
    color: #6a6a6a;
    font-weight: 500;
    letter-spacing: 0.05em;
    min-height: 1.4em;
}

/* ---- 分类筛选 chips ---- */
.blog-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    margin: 0 0 4rem;
}
.blog-filter__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.8rem 1.6rem;
    border: 1px solid #d8d4ca;
    border-radius: 999px;
    background: transparent;
    color: #3a3a3a;
    font-size: 1.35rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.18s, color 0.18s, border-color 0.18s, transform 0.18s;
    font-family: inherit;
    line-height: 1;
}
.blog-filter__chip:hover {
    border-color: #0a0a0a;
    color: #0a0a0a;
}
.blog-filter__chip.is-active {
    background: #0a0a0a;
    color: #ffffff;
    border-color: #0a0a0a;
}
.blog-filter__chip.is-active .blog-filter__n {
    background: #dcfa14;
    color: #0a0a0a;
}
.blog-filter__n {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.4rem;
    height: 2rem;
    padding: 0 0.6rem;
    background: rgba(0, 0, 0, 0.08);
    color: #6a6a6a;
    border-radius: 999px;
    font-size: 1.15rem;
    font-weight: 600;
    transition: background 0.18s, color 0.18s;
}

/* 空态 */
.blog-index__empty {
    margin: 6rem 0;
    text-align: center;
    font-size: 1.6rem;
    color: #8a8a8a;
}

/* 卡片隐藏（hidden 属性 + 防 .post-card display:flex 的覆盖） */
.post-card[hidden] {
    display: none !important;
}

/* 无视频时去掉 cover 上的"看视频"角标依据，确保 .video-cover.no-video 是 div 而不是 a，没有 cursor:pointer */
.video-cover.no-video {
    cursor: default;
}

/* 手机端搜索 / 筛选 */
@media (max-width: 767.98px) {
    .blog-search { margin: 2.4rem 0 1.6rem; }
    .blog-search__input { font-size: 1.5rem; padding: 1.3rem 3.8rem 1.3rem 1.6rem; }
    .blog-filter { margin: 0 0 3rem; gap: 0.6rem; }
    .blog-filter__chip { padding: 0.7rem 1.3rem; font-size: 1.2rem; }
}


/* ---- 卡片网格 ---- */
.post-grid {
    display: grid;
    gap: 4rem 3rem;
    grid-template-columns: 1fr;
}
@media (min-width: 768px) {
    .post-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1100px) {
    .post-grid { grid-template-columns: 1fr 1fr 1fr; }
}

.post-card {
    margin: 0;
}
.post-card__link {
    display: block;
    color: inherit;
    text-decoration: none;
}
.post-card__cover {
    margin: 0 0 2rem;
    overflow: hidden;
    border-radius: 0.8rem;
    background: #1a1a1a;
    aspect-ratio: 16 / 9;
    box-shadow: 0 0.4rem 1.6rem rgba(0, 0, 0, 0.06);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.post-card__cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.post-card__link:hover .post-card__cover {
    box-shadow: 0 1.2rem 3rem rgba(0, 0, 0, 0.15);
    transform: translateY(-0.4rem);
}
.post-card__link:hover .post-card__cover img {
    transform: scale(1.03);
}

.post-card__meta {
    list-style: none;
    padding: 0;
    margin: 0 0 1rem;
    display: flex;
    gap: 1.6rem;
    font-size: 1.15rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 500;
    opacity: 0.6;
}
.post-card__meta li:not(:last-child)::after {
    content: "·";
    margin-left: 1.6rem;
    opacity: 0.5;
}
.post-card__title {
    font-size: 2.2rem;
    line-height: 1.35;
    margin: 0;
    font-weight: 700;
    letter-spacing: -0.005em;
    color: #0a0a0a;
    transition: color 0.2s ease;
}
.post-card__link:hover .post-card__title {
    color: #5a5a5a;
}

@media (max-width: 991.98px) {
    .blog-index { padding: 6rem 0 4rem; }
    .blog-index__head { margin-bottom: 4.5rem; }
    .blog-index__title { font-size: 7rem; }
    .blog-index__lead { font-size: 1.6rem; }
    .post-grid { gap: 3.5rem 2.4rem; }
    .post-card__title { font-size: 2rem; }
}
@media (max-width: 767.98px) {
    .blog-index { padding: 4rem 0 3rem; }
    .blog-index__head { margin-bottom: 3.5rem; }
    .blog-index__title { font-size: 5.4rem; }
    .blog-index__lead { font-size: 1.5rem; }
    .post-grid { gap: 3rem; }
    .post-card__cover { border-radius: 0.6rem; }
    .post-card__title { font-size: 1.9rem; line-height: 1.4; }
    .post-card__meta { font-size: 1.05rem; }
}


/* ---- 视频封面（YouTube 缩略图 + 播放按钮） ----
   设计要点：
     · 固定 16:9 容器，避免图片加载时的布局跳动（CLS = 0）
     · object-fit: cover 让任意比例的封面优雅裁剪
     · 底部低对比度渐变，增加深度感、让播放按钮更突出
     · 播放按钮用 CSS triangle（不依赖字体 / unicode ▶）
     · hover 时图片轻微 zoom + 按钮放大 + 阴影加深，呼应 YouTube 自家交互
     · loading 时显示低饱和灰色背景占位
*/
.video-cover {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 1.2rem;
    cursor: pointer;
    background: #1a1a1a;                       /* 加载占位色 */
    aspect-ratio: 16 / 9;                      /* 锁定比例，零布局跳动 */
    box-shadow: 0 0.4rem 2rem rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.3s ease;
}
.video-cover:hover {
    box-shadow: 0 1.2rem 3.2rem rgba(0, 0, 0, 0.18);
}
.video-cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.video-cover:hover img {
    transform: scale(1.035);
}

/* 底部柔和渐变 —— 增加层次，让按钮更醒目 */
.video-cover::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        transparent 0%,
        transparent 55%,
        rgba(0, 0, 0, 0.18) 100%
    );
    pointer-events: none;
    transition: opacity 0.3s ease;
}

/* 播放按钮主体 */
.video-cover__play {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 7.8rem;
    height: 7.8rem;
    background: rgba(220, 250, 20, 0.95);
    border-radius: 50%;
    box-shadow:
        0 0.6rem 2rem rgba(0, 0, 0, 0.35),
        inset 0 0 0 1px rgba(0, 0, 0, 0.04);
    pointer-events: none;
    transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
    /* 字体重写：让 Unicode ▶ 失效，由 ::before 画出更锐利的三角 */
    font-size: 0;
    line-height: 0;
}

/* CSS 三角形播放图标（取代 Unicode ▶） */
.video-cover__play::before {
    content: "";
    position: absolute;
    top: 50%; left: 54%;
    transform: translate(-50%, -50%);
    width: 0; height: 0;
    border-style: solid;
    border-width: 1.3rem 0 1.3rem 2.2rem;       /* 高 2.6rem，宽 2.2rem */
    border-color: transparent transparent transparent #1a1a1a;
}

/* hover 反馈：按钮轻微放大、外圈柔光、图片轻微 zoom */
.video-cover:hover .video-cover__play {
    transform: translate(-50%, -50%) scale(1.08);
    box-shadow:
        0 0.8rem 2.6rem rgba(0, 0, 0, 0.4),
        0 0 0 1.4rem rgba(220, 250, 20, 0.18);   /* 外圈柔光环 */
}

/* ====================================================
   about.html —— 关于鲁蛇页（书稿风格，克制排版）
   ==================================================== */
.about-article {
    padding: 9rem 0 4rem;
    background: #ffffff;
}
.about-article .container {
    max-width: 90rem;
}

/* Hero — 小标题 + 一个克制的大字 */
.about-article .about-hero {
    max-width: 62rem;
    margin: 0 auto 6rem;
    padding: 0 0 3.6rem;
    border-bottom: 1px solid rgba(10,10,10,0.08);
    text-align: left;
}
.about-article .about-hero__eyebrow {
    font-size: 1.15rem;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: #8a8580;
    font-weight: 600;
    margin: 0 0 1.4rem;
}
.about-article .about-hero__title {
    font-size: 6.4rem;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #0a0a0a;
    margin: 0;
}
.about-article .about-hero__dot {
    color: #dcfa14;
    margin-left: 0.04em;
}

/* 正文：书稿排版 */
.about-article .about-body {
    max-width: 62rem;
    margin: 0 auto;
    color: #1f1f1f;
    font-feature-settings: "kern" 1;
}
.about-article .about-body p {
    font-size: 1.7rem;
    line-height: 1.95;
    margin: 0 0 1.7rem;
}
.about-article .about-body strong {
    font-weight: 600;
    color: #0a0a0a;
}
.about-article .about-body h2 {
    font-size: 2rem;
    line-height: 1.35;
    font-weight: 700;
    letter-spacing: -0.005em;
    color: #0a0a0a;
    margin: 4.4rem 0 1.4rem;
}
.about-article .about-body ul {
    list-style: none;
    padding: 0;
    margin: 0 0 1.7rem;
}
.about-article .about-body ul li {
    font-size: 1.7rem;
    line-height: 1.85;
    padding: 0 0 0 1.8rem;
    position: relative;
    margin: 0 0 0.4rem;
}
.about-article .about-body ul li::before {
    content: "·";
    position: absolute;
    left: 0.4rem;
    top: -0.1rem;
    font-weight: 700;
    color: #1f1f1f;
}

/* 内文小照片 — 不超过文字栏宽 */
.about-article .about-figure {
    margin: 2.4rem 0 3rem;
}
.about-article .about-figure img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 0.4rem;
}
.about-article .about-figure figcaption {
    font-size: 1.25rem;
    line-height: 1.6;
    color: #8a8580;
    margin-top: 1rem;
    font-style: italic;
    letter-spacing: 0.01em;
}

/* 落款 */
.about-article .about-signoff {
    margin: 5rem 0 0;
    padding: 3.2rem 0 0;
    border-top: 1px solid rgba(10,10,10,0.08);
    font-size: 1.7rem;
    line-height: 1.6;
    color: #0a0a0a;
    font-weight: 500;
    letter-spacing: 0.005em;
}
.about-article .about-signoff__dot {
    color: #dcfa14;
    margin-left: 0.05em;
    font-weight: 700;
}

/* 平板 */
@media (max-width: 991.98px) {
    .about-article { padding: 6rem 0 3rem; }
    .about-article .about-hero { margin-bottom: 4.4rem; padding-bottom: 2.8rem; }
    .about-article .about-hero__title { font-size: 5rem; }
    .about-article .about-body p { font-size: 1.6rem; line-height: 1.9; }
    .about-article .about-body ul li { font-size: 1.6rem; }
    .about-article .about-body h2 { font-size: 1.85rem; margin-top: 3.6rem; }
    .about-article .about-figure { margin: 2rem 0 2.6rem; }
    .about-article .about-signoff { font-size: 1.6rem; margin-top: 4rem; padding-top: 2.6rem; }
}

/* 手机 */
@media (max-width: 767.98px) {
    .about-article .about-hero__title { font-size: 4rem; }
    .about-article .about-body p { font-size: 1.55rem; }
    .about-article .about-body ul li { font-size: 1.55rem; }
}

/* ====================================================
   YouTube CTA —— 文章底部，引导观看视频 / 订阅频道
   ==================================================== */
.youtube-cta {
    background: #0a0a0a;
    color: #ffffff;
    padding: 6rem 0;
    margin: 6rem 0 0;
}
.youtube-cta__inner {
    max-width: 72rem;
    margin: 0 auto;
    text-align: center;
}
.youtube-cta__eyebrow {
    font-size: 1.2rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #dcfa14;
    font-weight: 600;
    margin: 0 0 1.6rem;
    opacity: 0.9;
}
.youtube-cta__title {
    font-size: 3.6rem;
    line-height: 1.18;
    font-weight: 800;
    letter-spacing: -0.01em;
    margin: 0 0 1.8rem;
    color: #ffffff;
}
.youtube-cta__lead {
    font-size: 1.6rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.75);
    margin: 0 0 3.2rem;
}
.youtube-cta__btns {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
    justify-content: center;
}
.youtube-cta__btn {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    padding: 1.4rem 2.4rem;
    border-radius: 999px;
    font-size: 1.5rem;
    font-weight: 600;
    text-decoration: none;
    transition: transform 0.2s, background 0.2s, color 0.2s, box-shadow 0.2s;
    line-height: 1;
    max-width: 100%;
}
.youtube-cta__btn--primary {
    background: #dcfa14;
    color: #0a0a0a;
}
.youtube-cta__btn--primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 0.8rem 2rem rgba(220, 250, 20, 0.35);
    color: #0a0a0a;
}
.youtube-cta__btn--secondary {
    background: transparent;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.3);
}
.youtube-cta__btn--secondary:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.6);
    color: #ffffff;
}
/* CSS 三角播放图标（按钮内左侧） */
.youtube-cta__play {
    display: inline-block;
    width: 0; height: 0;
    border-style: solid;
    border-width: 0.6rem 0 0.6rem 0.9rem;
    border-color: transparent transparent transparent currentColor;
    flex-shrink: 0;
}
@media (max-width: 767.98px) {
    .youtube-cta { padding: 4.4rem 0; margin-top: 4.4rem; }
    .youtube-cta__title { font-size: 2.6rem; margin-bottom: 1.4rem; }
    .youtube-cta__lead { font-size: 1.45rem; margin-bottom: 2.4rem; }
    .youtube-cta__btns { flex-direction: column; align-items: stretch; gap: 0.8rem; }
    .youtube-cta__btn { justify-content: center; padding: 1.3rem 1.8rem; font-size: 1.4rem; }
}

/* ---- 正文里的图片（<figure class="post-image">） ---- */
.single-article .post-image {
    margin: 3.2rem 0;
    border-radius: 0.8rem;
    overflow: hidden;
    background: #f3eee5;
    box-shadow: 0 0.4rem 1.6rem rgba(0, 0, 0, 0.06);
}
.single-article .post-image img {
    display: block;
    width: 100%;
    height: auto;
}
@media (max-width: 767.98px) {
    .single-article .post-image {
        margin: 2.4rem -2rem;          /* 在手机端铺到容器边缘 */
        border-radius: 0;
    }
}

/* 焦点环（键盘可达性） */
.video-cover:focus-visible {
    outline: 3px solid #dcfa14;
    outline-offset: 4px;
}

/* ---- 视频角标 ".video-cover__cue" ----
   位置：右上角；idle 是半透明黑底白字药丸，hover 翻成黄绿色按钮感
   作用：告诉访客「这是视频，点击可看」 */
.video-cover__cue {
    position: absolute;
    top: 1.6rem;
    right: 1.6rem;
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    background: rgba(10, 10, 10, 0.72);
    color: #ffffff;
    padding: 0.8rem 1.4rem 0.8rem 1.2rem;
    border-radius: 999px;
    font-size: 1.3rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: background 0.25s ease, color 0.25s ease, transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
    pointer-events: none;
    box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.18);
}
/* CSS 三角形播放图标（不依赖 unicode ▶ 渲染差异） */
.video-cover__cue::before {
    content: "";
    width: 0; height: 0;
    border-style: solid;
    border-width: 0.55rem 0 0.55rem 0.85rem;
    border-color: transparent transparent transparent currentColor;
}
.video-cover:hover .video-cover__cue {
    background: rgba(220, 250, 20, 0.96);
    color: #0a0a0a;
    transform: scale(1.06);
    box-shadow: 0 0.6rem 1.8rem rgba(220, 250, 20, 0.35);
}
@media (max-width: 767.98px) {
    .video-cover__cue {
        top: 1rem;
        right: 1rem;
        padding: 0.6rem 1.1rem 0.6rem 0.95rem;
        font-size: 1.15rem;
    }
    .video-cover__cue::before {
        border-width: 0.45rem 0 0.45rem 0.7rem;
    }
}

/* ---- 手机端响应式 ---- */
@media (max-width: 767.98px) {
    .single-article h1,
    .single-article .h1 {
        font-size: 2.8rem;
        margin-bottom: 1.6rem;
    }
    .single-article h2,
    .single-article .h2,
    .single-article h2.wp-block-heading {
        font-size: 1.9rem;
        margin-top: 2.4rem;
    }
    .single-article .single-article-body p {
        font-size: 1.5rem;
        line-height: 1.85;
    }
    .single-article-meta {
        font-size: 1.1rem;
        margin-bottom: 2rem;
    }
    .video-cover {
        border-radius: 0.8rem;
    }
    .video-cover__play {
        width: 5.4rem;
        height: 5.4rem;
    }
    .video-cover__play::before {
        border-width: 0.9rem 0 0.9rem 1.5rem;
    }
    .video-cover:hover .video-cover__play {
        box-shadow:
            0 0.6rem 2rem rgba(0, 0, 0, 0.35),
            0 0 0 0.9rem rgba(220, 250, 20, 0.18);
    }
}

/* ====================================================
   books.html —— 四本书页（书稿风格）
   ==================================================== */
.books-article {
    padding: 9rem 0 6rem;
    background: #ffffff;
}
.books-article .container {
    max-width: 110rem;
}

.books-article .books-hero {
    max-width: 62rem;
    margin: 0 auto 7rem;
    padding: 0 0 3.6rem;
    border-bottom: 1px solid rgba(10,10,10,0.08);
}
.books-article .books-hero__eyebrow {
    font-size: 1.15rem;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: #8a8580;
    font-weight: 600;
    margin: 0 0 1.4rem;
}
.books-article .books-hero__title {
    font-size: 6.4rem;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #0a0a0a;
    margin: 0 0 1.6rem;
}
.books-article .books-hero__dot {
    color: #dcfa14;
    margin-left: 0.04em;
}
.books-article .books-hero__lead {
    font-size: 1.7rem;
    line-height: 1.7;
    color: #4a4540;
    margin: 0;
}

/* 单本书：上图 + 下文 */
.books-article .book {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    align-items: start;
    margin: 0 0 8rem;
    padding: 0 0 8rem;
    border-bottom: 1px solid rgba(10,10,10,0.06);
}
.books-article .book:last-of-type {
    border-bottom: 0;
    padding-bottom: 4rem;
    margin-bottom: 4rem;
}

.books-article .book__covers {
    display: grid;
    grid-template-columns: 1fr 0.18fr 0.7fr;
    gap: 0.6rem;
    align-items: stretch;
}
.books-article .book__cover {
    margin: 0;
    border: 1px solid rgba(10,10,10,0.06);
    border-radius: 0.4rem;
    background: #ffffff;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}
.books-article .book__cover--spine {
    aspect-ratio: 0.18 / 1;
}
.books-article .book__cover--back {
    aspect-ratio: 0.7 / 1;
}
.books-article .book__cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.books-article .book__meta {
    padding-top: 1rem;
}
.books-article .book__eyebrow {
    font-size: 1.15rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #8a8580;
    font-weight: 600;
    margin: 0 0 1.4rem;
}
.books-article .book__title {
    font-size: 4.2rem;
    line-height: 1.05;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #0a0a0a;
    margin: 0 0 1.4rem;
}
.books-article .book__subtitle {
    font-size: 1.8rem;
    line-height: 1.5;
    color: #4a4540;
    font-weight: 500;
    margin: 0 0 2.8rem;
}
.books-article .book__note {
    font-size: 1.35rem;
    line-height: 1.6;
    color: #8a8580;
    font-style: italic;
    margin: 0 0 2.4rem;
}
.books-article .book__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.4rem;
}
.books-article .book__download {
    display: inline-block;
    font-size: 1.3rem;
    letter-spacing: 0.05em;
    font-weight: 600;
    padding: 1.1rem 1.8rem;
    border: 1px solid #0a0a0a;
    color: #0a0a0a;
    background: #ffffff;
    border-radius: 99rem;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}
.books-article .book__download:hover {
    background: #0a0a0a;
    color: #ffffff;
    text-decoration: none;
}
.books-article .book__download--soon {
    border-color: rgba(10,10,10,0.18);
    color: #8a8580;
    cursor: default;
    pointer-events: none;
}

.books-article .books-coda {
    margin: 4rem 0 0;
    padding: 3.2rem 0 0;
    border-top: 1px solid rgba(10,10,10,0.08);
    font-size: 1.7rem;
    line-height: 1.6;
    color: #0a0a0a;
    font-weight: 500;
    text-align: left;
}
.books-article .books-coda__dot {
    color: #dcfa14;
    margin-left: 0.05em;
    font-weight: 700;
}

@media (max-width: 991.98px) {
    .books-article { padding: 6rem 0 4rem; }
    .books-article .books-hero { margin-bottom: 4.4rem; padding-bottom: 2.8rem; }
    .books-article .books-hero__title { font-size: 5rem; }
    .books-article .book {
        grid-template-columns: 1fr;
        gap: 3rem;
        margin-bottom: 6rem;
        padding-bottom: 6rem;
    }
    .books-article .book__title { font-size: 3.4rem; }
    .books-article .book__subtitle { font-size: 1.6rem; margin-bottom: 2.4rem; }
}
@media (max-width: 575.98px) {
    .books-article .books-hero__title { font-size: 4rem; }
    .books-article .book__covers {
        grid-template-columns: 1fr 0.18fr 0.7fr;
        gap: 0.4rem;
    }
    .books-article .book__title { font-size: 2.8rem; }
}

/* ====================================================
   books.html · 2-column 网格列表（lsir.org/books 风格）
   ==================================================== */
/* ----------------------------------------------------------
   books.html · 4-book catalog (publisher pattern)
   References: NYRB Classics, Verso, Stripe Press, Knopf catalogs
   - 4-column row on desktop (all 4 books in one season-row)
   - cover floats directly on page bg with shadow on the image itself
   - minimal text under cover: eyebrow · title · subtitle (no tease, no CTA)
   ---------------------------------------------------------- */
.books-article .book-list {
    list-style: none;
    padding: 0;
    margin: 0 0 6rem;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 5.6rem 3rem;
}
.books-article .book-card {
    margin: 0;
}
.books-article .book-card__link {
    display: block;
    color: inherit;
    text-decoration: none;
    transition: transform 0.25s ease;
}
.books-article .book-card__link:hover {
    color: inherit;
    text-decoration: none;
    transform: translateY(-0.5rem);
}
.books-article .book-card__link:hover .book-card__cover img {
    box-shadow:
        0 2px 4px rgba(0,0,0,0.06),
        0 18px 40px -12px rgba(0,0,0,0.22);
}
.books-article .book-card__cover {
    aspect-ratio: 1 / 1;
    background: transparent;
    border: 0;
    padding: 0;
    margin: 0 0 1.8rem;
    overflow: visible;
    box-shadow: none;
}
.books-article .book-card__cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: box-shadow 0.25s ease;
    box-shadow:
        0 1px 2px rgba(0,0,0,0.04),
        0 12px 28px -10px rgba(0,0,0,0.16);
}
.books-article .book-card__eyebrow {
    font-size: 1.05rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #8a8580;
    font-weight: 600;
    margin: 0 0 0.5rem;
}
.books-article .book-card__title {
    font-size: 1.9rem;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.005em;
    color: #0a0a0a;
    margin: 0 0 0.5rem;
}
.books-article .book-card__subtitle {
    font-size: 1.3rem;
    line-height: 1.5;
    color: #6a6560;
    font-weight: 400;
    margin: 0;
}
/* The longer tease line and the explicit CTA — publisher catalogs don't
   carry them; whole card is the link. Hide for restraint. */
.books-article .book-card__tease,
.books-article .book-card__cta {
    display: none;
}

@media (max-width: 1199.98px) {
    .books-article .book-list {
        grid-template-columns: repeat(4, 1fr);
        gap: 4.4rem 2rem;
    }
    .books-article .book-card__title { font-size: 1.7rem; }
}
@media (max-width: 991.98px) {
    .books-article .book-list {
        grid-template-columns: repeat(2, 1fr);
        gap: 5rem 3rem;
    }
    .books-article .book-card__title { font-size: 2rem; }
    .books-article .book-card__subtitle { font-size: 1.35rem; }
}
@media (max-width: 575.98px) {
    .books-article .book-list {
        grid-template-columns: 1fr;
        gap: 4.4rem;
        max-width: 30rem;
        margin: 0 auto 5rem;
    }
}

/* ====================================================
   book-*.html · 单本书详情页
   ==================================================== */
.book-detail-article {
    padding: 9rem 0 4rem;
    background: #ffffff;
}
.book-detail-article .container {
    max-width: 110rem;
}
.book-detail-article .single-article-image {
    background: #f4f4f4;
    border-radius: 0.4rem;
    overflow: hidden;
    max-width: 88%;
}
.book-detail-article .book-detail__back {
    margin: 0 0 1.6rem;
    font-size: 1.3rem;
    letter-spacing: 0.05em;
}
.book-detail-article .book-detail__back a {
    color: #8a8580;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s;
}
.book-detail-article .book-detail__back a:hover {
    color: #0a0a0a;
    border-bottom-color: #0a0a0a;
    text-decoration: none;
}
.book-detail-article.single-article h1,
.book-detail-article.single-article .h1 {
    font-size: 6.4rem;
    line-height: 1;
    margin-bottom: 2rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}
.book-detail-article .single-article-meta {
    font-size: 1.2rem;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: #8a8580;
    font-weight: 600;
    padding-bottom: 3.2rem;
}
.book-detail-article.single-article h2,
.book-detail-article.single-article h2.wp-block-heading {
    font-size: 2.6rem;
    line-height: 1.2;
    font-weight: 700;
    margin-top: 4.8rem;
    margin-bottom: 1.6rem;
    padding-top: 1.6rem;
    border-top: 1px solid rgba(10,10,10,0.08);
}
.book-detail-article.single-article h3 {
    font-size: 1.7rem;
    font-weight: 700;
    margin-top: 2.4rem;
    margin-bottom: 1rem;
    color: #0a0a0a;
    letter-spacing: 0.02em;
}
.book-detail-article .single-article-body p {
    font-size: 1.6rem;
    line-height: 1.85;
    margin-bottom: 1.6rem;
    color: #1f1f1f;
}
.book-detail-article .book-detail__soon {
    font-style: italic;
    color: #8a8580;
    margin: 1.6rem 0;
}
.book-detail-article .book-detail__counter {
    font-size: 1.4rem;
    color: #4a4540;
    margin: 0 0 1.6rem;
    letter-spacing: 0.01em;
}
.book-detail-article .book-detail__count {
    font-weight: 700;
    color: #0a0a0a;
}
.book-detail-article .book-detail__dl-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.2rem;
    margin: 0 0 1.4rem;
}
.book-detail-article .book-detail__dl-btn {
    display: inline-block;
    font-size: 1.3rem;
    letter-spacing: 0.05em;
    font-weight: 600;
    padding: 1.1rem 1.8rem;
    border-radius: 99rem;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
    background: #dcfa14;
    color: #0a0a0a;
    border: 1px solid #dcfa14;
}
.book-detail-article .book-detail__dl-btn:hover {
    background: #0a0a0a;
    color: #ffffff;
    border-color: #0a0a0a;
    text-decoration: none;
}
.book-detail-article .book-detail__dl-btn--soon {
    background: #ffffff;
    border-color: rgba(10,10,10,0.18);
    color: #8a8580;
    cursor: default;
    pointer-events: none;
}
.book-detail-article .book-detail__dl-btn--soon:hover {
    background: #ffffff;
    color: #8a8580;
    border-color: rgba(10,10,10,0.18);
}
.book-detail-article .book-detail__thanks {
    font-size: 1.4rem;
    color: #0a0a0a;
    font-weight: 600;
    margin: 0.4rem 0 0;
    padding: 1.2rem 1.6rem;
    background: #f7f6f0;
    border-left: 3px solid #dcfa14;
    border-radius: 0.2rem;
}
.book-detail-article .book-detail__note {
    font-size: 1.35rem;
    color: #8a8580;
    margin: 0 0 1.2rem;
    font-style: italic;
}
.book-detail-article .book-detail__purchase {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem 0.8rem;
}
.book-detail-article .book-detail__purchase li {
    margin: 0;
}
.book-detail-article .book-detail__purchase a {
    display: inline-block;
    font-size: 1.3rem;
    letter-spacing: 0.03em;
    font-weight: 600;
    padding: 1rem 1.6rem;
    border: 1px solid rgba(10,10,10,0.2);
    color: #0a0a0a;
    background: #ffffff;
    border-radius: 99rem;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.book-detail-article .book-detail__purchase a:hover {
    background: #0a0a0a;
    color: #ffffff;
    border-color: #0a0a0a;
    text-decoration: none;
}

/* ====================================================
   网上购买 with platform logos (lsir.org pattern)
   - 4 white cards, equal grid, each with the platform logo
   - Hover lifts and shows accent border
   ==================================================== */
.book-detail-article .book-detail__shops {
    list-style: none;
    padding: 1rem;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    border: 1px solid rgba(10,10,10,0.1);
    border-radius: 0.4rem;
    background: #ffffff;
    max-width: 62rem;
}
.book-detail-article .book-detail__shops li { margin: 0; }
.book-detail-article .book-detail__shops a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 8.4rem;
    padding: 1.6rem 1.4rem;
    border: 1px solid rgba(10,10,10,0.08);
    border-radius: 0.3rem;
    background: #ffffff;
    text-decoration: none;
    transition: border-color 0.15s ease, transform 0.15s ease, background 0.15s ease;
}
.book-detail-article .book-detail__shops a:hover {
    border-color: #0a0a0a;
    background: #ffffff;
    transform: translateY(-0.2rem);
    text-decoration: none;
}
.book-detail-article .book-detail__shops img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 4.4rem;
    object-fit: contain;
}
@media (max-width: 767.98px) {
    .book-detail-article .book-detail__shops {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.8rem;
        padding: 0.8rem;
    }
}
@media (max-width: 991.98px) {
    .book-detail-article.single-article h1 { font-size: 4.4rem; }
    .book-detail-article.single-article h2 { font-size: 2.2rem; margin-top: 3.6rem; }
}
@media (max-width: 767.98px) {
    .book-detail-article.single-article h1 { font-size: 3.6rem; }
}

/* ====================================================
   2D Flat book cover (replaces 3D mockup on detail pages)
   - Stripe Press / NYRB / Standard Ebooks editorial pattern
   - Cover ~28% of column width, modest shadow, no 3D
   ==================================================== */
.book-detail-article .single-article-image.book-cover-figure {
    max-width: 28rem;
    margin: 0 auto 0 0;
    overflow: visible;
    background: transparent;
    border-radius: 0;
    padding: 0;
}
.book-detail-article .book-cover-figure img {
    display: block;
    width: 100%;
    height: auto;
    border-right: 1px solid rgba(0,0,0,0.08);
    box-shadow:
        0 1px 2px rgba(0,0,0,0.04),
        0 12px 32px -8px rgba(0,0,0,0.10);
}
@media (max-width: 991.98px) {
    .book-detail-article .single-article-image.book-cover-figure {
        max-width: 22rem;
        margin: 0 auto 3rem;
    }
}

/* "在线阅读" primary CTA — same shape as download btn but accent treatment */
.book-detail-article .book-detail__dl-btn--read {
    background: #0a0a0a;
    color: #ffffff;
    border-color: #0a0a0a;
}
.book-detail-article .book-detail__dl-btn--read:hover {
    background: #dcfa14;
    color: #0a0a0a;
    border-color: #dcfa14;
}

/* 鲁蛇的话 / 关于本书 lead paragraph (tagline-style intro) */
.book-detail-article .book-detail__lead {
    font-size: 1.7rem;
    line-height: 1.7;
    color: #0a0a0a;
    font-weight: 600;
    margin: 0 0 2rem;
    letter-spacing: 0.005em;
}

/* 鲁蛇的话 themes list (e.g. 选校逻辑 / 求职真相 / ...) */
.book-detail-article .book-detail__themes {
    list-style: none;
    padding: 0;
    margin: 0 0 2rem;
}
.book-detail-article .book-detail__themes li {
    font-size: 1.55rem;
    line-height: 1.75;
    color: #1f1f1f;
    padding: 0.6rem 0 0.6rem 1.6rem;
    position: relative;
    border-bottom: 1px solid rgba(10,10,10,0.06);
}
.book-detail-article .book-detail__themes li:last-child {
    border-bottom: 0;
}
.book-detail-article .book-detail__themes li::before {
    content: "·";
    position: absolute;
    left: 0.4rem;
    top: 0.6rem;
    font-weight: 700;
    color: #4a4540;
}
.book-detail-article .book-detail__themes strong {
    color: #0a0a0a;
    font-weight: 700;
    margin-right: 0.4rem;
}

/* 作者简介 name line */
.book-detail-article .author-name {
    font-size: 2rem;
    font-weight: 700;
    color: #0a0a0a;
    letter-spacing: 0.4em;
    margin: 0 0 1.6rem;
}

/* 本书目录 preview (mini chapter list on detail page) */
.book-detail-article .book-detail__chapters-preview {
    list-style: none;
    padding: 0;
    margin: 0 0 1.6rem;
    max-width: 56rem;
}
.book-detail-article .book-detail__chapters-preview li { margin: 0; }
.book-detail-article .book-detail__chapters-preview a {
    display: grid;
    grid-template-columns: 7rem 1fr;
    gap: 1.6rem;
    align-items: baseline;
    padding: 1rem 0;
    border-bottom: 1px solid rgba(10,10,10,0.06);
    color: inherit;
    text-decoration: none;
    transition: background 0.15s ease;
}
.book-detail-article .book-detail__chapters-preview a:hover {
    text-decoration: none;
    background: #faf9f5;
}
.book-detail-article .book-detail__chapters-preview .ch-no {
    font-size: 1.15rem;
    letter-spacing: 0.1em;
    color: #8a8580;
    font-weight: 600;
}
.book-detail-article .book-detail__chapters-preview .ch-ti {
    font-size: 1.55rem;
    line-height: 1.4;
    color: #0a0a0a;
    font-weight: 500;
}
.book-detail-article .book-detail__chapters-more {
    margin: 0;
    font-size: 1.35rem;
    letter-spacing: 0.03em;
}
.book-detail-article .book-detail__chapters-more a {
    color: #0a0a0a;
    text-decoration: none;
    font-weight: 600;
    border-bottom: 1px solid #0a0a0a;
    padding-bottom: 0.2rem;
}
.book-detail-article .book-detail__chapters-more a:hover {
    background: #0a0a0a;
    color: #ffffff;
}

/* ====================================================
   印刷规格单 (per-book print spec sheet)
   - Document-style inset: slight border, monospaced numbers,
     dl as 2-col grid. Editorial, not decorative.
   ==================================================== */
.book-detail-article .print-spec {
    margin: 2rem 0 0;
    padding: 2.8rem 3.2rem;
    background: #faf9f5;
    border: 1px solid rgba(10,10,10,0.08);
    border-radius: 0.4rem;
    max-width: 56rem;
    font-variant-numeric: tabular-nums;
}
.book-detail-article .print-spec__head {
    margin: 0 0 2rem;
    padding: 0 0 1.6rem;
    border-bottom: 1px solid rgba(10,10,10,0.1);
}
.book-detail-article .print-spec__title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0a0a0a;
    margin: 0 0 0.4rem;
    letter-spacing: 0.02em;
}
.book-detail-article .print-spec__author {
    font-size: 1.2rem;
    color: #8a8580;
    margin: 0;
}
.book-detail-article .print-spec__list {
    display: grid;
    grid-template-columns: 8rem 1fr;
    gap: 0.6rem 1.6rem;
    margin: 0 0 1.8rem;
}
.book-detail-article .print-spec__list:last-child {
    margin-bottom: 0;
}
.book-detail-article .print-spec__list dt {
    font-size: 1.3rem;
    color: #8a8580;
    font-weight: 500;
    margin: 0;
    line-height: 1.6;
}
.book-detail-article .print-spec__list dd {
    font-size: 1.4rem;
    color: #1a1a1a;
    margin: 0;
    line-height: 1.6;
}
.book-detail-article .print-spec__h {
    font-size: 1.4rem;
    font-weight: 700;
    color: #0a0a0a;
    margin: 2.4rem 0 1.2rem;
    padding-top: 1.6rem;
    border-top: 1px dashed rgba(10,10,10,0.12);
    letter-spacing: 0.02em;
}
.book-detail-article .print-spec__opt {
    margin: 0 0 1.4rem;
    padding: 1.4rem 1.6rem;
    background: #ffffff;
    border: 1px solid rgba(10,10,10,0.08);
    border-radius: 0.3rem;
}
.book-detail-article .print-spec__opt-name {
    font-size: 1.3rem;
    font-weight: 700;
    color: #0a0a0a;
    margin: 0 0 1rem;
    letter-spacing: 0.04em;
}
.book-detail-article .print-spec__swatch {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    margin-right: 0.6rem;
    vertical-align: -1px;
    border: 1px solid rgba(0,0,0,0.1);
}
@media (max-width: 575.98px) {
    .book-detail-article .print-spec {
        padding: 2rem 1.8rem;
    }
    .book-detail-article .print-spec__list {
        grid-template-columns: 6.4rem 1fr;
        gap: 0.4rem 1.2rem;
    }
    .book-detail-article .print-spec__list dt,
    .book-detail-article .print-spec__list dd {
        font-size: 1.3rem;
    }
}

/* ====================================================
   read/<book>/index.html — chapter table of contents
   ==================================================== */
.chapter-toc-article {
    padding: 8rem 0 6rem;
    background: #ffffff;
}
.chapter-toc-article .container {
    max-width: 88rem;
}
.chapter-toc-hero {
    max-width: 62rem;
    margin: 0 auto 5rem;
    padding: 0 0 3.2rem;
    border-bottom: 1px solid rgba(10,10,10,0.08);
}
.chapter-toc-hero__eyebrow {
    font-size: 1.2rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #8a8580;
    font-weight: 600;
    margin: 0 0 1.6rem;
}
.chapter-toc-hero__eyebrow a {
    color: #8a8580;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s;
}
.chapter-toc-hero__eyebrow a:hover { color: #0a0a0a; border-bottom-color: #0a0a0a; text-decoration: none; }
.chapter-toc-hero__title {
    font-size: 5.4rem;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #0a0a0a;
    margin: 0 0 1.6rem;
}
.chapter-toc-hero__dot { color: #dcfa14; margin-left: 0.04em; }
.chapter-toc-hero__lead {
    font-size: 1.55rem;
    line-height: 1.7;
    color: #4a4540;
    margin: 0;
}
.chapter-toc-hero__lead a {
    color: #0a0a0a;
    text-decoration: none;
    border-bottom: 1px solid #0a0a0a;
}
.chapter-toc-hero__lead a:hover { background: #0a0a0a; color: #ffffff; }

.chapter-toc {
    list-style: none;
    padding: 0;
    margin: 0;
    max-width: 62rem;
}
.chapter-toc li { margin: 0; }
.chapter-toc li a {
    display: grid;
    grid-template-columns: 8rem 1fr;
    gap: 2rem;
    align-items: baseline;
    padding: 1.2rem 0;
    border-bottom: 1px solid rgba(10,10,10,0.06);
    color: inherit;
    text-decoration: none;
    transition: background 0.15s ease;
}
.chapter-toc li a:hover {
    text-decoration: none;
    background: #faf9f5;
}
.chapter-toc .ch-no {
    font-size: 1.2rem;
    letter-spacing: 0.1em;
    color: #8a8580;
    font-weight: 600;
}
.chapter-toc .ch-ti {
    font-size: 1.7rem;
    line-height: 1.4;
    color: #0a0a0a;
    font-weight: 500;
}
@media (max-width: 575.98px) {
    .chapter-toc-hero__title { font-size: 4rem; }
    .chapter-toc li a { grid-template-columns: 6rem 1fr; gap: 1.2rem; }
    .chapter-toc .ch-ti { font-size: 1.5rem; }
}

/* ====================================================
   read/<book>/index.html — parts-grouped TOC (新版)
   - 6 parts × N chapters layout
   - Editorial: large gray part label + black part title + chapter list
   ==================================================== */
.chapter-toc-article .toc-part {
    margin: 0 auto 6rem;
    max-width: 62rem;
}
.chapter-toc-article .toc-part:last-of-type {
    margin-bottom: 2rem;
}
.chapter-toc-article .toc-part__head {
    margin: 0 0 2rem;
    padding: 0 0 1.6rem;
    border-bottom: 2px solid #0a0a0a;
}
.chapter-toc-article .toc-part__label {
    font-size: 1.15rem;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: #8a8580;
    font-weight: 600;
    margin: 0 0 1rem;
}
.chapter-toc-article.single-article .toc-part__title,
.chapter-toc-article .toc-part__title {
    font-size: 2.6rem;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.005em;
    color: #0a0a0a;
    margin: 0;
    padding-top: 0;
    border-top: 0;
}
.chapter-toc-article .toc-part__list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.chapter-toc-article .toc-part__list li {
    margin: 0;
}
.chapter-toc-article .toc-part__list li a {
    display: grid;
    grid-template-columns: 8rem 1fr;
    gap: 2rem;
    align-items: baseline;
    padding: 1.4rem 0;
    border-bottom: 1px solid rgba(10,10,10,0.06);
    color: inherit;
    text-decoration: none;
    transition: background 0.15s ease, padding-left 0.2s ease;
}
.chapter-toc-article .toc-part__list li a:hover {
    text-decoration: none;
    background: #faf9f5;
    padding-left: 0.8rem;
}
.chapter-toc-article .toc-part__list .toc-no {
    font-size: 1.2rem;
    letter-spacing: 0.1em;
    color: #8a8580;
    font-weight: 600;
}
.chapter-toc-article .toc-part__list .toc-ti {
    font-size: 1.7rem;
    line-height: 1.4;
    color: #0a0a0a;
    font-weight: 500;
}
@media (max-width: 575.98px) {
    .chapter-toc-article .toc-part { margin-bottom: 4.4rem; }
    .chapter-toc-article .toc-part__title { font-size: 2.1rem; }
    .chapter-toc-article .toc-part__list li a {
        grid-template-columns: 6rem 1fr;
        gap: 1.2rem;
        padding: 1.2rem 0;
    }
    .chapter-toc-article .toc-part__list .toc-ti { font-size: 1.5rem; }
}

/* ====================================================
   chapter page — prev/next dual-column nav
   ==================================================== */
.chapter-article .ch-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.4rem;
    margin: 5rem 0 0;
    padding: 3rem 0 0;
    border-top: 1px solid rgba(10,10,10,0.08);
    align-items: start;
}
.chapter-article .ch-nav__col { min-width: 0; }
.chapter-article .ch-nav__col--prev { text-align: left; }
.chapter-article .ch-nav__col--next { text-align: right; }
.chapter-article .ch-nav__prev,
.chapter-article .ch-nav__next {
    display: inline-block;
    font-size: 1.25rem;
    letter-spacing: 0.05em;
    color: #0a0a0a;
    text-decoration: none;
    line-height: 1.4;
    max-width: 26rem;
}
.chapter-article .ch-nav__prev span,
.chapter-article .ch-nav__next span {
    display: block;
    font-size: 1.55rem;
    font-weight: 600;
    margin-top: 0.4rem;
    line-height: 1.3;
    letter-spacing: 0;
}
.chapter-article .ch-nav__prev:hover span,
.chapter-article .ch-nav__next:hover span {
    border-bottom: 1px solid #0a0a0a;
    padding-bottom: 0.2rem;
}
.chapter-article .ch-nav__prev:hover,
.chapter-article .ch-nav__next:hover {
    color: #0a0a0a;
    text-decoration: none;
}
.chapter-article .ch-nav__toc {
    font-size: 1.25rem;
    letter-spacing: 0.05em;
    color: #8a8580;
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.chapter-article .ch-nav__toc:hover {
    color: #0a0a0a;
    border-bottom-color: #0a0a0a;
}
.chapter-article .ch-nav__toc-link {
    margin: 3rem 0 0;
    text-align: center;
    font-size: 1.25rem;
    letter-spacing: 0.05em;
}
.chapter-article .ch-nav__toc-link a {
    color: #8a8580;
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.chapter-article .ch-nav__toc-link a:hover {
    color: #0a0a0a;
    border-bottom-color: #0a0a0a;
}
@media (max-width: 575.98px) {
    .chapter-article .ch-nav {
        grid-template-columns: 1fr;
        gap: 1.6rem;
    }
    .chapter-article .ch-nav__col--next { text-align: left; }
    .chapter-article .ch-nav__prev span,
    .chapter-article .ch-nav__next span { font-size: 1.4rem; }
}

/* ====================================================
   read/<book>/chapter-NN.html — single-chapter reading page
   ==================================================== */
.chapter-article {
    padding: 7rem 0 5rem;
    background: #ffffff;
}
.chapter-article .container {
    max-width: 88rem;
}
.chapter-body {
    max-width: 62rem;
    margin: 0 auto;
}
.ch-breadcrumb {
    margin: 0 0 4rem;
    font-size: 1.25rem;
    letter-spacing: 0.05em;
}
.ch-breadcrumb a {
    color: #8a8580;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s;
}
.ch-breadcrumb a:hover { color: #0a0a0a; border-bottom-color: #0a0a0a; text-decoration: none; }

.chapter-head {
    margin: 0 0 4.4rem;
    padding: 0 0 2.4rem;
    border-bottom: 1px solid rgba(10,10,10,0.08);
}
.chapter-head__eyebrow {
    font-size: 1.15rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #8a8580;
    font-weight: 600;
    margin: 0 0 1.6rem;
}
.chapter-head__title {
    font-size: 3.6rem;
    line-height: 1.18;
    font-weight: 700;
    letter-spacing: -0.005em;
    color: #0a0a0a;
    margin: 0;
}

.chapter-prose p {
    font-size: 1.75rem;
    line-height: 1.95;
    color: #1a1a1a;
    margin: 0 0 1.8rem;
    text-align: justify;
    text-justify: inter-character;
    hyphens: auto;
}
.chapter-prose p:first-of-type::first-letter {
    /* subtle drop-cap effect - opt out by removing */
    font-weight: 700;
}

.ch-nav {
    margin: 5rem 0 0;
    padding: 3rem 0 0;
    border-top: 1px solid rgba(10,10,10,0.08);
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 2rem;
}
.ch-nav__toc {
    font-size: 1.25rem;
    letter-spacing: 0.05em;
    color: #8a8580;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s;
}
.ch-nav__toc:hover { color: #0a0a0a; border-bottom-color: #0a0a0a; text-decoration: none; }
.ch-nav__next {
    text-align: right;
    font-size: 1.25rem;
    letter-spacing: 0.05em;
    color: #0a0a0a;
    text-decoration: none;
    line-height: 1.4;
    max-width: 26rem;
}
.ch-nav__next span {
    display: block;
    font-size: 1.55rem;
    font-weight: 600;
    margin-top: 0.4rem;
    line-height: 1.3;
    letter-spacing: 0;
}
.ch-nav__next:hover {
    color: #0a0a0a;
    text-decoration: none;
}
.ch-nav__next:hover span { border-bottom: 1px solid #0a0a0a; padding-bottom: 0.2rem; }

@media (max-width: 575.98px) {
    .chapter-head__title { font-size: 2.6rem; }
    .chapter-prose p { font-size: 1.6rem; line-height: 1.9; }
    .ch-nav__next span { font-size: 1.4rem; }
}


