/* mihio 中文排版层（原 han-patch，去除 han.css 后的独立排版方案）
 * 在 Tailwind preflight 之上做中文长文阅读优化。
 * 加载顺序：mihio.css（工具类）→ mihio-typo.css（未分层，排版收敛）。
 */

/* ===== 基线 ===== */
html {
    line-height: 1.7;
    -webkit-text-size-adjust: 100%;
}

/* 中文无衬线字体栈：苹方 → 冬青黑 → 雅黑 → 思源黑体 */
body,
.entry-content,
.comment-content {
    font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
                 "Noto Sans CJK SC", "Source Han Sans SC",
                 system-ui, -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* 宋体模式（后台「正文字体」选衬线时） */
body.mihio-serif,
body.mihio-serif .entry-content,
body.mihio-serif .comment-content {
    font-family: "Songti SC", "Source Han Serif SC", "Noto Serif CJK SC",
                 "SimSun", Georgia, "Times New Roman", serif;
}

/* ===== 现代中文排版特性（渐进增强，旧浏览器自动忽略） ===== */
.entry-content,
.comment-content {
    /* 中西文/数字间距自动调整（Chrome 128+） */
    text-autospace: normal;
    /* 标点挤压：行首行尾与连续标点微缩（Chrome 127+） */
    text-spacing-trim: space-first;
    /* 长词/URL 换行兜底 */
    overflow-wrap: break-word;
    word-break: normal;
}
/* 宋体模式下行尾悬挂标点（Safari） */
.mihio-serif .entry-content {
    hanging-punctuation: allow-end;
}

/* ===== 正文容器：标题层级与段落 ===== */
.entry-content {
    font-size: 1.0625rem;          /* 17px：比 16px 更适合中文密集阅读 */
    line-height: 1.95;              /* 接近 2.0，中文需要更大行距 */
    letter-spacing: 0.01em;         /* 字距微开，避免字形粘连 */
    word-spacing: 0.05em;
    color: rgb(39, 39, 42);         /* zinc-800，比纯黑柔和 */
}
.dark .entry-content {
    color: rgb(228, 228, 231);      /* zinc-200 */
}
@media (min-width: 640px) {
    .entry-content {
        font-size: 1.125rem;        /* 18px on sm+ */
        line-height: 2.0;
    }
}
.entry-content > h1, .entry-content > h2, .entry-content > h3,
.entry-content > h4, .entry-content > h5, .entry-content > h6 {
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0;
    margin-top: 2.2em;
    margin-bottom: 1em;
    scroll-margin-top: 6rem;
    color: rgb(24, 24, 27);
}
.dark .entry-content > h1,
.dark .entry-content > h2,
.dark .entry-content > h3,
.dark .entry-content > h4,
.dark .entry-content > h5,
.dark .entry-content > h6 {
    color: rgb(244, 244, 245);
}
.entry-content > h1 { font-size: 1.6em; }
.entry-content > h2 {
    font-size: 1.4em;
    padding-bottom: 0.4em;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    margin-top: 2.5em;
}
.dark .entry-content > h2 {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}
.entry-content > h3 { font-size: 1.2em; }
.entry-content > h4 { font-size: 1.08em; }
.entry-content > h5,
.entry-content > h6 { font-size: 1em; }

/* 第一个标题不加上方间距 */
.entry-content > h1:first-child,
.entry-content > h2:first-child,
.entry-content > h3:first-child {
    margin-top: 0;
}

.entry-content > p {
    margin-top: 0;
    margin-bottom: 1.35em;
    text-align: justify;
    text-justify: inter-character;   /* 中英混排更自然的两端对齐 */
    hyphens: auto;
}

/* 列表阅读体验 */
.entry-content > ul,
.entry-content > ol {
    margin: 1.35em 0;
    padding-left: 1.8em;
}
.entry-content li {
    margin-bottom: 0.5em;
    line-height: 1.85;
}
.entry-content li::marker {
    color: var(--color-primary-500, #f59e0b);
}

/* ===== 正文图片与媒体 —— 块级图片占据内容区全部宽度 ===== */
.entry-content img {
    max-width: 100%;
    height: auto;
    border-radius: 0.5rem;
}
/* 独占段落的图片（markdown ![](url) 渲染为 <p><img></p>）：全宽显示 */
.entry-content p > img:only-child,
.entry-content figure > img,
.entry-content > img {
    width: 100%;
    display: block;
    margin: 1.5em auto;
    border-radius: 0.625rem;
}
.entry-content figure {
    margin: 1.5em 0;
    text-align: center;
}
.entry-content figcaption {
    margin-top: 0.6em;
    font-size: 0.85em;
    color: rgb(113, 113, 122);
    text-align: center;
    line-height: 1.6;
}
.dark .entry-content figcaption {
    color: rgb(161, 161, 170);
}

/* ===== 代码块：统一深色背景（github-dark 配色），亮暗模式一致 ===== */
.entry-content pre {
    margin: 1.5em 0;
    padding: 1.1em 1.4em;
    border-radius: 0.625rem;
    background-color: #0d1117;
    font-size: 0.875em;
    line-height: 1.7;
    overflow-x: auto;
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.dark .entry-content pre {
    border-color: rgba(255, 255, 255, 0.1);
}
.entry-content pre code {
    padding: 0;
    background: none;
    color: #c9d1d9;
}
.entry-content code {
    font-size: 0.875em;
    padding: 0.15em 0.4em;
    border-radius: 0.25rem;
    background-color: rgba(0, 0, 0, 0.06);
    font-family: var(--font-mono, ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace);
}
.dark .entry-content code {
    background-color: rgba(255, 255, 255, 0.08);
}
/* highlight.js 标记过的 code 块重置内联背景 */
.entry-content pre code.hljs {
    background: transparent;
    padding: 0;
}

/* ===== 引用 / 表格 / 分隔线 ===== */
.entry-content blockquote {
    margin: 1.5em 0;
    padding: 0.8em 1.4em;
    border-left: 3px solid #f59e0b;
    border-radius: 0.25rem;
    background-color: rgba(245, 158, 11, 0.06);
    color: inherit;
    font-style: normal;
}
.dark .entry-content blockquote {
    background-color: rgba(245, 158, 11, 0.08);
}
.entry-content blockquote p {
    margin-bottom: 0.6em;
}
.entry-content blockquote p:last-child {
    margin-bottom: 0;
}
.entry-content table {
    width: 100%;
    margin: 1.5em 0;
    border-collapse: collapse;
    font-size: 0.925em;
}
.entry-content th, .entry-content td {
    padding: 0.6em 0.9em;
    border: 1px solid rgba(0, 0, 0, 0.1);
}
.dark .entry-content th, .dark .entry-content td {
    border-color: rgba(255, 255, 255, 0.12);
}
.entry-content th {
    background-color: rgba(0, 0, 0, 0.03);
    font-weight: 600;
}
.dark .entry-content th {
    background-color: rgba(255, 255, 255, 0.05);
}
.entry-content hr {
    margin: 2.5em auto;
    border: none;
    border-top: 1px dashed rgba(0, 0, 0, 0.15);
    width: 60%;
}
.dark .entry-content hr {
    border-top-color: rgba(255, 255, 255, 0.15);
}

/* ===== 评论内容 ===== */
.comment-content {
    font-size: 0.9375rem;
    line-height: 1.75;
}
.comment-content p {
    margin: 0 0 0.6em;
    word-break: break-word;
}
.comment-content p:last-child {
    margin-bottom: 0;
}
.comment-content img {
    max-width: 100%;
    height: auto;
}

/* ===== Typecho 分页器 ===== */
ol.page-navigator {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
    padding: 0;
    margin: 0;
    list-style: none;
}
ol.page-navigator li {
    margin: 0;
}
ol.page-navigator a, ol.page-navigator span {
    display: inline-block;
    min-width: 2.25rem;
    padding: 0.5rem 0.9rem;
    border-radius: 9999px;
    border: 1px solid rgba(228, 228, 231, 1);
    background: #fff;
    font-size: 0.875rem;
    text-align: center;
    color: inherit;
    transition: all 0.15s;
}
.dark ol.page-navigator a, .dark ol.page-navigator span {
    border-color: rgba(63, 63, 70, 1);
    background: #18181b;
}
ol.page-navigator a:hover {
    border-color: #f59e0b;
    color: #b45309;
}
.dark ol.page-navigator a:hover {
    color: #fbbf24;
}

/* 旧正文内联样式兜底 */
img {
    background-color: transparent;
}

/* ===== 区块分割 ===== */
.section-divider {
    margin-top: 3rem;
    margin-bottom: 2rem;
    border-top: 1px solid rgba(228, 228, 231, 0.7);
    padding-top: 2rem;
}
.dark .section-divider {
    border-top-color: rgba(39, 39, 42, 0.7);
}
.section-heading {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}
.section-heading::before {
    content: "";
    display: inline-block;
    width: 0.25rem;
    height: 1.5rem;
    background-color: var(--color-primary-500, #f59e0b);
    border-radius: 9999px;
    flex-shrink: 0;
}
.section-heading__text {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.4;
}
.section-heading__meta {
    margin-left: auto;
    font-size: 0.875rem;
    color: rgb(113, 113, 122);
}

/* ===== TOC 高亮 ===== */
#mihio-toc a[data-toc-index].is-active {
    background-color: rgba(245, 158, 11, 0.1);
    color: #b45309;
    font-weight: 600;
}
.dark #mihio-toc a[data-toc-index].is-active {
    background-color: rgba(245, 158, 11, 0.15);
    color: #fbbf24;
}
#mihio-toc-mobile a[data-toc-index].is-active {
    color: #b45309;
    font-weight: 600;
}
.dark #mihio-toc-mobile a[data-toc-index].is-active {
    color: #fbbf24;
}

/* ===== 高分辨率缩放（4K/2K 下按比例放大界面，基准 16px→22.4px = +40%） ===== */
@media (min-width: 1920px) {
    html {
        font-size: 20px; /* +25% */
    }
}
@media (min-width: 2560px) {
    html {
        font-size: 22.4px; /* +40% */
    }
}
@media (min-width: 3840px) {
    html {
        font-size: 26.88px; /* +68%，超宽屏补偿 */
    }
}