/* ============================================================
   华夏中医文论 - 公共样式
   合并 list_articles / list_articles_essay / article-detail
   ============================================================ */

/* ==================== 通用基础样式 ==================== */
body {
    font-family: 'Noto Sans SC', sans-serif;
    background-color: #F5F0E8;
    color: #2D2A26;
    line-height: 1.8;
    padding-top: 80px;
}
@media (max-width: 1024px) { body { padding-top: 64px; } }

/* ==================== 通用组件样式 ==================== */

/* Hero 区域通用 */
.hero-seal {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    font-family: 'Noto Serif SC', serif;
    color: #9B3B2E;
    transform: rotate(-4deg);
    position: relative;
    flex-shrink: 0;
}
.hero-seal .seal-char { font-weight: 700; line-height: 1; }
.hero-seal .seal-label { letter-spacing: 0.15em; margin-top: 0.25rem; opacity: 0.8; }

.hero-accent-line {
    width: 60px; height: 3px;
    background: linear-gradient(90deg, #9B3B2E, #C4A35A);
    margin: 1rem 0;
}

.hero-breadcrumb a { color: #5C5449; transition: color 0.2s; }
.hero-breadcrumb a:hover { color: #9B3B2E; }

.hero-desc { color: #5C5449; }

/* 章节标题 */
.section-title-wrap { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; }
.section-title { font-family: 'Noto Serif SC', serif; font-size: 1.5rem; font-weight: 700; color: #2D2A26; display: flex; align-items: center; gap: 0.625rem; }
.section-title::before {
    content: ''; display: block; width: 4px; height: 1.25rem;
    background: linear-gradient(180deg, #9B3B2E, #C4A35A); border-radius: 2px;
}
@media (min-width: 1024px) {
    .section-title { font-size: 1.875rem; }
    .section-title::before { height: 1.5rem; }
}

/* 侧边栏 */
.sidebar-card {
    background: #fff; border: 1px solid #D4C9B8; border-radius: 1rem;
    padding: 1.25rem; margin-bottom: 1.25rem;
}
.sidebar-title {
    font-family: 'Noto Serif SC', serif; font-size: 1.0625rem; font-weight: 700;
    color: #2D2A26; margin-bottom: 0.875rem;
    display: flex; align-items: center; gap: 0.5rem;
}
.sidebar-title::before {
    content: ''; display: block; width: 3px; height: 1rem;
    background: #9B3B2E; border-radius: 2px;
}

/* 子栏目导航 */
.sub-nav-item {
    display: flex; align-items: center; gap: 0.625rem;
    padding: 0.625rem 0; border-bottom: 1px dashed #E5DBCB;
    transition: padding-left 0.2s, color 0.2s;
    cursor: pointer; text-decoration: none;
}
.sub-nav-item:last-child { border-bottom: none; }
.sub-nav-item:hover { padding-left: 0.375rem; }
.sub-nav-dot { width: 8px; height: 8px; border-radius: 2px; flex-shrink: 0; }
.sub-nav-name { flex: 1; font-size: 0.875rem; color: #2D2A26; transition: color 0.2s; }
.sub-nav-item:hover .sub-nav-name { color: #9B3B2E; }
.sub-nav-count {
    font-family: 'Noto Serif SC', serif; font-size: 0.75rem; font-weight: 700;
    color: #8B7355;
}
.sub-nav-item.active .sub-nav-name { color: #9B3B2E; font-weight: 600; }
.sub-nav-item.active .sub-nav-dot { box-shadow: 0 0 0 3px rgba(155,59,46,0.15); }

/* 标签云 */
.tag-cloud { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.tc-tag {
    display: inline-block; padding: 0.3rem 0.7rem;
    background: #F5F0E8; border: 1px solid #D4C9B8;
    border-radius: 0.375rem; font-size: 0.75rem; color: #5C5449;
    transition: all 0.2s; cursor: pointer; text-decoration: none;
}
.tc-tag:hover { background: #9B3B2E; color: #fff; border-color: #9B3B2E; }
.tc-tag.tag-lg { font-size: 0.875rem; padding: 0.35rem 0.85rem; }
.tc-tag.tag-md { font-size: 0.8125rem; }

/* 阅读排行榜 */
.rank-item {
    display: flex; align-items: flex-start; gap: 0.75rem;
    padding: 0.625rem 0; border-bottom: 1px dashed #E5DBCB;
    text-decoration: none;
    transition: padding-left 0.2s;
}
.rank-item:last-child { border-bottom: none; }
.rank-item:hover { padding-left: 0.375rem; }
.rank-num {
    width: 22px; height: 22px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    border-radius: 4px; font-size: 0.7rem; font-weight: 700;
    background: #EDE5D8; color: #8B7355;
    font-family: 'Noto Serif SC', serif;
}
.rank-num.top1 { background: #9B3B2E; color: #fff; }
.rank-num.top2 { background: #C4A35A; color: #fff; }
.rank-num.top3 { background: #B8A58B; color: #fff; }
.rank-title { font-size: 0.8125rem; color: #2D2A26; line-height: 1.5; transition: color 0.2s; }
.rank-item:hover .rank-title { color: #9B3B2E; }
.rank-meta { font-size: 0.6875rem; color: #8B7355; margin-top: 2px; }

/* 分页样式已统一到 common.css */

/* 书页风格文章条目 book-entry（子栏目列表页 & 详情页通用） */
.book-entry {
    display: flex; gap: 1rem;
    padding: 1.25rem;
    background: #fff;
    border: 1px solid #D4C9B8;
    border-radius: 0.25rem;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    text-decoration: none;
}
.book-entry-chapter {
    font-family: 'Noto Serif SC', serif;
    font-size: 0.7rem;
    color: #B8A58B;
    letter-spacing: 0.1em;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    border-right: 1px solid #D4C9B8;
    padding-right: 0.75rem;
    flex-shrink: 0;
}
.book-entry-content { flex: 1; min-width: 0; }
.book-entry-tag {
    display: inline-flex; align-items: center; gap: 0.25rem;
    padding: 0.125rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.7rem; font-weight: 600;
    margin-bottom: 0.5rem;
}
.book-entry-title {
    font-family: 'Noto Serif SC', serif;
    font-size: 1rem; font-weight: 600;
    color: #2D2A26; line-height: 1.5;
    margin-bottom: 0.375rem;
    transition: color 0.2s;
}
.book-entry-excerpt {
    font-size: 0.8125rem; color: #5C5449;
    line-height: 1.7;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.book-entry-meta {
    display: flex; align-items: center; gap: 0.75rem;
    font-size: 0.7rem; color: #8B7355;
    margin-top: 0.625rem;
}
.book-entry-meta .meta-item { display: inline-flex; align-items: center; gap: 0.25rem; }

/* 响应式通用 */
@media (max-width: 768px) {
    .book-entry { gap: 0.75rem; padding: 1rem; }
    .book-entry-chapter { font-size: 0.65rem; padding-right: 0.5rem; }
}

/* ============================================================
   页面一：华夏中医文论主列表页 (articles_list)
   ============================================================ */

body.articles_list .articles-hero {
    background: linear-gradient(135deg, #E8E0D5 0%, #F0EBE2 50%, #E5DDD0 100%);
    position: relative;
    overflow: hidden;
}
body.articles_list .articles-hero::before {
    content: ''; position: absolute; inset: 0;
    background:
        radial-gradient(circle at 15% 25%, rgba(45,42,38,0.07) 0%, transparent 45%),
        radial-gradient(circle at 85% 75%, rgba(155,59,46,0.10) 0%, transparent 48%),
        radial-gradient(circle at 70% 18%, rgba(74,124,140,0.06) 0%, transparent 40%),
        radial-gradient(circle at 25% 85%, rgba(196,163,90,0.08) 0%, transparent 42%);
    pointer-events: none;
}
body.articles_list .articles-hero::after {
    content: ''; position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(45,42,38,0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(45,42,38,0.025) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
}
body.articles_list .articles-hero-content { position: relative; z-index: 1; }
body.articles_list .articles-hero h1 {
    font-family: 'Noto Serif SC', serif;
    font-size: clamp(2rem, 5vw, 3rem);
    font-weight: 700;
    line-height: 1.25;
    color: #2D2A26;
}

body.articles_list .hero-seal {
    width: 84px; height: 84px;
    border: 2px solid rgba(155,59,46,0.45);
    border-radius: 0.5rem;
    background: rgba(255,255,255,0.45);
}
body.articles_list .hero-seal::before {
    content: ''; position: absolute; inset: 5px;
    border: 1px solid rgba(155,59,46,0.28);
    border-radius: 0.3rem;
}
body.articles_list .hero-seal .seal-char { font-size: 1.5rem; }
body.articles_list .hero-seal .seal-label { font-size: 0.625rem; }

/* Hero 徽章标签 */
body.articles_list .hero-badge {
    display: inline-flex; align-items: center; gap: 0.375rem;
    padding: 0.4rem 0.9rem;
    background: rgba(255,255,255,0.65);
    border: 1px solid #D4C9B8;
    border-radius: 9999px;
    font-size: 0.8125rem;
    color: #2D2A26;
    transition: all 0.2s;
    cursor: pointer;
}
body.articles_list .hero-badge:hover {
    background: #fff;
    border-color: var(--badge-color, #9B3B2E);
}
body.articles_list .hero-badge .badge-count {
    font-family: 'Noto Serif SC', serif;
    font-weight: 700;
    color: var(--badge-color, #9B3B2E);
}
body.articles_list .hero-badge .badge-dot {
    width: 6px; height: 6px; border-radius: 9999px;
    background: var(--badge-color, #9B3B2E);
}

/* 文卷/书页卡片 scroll-card */
body.articles_list .scroll-card {
    background: #fff;
    border: 1px solid #D4C9B8;
    border-radius: 0.25rem;
    padding: 1.5rem;
    position: relative;
    transition: all 0.35s ease;
    overflow: hidden;
    display: block;
    text-decoration: none;
}
body.articles_list .scroll-card::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 6px;
    background: var(--scroll-color, #9B3B2E);
    transition: width 0.35s ease;
}
body.articles_list .scroll-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        repeating-linear-gradient(0deg, transparent, transparent 28px, rgba(212,201,184,0.15) 28px, rgba(212,201,184,0.15) 29px);
    pointer-events: none;
}
body.articles_list .scroll-card:hover {
    transform: translateY(-4px) rotate(-0.3deg);
    box-shadow: 0 12px 36px rgba(45,42,38,0.12);
}
body.articles_list .scroll-card:hover::before { width: 10px; }
body.articles_list .scroll-volume {
    font-family: 'Noto Serif SC', serif;
    font-size: 0.75rem;
    color: #B8A58B;
    letter-spacing: 0.15em;
    margin-bottom: 0.75rem;
    position: relative;
    z-index: 1;
}
body.articles_list .scroll-icon-circle {
    width: 48px; height: 48px;
    border-radius: 50%;
    background: rgba(245,240,232,0.8);
    border: 1px solid var(--scroll-color, #9B3B2E);
    display: flex; align-items: center; justify-content: center;
    color: var(--scroll-color, #9B3B2E);
    position: absolute;
    top: 1.5rem; right: 1.5rem;
    z-index: 1;
}
body.articles_list .scroll-title {
    font-family: 'Noto Serif SC', serif;
    font-size: 1.25rem; font-weight: 700;
    color: #2D2A26;
    margin-bottom: 0.5rem;
    padding-right: 60px;
    position: relative;
    z-index: 1;
}
body.articles_list .scroll-desc {
    font-size: 0.8125rem;
    color: #5C5449;
    line-height: 1.7;
    margin-bottom: 1rem;
    position: relative;
    z-index: 1;
}
body.articles_list .scroll-divider {
    border-top: 1px dashed #D4C9B8;
    margin: 0.75rem 0;
    position: relative;
    z-index: 1;
}
body.articles_list .scroll-footer {
    display: flex; align-items: center; justify-content: space-between;
    font-size: 0.75rem; color: #8B7355;
    position: relative;
    z-index: 1;
}
body.articles_list .scroll-count {
    font-family: 'Noto Serif SC', serif;
    font-weight: 700;
    color: var(--scroll-color, #9B3B2E);
}
body.articles_list .scroll-enter {
    display: inline-flex; align-items: center; gap: 0.25rem;
    color: var(--scroll-color, #9B3B2E);
    font-weight: 500;
    transition: gap 0.25s ease;
}
body.articles_list .scroll-card:hover .scroll-enter { gap: 0.5rem; }

/* book-entry 使用 CSS 变量版本 */
body.articles_list .book-entry:hover {
    border-color: var(--entry-color, #9B3B2E);
    box-shadow: 0 4px 16px rgba(45,42,38,0.06);
}
body.articles_list .book-entry-tag {
    background: color-mix(in srgb, var(--entry-color, #9B3B2E) 15%, white);
    color: var(--entry-color, #9B3B2E);
}
body.articles_list .book-entry-tag i { color: inherit; }
body.articles_list .book-entry:hover .book-entry-title { color: var(--entry-color, #9B3B2E); }

/* sub-nav-dot 使用 CSS 变量 */
body.articles_list .sub-nav-dot { background: var(--nav-dot-color, #9B3B2E); }

/* 响应式（articles_list） */
@media (max-width: 768px) {
    body.articles_list .scroll-title { font-size: 1.125rem; }
}


/* ============================================================
   页面二：学术随笔子栏目列表页 (articles_2list)
   ============================================================ */

body.articles_2list .sub-hero {
    background: linear-gradient(135deg, #E8E0D5 0%, #F0EBE2 50%, #E5DDD0 100%);
    position: relative;
    overflow: hidden;
}
body.articles_2list .sub-hero::before {
    content: ''; position: absolute; inset: 0;
    background:
        radial-gradient(circle at 20% 30%, rgba(155,59,46,0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(196,163,90,0.06) 0%, transparent 50%);
}
body.articles_2list .sub-hero-content { position: relative; z-index: 1; }
body.articles_2list .sub-hero h1 {
    font-family: 'Noto Serif SC', serif;
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 700;
    line-height: 1.25;
    color: #2D2A26;
}

body.articles_2list .hero-seal {
    width: 84px; height: 84px;
    border: 2px solid rgba(155,59,46,0.45);
    border-radius: 0.5rem;
    background: rgba(255,255,255,0.45);
}
body.articles_2list .hero-seal::before {
    content: ''; position: absolute; inset: 5px;
    border: 1px solid rgba(155,59,46,0.28);
    border-radius: 0.3rem;
}
body.articles_2list .hero-seal .seal-char { font-size: 1.5rem; }
body.articles_2list .hero-seal .seal-label { font-size: 0.625rem; }

/* book-entry 使用硬编码色值版本 */
body.articles_2list .book-entry:hover {
    border-color: #9B3B2E;
    box-shadow: 0 4px 16px rgba(45,42,38,0.06);
}
body.articles_2list .book-entry-tag {
    background: #F0E0DC;
    color: #9B3B2E;
}
body.articles_2list .book-entry-tag i { color: inherit; }
body.articles_2list .book-entry:hover .book-entry-title { color: #9B3B2E; }

/* sub-nav-dot 默认背景（实际颜色由行内 style 控制） */
body.articles_2list .sub-nav-dot { background: #9B3B2E; }


/* ============================================================
   页面三：文章详情页 (articles_detail)
   ============================================================ */

body.articles_detail .sub-hero {
    background: linear-gradient(135deg, #E8E0D5 0%, #F0EBE2 50%, #E5DDD0 100%);
    position: relative;
    overflow: hidden;
}
body.articles_detail .sub-hero::before {
    content: ''; position: absolute; inset: 0;
    background:
        radial-gradient(circle at 20% 30%, rgba(155,59,46,0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(196,163,90,0.06) 0%, transparent 50%);
}
body.articles_detail .sub-hero-content { position: relative; z-index: 1; }

body.articles_detail .hero-seal {
    width: 72px; height: 72px;
    border: 2px solid rgba(155,59,46,0.45);
    border-radius: 0.5rem;
    background: rgba(255,255,255,0.45);
}
body.articles_detail .hero-seal::before {
    content: ''; position: absolute; inset: 5px;
    border: 1px solid rgba(155,59,46,0.28);
    border-radius: 0.3rem;
}
body.articles_detail .hero-seal .seal-char { font-size: 1.375rem; }
body.articles_detail .hero-seal .seal-label { font-size: 0.5625rem; }

body.articles_detail .article-hero-title {
    font-family: 'Noto Serif SC', serif;
    font-size: clamp(1.5rem, 3.5vw, 2.125rem);
    font-weight: 700;
    line-height: 1.4;
    color: #2D2A26;
}
body.articles_detail .article-hero-subtitle {
    display: inline-flex; align-items: center; gap: 0.375rem;
    font-size: 0.8125rem; font-weight: 500;
    color: #9B3B2E;
    padding: 0.25rem 0.75rem;
    background: rgba(155,59,46,0.08);
    border-radius: 9999px;
}

/* 文章元信息条 */
body.articles_detail .article-meta-bar {
    display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap;
    padding: 0.875rem 1.25rem;
    background: #fff; border: 1px solid #D4C9B8; border-radius: 0.75rem;
    margin-bottom: 2rem;
}
body.articles_detail .article-meta-item { display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.8125rem; color: #8B7355; }
body.articles_detail .article-meta-item svg { width: 0.875rem; height: 0.875rem; }
body.articles_detail .article-meta-item strong { color: #2D2A26; font-weight: 600; }
body.articles_detail .article-meta-divider { width: 1px; height: 14px; background: #D4C9B8; }

/* 正文容器 */
body.articles_detail .article-body {
    background: #fff; border: 1px solid #D4C9B8; border-radius: 0.75rem;
    padding: 2.5rem 2rem; position: relative;
}
@media (min-width: 768px) { body.articles_detail .article-body { padding: 3rem 3.5rem; } }
body.articles_detail .article-body::before {
    content: ''; position: absolute; left: 18px; top: 24px; bottom: 24px; width: 1px;
    background: repeating-linear-gradient(0deg, #D4C9B8 0px, #D4C9B8 4px, transparent 4px, transparent 8px);
}

/* 正文标题 */
body.articles_detail .article-heading {
    font-family: 'Noto Serif SC', serif; font-size: 1.375rem; font-weight: 700;
    color: #2D2A26; margin: 2.5rem 0 1rem;
    padding-left: 0.875rem; border-left: 4px solid #9B3B2E; line-height: 1.5;
}
body.articles_detail .article-heading:first-child { margin-top: 0; }
body.articles_detail .article-heading-num {
    display: inline-flex; align-items: center; justify-content: center;
    width: 1.75rem; height: 1.75rem; border-radius: 0.375rem;
    background: rgba(155,59,46,0.12); color: #9B3B2E;
    font-size: 0.875rem; font-weight: 700; margin-right: 0.5rem; vertical-align: middle;
}

/* 正文段落 */
body.articles_detail .article-body p {
    font-size: 0.9375rem; color: #3D3833; line-height: 2;
    margin-bottom: 1rem; text-indent: 2em;
}
body.articles_detail .article-body p.no-indent { text-indent: 0; }

/* 引文块 */
body.articles_detail .article-quote {
    margin: 1.5rem 0; padding: 1.25rem 1.5rem;
    background: #FAF6EE; border-left: 4px solid #9B3B2E; border-radius: 0 0.5rem 0.5rem 0;
    position: relative;
}
body.articles_detail .article-quote::before {
    content: '「'; position: absolute; top: -4px; left: 8px;
    font-size: 2rem; color: #9B3B2E; opacity: 0.2;
    font-family: 'Noto Serif SC', serif;
}
body.articles_detail .article-quote-text {
    font-family: 'Noto Serif SC', serif; font-size: 0.9375rem;
    color: #9B3B2E; line-height: 1.9; font-weight: 500;
}
body.articles_detail .article-quote-cite { font-size: 0.75rem; color: #A08F75; margin-top: 0.5rem; text-align: right; }

/* 六经卡片 */
body.articles_detail .meridian-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.75rem; margin: 1.5rem 0; }
body.articles_detail .meridian-card {
    padding: 1rem; background: #FAF6EE; border: 1px solid #E5D9C8; border-radius: 0.5rem;
    text-align: center; position: relative; transition: all 0.25s;
}
body.articles_detail .meridian-card:hover { border-color: #9B3B2E; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(45,42,38,0.06); }
body.articles_detail .meridian-card-yang { border-top: 3px solid #C4A35A; }
body.articles_detail .meridian-card-yin { border-top: 3px solid #4A7C8C; }
body.articles_detail .meridian-name { font-family: 'Noto Serif SC', serif; font-size: 1.125rem; font-weight: 700; color: #2D2A26; margin-bottom: 0.25rem; }
body.articles_detail .meridian-pinyin { font-size: 0.625rem; color: #B8A58B; letter-spacing: 0.15em; margin-bottom: 0.5rem; }
body.articles_detail .meridian-desc { font-size: 0.75rem; color: #8B7355; line-height: 1.6; }
body.articles_detail .meridian-tag { display: inline-block; margin-top: 0.5rem; padding: 0.125rem 0.5rem; border-radius: 0.25rem; font-size: 0.625rem; font-weight: 600; }
body.articles_detail .meridian-tag.exterior { background: rgba(196,163,90,0.15); color: #9C7B2E; }
body.articles_detail .meridian-tag.interior { background: rgba(74,124,140,0.15); color: #4A7C8C; }

/* 提示框 */
body.articles_detail .article-tip {
    margin: 1.5rem 0; padding: 1rem 1.25rem 1rem 3rem;
    background: rgba(155,59,46,0.05); border: 1px solid rgba(155,59,46,0.2); border-radius: 0.5rem;
    position: relative; font-size: 0.875rem; color: #5C5449; line-height: 1.9;
}
body.articles_detail .article-tip svg {
    position: absolute; left: 0.875rem; top: 50%; transform: translateY(-50%);
    width: 1.25rem; height: 1.25rem; color: #9B3B2E;
}
body.articles_detail .article-tip-title { font-weight: 600; color: #9B3B2E; margin-bottom: 0.25rem; }

/* 关键词标签 */
body.articles_detail .article-keywords { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px dashed #D4C9B8; }
body.articles_detail .article-keyword-label { font-size: 0.8125rem; color: #8B7355; font-weight: 600; margin-right: 0.25rem; line-height: 1.7; }
body.articles_detail .article-keyword { padding: 0.2rem 0.6rem; background: #F5F0E8; border: 1px solid #D4C9B8; border-radius: 0.375rem; font-size: 0.75rem; color: #5C5449; transition: all 0.2s; cursor: pointer; }
body.articles_detail .article-keyword:hover { background: #9B3B2E; color: #fff; border-color: #9B3B2E; }

/* 文章底部分享/操作 */
body.articles_detail .article-actions { display: flex; align-items: center; gap: 0.75rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px dashed #D4C9B8; flex-wrap: wrap; }
body.articles_detail .article-action-btn {
    display: inline-flex; align-items: center; gap: 0.375rem;
    padding: 0.5rem 1rem; border-radius: 0.5rem; font-size: 0.8125rem; font-weight: 500;
    transition: all 0.2s; cursor: pointer; border: 1px solid #D4C9B8; background: #fff; color: #5C5449;
}
body.articles_detail .article-action-btn:hover { border-color: #9B3B2E; color: #9B3B2E; }
body.articles_detail .article-action-btn.liked { background: #9B3B2E; color: #fff; border-color: #9B3B2E; }
body.articles_detail .article-action-btn svg { width: 0.875rem; height: 0.875rem; }

/* 上下篇导航 */
body.articles_detail .article-nav-link {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 1rem 1.25rem; background: #fff; border: 1px solid #D4C9B8; border-radius: 0.625rem;
    text-decoration: none; color: #5C5449; transition: all 0.2s; flex: 1;
}
body.articles_detail .article-nav-link:hover {
    border-color: #9B3B2E; color: #9B3B2E;
    transform: translateY(-2px); box-shadow: 0 6px 20px rgba(45,42,38,0.06);
}
body.articles_detail .article-nav-link svg { width: 1.125rem; height: 1.125rem; flex-shrink: 0; }
body.articles_detail .article-nav-label { font-size: 0.75rem; color: #A08F75; margin-bottom: 0.125rem; }
body.articles_detail .article-nav-title { font-family: 'Noto Serif SC', serif; font-size: 0.9375rem; font-weight: 600; }

/* 目录导航 */
body.articles_detail .toc-list { list-style: none; padding: 0; margin: 0; }
body.articles_detail .toc-list li { margin-bottom: 0.25rem; }
body.articles_detail .toc-list a {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 0.5rem 0.625rem; border-radius: 0.375rem;
    font-size: 0.8125rem; color: #5C5449;
    text-decoration: none; transition: all 0.2s;
    border-left: 2px solid transparent;
}
body.articles_detail .toc-list a:hover { background: #FAF6EE; color: #9B3B2E; border-left-color: #9B3B2E; }
body.articles_detail .toc-list a.active {
    background: rgba(155,59,46,0.08); color: #9B3B2E;
    border-left-color: #9B3B2E; font-weight: 600;
}
body.articles_detail .toc-num {
    width: 1.25rem; height: 1.25rem;
    display: flex; align-items: center; justify-content: center;
    border-radius: 0.25rem;
    background: #F5F0E8; color: #A08F75;
    font-size: 0.6875rem; font-weight: 600; flex-shrink: 0;
}
body.articles_detail .toc-list a:hover .toc-num,
body.articles_detail .toc-list a.active .toc-num { background: #9B3B2E; color: #fff; }

/* 评论区域 */
body.articles_detail .comments-section { background: #fff; border: 1px solid #D4C9B8; border-radius: 1rem; padding: 1.5rem; margin-bottom: 2rem; }
body.articles_detail .comment-item { display: flex; gap: 1rem; padding: 1.25rem 0; border-bottom: 1px dashed #E5DBCB; }
body.articles_detail .comment-item:last-child { border-bottom: none; }
body.articles_detail .comment-avatar {
    width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-family: 'Noto Serif SC', serif; font-size: 1rem; font-weight: 700; color: #fff;
}
body.articles_detail .comment-body { flex: 1; min-width: 0; }
body.articles_detail .comment-header { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.375rem; flex-wrap: wrap; }
body.articles_detail .comment-author { font-size: 0.875rem; font-weight: 600; color: #2D2A26; }
body.articles_detail .comment-badge {
    display: inline-flex; align-items: center; gap: 0.25rem;
    padding: 0.1rem 0.5rem; border-radius: 0.25rem;
    font-size: 0.625rem; font-weight: 600;
}
body.articles_detail .comment-badge.author { background: rgba(155,59,46,0.1); color: #9B3B2E; }
body.articles_detail .comment-badge.expert { background: rgba(196,163,90,0.15); color: #9C7B2E; }
body.articles_detail .comment-time { font-size: 0.6875rem; color: #A08F75; }
body.articles_detail .comment-floor { font-size: 0.6875rem; color: #A08F75; font-family: 'Noto Serif SC', serif; }
body.articles_detail .comment-text { font-size: 0.875rem; color: #3D3833; line-height: 1.8; }
body.articles_detail .comment-reply-quote {
    margin: 0.5rem 0; padding: 0.625rem 0.875rem;
    background: #FAF6EE; border-left: 3px solid #D4C9B8;
    border-radius: 0 0.375rem 0.375rem 0;
    font-size: 0.8125rem; color: #8B7355; line-height: 1.7;
}
body.articles_detail .comment-reply-quote strong { color: #5C5449; }
body.articles_detail .comment-footer { display: flex; align-items: center; gap: 1rem; margin-top: 0.625rem; }
body.articles_detail .comment-action {
    display: inline-flex; align-items: center; gap: 0.25rem;
    font-size: 0.75rem; color: #8B7355;
    cursor: pointer; transition: color 0.2s;
}
body.articles_detail .comment-action:hover { color: #9B3B2E; }
body.articles_detail .comment-action svg { width: 0.875rem; height: 0.875rem; }

/* 评论表单 */
body.articles_detail .comment-form { background: #fff; border: 1px solid #D4C9B8; border-radius: 1rem; padding: 1.5rem; }
body.articles_detail .comment-form-title {
    font-family: 'Noto Serif SC', serif; font-size: 1.125rem; font-weight: 700;
    color: #2D2A26; margin-bottom: 1rem;
    display: flex; align-items: center; gap: 0.5rem;
}
body.articles_detail .comment-form-title::before {
    content: ''; width: 3px; height: 1rem;
    background: linear-gradient(180deg, #9B3B2E, #C4A35A); border-radius: 2px;
}
body.articles_detail .comment-form-row { margin-bottom: 1rem; }
body.articles_detail .comment-form-label { display: block; font-size: 0.8125rem; font-weight: 500; color: #5C5449; margin-bottom: 0.375rem; }
body.articles_detail .comment-form-input {
    width: 100%; padding: 0.625rem 0.875rem;
    border: 1px solid #D4C9B8; border-radius: 0.5rem;
    font-size: 0.875rem; color: #2D2A26;
    background: #FAF6EE; transition: all 0.2s;
    font-family: inherit; outline: none;
}
body.articles_detail .comment-form-input:focus { border-color: #9B3B2E; background: #fff; box-shadow: 0 0 0 3px rgba(155,59,46,0.08); }
body.articles_detail .comment-form-textarea {
    width: 100%; min-height: 120px;
    padding: 0.75rem 0.875rem;
    border: 1px solid #D4C9B8; border-radius: 0.5rem;
    font-size: 0.875rem; color: #2D2A26;
    background: #FAF6EE; transition: all 0.2s;
    font-family: inherit; outline: none; resize: vertical; line-height: 1.8;
}
body.articles_detail .comment-form-textarea:focus { border-color: #9B3B2E; background: #fff; box-shadow: 0 0 0 3px rgba(155,59,46,0.08); }
body.articles_detail .comment-form-bottom { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
body.articles_detail .comment-form-hint { font-size: 0.75rem; color: #A08F75; }
body.articles_detail .comment-form-submit {
    display: inline-flex; align-items: center; gap: 0.375rem;
    padding: 0.625rem 1.5rem;
    background: #9B3B2E; color: #fff;
    border: none; border-radius: 0.5rem;
    font-size: 0.875rem; font-weight: 600;
    cursor: pointer; transition: all 0.2s; font-family: inherit;
}
body.articles_detail .comment-form-submit:hover {
    background: #C44B3C; transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(155,59,46,0.25);
}
body.articles_detail .comment-form-submit svg { width: 0.875rem; height: 0.875rem; }

/* 作者信息卡 */
body.articles_detail .author-card {
    display: flex; gap: 1rem; padding: 1.25rem;
    background: #FAF6EE; border: 1px solid #E5D9C8;
    border-radius: 0.75rem; margin-bottom: 1.5rem;
}
body.articles_detail .author-avatar {
    width: 56px; height: 56px; border-radius: 50%; flex-shrink: 0;
    background: linear-gradient(135deg, #9B3B2E, #C4A35A);
    display: flex; align-items: center; justify-content: center;
    font-family: 'Noto Serif SC', serif; font-size: 1.5rem; font-weight: 700; color: #fff;
}
body.articles_detail .author-info { flex: 1; }
body.articles_detail .author-name {
    font-family: 'Noto Serif SC', serif; font-size: 1.0625rem; font-weight: 700;
    color: #2D2A26; margin-bottom: 0.125rem;
}
body.articles_detail .author-title { font-size: 0.75rem; color: #8B7355; margin-bottom: 0.375rem; }
body.articles_detail .author-bio { font-size: 0.8125rem; color: #5C5449; line-height: 1.7; }
body.articles_detail .author-stats { display: flex; gap: 1.25rem; margin-top: 0.625rem; }
body.articles_detail .author-stat { font-size: 0.75rem; color: #8B7355; }
body.articles_detail .author-stat strong {
    font-family: 'Noto Serif SC', serif; color: #9B3B2E;
    font-size: 0.875rem; font-weight: 700;
}

/* book-entry 使用硬编码色值版本 */
body.articles_detail .book-entry:hover {
    border-color: #9B3B2E;
    box-shadow: 0 4px 16px rgba(45,42,38,0.06);
}
body.articles_detail .book-entry-tag {
    background: #F0E0DC;
    color: #9B3B2E;
}
body.articles_detail .book-entry-tag i { color: inherit; }
body.articles_detail .book-entry:hover .book-entry-title { color: #9B3B2E; }

/* sub-nav-dot 默认背景（实际颜色由行内 style 控制） */
body.articles_detail .sub-nav-dot { background: #9B3B2E; }

/* 响应式（articles_detail） */
@media (max-width: 768px) {
    body.articles_detail .article-body { padding: 1.5rem 1.25rem; }
}
