/* ==========================================================================
   content_pages.css —— 公开内容页（藏经阁 / 专题聚合页 / 文章详情 / 编辑说明）
   子代理 A 产出。配套模板：templates/articles.html、templates/article_detail.html、
   templates/topics/*.html、templates/about/editorial.html

   约束：
   1. 375 / 390 / 768 与桌面 1440 均无横向溢出（长标题、长文、长 URL 都要能断行）。
   2. 移动端仅保留既有底部导航；文章 CTA 和返回顶部放入文档流。
   3. 只使用既有 CSS 变量，不新增配色体系。
   ========================================================================== */

.cp-page {
    max-width: 1100px;
    margin: 0 auto;
    padding: 40px 20px 60px;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* 文章详情页：整改轮重设计（2026-10-24）。
   --cp-article-text 是正文可读性基线色，亮度必须 ≥ #c9d0dc（守护测试逐通道断言，
   且对卡片底色 #101820 的 WCAG 对比度 ≥ 4.5:1）。金色只作装饰线/强调，正文禁金色。 */
.cp-page--article {
    --cp-article-text: #CBD3DF;
    --cp-article-text-strong: #F3EFE2;
    --cp-article-link: #D6B56D;
    max-width: 1160px;
    padding: 14px 16px 24px;
}

/* V1（F 验收）：亮色主题下文章作用域变量翻转——正文/标题用深色，保对比度 */
[data-theme="light"] .cp-page--article {
    --cp-article-text: #3A4250;
    --cp-article-text-strong: #1A1612;
    --cp-article-muted: #5C6472;
    --cp-article-link: #765632;
}

/* sticky 修复（整改轮实测发现）：style.css 的 html/body overflow-x:hidden 会把 body
   变成滚动容器，页内所有 position:sticky（顶栏导航、PC 侧栏目录）因此全部失效。
   clip 同样裁掉横向溢出（防撑破视口），但不会产生滚动容器，sticky 恢复正常。
   旧浏览器不认识 clip 时回落到 hidden（保持现状，不算回归）。 */
html, body {
    overflow-x: hidden;
    overflow-x: clip;
}

/* ---------- 通用块 ---------- */
.cp-hero {
    text-align: center;
    padding: 30px 16px 26px;
    position: relative;
}

.cp-h1 {
    font-family: var(--font-display);
    font-size: 34px;
    font-weight: 700;
    color: var(--gold-primary);
    letter-spacing: 0.16em;
    margin: 0 0 12px;
    line-height: 1.35;
    max-width: 100%;
}

@media (min-width: 768px) {
    .cp-h1 { font-size: 46px; }
}

.cp-hero-sub {
    font-family: var(--font-display);
    font-size: 14px;
    color: var(--text-secondary);
    letter-spacing: 0.24em;
    margin: 0;
}

.cp-divider {
    width: 80px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--gold-primary), transparent);
    margin: 20px auto;
}

.cp-section {
    margin: 40px 0 0;
}

.cp-section-title {
    font-family: var(--font-display);
    font-size: 19px;
    color: var(--gold-primary);
    letter-spacing: 0.12em;
    margin: 0 0 6px;
    line-height: 1.5;
}

.cp-section-desc {
    font-size: 13px;
    color: var(--text-muted);
    line-height: 1.8;
    margin: 0 0 18px;
}

.cp-note {
    font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.8;
}

.cp-back-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin: 36px 0 0;
}

.cp-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 18px;
    min-height: 44px;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    background: transparent;
    color: var(--text-secondary);
    font-size: 13px;
    font-family: var(--font-body);
    text-decoration: none;
    letter-spacing: 0.05em;
    justify-content: center;
    line-height: 1.6;
    max-width: 100%;
    transition: all 0.25s ease;
}

.cp-btn:hover {
    border-color: var(--gold-primary);
    color: var(--gold-primary);
}

.cp-btn--gold {
    background: linear-gradient(135deg, var(--gold-dark), var(--gold-primary));
    border-color: transparent;
    color: #1a1a1a;
    font-weight: 600;
}

.cp-btn--gold:hover {
    color: #1a1a1a;
    opacity: 0.92;
}

/* ---------- 面包屑 ---------- */
.cp-breadcrumb {
    font-size: 12.5px;
    color: var(--text-muted);
    margin: 0 0 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.cp-breadcrumb a {
    color: var(--text-muted);
    text-decoration: none;
}

.cp-breadcrumb a:hover { color: var(--gold-primary); }

/* ---------- 专题卡片 ---------- */
.cp-topic-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    gap: 16px;
}

.cp-topic-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 22px 20px;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    min-width: 0;
    transition: all 0.3s ease;
}

.cp-topic-card:hover {
    border-color: rgba(201, 168, 106, 0.4);
    transform: translateY(-3px);
}

.cp-topic-name {
    font-family: var(--font-display);
    font-size: 18px;
    color: var(--gold-primary);
    letter-spacing: 0.1em;
    margin: 0 0 8px;
}

.cp-topic-intent {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.85;
    margin: 0 0 12px;
    flex: 1;
}

