@charset "UTF-8";
/* ============================================================================
   mywenxue.cn — 内容页「正文区」增强样式（精简版）
   ----------------------------------------------------------------------------
   作用范围：仅文章正文内（由 footer.php 在 is_singular('post') 时加载）
     1. art.article_info     文章信息行（作者 / 分类 / 日期）
     2. #post_content        文首摘要段
     3. .entry-content       正文（含 JS 由表格转换出的语义块）
     4. .article_tags        网络标签
   不含：顶部导航、面包屑、两栏布局、侧栏、页脚、上下篇、相关推荐、评论区
        —— 这些全部交回 WP 主题原生样式。
   ========================================================================== */

:root {
    /* —— 色板 —— */
    --v2-red:        #E23A2E;
    --v2-red-deep:   #C0281D;
    --v2-red-wash:   #FDF2F0;
    --v2-ink:        #1F1B18;
    --v2-ink-2:      #57504A;
    --v2-ink-3:      #8C837B;
    --v2-ink-4:      #B3AAA2;
    --v2-paper:      #FBF9F6;
    --v2-card:       #FFFFFF;
    --v2-line:       #EAE4DD;
    --v2-line-soft:  #F4F0EB;
    --v2-wash:       #F7F4F0;
    --v2-gold:       #B8860B;

    /* —— 尺寸 —— */
    --v2-wrap:       1180px;
    --v2-read:       720px;
    --v2-radius:     10px;
    --v2-radius-sm:  6px;

    /* —— 字体 —— */
    --v2-serif:  "Noto Serif SC", "Source Han Serif SC", "Songti SC", "SimSun", Georgia, serif;
    --v2-sans:   -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
                 "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", sans-serif;
}

/* ============================================================================
   5. 文章卡 —— 纯白纸卡
   ========================================================================== */
.article_container {
    background: var(--v2-card) !important;
    border: 1px solid var(--v2-line) !important;
    border-radius: var(--v2-radius) !important;
    padding: 40px 44px 36px !important;
    margin: 0 0 20px !important;
    box-shadow: 0 1px 2px rgba(31, 27, 24, .03), 0 8px 24px -12px rgba(31, 27, 24, .08);
    box-sizing: border-box;
    /* 不能用 overflow:hidden，会把内容/阴影裁掉 */
    overflow: visible;
    position: relative;
}

/* 5.1 标题 */
.article_container h1 {
    font-family: var(--v2-serif) !important;
    font-size: 32px !important;
    font-weight: 700 !important;
    line-height: 1.42 !important;
    color: var(--v2-ink) !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    border: none !important;
    border-bottom: none !important;
    letter-spacing: .5px;
    text-align: left;
    word-break: break-word;
}
.article_container h1::after {
    content: "";
    display: block;
    width: 44px;
    height: 3px;
    background: var(--v2-red);
    border-radius: 2px;
    margin-top: 16px;
}

/* 5.2 元信息行 */
.article_info {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 18px;
    padding: 0 0 22px !important;
    margin: 0 0 26px !important;
    /* 主题原本是 border-top:#09f solid 5px，必须一并清掉 */
    border: none !important;
    border-top: none !important;
    border-bottom: 1px solid var(--v2-line-soft) !important;
    font-size: 13px !important;
    color: var(--v2-ink-3) !important;
    line-height: 1.6;
}
.article_info > span { display: inline-flex; align-items: center; }
.article_info i, .article_info .info_ico {
    font-style: normal !important;
    color: var(--v2-ink-3) !important;
    font-size: 13px !important;
}
.article_info a { color: var(--v2-ink-2) !important; text-decoration: none; font-size: 13px !important; }
.article_info a:hover { color: var(--v2-red) !important; }

/* ============================================================================
   6. 摘要段 #post_content
   ========================================================================== */
#post_content {
    background: var(--v2-wash);
    border-left: 3px solid var(--v2-red);
    border-radius: 0 var(--v2-radius-sm) var(--v2-radius-sm) 0;
    padding: 18px 22px !important;
    margin: 0 0 30px !important;
    font-size: 15.5px !important;
    line-height: 1.9 !important;
    color: var(--v2-ink-2) !important;
    overflow: visible !important;
}
#post_content p {
    margin: 0 !important;
    font-size: 15.5px !important;
    line-height: 1.9 !important;
    color: var(--v2-ink-2) !important;
    overflow: visible !important;
    max-height: none !important;
    /* 老站给摘要加过 line-clamp，去掉 */
    display: block !important;
    -webkit-line-clamp: none !important;
}
/* 摘要里的内联蓝字链接：只有第一个（词条名）保持强调，其余淡化为正文色 */
#post_content a,
#post_content a[style] {
    color: var(--v2-red) !important;
    font-size: inherit !important;
    font-weight: 600 !important;
    text-decoration: none;
    border-bottom: 1px solid rgba(226, 58, 46, .28);
    transition: border-color .16s;
}
/* 第二个及之后的链接（正文中夹带的关键词）弱化，避免整段泛红 */
#post_content a ~ a {
    color: var(--v2-ink-2) !important;
    font-weight: 400 !important;
    border-bottom-color: var(--v2-line);
}
#post_content a:hover { border-bottom-color: var(--v2-red); }

