/* ==========================================================================
   文章页样式增强（article-optimize.css）
   适用于新闻列表页（news_list）与新闻详情页（news_content）。
   在 zaobao index.1/2/3.css 与各页内联样式之后引入；
   仅做质感与交互统一，不改动既有版式、栅格与品牌配色。
   ========================================================================== */

/* ---------- 基础质感 ---------- */
html {
    scroll-behavior: smooth;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

::selection {
    background: rgba(168, 0, 52, 0.12);
}

/* ---------- 封面容器：统一灰底与圆角（无图/加载前呈中性骨架色） ---------- */
.aspect-picture {
    background-color: #f6f6f6;
    border-radius: 4px;
}

img[src^="data:image/gif;base64,R0lGODlh"] {
    visibility: hidden;
}

article img {
    backface-visibility: hidden;
    color: transparent;
}

/* ---------- 列表页 ---------- */

/* 列表卡片标题：品牌红 hover + 细腻过渡 */
.nlist article a.text-grey-500,
.nlist article .text-lg {
    transition: color 160ms ease;
}

.nlist article a.text-grey-500:hover {
    color: rgb(168 0 52) !important;
}

/* 列表卡缩略图链接：hover 时封面轻微上浮投影，强化可点击感 */
.nlist article > div {
    transition: background-color 160ms ease;
}

/* 列表摘要行高更舒展 */
.nlist article p {
    line-height: 1.6;
}

/* 右栏热门标题链接 hover 品牌红 */
.nlist-aside a.text-grey-500:hover {
    color: rgb(168 0 52) !important;
}

/* 热门序号前三名火焰图标块级对齐 */
.nlist-aside svg {
    display: block;
}

/* 面包屑链接 hover 品牌红 */
.nlist .text-grey-400[href]:hover {
    color: rgb(168 0 52) !important;
}

/* ---------- 详情页正文 ---------- */

/* 正文标题/小节标题渲染更锐利 */
.ncontent .content_head h1.qt_article_title,
.ncontent #ctrlfscont h2,
.ncontent #ctrlfscont h3 {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* 正文图片统一圆角与居中留白；段内图片最大不溢出正文宽度 */
.ncontent #ctrlfscont img {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
}

.ncontent #ctrlfscont figure,
.ncontent #ctrlfscont .image,
.ncontent #ctrlfscont .TRS_Editor div img {
    max-width: 100%;
}

/* 正文视频/iframe 响应式不溢出 */
.ncontent #ctrlfscont video,
.ncontent #ctrlfscont iframe,
.ncontent #ctrlfscont embed {
    max-width: 100%;
    border-radius: 6px;
}

/* 正文列表缩进与行距 */
.ncontent #ctrlfscont ul,
.ncontent #ctrlfscont ol {
    line-height: 1.85;
    padding-left: 1.6em;
    margin: 0 0 18px;
}

/* 正文长链接/英文串换行，避免撑破版面 */
.ncontent #ctrlfscont,
.ncontent #ctrlfscont p {
    overflow-wrap: anywhere;
}

/* 面包屑（详情页） */
.ncontent .sk_crumbs a:hover {
    color: rgb(168 0 52) !important;
}

/* 核心提示框样式统一由内联 <style> 的 .article-summary-box 承载（红竖条+灰底+楷体）。
   这里仅保留正文容器兜底：#ctrlfscont 绝不继承摘要框底色，正文 <p> 首行缩进
   完全交由后台内容的内联样式处理，外部不干预。 */
.ncontent #ctrlfscont {
    background-color: transparent;
}

/* ---------- 键盘可达性 ---------- */
a:focus-visible,
button:focus-visible,
textarea:focus-visible,
input:focus-visible {
    outline: 2px solid rgba(168, 0, 52, 0.55);
    outline-offset: 2px;
    border-radius: 2px;
}

/* ---------- 自定义滚动条（仅指针设备） ---------- */
@media (pointer: fine) {
    ::-webkit-scrollbar {
        width: 8px;
        height: 8px;
    }
    ::-webkit-scrollbar-thumb {
        background: rgba(0, 0, 0, 0.14);
        border-radius: 8px;
    }
    ::-webkit-scrollbar-thumb:hover {
        background: rgba(168, 0, 52, 0.35);
    }
    ::-webkit-scrollbar-track {
        background: transparent;
    }
}

/* ---------- 减少动效偏好 ---------- */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}