.cp-topic-meta {
    font-size: 12px;
    color: var(--text-muted);
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.cp-tag {
    display: inline-block;
    padding: 2px 9px;
    border: 1px solid rgba(201, 168, 106, 0.25);
    border-radius: 3px;
    color: var(--gold-primary);
    font-size: 11px;
    letter-spacing: 0.06em;
}

.cp-tag--muted {
    color: var(--text-muted);
    border-color: var(--border-color);
}

/* ---------- 搜索与筛选 ---------- */
.cp-search-form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 18px;
}

.cp-search-input {
    flex: 1 1 240px;
    min-width: 0;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 4px;
    padding: 11px 14px;
    min-height: 44px;
    color: var(--text-primary);
    font-size: 14px;
    font-family: var(--font-body);
    outline: none;
}

.cp-search-input:focus { border-color: var(--gold-primary); }

.cp-search-btn {
    flex: 0 0 auto;
    min-height: 44px;
    padding: 0 22px;
    border: 1px solid var(--border-gold);
    border-radius: 4px;
    background: rgba(201, 168, 106, 0.08);
    color: var(--gold-primary);
    font-size: 13px;
    font-family: var(--font-body);
    letter-spacing: 0.08em;
    cursor: pointer;
}

.cp-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 20px;
}

.cp-filter-link {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 6px 14px;
    border: 1px solid var(--border-color);
    border-radius: 18px;
    background: var(--bg-card);
    color: var(--text-secondary);
    font-size: 12.5px;
    text-decoration: none;
    letter-spacing: 0.05em;
}

.cp-filter-link:hover,
.cp-filter-link.active {
    border-color: var(--gold-primary);
    color: var(--gold-primary);
}

.cp-filter-link.active {
    background: rgba(201, 168, 106, 0.12);
}

/* ---------- 文章卡片 ---------- */
.cp-article-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
    gap: 16px;
}

.cp-article-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 20px;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    min-width: 0;
    transition: all 0.3s ease;
}

.cp-article-card:hover {
    border-color: rgba(201, 168, 106, 0.4);
    transform: translateY(-3px);
}

.cp-article-title {
    font-family: var(--font-display);
    font-size: 16.5px;
    font-weight: 600;
    color: var(--text-primary);
    letter-spacing: 0.05em;
    line-height: 1.6;
    margin: 10px 0 8px;
}

.cp-article-card:hover .cp-article-title { color: var(--gold-primary); }

.cp-article-excerpt {
    font-size: 13px;
    color: var(--text-muted);
    line-height: 1.85;
    margin: 0 0 14px;
    flex: 1;
}

.cp-article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 12px;
    color: var(--text-muted);
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}

/* ---------- 分页 ---------- */
.cp-pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin: 36px 0 0;
}

.cp-page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    min-height: 40px;
    padding: 0 12px;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    background: var(--bg-card);
    color: var(--text-secondary);
    font-size: 13px;
    text-decoration: none;
    font-family: var(--font-body);
}

.cp-page-link:hover,
.cp-page-link.active {
    border-color: var(--gold-primary);
    color: var(--gold-primary);
}

.cp-page-link.active {
    background: rgba(201, 168, 106, 0.14);
    font-weight: 600;
}

.cp-page-ellipsis { color: var(--text-muted); padding: 0 4px; }

/* ---------- 空状态 ---------- */
.cp-empty {
    text-align: center;
    padding: 56px 20px;
    border: 1px dashed var(--border-color);
    border-radius: 8px;
    color: var(--text-muted);
}

.cp-empty-title {
    font-family: var(--font-display);
    font-size: 16px;
    color: var(--text-secondary);
    letter-spacing: 0.1em;
    margin: 0 0 8px;
}

.cp-empty-desc {
    font-size: 13px;
    line-height: 1.85;
    margin: 0;
}

/* ---------- 学习路径 ---------- */
.cp-path-list {
    margin: 0;
    padding-left: 1.4em;
    color: var(--text-secondary);
    font-size: 13.5px;
    line-height: 1.95;
}

.cp-path-list li { margin-bottom: 4px; }

.cp-path-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
    gap: 16px;
}

.cp-path-card {
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 18px;
    background: var(--bg-card);
    min-width: 0;
}

.cp-path-card-title {
    font-family: var(--font-display);
    font-size: 15px;
    color: var(--gold-primary);
    margin: 0 0 8px;
    letter-spacing: 0.08em;
}

.cp-path-card-title a {
    color: inherit;
    text-decoration: none;
}

/* ---------- 子栏目 ---------- */
.cp-subcolumn-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
    gap: 14px;
}

.cp-subcolumn {
    border: 1px solid var(--border-color);
    border-left: 2px solid var(--gold-primary);
    border-radius: 0 6px 6px 0;
    padding: 14px 16px;
    background: var(--bg-card);
    min-width: 0;
}

.cp-subcolumn-name {
    font-family: var(--font-display);
    font-size: 14.5px;
    color: var(--gold-primary);
    letter-spacing: 0.08em;
    margin: 0 0 6px;
}

.cp-subcolumn-desc {
    font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.8;
    margin: 0;
}