/* ============================================================================
   7. 正文通用
   ========================================================================== */
.entry-content {
    font-size: 17px !important;
    line-height: 1.95 !important;
    color: var(--v2-ink) !important;
    overflow: visible !important;
}
.context,
.context p,
.context pre {
    font-size: 17px !important;
    line-height: 1.95 !important;
    color: var(--v2-ink) !important;
}
.entry-content a,
.context a {
    color: var(--v2-red) !important;
}
.entry-content p { margin: 0 0 18px !important; }

/* ============================================================================
   8. 【核心】正文语义块 —— 由 JS 从表格转换而来
   ----------------------------------------------------------------------------
   JS 会把 5 个表格改写成：
     .mw-sec    纵向块（th 独占行 + td 独占行）→ 小节：标题 + 正文
     .mw-grid   4 列键值表 → 2×N 网格卡片
     .mw-kv     2 列键值表 → 行式键值对
   这样彻底摆脱表格的列宽死约束。
   ========================================================================== */

/* 8.1 小节块（解释 / 例句 / 出处 / 故事） */
.mw-sec {
    margin: 0 0 26px;
    padding: 0;
}
.mw-sec-title {
    position: relative;
    font-family: var(--v2-serif);
    font-size: 18px !important;
    font-weight: 700;
    line-height: 1.5;
    color: var(--v2-ink);
    margin: 0 0 12px;
    padding-left: 14px;
    letter-spacing: .3px;
}
.mw-sec-title::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 17px;
    background: var(--v2-red);
    border-radius: 2px;
}
.mw-sec-body {
    font-size: 17px !important;
    line-height: 1.95;
    color: var(--v2-ink-2);
    margin: 0;
    /* 解释/例句类短句：加浅色底衬托，读起来有呼吸感 */
    background: var(--v2-wash);
    border-radius: var(--v2-radius-sm);
    padding: 14px 18px;
}
/* 段落式的“故事 / 出处”不加底色，纯文字更耐读 */
.mw-sec-body.is-prose {
    background: transparent;
    padding: 0;
    color: var(--v2-ink);
    text-align: justify;
    text-justify: inter-ideograph;
}
.mw-sec-body.is-prose a { color: var(--v2-red) !important; }

/* 8.2 键值网格（4 列 → 2×N 卡片） */
.mw-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 26px;
}
.mw-grid-item {
    display: flex;
    flex-direction: column;
    gap: 5px;
    background: var(--v2-card);
    border: 1px solid var(--v2-line);
    border-radius: var(--v2-radius-sm);
    padding: 12px 15px;
    min-width: 0;
    transition: border-color .18s ease, box-shadow .18s ease;
}
.mw-grid-item:hover {
    border-color: #DCD2C7;
    box-shadow: 0 2px 10px -4px rgba(31, 27, 24, .12);
}
.mw-grid-key {
    font-size: 12px !important;
    line-height: 1.5;
    color: var(--v2-ink-3) !important;
    font-weight: 400;
    letter-spacing: .2px;
}
.mw-grid-val {
    font-size: 15.5px !important;
    line-height: 1.6;
    color: var(--v2-ink) !important;
    font-weight: 500;
    word-break: break-word;
}
.mw-grid-val:empty::after {
    content: "—";
    color: var(--v2-ink-4);
    font-weight: 400;
}
.mw-grid-val a { color: var(--v2-red) !important; text-decoration: none; }

/* 8.3 行式键值（近义词 / 反义词 2 列） */
.mw-kv {
    display: flex;
    flex-direction: column;
    margin: 0 0 26px;
    border: 1px solid var(--v2-line);
    border-radius: var(--v2-radius-sm);
    overflow: hidden;
    background: var(--v2-card);
}
.mw-kv-row {
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid var(--v2-line-soft);
}
.mw-kv-row:last-child { border-bottom: none; }
.mw-kv-key {
    flex: 0 0 132px;
    background: var(--v2-wash);
    padding: 12px 15px;
    font-size: 13.5px !important;
    line-height: 1.7;
    color: var(--v2-ink-3) !important;
    display: flex;
    align-items: center;
}
.mw-kv-val {
    flex: 1 1 auto;
    min-width: 0;
    padding: 12px 15px;
    font-size: 15px !important;
    line-height: 1.7;
    color: var(--v2-ink) !important;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}
.mw-kv-val:empty::after {
    content: "暂无";
    color: var(--v2-ink-4);
}
.mw-kv-val a { color: var(--v2-red) !important; text-decoration: none; }

/* 近义词 / 反义词里的词，做成小标签 */
.mw-kv-val .mw-word {
    display: inline-block;
    padding: 3px 10px;
    background: var(--v2-red-wash);
    color: var(--v2-red-deep) !important;
    border-radius: 20px;
    font-size: 13.5px;
    line-height: 1.6;
    text-decoration: none;
    border: 1px solid rgba(226, 58, 46, .14);
}
.mw-kv-val .mw-word:hover {
    background: var(--v2-red);
    color: #fff !important;
    border-color: var(--v2-red);
}