/* ---------- 文章详情：布局与首屏 ----------
   首屏砍掉无意义留白：页面顶距 14px，面包屑后立刻是 标题 → 元信息 → 核心答案框 → 目录/正文。 */
.cp-article-layout { display: block; }

.cp-article-main {
    max-width: 720px;   /* 阅读宽落在 680-760px 区间 */
    margin: 0 auto;
    min-width: 0;
}

@media (min-width: 768px) {
    .cp-page--article { padding: 26px 24px 32px; }
}

/* ≥1280px：双栏 —— 主栏阅读宽 + 右侧粘性侧栏（目录 / 相关文章） */
@media (min-width: 1280px) {
    .cp-article-layout--aside {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 300px;
        gap: 44px;
        align-items: start;
    }
    .cp-article-layout--aside .cp-article-main { max-width: none; margin: 0; }
    /* 双栏时正文内的折叠目录与侧栏目录重复，隐藏正文内的 */
    .cp-article-layout--aside .cp-toc--inline { display: none; }
}

.cp-article-aside { display: none; }

@media (min-width: 1280px) {
    .cp-article-aside {
        display: block;
        position: sticky;
        top: 88px;                       /* 64px 顶栏 + 24px 呼吸 */
        max-height: calc(100vh - 112px);
        overflow-y: auto;
        min-width: 0;
    }
}

/* ---------- 文章详情：进度条 ---------- */
.cp-progress {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    z-index: 140;
    pointer-events: none;
    background: transparent;
}

.cp-progress-fill {
    display: block;
    height: 100%;
    width: 0;
    background: linear-gradient(90deg, var(--gold-dark), var(--gold-primary), var(--gold-light));
}

/* ---------- 文章详情：头部（标题 / 元信息条 / 封面） ---------- */
.cp-detail-header {
    padding: 4px 0 18px;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 18px;
}

.cp-detail-title {
    font-family: var(--font-display);
    font-size: clamp(24px, 6.3vw, 28px);
    font-weight: 700;
    color: var(--cp-article-text-strong, #F3EFE2);   /* 标题用近白色保证对比，金色只留给装饰 */
    letter-spacing: 0.01em;
    line-height: 1.45;
    margin: 10px 0 12px;
    max-width: 100%;
    position: relative;
    padding-left: 14px;
}

.cp-detail-title::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.18em;
    width: 4px;
    height: calc(100% - 0.36em);
    min-height: 1.2em;
    background: linear-gradient(180deg, var(--gold-light), var(--gold-dark));
    border-radius: 2px;
}

@media (min-width: 768px) {
    .cp-detail-title { font-size: 30px; }
}

@media (min-width: 1280px) {
    .cp-detail-title { font-size: 32px; }
}

.cp-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 14px;
    align-items: center;
    font-size: 13px;
    color: var(--text-muted);
    letter-spacing: 0;
    line-height: 1.65;
}

.cp-detail-meta span { white-space: normal; }
.cp-detail-meta time { white-space: nowrap; }

.cp-cover {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    border: 1px solid var(--border-color);
    margin: 14px 0 0;
}

/* ---------- 文章详情：核心答案框 ----------
   结构位（§2.3）：标题 → 摘要 → 核心答案框。路由提供 core_answer 时优先；
   只有摘要时摘要升级为本框；两者皆空整块不渲染（优雅降级）。 */
.cp-answer-box {
    border: 1px solid var(--border-gold);
    border-left: 3px solid var(--gold-primary);
    border-radius: 0 8px 8px 0;
    background: rgba(201, 168, 106, 0.08);
    padding: 13px 16px 14px;
    margin: 0 0 18px;
}

.cp-answer-tag {
    display: inline-block;
    padding: 1px 9px;
    border: 1px solid rgba(201, 168, 106, 0.4);
    border-radius: 3px;
    color: var(--gold-primary);
    font-size: 12px;
    letter-spacing: 0.14em;
    margin: 0 0 8px;
}

.cp-answer-text {
    margin: 0;
    font-size: 15.5px;
    line-height: 1.85;
    color: var(--cp-article-text-strong, #F3EFE2);
    overflow-wrap: anywhere;
}

/* ---------- 目录（正文内可折叠 + PC 粘性侧栏） ---------- */
.cp-toc {
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: var(--bg-card);
    margin: 0 0 22px;
}

/* 长文（≥3 个 H2）：整条目录头是一个折叠按钮 */
.cp-toc-toggle {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 13px 16px;
    background: transparent;
    border: 0;
    cursor: pointer;
    color: var(--gold-primary);
    font-family: var(--font-display);
    font-size: 14.5px;
    letter-spacing: 0.12em;
    text-align: left;
}

.cp-toc-toggle:hover { color: var(--gold-light); }

.cp-toc-chevron {
    flex: 0 0 auto;
    font-size: 12px;
    transition: transform 0.2s ease;
    color: var(--text-muted);
}

.cp-toc-toggle.is-open .cp-toc-chevron { transform: rotate(180deg); }

.cp-toc-title {
    font-family: var(--font-display);
    font-size: 14.5px;
    font-weight: 600;
    color: var(--gold-primary);
    letter-spacing: 0.12em;
    margin: 0;
}

.cp-toc-title--static {
    display: block;
    padding: 13px 16px 0;
}

.cp-toc-panel { padding: 8px 16px 14px; }

/* 无折叠头（≤2 个 H2 的短文）时给面板补上顶距 */
.cp-toc-title--static + .cp-toc-panel { padding-top: 10px; }

.cp-toc-list {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 13.5px;
    line-height: 1.9;
}

.cp-toc-list li { margin-bottom: 4px; }

.cp-toc-list li.level-3 { padding-left: 1.2em; }

.cp-toc-list a {
    color: var(--text-secondary);
    text-decoration: none;
}

.cp-toc-list a:hover,
.cp-toc-list a.is-active { color: var(--gold-primary); }

.cp-toc-list a.is-active { font-weight: 600; }

/* PC 侧栏里的目录与相关文章 */
.cp-aside-title {
    font-family: var(--font-display);
    font-size: 14px;
    color: var(--gold-primary);
    letter-spacing: 0.14em;
    margin: 0 0 10px;
}

.cp-toc--aside {
    padding: 16px;
    margin: 0 0 18px;
}

.cp-toc--aside .cp-toc-list { font-size: 13px; }

.cp-aside-box {
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: var(--bg-card);
    padding: 16px;
}

.cp-aside-related {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cp-aside-related-item {
    display: block;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 10px 12px;
    text-decoration: none;
    background: var(--bg-secondary);
    min-width: 0;
    transition: border-color 0.25s ease;
}

.cp-aside-related-item:hover { border-color: var(--gold-primary); }

.cp-aside-related-title {
    display: block;
    font-size: 13.5px;
    color: var(--text-primary);
    line-height: 1.6;
    margin-bottom: 4px;
}

.cp-aside-related-item:hover .cp-aside-related-title { color: var(--gold-primary); }

.cp-aside-related-meta {
    display: block;
    font-size: 11.5px;
    color: var(--text-muted);
}

/* ---------- 正文基础（专题页 intro_html 等非文章详情页沿用） ---------- */
.cp-body {
    font-size: 15.5px;
    line-height: 1.95;
    color: var(--text-primary);
    margin-bottom: 32px;
}

.cp-body p { margin: 0 0 1.25em; }

.cp-body h2 {
    font-family: var(--font-display);
    font-size: 21px;
    color: var(--gold-primary);
    letter-spacing: 0.06em;
    margin: 1.9em 0 0.8em;
    line-height: 1.5;
    scroll-margin-top: 80px;
}

.cp-body h3 {
    font-family: var(--font-display);
    font-size: 17px;
    color: var(--gold-light);
    letter-spacing: 0.05em;
    margin: 1.6em 0 0.7em;
    line-height: 1.5;
    scroll-margin-top: 80px;
}

.cp-body h4 {
    font-family: var(--font-display);
    font-size: 15.5px;
    color: var(--text-primary);
    margin: 1.4em 0 0.6em;
}

.cp-body ul,
.cp-body ol {
    padding-left: 1.5em;
    margin: 0 0 1.3em;
}

.cp-body li { margin-bottom: 0.45em; }

.cp-body blockquote {
    border-left: 3px solid var(--gold-primary);
    padding: 10px 18px;
    margin: 1.4em 0;
    background: rgba(201, 168, 106, 0.05);
    border-radius: 0 4px 4px 0;
    color: var(--text-secondary);
}

.cp-body strong { color: var(--gold-primary); font-weight: 600; }

.cp-body a {
    color: var(--gold-primary);
    text-decoration: underline;
    overflow-wrap: anywhere;
}

.cp-body img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin: 1em 0;
}

.cp-body pre {
    background: rgba(0, 0, 0, 0.25);
    border-radius: 4px;
    padding: 14px;
    overflow-x: auto;
    font-size: 13px;
    line-height: 1.7;
    max-width: 100%;
}

.cp-body code {
    font-family: 'Courier New', monospace;
    font-size: 13px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    padding: 1px 5px;
}

.cp-body pre code { background: none; padding: 0; }

.cp-body table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.2em 0;
    font-size: 13px;
    display: block;
    overflow-x: auto;
}

.cp-body th,
.cp-body td {
    border: 1px solid var(--border-color);
    padding: 8px 10px;
    text-align: left;
}

[data-theme="light"] .cp-body pre,
[data-theme="light"] .cp-body code {
    background: rgba(0, 0, 0, 0.06);
}

/* ---------- 文章详情正文 ----------
   作用域收窄到文章详情页（.cp-page--article），不影响专题页的 .cp-body。
   移动端 16.5px/1.85、段距 1.15em；正文色 #CBD3DF ≥ #c9d0dc（守护测试断言）。
   金色只出现在标题装饰线与强调元素，正文文字不用金色。 */