/* ============================================================================
   9. 成语接龙 —— 竖排长列 → 横向 chips
   ========================================================================== */
/* 接龙标题紧跟词链，下间距收紧 */
.mw-chain-title {
    margin-top: 6px !important;
    margin-bottom: 14px !important;
}
.result_characters-container {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 30px !important;
    padding: 0 !important;
    counter-reset: mwchain;
}
.reault_characters-item {
    display: inline-flex !important;
    align-items: center;
    position: relative;
    height: auto !important;
    line-height: 1.5 !important;
    padding: 7px 14px 7px 30px !important;
    background: var(--v2-card) !important;
    border: 1px solid var(--v2-line) !important;
    border-radius: 18px;
    font-family: var(--v2-serif);
    font-size: 14.5px !important;
    color: var(--v2-ink-2) !important;
    white-space: nowrap;
    counter-increment: mwchain;
    transition: all .18s ease;
    cursor: default;
}
.reault_characters-item::before {
    content: counter(mwchain);
    position: absolute;
    left: 9px;
    top: 50%;
    transform: translateY(-50%);
    font-family: var(--v2-sans);
    font-size: 10.5px;
    font-weight: 600;
    color: var(--v2-ink-4);
    min-width: 14px;
    text-align: right;
}
.reault_characters-item:hover {
    background: var(--v2-red-wash) !important;
    border-color: rgba(226, 58, 46, .3) !important;
    color: var(--v2-red-deep) !important;
    transform: translateY(-1px);
}
.reault_characters-item:hover::before { color: var(--v2-red); }

/* ============================================================================
   10. 标签
   ========================================================================== */
.article_tags {
    border-top: 1px solid var(--v2-line-soft) !important;
    margin: 30px 0 0 !important;
    padding: 22px 0 0 !important;
    background: transparent !important;
}
.article_tags .tagcloud {
    font-size: 13px !important;
    color: var(--v2-ink-3) !important;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    line-height: 2;
}
.article_tags .tagcloud a {
    display: inline-block;
    padding: 4px 13px;
    background: var(--v2-wash) !important;
    border: 1px solid var(--v2-line);
    border-radius: 20px;
    color: var(--v2-ink-2) !important;
    font-size: 13px !important;
    text-decoration: none;
    transition: all .18s ease;
}
.article_tags .tagcloud a:hover {
    background: var(--v2-red) !important;
    border-color: var(--v2-red);
    color: #fff !important;
}

/* ============================================================================
   响应式（只调正文区，不动布局外壳）
   ========================================================================== */
@media only screen and (max-width: 760px) {
    .article_container {
        padding: 22px 16px 20px !important;
        border-radius: var(--v2-radius-sm) !important;
    }
    .article_container h1 { font-size: 23px !important; line-height: 1.45 !important; }
    .article_container h1::after { width: 34px; height: 2px; margin-top: 12px; }
    .article_info { gap: 0 14px; padding-bottom: 16px !important; margin-bottom: 20px !important; }

    #post_content {
        padding: 14px 15px !important;
        font-size: 15px !important;
        margin-bottom: 22px !important;
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    #post_content p { font-size: 15px !important; line-height: 1.85 !important; }

    .entry-content,
    .context,
    .context p {
        font-size: 15.5px !important;
        line-height: 1.88 !important;
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    /* 正文内块级元素不得超宽（不作用于行内元素，避免破坏排版） */
    .context div,
    .context p,
    .context ul,
    .context ol,
    .context table,
    .entry-content div,
    .entry-content p,
    .entry-content ul,
    .entry-content ol,
    .entry-content table {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .mw-grid { grid-template-columns: 1fr; gap: 7px; margin-bottom: 20px; }
    .mw-grid-item { padding: 10px 13px; }
    .mw-sec { margin-bottom: 20px; }
    .mw-sec-title { font-size: 16px !important; }
    .mw-sec-body {
        font-size: 15.5px !important;
        line-height: 1.85 !important;
        padding: 12px 14px;
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    .mw-kv-key { flex: 0 0 96px; padding: 10px 11px; font-size: 12.5px !important; }
    .mw-kv-val { padding: 10px 11px; font-size: 14.5px !important; }

    .reault_characters-item {
        font-size: 13.5px !important;
        padding: 6px 12px 6px 27px !important;
    }
}

@media only screen and (max-width: 420px) {
    .article_container { padding: 20px 14px 18px !important; }
    .article_container h1 { font-size: 21px !important; }
    .mw-kv { flex-direction: column; }
    .mw-kv-row { flex-direction: column; }
    .mw-kv-key {
        flex: none;
        padding: 8px 12px 4px;
        background: transparent;
        font-size: 12px !important;
        color: var(--v2-ink-4) !important;
    }
    .mw-kv-val { padding: 0 12px 11px; }
}