.cp-page--article .cp-body {
    font-size: 17px;
    line-height: 1.85;
    color: var(--cp-article-text, #CBD3DF);
    margin-bottom: 32px;
}

@media (min-width: 768px) {
    .cp-page--article .cp-body { font-size: 17px; line-height: 1.85; }
}

.cp-page--article .cp-body p { margin: 0 0 1.1em; }
.cp-page--article .cp-body p:last-child { margin-bottom: 0; }

.cp-page--article .cp-body h2 {
    font-family: var(--font-display);
    font-size: 20px;
    color: var(--cp-article-text-strong, #F3EFE2);
    letter-spacing: 0.04em;
    margin: 1.8em 0 0.75em;
    line-height: 1.5;
    position: relative;
    padding-left: 14px;
    scroll-margin-top: 80px;
}

.cp-page--article .cp-body h2::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.3em;
    width: 4px;
    height: 1em;
    background: linear-gradient(180deg, var(--gold-light), var(--gold-dark));
    border-radius: 2px;
}

@media (min-width: 768px) {
    .cp-page--article .cp-body h2 { font-size: 22px; }
}

.cp-page--article .cp-body h3 {
    font-family: var(--font-display);
    font-size: 18px;
    color: var(--cp-article-text-strong, #F3EFE2);
    letter-spacing: 0.03em;
    margin: 1.5em 0 0.65em;
    line-height: 1.5;
    scroll-margin-top: 80px;
}

.cp-page--article .cp-body h4 {
    font-family: var(--font-display);
    font-size: 16.5px;
    color: var(--cp-article-text-strong, #F3EFE2);
    margin: 1.5em 0 0.6em;
    line-height: 1.6;
}

.cp-page--article .cp-body ul,
.cp-page--article .cp-body ol {
    padding-left: 1.5em;
    margin: 0 0 1.3em;
}

.cp-page--article .cp-body li { margin-bottom: 0.5em; }

/* 引用块：左边框 + 金调底色 + 缩进，与正文明确区隔 */
.cp-page--article .cp-body blockquote {
    border-left: 3px solid var(--gold-primary);
    padding: 13px 18px 13px 20px;
    margin: 1.5em 0;
    background: rgba(201, 168, 106, 0.08);
    border-radius: 0 6px 6px 0;
    color: var(--cp-article-text, #CBD3DF);
}

.cp-page--article .cp-body blockquote p { margin: 0 0 0.6em; }
.cp-page--article .cp-body blockquote p:last-child { margin-bottom: 0; }

.cp-page--article .cp-body strong {
    color: var(--cp-article-text-strong, #F3EFE2);
    font-weight: 600;
}

.cp-page--article .cp-body a {
    color: var(--cp-article-link, var(--gold-primary));
    text-decoration: underline;
    text-underline-offset: 3px;
    overflow-wrap: anywhere;
}

.cp-page--article .cp-body a.cp-btn--gold,
.cp-page--article .cp-body a.cp-btn--gold:hover {
    color: #1a1a1a;
    text-decoration: none;
}

[data-theme="light"] .cp-page--article a.cp-btn--gold,
[data-theme="light"] .cp-page--article a.cp-btn--gold:hover {
    color: #fff;
}

.cp-page--article .cp-body img {
    max-width: 100%;     /* 图片永不宽于正文栏（守护测试断言） */
    width: auto;
    height: auto;
    border-radius: 6px;
    margin: 1.2em 0;
}

.cp-page--article .cp-body pre {
    background: rgba(0, 0, 0, 0.25);
    border-radius: 4px;
    padding: 14px;
    overflow-x: auto;
    font-size: 13px;
    line-height: 1.7;
    max-width: 100%;
}

.cp-page--article .cp-body code {
    font-family: 'Courier New', monospace;
    font-size: 14px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    padding: 1px 5px;
}

.cp-page--article .cp-body pre code { background: none; padding: 0; }

/* 表格：article_reading.js 会把每张表包进 .cp-table-wrap 横向滚动容器；
   无 JS 时回退为表格自身 display:block + overflow-x:auto，两种路径都不撑破视口。 */
.cp-table-wrap {
    overflow-x: auto;                /* 守护测试断言 */
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
    margin: 0;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    background: rgba(7, 10, 15, 0.4);
}

[data-theme="light"] .cp-table-wrap { background: var(--bg-card); }

.cp-scroll-shell {
    position: relative;
    max-width: 100%;
    margin: 1.2em 0;
}

.cp-scroll-shell.has-overflow { padding-top: 28px; }

.cp-scroll-hint {
    position: absolute;
    top: 0;
    right: 0;
    height: 28px;
    display: grid;
    place-items: center;
    color: var(--text-secondary);
    font: 12px/1.5 var(--font-body);
    pointer-events: none;
}

.cp-scroll-hint[hidden] { display: none; }

.cp-diagram-wrap {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--border-color);
    border-radius: 6px;
}

.cp-diagram-wrap > p { margin: 0; }
.cp-page--article .cp-body .cp-diagram-wrap img { margin: 0; }
.cp-page--article .cp-body figure { margin: 1.4em 0; min-width: 0; max-width: 100%; }
.cp-page--article .cp-body figure.cp-figure figcaption {
    margin-top: 8px;
    color: var(--text-secondary);
    font-size: 13px;
    line-height: 1.65;
}

/* 图解默认完整缩放显示，放大阅读由独立大图入口承担，不把正文图片强制拉到900px。 */
.cp-media-frame { display: block; margin: 1.4em 0; min-width: 0; max-width: 100%; }
.cp-media-frame > p { margin: 0; }
.cp-page--article .cp-body .cp-media-frame img,
.cp-page--article .cp-body svg {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}
.cp-page--article .cp-body .cp-media-frame img { width: 100%; }
.cp-page--article .cp-body .cp-media-open {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 40px;
    margin-top: 6px;
    font-size: 13px;
    color: var(--text-secondary);
    text-underline-offset: 3px;
}

.cp-table-wrap table {
    display: table;
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    font-size: 14px;
}

.cp-page--article .cp-body > table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.2em 0;
    font-size: 14px;
    display: block;
    overflow-x: auto;                /* 无 JS 回退路径 */
}

.cp-page--article .cp-body th,
.cp-page--article .cp-body td {
    border: 1px solid var(--border-color);
    padding: 9px 12px;
    text-align: left;
    vertical-align: top;
    color: var(--cp-article-text, #CBD3DF);
}

.cp-page--article .cp-body th {
    background: rgba(201, 168, 106, 0.12);
    color: var(--cp-article-text-strong, #F3EFE2);
    font-weight: 600;
    white-space: nowrap;
}

[data-theme="light"] .cp-page--article .cp-body pre,
[data-theme="light"] .cp-page--article .cp-body code {
    background: rgba(0, 0, 0, 0.06);
}

/* ---------- CTA ---------- */
.cp-cta {
    border: 1px solid rgba(201, 168, 106, 0.32);
    border-radius: 8px;
    background: rgba(201, 168, 106, 0.06);
    padding: 18px 20px;
    margin: 26px 0;
    text-align: center;
}

.cp-cta-label {
    display: block;
    font-family: var(--font-display);
    font-size: 15px;
    color: var(--gold-primary);
    letter-spacing: 0.08em;
    margin-bottom: 10px;
}

.cp-cta-hint {
    display: block;
    font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.8;
    margin-top: 10px;
}
.cp-cta-alternatives { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px; margin-top: 12px; }
.cp-cta-alternatives a { font-size: 13px; line-height: 1.7; color: var(--text-secondary); text-underline-offset: 3px; }

.cp-cta--footer { margin: 32px 0 0; }

/* 文末强 CTA：金色实底大按钮，移动端通栏，保证"CTA 明显" */
.cp-cta--final {
    padding: 22px 18px;
    border: 1px solid var(--border-gold);
    background: linear-gradient(180deg, rgba(201, 168, 106, 0.12), rgba(201, 168, 106, 0.04));
}

.cp-cta--final .cp-cta-label {
    font-size: 16.5px;
    color: var(--gold-light);
    margin-bottom: 12px;
}

.cp-cta--final .cp-btn--gold {
    min-height: 48px;
    padding: 12px 30px;
    font-size: 15.5px;
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(201, 168, 106, 0.22);
}

/* 底部导航已由全站 body 一次性避让，内容页只保留正常段落间距。 */
@media (max-width: 767px) {
    .cp-page { padding-bottom: 28px; }
    .cp-page--article { padding-bottom: 24px; }
}

/* ---------- 返回顶部 ----------
   滚动 >600px 出现；宽屏固定于视口边缘，窄屏放在文末以免遮挡正文。 */
.cp-backtop {
    display: none;
    position: fixed;
    right: 16px;
    bottom: 32px;
    z-index: 92;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid var(--border-gold);
    background: rgba(10, 15, 22, 0.92);
    color: var(--gold-primary);
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
}

.cp-backtop.is-visible { display: flex; }

.cp-backtop:hover { border-color: var(--gold-primary); color: var(--gold-light); }

.cp-backtop-text {
    display: block;
    font-size: 9px;
    letter-spacing: 0.08em;
    margin-top: 1px;
}

@media (min-width: 768px) {
    .cp-backtop { right: 30px; bottom: 32px; }
}

@media (max-width: 900px) {
    .cp-backtop {
        position: static;
        flex-direction: row;
        gap: 6px;
        margin: 0;
        width: auto;
        min-height: 44px;
        padding: 9px 14px;
        border-radius: 4px;
        box-shadow: none;
        background: transparent;
    }
    .cp-backtop-text { margin: 0; font-size: 13px; letter-spacing: 0; }
}

/* ---------- 出处 / 内链 / 相关 ---------- */
.cp-box {
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 18px 20px;
    margin: 28px 0;
    background: var(--bg-card);
}

.cp-box-title {
    font-family: var(--font-display);
    font-size: 15px;
    color: var(--gold-primary);
    letter-spacing: 0.1em;
    margin: 0 0 12px;
}

.cp-source-item {
    border-left: 2px solid var(--gold-dark);
    padding: 2px 0 2px 12px;
    margin-bottom: 12px;
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.85;
}

.cp-source-item:last-child { margin-bottom: 0; }

.cp-source-title { color: var(--gold-primary); }

.cp-source-verify {
    font-size: 11.5px;
    color: var(--text-muted);
    margin-left: 6px;
}

.cp-kw-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cp-kw-list a {
    display: inline-block;
    padding: 4px 11px;
    border: 1px solid var(--border-color);
    border-radius: 3px;
    font-size: 12px;
    color: var(--text-secondary);
    text-decoration: none;
}

.cp-kw-list a:hover {
    border-color: var(--gold-primary);
    color: var(--gold-primary);
}

.cp-related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
    gap: 12px;
}

.cp-related-item {
    display: flex;
    flex-direction: column;
    gap: 6px;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 14px 16px;
    text-decoration: none;
    color: var(--text-secondary);
    font-size: 13.5px;
    line-height: 1.65;
    min-width: 0;
    background: var(--bg-card);
    transition: border-color 0.25s ease;
}

.cp-related-item:hover { border-color: var(--gold-primary); }

.cp-related-topic {
    align-self: flex-start;
    display: inline-block;
    padding: 1px 8px;
    border: 1px solid rgba(201, 168, 106, 0.25);
    border-radius: 3px;
    color: var(--gold-primary);
    font-size: 11px;
    letter-spacing: 0.06em;
}

.cp-related-title {
    display: block;
    font-size: 14.5px;
    color: var(--text-primary);
    line-height: 1.6;
}

.cp-related-item:hover .cp-related-title { color: var(--gold-primary); }

.cp-related-summary {
    display: block;
    font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.8;
}

/* ---------- 文末上下篇（F09：同专题物理前后篇，轻量双栏导航） ---------- */
.cp-prevnext {
    display: flex;
    gap: 12px;
    margin: 18px 0;
}

.cp-prevnext-item {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 10px 14px;
    text-decoration: none;
    background: var(--bg-card);
    transition: border-color 0.25s ease;
}

.cp-prevnext-item:hover { border-color: var(--gold-primary); }

.cp-prevnext--next { text-align: right; }

.cp-prevnext-label {
    font-size: 11px;
    letter-spacing: 0.06em;
    color: var(--gold-primary);
}

.cp-prevnext-title {
    font-size: 13.5px;
    color: var(--text-secondary);
    line-height: 1.6;
}

.cp-prevnext-item:hover .cp-prevnext-title { color: var(--gold-primary); }

.cp-prevnext--placeholder { border-style: dashed; visibility: hidden; }

/* ---------- 编辑信息 / 误区（文章详情） ---------- */
.cp-editor-box .cp-editor-line {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.9;
    margin: 0;
}

.cp-page--article .cp-editor-box a,
.cp-page--article .cp-box .cp-note a {
    color: var(--cp-article-link, var(--gold-primary));
    text-decoration: underline;
    text-underline-offset: 3px;
}

.cp-page--article .cp-editor-box a:focus-visible,
.cp-page--article .cp-box .cp-note a:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
}

.cp-misconception-list {
    margin: 0;
    padding-left: 1.5em;
    font-size: 14px;
    color: var(--cp-article-text, #CBD3DF);
    line-height: 1.9;
}

.cp-misconception-list li { margin-bottom: 0.5em; }

/* ---------- 工具入口 ---------- */
.cp-tool-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
    gap: 12px;
}

.cp-tool-link {
    display: flex;
    flex-direction: column;
    gap: 6px;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 14px 16px;
    text-decoration: none;
    background: var(--bg-card);
    min-width: 0;
}

.cp-tool-link:hover { border-color: var(--gold-primary); }

.cp-tool-name {
    font-family: var(--font-display);
    font-size: 15px;
    color: var(--gold-primary);
    letter-spacing: 0.08em;
}

.cp-tool-desc { font-size: 12.5px; color: var(--text-muted); line-height: 1.75; }

/* ---------- 首页工具突出（供 app.py 首页视图使用） ---------- */
.yxtjg-featured-tool {
    border: 1px solid rgba(201, 168, 106, 0.45);
    border-radius: 8px;
    background: rgba(201, 168, 106, 0.08);
    padding: 14px 18px;
    margin: 12px 0;
}

.yxtjg-featured-tool--qimen { border-color: rgba(201, 168, 106, 0.55); }
.yxtjg-featured-tool--liuren { border-color: rgba(62, 107, 115, 0.55); }
.yxtjg-featured-tool--bazi { border-color: rgba(107, 75, 160, 0.5); }

.yxtjg-featured-tool__label {
    display: block;
    font-family: var(--font-display);
    font-size: 14px;
    color: var(--gold-primary);
    letter-spacing: 0.08em;
    margin-bottom: 6px;
}

/* ---------- 编辑说明页 ---------- */
.cp-doc {
    max-width: 780px;
    margin: 0 auto;
    padding: 40px 20px 60px;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.cp-doc h2 {
    font-family: var(--font-display);
    font-size: 19px;
    color: var(--gold-primary);
    letter-spacing: 0.1em;
    margin: 2em 0 0.8em;
}

.cp-doc h3 {
    font-family: var(--font-display);
    font-size: 16px;
    color: var(--gold-light);
    margin: 1.6em 0 0.6em;
}

.cp-doc p,
.cp-doc li {
    font-size: 14px;
    line-height: 1.95;
    color: var(--text-secondary);
}

.cp-doc ul { padding-left: 1.4em; margin: 0 0 1.2em; }

.cp-doc a { color: var(--gold-primary); }

.cp-doc strong { color: var(--text-primary); }

/* ==========================================================================
   第三阶段 A（子代理 A）—— 专题知识中心新增组件：
   子主题卡片 / 代表性古籍 / 常见问题 / 工具状态。
   约束沿用文件头：只用既有 CSS 变量；网格列允许收窄到视口宽度；
   375 / 390 / 768 / 1440 无横向溢出。
   ========================================================================== */

/* ---------- 子主题卡片 ---------- */
.cp-subtopic-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    gap: 14px;
}

.cp-subtopic {
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 16px 18px;
    background: var(--bg-card);
    min-width: 0;
    transition: border-color 0.25s ease;
}

.cp-subtopic:hover { border-color: rgba(201, 168, 106, 0.4); }

.cp-subtopic-name {
    font-family: var(--font-display);
    font-size: 15px;
    color: var(--gold-primary);
    letter-spacing: 0.08em;
    margin: 0 0 6px;
}

.cp-subtopic-desc {
    font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.8;
    margin: 0;
}

/* ---------- 代表性古籍 ---------- */
.cp-classic-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    gap: 14px;
}

.cp-classic-item {
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 14px 16px;
    background: var(--bg-card);
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px;
}

.cp-classic-title {
    font-family: var(--font-display);
    font-size: 14.5px;
    color: var(--text-primary);
    letter-spacing: 0.06em;
}

.cp-classic-badge {
    display: inline-block;
    padding: 1px 8px;
    border: 1px solid var(--border-color);
    border-radius: 3px;
    color: var(--text-muted);
    font-size: 11px;
    letter-spacing: 0.06em;
    white-space: nowrap;
}

.cp-classic-note {
    flex-basis: 100%;
    font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.8;
}

/* ---------- 常见问题 ---------- */
.cp-faq-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cp-faq-item {
    border: 1px solid var(--border-color);
    border-left: 2px solid var(--gold-primary);
    border-radius: 0 6px 6px 0;
    padding: 14px 16px;
    background: var(--bg-card);
    min-width: 0;
}

.cp-faq-q {
    font-family: var(--font-display);
    font-size: 14.5px;
    color: var(--text-primary);
    letter-spacing: 0.04em;
    line-height: 1.7;
    margin: 0 0 6px;
}

.cp-faq-a {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.9;
    margin: 0;
}

/* ---------- 工具状态 ---------- */
.cp-tool-status {
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 16px 18px;
    background: var(--bg-card);
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 14px;
}

.cp-tool-status-text {
    flex: 1 1 260px;
    min-width: 0;
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.9;
    margin: 0;
}

.cp-tool-status-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 3px;
    font-size: 11.5px;
    letter-spacing: 0.08em;
    white-space: nowrap;
}

.cp-tool-status-badge.is-open {
    border: 1px solid rgba(201, 168, 106, 0.45);
    color: var(--gold-primary);
}

.cp-tool-status-badge.is-closed {
    border: 1px solid var(--border-color);
    color: var(--text-muted);
}

/* ── 人工咨询卡片（AI预测辅助入口） ── */
.cp-consult-box { border: 1px solid rgba(201,168,106,.15); border-radius: 6px; padding: 16px 20px; margin-top: 20px; background: rgba(201,168,106,.03); }
.cp-consult-title { font-size: 14px; font-weight: 600; color: var(--gold-primary); margin: 0 0 8px; }
.cp-consult-line { font-size: 14px; line-height: 1.8; margin: 0 0 6px; color: var(--text-secondary); }
.cp-consult-wxid { color: var(--gold-primary); font-weight: 600; letter-spacing: .05em; }
.cp-consult-copy { display: inline-block; margin-left: 8px; padding: 2px 12px; font-size: 12px; cursor: pointer; border: 1px solid var(--gold-primary); border-radius: 3px; background: transparent; color: var(--gold-primary); }
.cp-consult-copy:active { background: rgba(201,168,106,.15); }
.cp-consult-note { font-size: 12px; color: var(--text-muted); opacity: .7; margin: 4px 0 0; line-height: 1.6; }
@media (max-width: 767px) {
    .cp-consult-box { padding: 12px 14px; }
    .cp-consult-copy { padding: 4px 14px; }
}

/* ── T2a（2026-10-26）：子主题/子节点卡链接化（F06）与文章页"所属聚合"行（F04）── */
/* <a class="cp-subtopic"> 与 div 卡同款样式（cp-subtopic 已有盒模型），仅补链接态 */
a.cp-subtopic {
    display: block;
    text-decoration: none;
}
a.cp-subtopic:hover { border-color: rgba(201, 168, 106, 0.55); }
a.cp-subtopic:hover .cp-subtopic-name { text-decoration: underline; text-underline-offset: 3px; }
/* 无发布资格节点的文字卡标记 */
.cp-subtopic-pending { color: var(--text-muted); opacity: .8; }
/* 文章页面包屑下方的"所属聚合"行 */
.cp-node-affiliation {
    font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.8;
    margin: 6px 0 0;
}
.cp-node-affiliation a { color: var(--gold-primary); text-decoration: none; }
.cp-node-affiliation a:hover { text-decoration: underline; text-underline-offset: 3px; }