/*
 * Moonlight Theme — 高仿月光博客 v1.7.4
 * Content: 760px | Sidebar: 300px | Container: 1080px
 * 导航商务蓝通栏吸顶（含站名与工具按钮）；列表卡片白底、条目间 1px 实线分隔；页脚纯白通栏。
 */

/* ============================================================
   1. Reset & Base
   ============================================================ */
html,body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,img,ol,ul,li,form,label,table,tr,th,td {
    border:0; margin:0; padding:0; vertical-align:baseline;
}
body {
    background: var(--ml-bg);
    /* 中文优先字体栈：Mac/iOS 用苹方，Windows 西文用 Segoe UI + 中文雅黑，避免回退到无衬线默认体 */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
                 "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑",
                 "Helvetica Neue", Arial, sans-serif;
    font-size: 15px;
    line-height: 1.7;
    color: var(--ml-text);
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transition: background 0.3s, color 0.3s;
}
a { text-decoration: none; color: var(--ml-link); transition: color 0.2s, border-color 0.2s, background 0.2s; }
a:hover { color: var(--ml-link-hover); }
/* 键盘可达性：仅键盘聚焦时出现焦点环，鼠标点击不出现 */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--ml-link);
    outline-offset: 2px;
    border-radius: 2px;
}
img { max-width: 100%; height: auto; }
ol,ul { list-style: none; }
.clear { clear:both; display:block; overflow:hidden; visibility:hidden; width:0; height:0; }
.clearfix:after { content:''; display:table; clear:both; }
.hidden { display:none; }
/* 屏幕阅读器专用文本（视觉隐藏但不脱离无障碍树） */
.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
/* 文本选中色跟随主色 */
::selection { background: var(--ml-link); color: #fff; }
/* 锚点 / 返回顶部使用平滑滚动（系统开启"减少动态效果"时自动关闭） */
@media (prefers-reduced-motion: no-preference) {
    html { scroll-behavior: smooth; }
}

/* ============================================================
   2. Container & Layout (Flexbox — 防御内容溢出导致 sidebar 掉落)
   ============================================================ */
/* max-width = 1080(内容) + 2×15(左右安全边距)
   padding 保证视口小于 1110px 时卡片不会贴死屏幕边缘 */
#wrap {
    max-width: 1110px;
    margin: 0 auto;
    padding: 0 15px;
}
/* 主布局：flexbox，content 弹性伸缩 + sidebar 固定宽度 */
/* 760 + 20(gap) + 300 = 1080 */
#main {
    display: flex;
    gap: 20px;
    padding: 0 0 22px;
}
#main .content {
    flex: 1;                 /* 自适应填充剩余空间 */
    min-width: 0;            /* ★ 关键：允许 flex 子元素收缩，防止内容溢出推走 sidebar */
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
}
#main .sidebar,
#main .sidebar-sticky-wrap {
    flex: 0 0 300px;         /* 固定 300px 不伸缩 */
    min-width: 0;
    max-width: 100%;
}
/* 侧边栏对调 */
#main.sidebar-left {
    flex-direction: row-reverse;
}
/* 清除 float clearfix 伪元素对 flex 容器的干扰 */
#main.clearfix::after { display: none; }
/* 无侧边栏全宽模板 */
body.no-sidebar #main .sidebar,
body.no-sidebar #main .sidebar-sticky-wrap { display: none; }
/* 没有侧边栏列时，"左右对调"按钮失去作用对象，一并收起 */
body.no-sidebar #swap-sidebar { display: none; }
body.no-sidebar #main .content {
    flex: 1 1 100%;
    min-width: 0;
}
/* ============================================================
   2.5. 侧边栏智能悬浮（Sticky Sidebar）
   JS 在 #sidebar 外包裹 .sidebar-sticky-wrap 作为布局占位：
   - 状态一：侧边栏高度 ≤ 视口可用高度 → position:fixed 整体固定悬浮
   - 状态二：侧边栏高度 > 视口可用高度 → 在 wrapper 虚拟滚动容器内
     滑动，translateY 受顶部/底部边界约束，模块永不被截断
   ============================================================ */
#main .sidebar-sticky-wrap #sidebar {
    width: 100%;             /* static 时填满 wrapper */
}
#sidebar {
    z-index: 50;             /* 悬浮时不被内容区遮挡（导航 z-index 1000 仍在其上） */
}

/* ============================================================
   3. Navigation — 商务蓝通栏吸顶导航（站名 + 菜单 + 工具按钮）
   底色/文字走 --ml-nav-bg / --ml-nav-text 令牌：默认商务蓝 #2b5fa3，
   后台「导航底色」自定义后文字深浅自动适配。
   原「导航栏上方的头部条」已移除：站名并入导航左侧，
   明暗切换 / 侧边栏对调按钮并入导航右侧。
   ============================================================ */
#navigation {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1000;
    background: var(--ml-nav-bg);
    color: var(--ml-nav-text);
    margin-bottom: 24px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
[data-theme='dark'] #navigation {
    box-shadow: 0 2px 8px rgba(0,0,0,0.45);
}
/* 内层容器与正文列对齐：1110(1080 + 2×15) 与 #wrap 同宽同边距，
   通栏导航条上内容与文章卡片左右缘齐整 */
.nav-inner {
    box-sizing: border-box;
    max-width: 1110px;
    margin: 0 auto;
    padding: 0 15px;
    min-height: 52px;
    display: flex;
    align-items: stretch;
}
.site-brand {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    margin: 0;
    padding-right: 22px;
}
.site-brand a {
    font-size: 21px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.3px;
    color: var(--ml-nav-text);
}
.site-brand a:hover { opacity: 0.85; }

.sf-menu {
    display: flex;
    align-self: stretch;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style: none;
}
.sf-menu li { position: relative; display: flex; }
.sf-menu a {
    display: flex;
    align-items: center;
    padding: 0 18px;
    color: var(--ml-nav-text);
    font-size: 14.5px;
    line-height: 1.5;          /* 固定行高，避免受全局行高影响 */
    letter-spacing: 0.2px;
    white-space: nowrap;
    position: relative;
    transition: background 0.25s ease, color 0.25s ease;
}
/* 悬停：底色提亮的半透明白层，任何导航底色下都成立 */
.sf-menu a:hover { background: rgba(255,255,255,0.14); }
/* 当前选中 / 单篇文章所属分类：更亮的半透明色块整块填充，突出但不抢底色 */
.sf-menu .current-menu-item a,
.sf-menu .ml-post-category a {
    background: rgba(255,255,255,0.22);
    font-weight: 700;
}
/* 菜单下方粗线：强调色，悬停时向两侧展开，选中时保持可见 */
.sf-menu a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 10px;
    right: 10px;
    height: 4px;
    border-radius: 2px 2px 0 0;
    background: var(--ml-accent);
    transform: scaleX(0);
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.sf-menu a:hover::after { transform: scaleX(1); }
.sf-menu .current-menu-item a::after,
.sf-menu .ml-post-category a::after {
    transform: scaleX(1);
}

/* 导航右侧工具按钮 — 贴右缘、垂直居中 */
.page-tools {
    margin-left: auto;
    align-self: center;
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 14px;
}

/* 移动端菜单说明：≤768px 时站名与按钮占首行，菜单换行为横向滚动（见「9. Responsive」）
   v1.6.0 已移除永不触发的汉堡按钮（.navbar-toggle / #menu-toggle / .mobile-menu-open）相关代码 */

/* ============================================================
   4. Nav Search — 导航栏下方搜索模块（仅移动端显示）
   位于 #wrap 之外，自设与正文列一致的宽度与边距
   ============================================================ */
.nav-search {
    box-sizing: border-box;
    max-width: 1110px;
    margin: 0 auto 20px;
    padding: 0 15px;
}
.nav-search form {
    display: flex;
    gap: 0;
    background: var(--ml-box);
    border: 1px solid var(--ml-border);
    border-radius: var(--ml-radius);
    box-shadow: var(--ml-shadow);
    overflow: hidden;
}
.nav-search input[type="text"] {
    flex: 1;
    padding: 12px 18px;
    border: none;
    font-size: 15px;
    background: var(--ml-box);
    color: var(--ml-text);
    font-family: inherit;
    outline: none;
}
.nav-search input[type="text"]::placeholder {
    color: var(--ml-meta);
}
.nav-search button {
    padding: 12px 24px;
    border: none;
    background: var(--ml-nav-bg);
    color: var(--ml-nav-text);
    font-size: 16px;
    cursor: pointer;
    transition: opacity 0.25s, background 0.25s;
    font-family: inherit;
}
.nav-search button:hover {
    opacity: 0.85;
    background: var(--ml-link);
}

@media (max-width: 768px) {
    .nav-search {
        padding: 0 12px;
        margin-bottom: 14px;
    }
    .nav-search input[type="text"] {
        padding: 10px 14px;
        /* 16px 是底线：小于此值 iOS Safari 聚焦输入框时会把整页放大 */
        font-size: 16px;
    }
    .nav-search button {
        padding: 10px 18px;
        font-size: 15px;
    }
}

/* ============================================================
   5. Toolbar — 导航右侧明暗切换 + 侧边栏对调（SVG 线条图标）
   按钮固定白底浅色系：在任何导航底色（深色或自定义浅色）下都清晰
   ============================================================ */
.toolbar-btn {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dcdfe6;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s, background 0.2s;
    color: #333;
    padding: 0;
}
.toolbar-btn:hover {
    border-color: var(--ml-link);
    color: var(--ml-link);
}
.toolbar-btn svg { width: 16px; height: 16px; display: block; }
/* 主题切换按钮：按当前模式显示月亮（浅色时）/ 太阳（深色时） */
.toolbar-btn .ico-sun { display: none; }
[data-theme='dark'] .toolbar-btn .ico-moon { display: none; }
[data-theme='dark'] .toolbar-btn .ico-sun { display: block; }
/* 统一 SVG 线条图标样式：描边跟随文字色 */
.toolbar-btn svg,
.nav-search button svg,
.back-to-top svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.nav-search button svg { width: 17px; height: 17px; display: block; }

/* ============================================================
   6. Content — 文章列表/文章页
   ============================================================ */

/* ------------------------------------------------------------
   6.0 文章正文排版令牌（对齐公众号长文阅读节奏）
   只作用于 .entry-content 内部，不影响列表页/侧边栏/评论等其它模块。
   改这一处即可整体调字号/行距/段距/字距/配色；
   PC 与手机共用同一节奏，手机端仅在「9. Responsive」收敛段距与标题上距。
   ------------------------------------------------------------ */
:root {
    --ml-post-font-size: 17px;         /* 正文字号 */
    --ml-post-line-height: 2;          /* 行高：17 × 2 = 34px */
    --ml-post-letter-spacing: 0.3px;   /* 字距 */
    --ml-post-para-gap: 22px;          /* 段间距（无首行缩进，靠段距分段） */
    --ml-post-text: #2B2B2B;           /* 正文色 */
    --ml-post-strong: #1F3B34;         /* 加粗 / 强调 */
    --ml-post-heading: #1F3B34;        /* 正文小标题 */
    --ml-post-rule: #C4553B;           /* 标题竖线 / 提示卡边线 */
    --ml-post-muted: #9A9A9A;          /* 图注等辅助文字 */
    --ml-post-note-bg: #FBF1E6;        /* 提示卡（引用块）底色 */
    --ml-post-note-text: #8A3B25;      /* 提示卡文字 */
    --ml-post-note-line: 1.95;         /* 提示卡行高 */
}
/* 深色模式：保持同一组比例关系，只做明度反转，避免深色下正文发灰或刺眼 */
[data-theme='dark'] {
    --ml-post-text: #C9D4DD;
    --ml-post-strong: #E2EFE9;
    --ml-post-heading: #E2EFE9;
    --ml-post-rule: #C4553B;
    --ml-post-muted: #8598A6;
    --ml-post-note-bg: rgba(196, 85, 59, 0.13);
    --ml-post-note-text: #E8A58E;
}

.entry {
    background: var(--ml-box);
    border: 1px solid var(--ml-border);
    border-bottom: 2px solid var(--ml-accent);   /* 底部识别色条（可改 --ml-accent 统一换色） */
    border-radius: var(--ml-radius);
    padding: 24px 28px;
    margin-bottom: 18px;
    box-shadow: var(--ml-shadow);
    transition: background 0.3s, border-color 0.3s, box-shadow 0.3s;
}
/* 悬浮反馈只加深阴影，不做位移：避免鼠标扫过时卡片上下跳动 */
.entry:hover {
    box-shadow: var(--ml-shadow-hover);
}

/* 标题层级：列表标题 21px / 单篇标题 26px，字重 700，行高收紧 */
.entry h1 {
    font-size: 21px;
    line-height: 1.45;
    margin-bottom: 10px;
    font-weight: 700;
}
.post-title { color: var(--ml-title); }
.post-title:hover { color: var(--ml-link); }
.entry h1.post-title-single {
    font-size: 26px;
    line-height: 1.4;
    margin-bottom: 12px;
    letter-spacing: -0.1px;
}

.post-meta {
    font-size: 13px;
    color: var(--ml-meta);
    margin-bottom: 14px;
    line-height: 1.7;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.post-meta a { color: var(--ml-meta); }
.post-meta a:hover { color: var(--ml-link); }
.post-meta .meta-sep {
    color: var(--ml-border);
    margin: 0 8px;
}
.post-meta .meta-date { color: var(--ml-meta); }
/* 元信息项：图标 + 数值，图标尺寸用 em 随字号缩放，PC/移动端自动协调 */
.post-meta .meta-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
/* 多分类时在窄屏可换行，不溢出 */
.post-meta .meta-cats { flex-wrap: wrap; }
.post-meta .meta-icon {
    width: 0.95em;
    height: 0.95em;
    flex: none;
    opacity: .85;
}
.post-meta .meta-item a:hover .meta-icon { opacity: 1; }

/* ===== 正文基础：17px / 行高 2.0 / 字距 0.3px / 两端对齐 =====
   与公众号一致：不设首行缩进，段落之间用 22px 段距分隔。
   （旧版 single/page 的 2em 首行缩进已移除，图片段落不再需要例外规则。） */
.entry-content {
    font-size: var(--ml-post-font-size);
    line-height: var(--ml-post-line-height);
    letter-spacing: var(--ml-post-letter-spacing);
    color: var(--ml-post-text);
    text-align: justify;             /* 两端对齐，右侧齐整 */
    text-justify: inter-ideograph;   /* 中文按字符均匀分配间距（支持的浏览器） */
    overflow: hidden;
    word-wrap: break-word;
    overflow-wrap: break-word;
}
.entry-content p {
    margin: 0 0 var(--ml-post-para-gap);
    text-indent: 0;                  /* 兜底：抵消编辑器/插件注入的行内缩进 */
}
.entry-content > p:last-child,
.entry-content > ul:last-child,
.entry-content > ol:last-child { margin-bottom: 0; }
/* 强调：公众号做法是只换深绿、不加大字号 */
.entry-content strong,
.entry-content b {
    color: var(--ml-post-strong);
    font-weight: 700;
}

/* 小标题：19px / 行高 1.6 / 700 / 左竖线 4px（与公众号 h2 完全同一规格） */
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
    color: var(--ml-post-heading);
    font-weight: 700;
    line-height: 1.6;
    text-align: left;          /* 标题不跟随正文两端对齐 */
    scroll-margin-top: 70px;   /* 锚点跳转不被吸顶导航遮挡 */
}
.entry-content h2 {
    font-size: 19px;
    margin: 40px 0 18px;
    padding-left: 12px;
    border-left: 4px solid var(--ml-post-rule);
}
.entry-content h3 { font-size: 18px;  margin: 32px 0 14px; padding-left: 11px; border-left: 3px solid var(--ml-post-rule); }
.entry-content h4 { font-size: 17px;  margin: 28px 0 12px; }
.entry-content h5 { font-size: 16px;  margin: 24px 0 10px; color: var(--ml-post-strong); }
.entry-content h6 { font-size: 15px;  margin: 22px 0 10px; color: var(--ml-post-muted); }
.entry-content h2:first-child,
.entry-content h3:first-child { margin-top: 0; }
.entry-content ul, .entry-content ol { margin: 0 0 var(--ml-post-para-gap) 24px; }
.entry-content ul { list-style: disc; }
.entry-content ol { list-style: decimal; }
.entry-content li { margin-bottom: 8px; line-height: var(--ml-post-line-height); }
.entry-content li:last-child { margin-bottom: 0; }
/* ===== 内容溢出防护 =====
 * 确保文章/页面内任何元素都不会撑破容器导致页面错位
 */
.entry-content img,
.entry-content video,
.entry-content iframe,
.entry-content embed,
.entry-content object,
.entry-content svg {
    max-width: 100%;
    height: auto;
}
/* 表格：横向可滚动，但单元格内文本正常断词（原文 break-all 会让中文逐字断行、英文被腰斩） */
.entry-content table {
    width: 100%;
    max-width: 100%;
    margin: 16px 0;
    border-collapse: collapse;
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    font-size: 15px;
}
.entry-content table th,
.entry-content table td {
    padding: 9px 12px;
    border: 1px solid var(--ml-border);
    line-height: 1.75;      /* 与正文 2.0 节奏协调，表格内不过度松散 */
    overflow-wrap: break-word;
    word-break: normal;
}
.entry-content table thead th,
.entry-content table th {
    background: var(--ml-table-head-bg);
    color: var(--ml-title);
    font-weight: 700;
    text-align: left;
}
.entry-content table tbody tr:nth-child(even) { background: rgba(0,0,0,0.015); }
[data-theme='dark'] .entry-content table tbody tr:nth-child(even) { background: rgba(255,255,255,0.02); }
/* 代码块：保留缩进但允许长行折行 */
.entry-content pre {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: pre-wrap;
    overflow-wrap: break-word;
    letter-spacing: normal;     /* 代码等宽字体不加字距，避免错位 */
}
.entry-content code { overflow-wrap: break-word; letter-spacing: normal; }
/* 长链接：仅在必要时折行，不破坏英文单词 */
.entry-content a {
    overflow-wrap: break-word;
    word-break: normal;
}
/* 子元素统一 box-sizing */
.entry-content *,
.entry-content *::before,
.entry-content *::after {
    box-sizing: border-box;
}
/* 引用块 → 公众号「划重点」提示卡：米黄底 + 砖红左竖线 + 圆角 4px
   （中文斜体观感差，保持常规字形，靠底色与竖线区分层级） */
.entry-content blockquote {
    background: var(--ml-post-note-bg);
    margin: 0 0 26px;
    padding: 14px 18px;
    border-left: 4px solid var(--ml-post-rule);
    border-radius: 4px;
    color: var(--ml-post-note-text);
    font-size: 16px;
    line-height: var(--ml-post-note-line);
    text-align: left;
    font-style: normal;
}
.entry-content blockquote p { margin: 0 0 10px; }
.entry-content blockquote p:last-child { margin-bottom: 0; }
.entry-content blockquote cite {
    display: block;
    margin-top: 8px;
    font-size: 13px;
    font-style: normal;
    color: var(--ml-post-muted);
}
.entry-content pre, .entry-content code {
    background: var(--ml-code-bg);
    border-radius: 3px;
    font-size: 13px;
    font-family: "SF Mono", "Cascadia Mono", Consolas, Monaco, "Courier New", monospace;
}
.entry-content code { padding: 2px 6px; }
.entry-content pre { padding: 14px 16px; line-height: 1.65; }
.entry-content pre code { padding: 0; background: none; }

/* ===== 图片对齐 / 图注（WordPress 编辑器对齐图基础支持） ===== */
.entry-content img.alignleft,
.entry-content .alignleft img,
.entry-content .alignleft {
    float: left;
    margin: 6px 18px 12px 0;
    max-width: 100%;
}
.entry-content img.alignright,
.entry-content .alignright img,
.entry-content .alignright {
    float: right;
    margin: 6px 0 12px 18px;
    max-width: 100%;
}
.entry-content img.aligncenter,
.entry-content .aligncenter {
    display: block;
    margin: 22px auto;
    float: none;
}
.entry-content img.alignnone,
.entry-content .alignnone { margin: 22px 0; }
.entry-content .alignleft,
.entry-content .alignright,
.entry-content .aligncenter,
.entry-content .alignnone { max-width: 100%; }
.entry-content img {
    border-radius: 6px;
}
.entry-content figure,
.entry-content .wp-caption {
    max-width: 100%;
    margin: 22px 0;
}
.entry-content figure img,
.entry-content .wp-caption img { margin: 0; }
.entry-content figcaption,
.entry-content figure .wp-caption-text,
.entry-content .wp-caption-text {
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.7;
    color: var(--ml-post-muted);
    text-align: center;
}
/* 图集（Gallery） */
.entry-content .gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px;
    margin: 18px 0;
}
.entry-content .gallery-item { margin: 0; text-align: center; }
.entry-content .gallery-item img { width: 100%; height: auto; margin: 0; }

/* Thumbnail — 特色图片 120×120 右浮（v1.6.0 由 80px 放大） */
img.thumb {
    float: right;
    margin: 0 0 16px 18px;
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 3px;
}
.thumb-single {
    margin-top: 4px;
}

/* 面包屑导航 */
.breadcrumb {
    font-size: 13px;
    line-height: 1.7;
    color: var(--ml-meta);
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--ml-border);
}
.breadcrumb a { color: var(--ml-link); }
.breadcrumb a:hover { text-decoration: underline; }

/* Tags & Nav */
.post-tags {
    margin-top: 22px;
    padding-top: 14px;
    border-top: 1px solid var(--ml-border);
    font-size: 13px;
    line-height: 1.9;
    color: var(--ml-meta);
    word-break: break-word;
}
.post-tags a {
    color: var(--ml-link);
    background: var(--ml-code-bg);
    padding: 2px 8px;
    border-radius: 10px;
    margin: 0 2px;
    display: inline-block;
    transition: background 0.2s, color 0.2s;
}
.post-tags a:hover { background: var(--ml-link); color: #fff; }
.post-nav {
    margin-top: 20px;
    padding-top: 14px;
    border-top: 1px solid var(--ml-border);
    font-size: 14px;
}
.post-nav .prev { float: left; max-width: 46%; }
.post-nav .next { float: right; max-width: 46%; text-align: right; }
.post-nav a { color: var(--ml-link); }
.post-nav a:hover { text-decoration: underline; }

/* ===== 相关阅读（文章底部：优先同分类，无结果退化为同标签）===== */
.related-posts {
    margin-top: 22px;
    padding-top: 16px;
    border-top: 1px solid var(--ml-border);
}
.related-title {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
    color: var(--ml-title);
    margin-bottom: 12px;
}
.related-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.related-item { min-width: 0; }
.related-link {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 9px 11px;
    border: 1px solid var(--ml-border);
    border-radius: var(--ml-radius);
    background: var(--ml-box);
    color: var(--ml-text);
    transition: border-color 0.2s, background 0.2s, color 0.2s;
}
.related-link:hover {
    border-color: var(--ml-link);
    color: var(--ml-link);
    background: var(--ml-code-bg);
}
.related-name {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.related-date {
    flex-shrink: 0;
    font-size: 12px;
    color: var(--ml-meta);
}

/* Comments — 自定义评论区样式 */
.comments-area {
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--ml-border);
}

/* 评论标题 */
.comments-title {
    font-size: 17px;
    margin-bottom: 18px;
    color: var(--ml-title);
    font-weight: bold;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--ml-border);
}

/* 评论列表 */
.comment-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.comment-list .comment {
    margin-bottom: 0;
}
.comment-list .children {
    list-style: none;
    margin: 0 0 0 52px;
    padding: 0;
}

/* 单条评论卡片 */
.comment-body {
    display: flex;
    gap: 14px;
    padding: 16px 0;
    border-bottom: 1px dotted var(--ml-border);
}
.comment-list > .comment:last-child > .comment-body {
    border-bottom: none;
}

/* 头像 */
.comment-avatar {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
}
.avatar-img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid var(--ml-border);
}

/* 评论内容容器 */
.comment-content {
    flex: 1;
    min-width: 0;
}

/* 评论头部：作者 + 日期 + 回复链接 */
.comment-header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 8px;
    padding: 0;
}
.comment-author {
    font-weight: bold;
    font-size: 14px;
    color: var(--ml-title);
}
.comment-author a {
    color: var(--ml-title);
}
.comment-author a:hover {
    color: var(--ml-link);
}
.comment-meta {
    font-size: 12px;
    color: var(--ml-meta);
}
.comment-meta a {
    color: var(--ml-meta);
}
.comment-meta a:hover {
    color: var(--ml-link);
}

/* 回复链接 */
.comment-reply a {
    font-size: 12px;
    color: var(--ml-link);
    margin-left: auto;
    padding: 2px 8px;
    border: 1px solid var(--ml-border);
    border-radius: 3px;
    transition: background 0.2s, color 0.2s;
}
.comment-reply a:hover {
    background: var(--ml-nav-bg);
    color: var(--ml-nav-text);
    border-color: var(--ml-nav-bg);
}

/* 评论文本 */
.comment-text {
    font-size: 14px;
    line-height: 1.8;
    color: var(--ml-text);
    word-wrap: break-word;
    overflow-wrap: break-word;
}
.comment-text p {
    margin-bottom: 8px;
}
.comment-text p:last-child {
    margin-bottom: 0;
}
.comment-awaiting {
    display: block;
    font-size: 13px;
    color: var(--ml-warning);
    margin-bottom: 8px;
    font-style: normal;
}

/* 评论分页导航 */
.comment-nav {
    margin: 16px 0;
    padding: 10px 0;
    border-top: 1px dotted var(--ml-border);
    font-size: 14px;
    overflow: hidden;
}
.comment-nav .prev { float: left; }
.comment-nav .next { float: right; }
.comment-nav a { color: var(--ml-link); }

/* 评论已关闭 */
.comments-closed {
    font-size: 14px;
    color: var(--ml-meta);
    padding: 14px 0;
}

/* ===== 评论表单 ===== */
.comment-reply-title {
    font-size: 17px;
    margin: 20px 0 12px;
    color: var(--ml-title);
    font-weight: bold;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--ml-border);
}
.comment-reply-title small {
    font-size: 13px;
    font-weight: normal;
}
.comment-reply-title small a {
    color: var(--ml-meta);
    margin-left: 8px;
}
.comment-reply-title small a:hover {
    color: var(--ml-link);
}

/* 表单注释 */
.comment-notes {
    font-size: 13px;
    color: var(--ml-meta);
    margin-bottom: 14px;
}
.required { color: var(--ml-danger); }

/* 已登录提示 */
.logged-in-as {
    font-size: 13px;
    color: var(--ml-meta);
    margin-bottom: 14px;
}
.logged-in-as a { color: var(--ml-link); }

/* 评论输入框 */
.comment-form-comment textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 12px 14px;
    border: 1px solid var(--ml-border);
    border-radius: var(--ml-radius);
    font-size: 14px;
    line-height: 1.7;
    background: var(--ml-box);
    color: var(--ml-text);
    font-family: inherit;
    resize: vertical;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.comment-form-comment textarea:focus {
    outline: none;
    border-color: var(--ml-link);
    box-shadow: 0 0 0 3px var(--ml-focus-ring);
}

/* 评论表单：统一用 flex 排列，窄屏自动换行，不再依赖 inline-block + 固定 200px */
.comment-form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: flex-start;
}
.comment-form > .comment-notes,
.comment-form > .logged-in-as,
.comment-form > .comment-form-comment,
.comment-form > .comment-form-cookies-consent,
.comment-form > .form-submit { flex: 1 0 100%; }
.comment-form-author,
.comment-form-email,
.comment-form-url {
    flex: 1 1 180px;
    margin: 0;
}
.comment-form-author input,
.comment-form-email input,
.comment-form-url input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--ml-border);
    border-radius: var(--ml-radius);
    font-size: 14px;
    background: var(--ml-box);
    color: var(--ml-text);
    font-family: inherit;
    box-sizing: border-box;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.comment-form-author input:focus,
.comment-form-email input:focus,
.comment-form-url input:focus {
    outline: none;
    border-color: var(--ml-link);
    box-shadow: 0 0 0 3px var(--ml-focus-ring);
}
/* 表单注释 / 已登录提示 / 表单内段落间距（.comment-form 为 flex 容器，间距由 gap 控制） */
.comment-form .comment-notes,
.comment-form .logged-in-as { margin: 0; }

/* 提交按钮 */
.submit-btn {
    display: inline-block;
    padding: 10px 28px;
    background: var(--ml-nav-bg);
    color: var(--ml-nav-text);
    border: none;
    border-radius: var(--ml-radius);
    font-size: 14px;
    font-family: inherit;
    cursor: pointer;
    transition: opacity 0.2s;
}
.submit-btn:hover {
    opacity: 0.88;
}

/* Pagination */
.pagination {
    text-align: center;
    margin: 24px 0 8px;
    line-height: 1;
}
.pagination .page-numbers {
    display: inline-block;
    padding: 8px 13px;
    margin: 0 3px 6px;
    border: 1px solid var(--ml-border);
    border-radius: var(--ml-radius-lg);
    background: var(--ml-box);
    color: var(--ml-text);
    font-size: 14px;
    line-height: 1.2;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.pagination .current {
    background: var(--ml-nav-bg);
    color: var(--ml-nav-text);
    border-color: var(--ml-nav-bg);
    font-weight: 700;
}
.pagination a.page-numbers:hover {
    color: var(--ml-link);
    border-color: var(--ml-link);
    background: var(--ml-box);
}
/* 省略号不显示边框盒子 */
.pagination .page-numbers.dots,
.pagination .page-numbers.dots:hover {
    border-color: transparent;
    background: transparent;
    padding: 8px 4px;
}

/* In-article page links — 长文章分页导航 */
.page-links {
    text-align: center;
    margin: 24px 0 10px;
    padding-top: 18px;
    border-top: 1px solid var(--ml-border);
    clear: both;
}
.page-links-title {
    font-size: 14px;
    color: var(--ml-meta);
    margin-right: 8px;
    vertical-align: middle;
}
.page-links .page-link {
    display: inline-block;
    min-width: 30px;
    padding: 6px 9px;
    margin: 0 2px 6px;
    border: 1px solid var(--ml-border);
    border-radius: var(--ml-radius-lg);
    background: var(--ml-box);
    color: var(--ml-text);
    font-size: 13px;
    line-height: 1.2;
    text-align: center;
    vertical-align: middle;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.page-links .page-link:hover {
    background: var(--ml-link);
    color: #fff;
    border-color: var(--ml-link);
}
.page-links > span:not(.page-links-title) .page-link {
    background: var(--ml-nav-bg);
    color: var(--ml-nav-text);
    border-color: var(--ml-nav-bg);
    font-weight: 700;
}
/* 深色模式 */
[data-theme='dark'] .page-links .page-link:hover {
    background: var(--ml-link);
    color: #fff;
}

/* Archive header — 窄条式：紧凑高度、内容垂直居中、计数为弱化胶囊。
   底色/描边沿用 .entry 卡片体系，只收紧内边距并用 flex 居中。 */
.archive-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 11px 18px;
    margin-bottom: 14px;
}
.archive-header h1 {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
    font-size: 16px;
    line-height: 1.5;
    color: var(--ml-title);
}
.archive-header h1 .meta-icon {
    width: 1.05em;
    height: 1.05em;
    flex: none;
    color: var(--ml-accent);   /* 与底部识别色条同色，呼应主题 */
}
.archive-desc { width: 100%; font-size: 13px; line-height: 1.7; color: var(--ml-meta); margin-top: 4px; }
.archive-count {
    font-size: 12px;
    font-weight: normal;
    line-height: 1.5;
    color: var(--ml-meta);
    padding: 1px 9px;
    border: 1px solid var(--ml-border);
    border-radius: 999px;      /* 胶囊计数，垂直节奏由 flex 保证 */
}

/* ============================================================
   7. Sidebar
   ============================================================ */
.sidebar-box {
    background: var(--ml-box);
    border: 1px solid var(--ml-border);
    border-radius: var(--ml-radius);
    margin-bottom: 12px;
    padding: 0;
    box-shadow: var(--ml-shadow);
    overflow: hidden;
    transition: box-shadow 0.3s;
}
/* 悬浮只加深阴影，不做位移（侧边栏模块不做上下跳动） */
.sidebar-box:hover {
    box-shadow: var(--ml-shadow-hover);
}
/* 经典小工具标题为 h4（register_sidebar 的 before_title），
   区块小工具自带 h2/h3/label 形式的 *__label，一并收敛成同一条标题栏 */
.sidebar-box h4,
.sidebar-box [class$="__label"] {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
    padding: 11px 14px;
    background: var(--ml-sidebar-title-bg);
    border-bottom: 1px solid var(--ml-border);
    border-left: 4px solid var(--ml-sidebar-title-border);
    color: var(--ml-title);
}
.sidebar-box ul {
    padding: 8px 14px;
}
/* 允许换行：长分类名/长标题不再被强制单行截断成省略号 */
/* margin:0 抹平区块列表小工具自带的缩进/下边距，保持分隔虚线节奏一致 */
.sidebar-box li {
    margin: 0;
    padding: 7px 0;
    border-bottom: 1px dotted var(--ml-border);
    font-size: 14px;
    line-height: 1.6;
    word-break: break-word;
}
.sidebar-box li:last-child { border-bottom: none; }
.sidebar-box li a { color: var(--ml-text); }
.sidebar-box li a:hover { color: var(--ml-link); }
/* 分类/存档计数括号弱化显示 */
.sidebar-box .count {
    color: var(--ml-meta);
    font-size: 12px;
    font-weight: normal;
}

/* 小工具区为空时的引导提示 — 仅管理员可见（见 sidebar.php） */
.sidebar-empty-hint {
    padding: 14px;
    font-size: 13px;
    line-height: 1.8;
    color: var(--ml-meta);
}
.sidebar-empty-hint a { color: var(--ml-link); }

/* ============================================================
   7.1 后台小工具（Widgets）样式
   .widget / .widget_xxx 两个 class 由 register_sidebar 的 before_widget
   中的 %2$s 注入（见 functions.php），侧边栏现在只渲染小工具。
   ============================================================ */
/* 小工具内容统一内边距（标题 h4、列表 ul、搜索表单已有专属样式，不再重复） */
.sidebar-box.widget > *:not(h4):not(ul):not(form) {
    padding: 10px 14px;
}
/* 小工具列表：沿用 .sidebar-box ul / li 的同一套内边距与换行策略 */
.sidebar-box.widget ul { padding: 8px 14px; }
/* 文本 / 自定义 HTML / 图片 小工具 */
.sidebar-box.widget .textwidget {
    font-size: 14px;
    line-height: 1.8;
    color: var(--ml-text);
    word-wrap: break-word;
    overflow-wrap: break-word;
}
.sidebar-box.widget .textwidget p { margin-bottom: 10px; }
.sidebar-box.widget .textwidget a { color: var(--ml-link); }
.sidebar-box.widget .textwidget img {
    max-width: 100%;
    height: auto;
    border-radius: var(--ml-radius);
}
/* 标签云小工具 */
.sidebar-box.widget .tagcloud {
    line-height: 2.2;
    font-size: 14px;
}
.sidebar-box.widget .tagcloud a {
    color: var(--ml-link);
    text-decoration: none;
}
.sidebar-box.widget .tagcloud a:hover { opacity: 0.8; }
/* 搜索 — 经典搜索小工具与区块「搜索」(core/search) 共用同一套外观：
   标题栏通铺，下面输入框 + 按钮横向贴合排列 */
.sidebar-box.widget_search form,
.sidebar-box .wp-block-search__inside-wrapper {
    display: flex;
    gap: 0;
    padding: 10px 12px;
}
.sidebar-box.widget > .wp-block-search { padding: 0; }
.sidebar-box.widget_search label {
    flex: 1;
    min-width: 0;
    display: block;
}
.sidebar-box.widget_search input[type="search"],
.sidebar-box.widget_search input[type="text"],
.sidebar-box .wp-block-search__input {
    width: 100%;
    flex: 1;
    min-width: 0;
    padding: 8px 12px;
    border: 1px solid var(--ml-border);
    border-right: none;
    border-radius: var(--ml-radius) 0 0 var(--ml-radius);
    font-size: 14px;
    background: var(--ml-box);
    color: var(--ml-text);
    font-family: inherit;
    outline: none;
    box-sizing: border-box;
}
.sidebar-box.widget_search input[type="search"]:focus,
.sidebar-box.widget_search input[type="text"]:focus,
.sidebar-box .wp-block-search__input:focus {
    border-color: var(--ml-link);
}
.sidebar-box.widget_search input[type="submit"],
.sidebar-box .wp-block-search__button {
    padding: 8px 16px;
    border: 1px solid var(--ml-nav-bg);
    border-radius: 0 var(--ml-radius) var(--ml-radius) 0;
    background: var(--ml-nav-bg);
    color: var(--ml-nav-text);
    font-size: 14px;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
    transition: opacity 0.25s;
}
.sidebar-box.widget_search input[type="submit"]:hover,
.sidebar-box .wp-block-search__button:hover { opacity: 0.85; }
.sidebar-box.widget_search input::placeholder,
.sidebar-box .wp-block-search__input::placeholder { color: var(--ml-meta); }
/* 下拉型小工具（分类/存档下拉） */
.sidebar-box.widget select {
    width: 100%;
    max-width: 100%;
    margin: 8px 0;
    padding: 7px 8px;
    border: 1px solid var(--ml-border);
    border-radius: var(--ml-radius);
    background: var(--ml-box);
    color: var(--ml-text);
    font-family: inherit;
    font-size: 14px;
    outline: none;
    box-sizing: border-box;
}
/* 日历小工具 */
.sidebar-box.widget_calendar .calendar_wrap { padding: 10px 12px; }
.sidebar-box.widget_calendar table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.sidebar-box.widget_calendar caption {
    padding-bottom: 8px;
    font-weight: bold;
    color: var(--ml-title);
}
.sidebar-box.widget_calendar th,
.sidebar-box.widget_calendar td {
    padding: 5px 2px;
    text-align: center;
    border: 1px solid var(--ml-border);
    line-height: 1.5;
}
.sidebar-box.widget_calendar td a {
    color: var(--ml-link);
    font-weight: bold;
}
.sidebar-box.widget_calendar #today {
    background: var(--ml-sidebar-title-bg);
    font-weight: bold;
    color: var(--ml-title);
}
/* 小工具内链接 / 次要文字统一配色 */
.sidebar-box.widget a { color: var(--ml-link); }
.sidebar-box.widget .widget-title { color: var(--ml-title); }

/* ============================================================
   7.5. Post Nav Arrows — 单篇文章翻页浮动箭头
   浅灰竖圆角长方形底板 + CSS 线条箭头（边框旋转绘制）
   配色走 --ml-arrow-bg / --ml-arrow-icon 局部变量（深色模式见下方覆盖）
   ============================================================ */
.post-nav-arrow {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    z-index: 999;
    width: 56px;
    height: 128px;
    border-radius: 10px;
    background: var(--ml-arrow-bg, #d5d8dc);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.35s ease, transform 0.3s ease, background 0.25s;
    box-shadow: 0 2px 10px rgba(0,0,0,0.10);
    user-select: none;
}
/* 线条箭头 — 两条边框旋转 45° 形成的 < 和 > */
.post-nav-arrow::after {
    content: '';
    display: block;
    width: 13px;
    height: 13px;
    border: 0 solid var(--ml-arrow-icon, #6b7280);
    transition: border-color 0.25s;
}
.post-nav-arrow-left::after {
    border-bottom-width: 2.5px;
    border-left-width: 2.5px;
    transform: rotate(45deg);
    margin-right: 4px;  /* 视觉居中微调 */
}
.post-nav-arrow-right::after {
    border-top-width: 2.5px;
    border-right-width: 2.5px;
    transform: rotate(45deg);
    margin-left: 4px;
}
.post-nav-arrow.visible {
    opacity: 0.92;
    pointer-events: auto;
}
.post-nav-arrow:hover {
    opacity: 1;
    transform: translateY(-50%) scale(1.05);
    background: var(--ml-link);
    box-shadow: 0 4px 16px rgba(0,0,0,0.16);
}
.post-nav-arrow:hover::after {
    border-color: #fff;
}
/* 深色模式 — 底板取边框色阶，图标用浅灰蓝，不刺眼 */
[data-theme='dark'] .post-nav-arrow {
    --ml-arrow-bg: #253d5a;
    --ml-arrow-icon: #c3d0de;
}
.post-nav-arrow-left {
    left: 20px;
    /* 贴在容器(1110px)边框外沿；窗口较窄放不下时退到视口边缘 10px 处 */
    left: max(10px, calc((100vw - 1110px) / 2 - 71px));
}
.post-nav-arrow-right {
    right: 20px;
    right: max(10px, calc((100vw - 1110px) / 2 - 71px));
}

/* 手机端缩小箭头，贴近边缘 */
@media (max-width: 768px) {
    .post-nav-arrow {
        width: 42px;
        height: 84px;
    }
    .post-nav-arrow::after {
        width: 10px;
        height: 10px;
    }
    .post-nav-arrow-left {
        left: 6px;
    }
    .post-nav-arrow-right {
        right: 6px;
    }
}

/* ============================================================
   7.6. Back to Top — 返回顶部浮动按钮
   滚动超过一屏后浮现；颜色跟随导航底色，无 JS 时点 #top 锚点也可用
   ============================================================ */
.back-to-top {
    position: fixed;
    right: 24px;
    bottom: 28px;
    z-index: 998;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--ml-nav-bg);
    color: var(--ml-nav-text);
    box-shadow: 0 3px 14px rgba(0,0,0,0.18);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity 0.3s ease, transform 0.3s ease, background 0.25s;
}
.back-to-top svg { width: 18px; height: 18px; }
.back-to-top.visible {
    opacity: 0.9;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}
.back-to-top:hover {
    opacity: 1;
    background: var(--ml-link);
    transform: translateY(-2px);
}
@media (max-width: 768px) {
    .back-to-top {
        right: 14px;
        bottom: 18px;
        width: 38px;
        height: 38px;
    }
    .back-to-top svg { width: 16px; height: 16px; }
    .related-list { grid-template-columns: 1fr; }
}
/* 打印时不输出浮动元素 */
@media print {
    .back-to-top,
    .post-nav-arrow,
    .page-tools,
    #navigation { display: none !important; }
    .entry { box-shadow: none; border: 1px solid #ddd; }
    body { background: #fff; }
}

/* ============================================================
   8. Footer — 纯白通栏页脚（v1.7.4），延伸至屏幕两侧，
   内容列仍与正文对齐；深灰文字，明暗两种模式下保持一致。
   ============================================================ */
#footer {
    text-align: center;
    padding: 20px 15px;
    background: #FFFFFF;
    color: #555555;
    border-top: 1px solid #e8e8e8;
    font-size: 13px;
    line-height: 1.9;
}
.footer-inner { max-width: 1080px; margin: 0 auto; }
#footer p { margin: 0; }
/* 链接固定商务蓝：页脚恒为白底，不随深色模式的浅蓝链接令牌走，保证可读 */
#footer a { color: var(--ml-nav-bg); }
#footer a:hover { text-decoration: underline; opacity: 0.8; }

/* ============================================================
   9. Responsive
   ============================================================ */
@media (max-width: 1080px) {
    #main .content { flex: 1 1 65%; }
    #main .sidebar, #main .sidebar-sticky-wrap { flex: 0 1 32%; }
}
@media (max-width: 768px) {
    /* 窄屏安全边距（避免卡片贴死屏幕边缘） */
    #wrap { padding: 0 12px; }
    #main { flex-direction: column; gap: 0; }
    #main .content, #main .sidebar, #main .sidebar-sticky-wrap {
        flex: 1 1 100%;
        width: 100%;
        margin: 0 0 20px;
    }
    #main .sidebar-sticky-wrap #sidebar { width: 100%; }
    #main.sidebar-left { flex-direction: column; }
    #navigation { margin-bottom: 12px; }
    /* 移动端导航两行式：首行 站名(左) + 工具按钮(右) 同行等高，次行菜单横向滚动。
       用 order + flex-basis:100% 锁定菜单独占次行，防止菜单换行时把按钮挤到右下角 */
    .nav-inner { flex-wrap: wrap; padding: 0 12px; min-height: 46px; }
    .site-brand { order: 1; padding: 10px 10px 10px 0; max-width: calc(100% - 84px); }
    .site-brand a {
        font-size: 18px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        display: block;
    }
    .page-tools { order: 2; flex: none; gap: 6px; padding-left: 8px; }
    /* 移动端菜单：始终可见，独占次行横向滚动 */
    .sf-menu {
        display: flex !important;
        flex-wrap: nowrap;
        order: 3;
        flex: 1 0 100%;
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
        white-space: nowrap;
        padding: 0 4px;
    }
    .sf-menu::-webkit-scrollbar { display: none; }
    .sf-menu li { flex-shrink: 0; width: auto; }
    .sf-menu a { padding: 11px 14px; white-space: nowrap; }
    .sf-menu a::after { left: 6px; right: 6px; }
    /* 移动端隐藏侧边栏对调按钮 */
    #swap-sidebar { display: none; }
    .entry { padding: 18px 16px; }
    /* 归档窄条头部移动端同步收紧，保持垂直居中的紧凑比例 */
    .archive-header { padding: 10px 14px; }
    .archive-header h1 { font-size: 15px; }
    .entry h1 { font-size: 19px; }
    .entry h1.post-title-single { font-size: 21px; }
    /* 手机端与公众号同为 17px / 行高 2.0 / 字距 0.3px：字号行距保持原样，
       只把段距收到 20px、标题上距收敛，避免窄屏留白过松 */
    .entry-content { --ml-post-para-gap: 20px; }
    .entry-content h2 { margin: 26px 0 14px; }
    .entry-content h3 { margin: 22px 0 12px; }
    .entry-content h4 { margin: 20px 0 10px; }
    .entry-content blockquote { margin-bottom: 20px; padding: 12px 14px; }
    img.thumb { width: 60px; height: 60px; }

    /* 移动端评论适配 */
    .comment-body { gap: 10px; padding: 14px 0; }
    .comment-avatar { width: 36px; height: 36px; }
    .avatar-img { width: 36px; height: 36px; }
    .comment-list .children { margin-left: 24px; }
    .comment-header { gap: 8px; }
    .comment-form-author,
    .comment-form-email,
    .comment-form-url { flex: 1 1 100%; }
    .comment-reply a { margin-left: 0; }

    /* 移动端单篇文章 — 翻页链接卡片化 */
    .post-nav {
        display: flex;
        flex-direction: column;
        gap: 10px;
        border-top: none;
        padding-top: 0;
        margin-top: 24px;
    }
    .post-nav .prev,
    .post-nav .next {
        float: none;
        display: block;
        max-width: 100%;
        padding: 14px 16px;
        background: var(--ml-box);
        border: 1px solid var(--ml-border);
        border-radius: var(--ml-radius);
        font-size: 15px;
        line-height: 1.5;
        text-align: left;
        box-shadow: var(--ml-shadow);
    }
    .post-nav .prev {
        border-left: 4px solid var(--ml-nav-bg);
    }
    .post-nav .next {
        border-right: 4px solid var(--ml-nav-bg);
        text-align: right;
    }
    .post-nav .prev a,
    .post-nav .next a {
        color: var(--ml-text);
        text-decoration: none;
    }

    /* 手机端侧边栏策略：列表页/文章页继续整体隐藏（阅读优先，搜索走导航下方那条），
       单页等仍会显示侧边栏的模板里，小工具全宽堆叠、表单控件守住 16px 字号底线 */
    .sidebar-box input[type="search"],
    .sidebar-box input[type="text"],
    .sidebar-box select {
        font-size: 16px;
    }
    /* 日历/图片/嵌入内容等小工具在窄屏下不得撑破卡片 */
    .sidebar-box embed,
    .sidebar-box iframe,
    .sidebar-box object,
    .sidebar-box video {
        max-width: 100%;
    }

    /* 移动端列表页 + 单篇文章页隐藏侧边栏全部模块 */
    .home .sidebar,
    .archive .sidebar,
    .search .sidebar,
    .blog .sidebar,
    .single .sidebar {
        display: none;
    }
}
@media (min-width: 769px) {
    .sf-menu { display: flex !important; }
    /* PC 端隐藏导航下方搜索模块，改用侧边栏搜索 */
    .nav-search { display: none; }
}

/* ============================================================
   9.1 无障碍与动效偏好
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
    .entry:hover,
    .sidebar-box:hover { box-shadow: var(--ml-shadow); }
    .post-nav-arrow:hover { transform: translateY(-50%); }
}

/* ============================================================
   10. Dark Mode Override (Deep Blue)
   说明：颜色类差异已全部收敛到 --ml-* 设计令牌（见 functions.php 的
   moonlight_dynamic_css），此处只保留无法用颜色变量表达的少量规则。
   ============================================================ */
/* 深色下卡片底色与页面底色接近，靠边框区分层次 */
[data-theme='dark'] .entry,
[data-theme='dark'] .sidebar-box { border-color: var(--ml-border); }
[data-theme='dark'] .comment-body { border-bottom-color: rgba(255,255,255,0.06); }
[data-theme='dark'] .comments-title,
[data-theme='dark'] .comment-reply-title { border-bottom-color: rgba(255,255,255,0.08); }
[data-theme='dark'] .comment-nav { border-top-color: rgba(255,255,255,0.06); }
[data-theme='dark'] .comment-reply a { border-color: rgba(255,255,255,0.12); }
[data-theme='dark'] .comment-reply a:hover {
    background: var(--ml-nav-bg);
    color: var(--ml-nav-text);
    border-color: var(--ml-nav-bg);
}

/* ============================================================
   11. 列表文章卡片（v1.7.4）— 白色底、无四边框，
   条目之间以 1px 实线分隔（色深易辨），阅读节奏更轻。
   两列 flex 布局，封面图绝对定位铺满列高，保证与文字列等高。
   ============================================================ */
.post-card {
    display: flex;
    align-items: stretch;
    gap: 20px;
    background: var(--ml-box);
    padding: 20px 24px 18px;
    border-bottom: 1px solid #D5DAE1;
    position: relative;
    transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}
[data-theme='dark'] .post-card { border-bottom-color: #35537e; }
/* 悬停浮起 — 条目轻抬 4px + 柔和投影 + 圆角，与相邻文章拉开层次；
   阴影走 --ml-shadow-hover 令牌，深色模式自动适配，静止态外观不变 */
.post-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.12), 0 2px 6px rgba(0,0,0,0.06);
    border-bottom-color: transparent;
    border-radius: 8px;
    z-index: 2;
}
[data-theme='dark'] .post-card:hover {
    box-shadow: 0 10px 24px rgba(0,0,0,0.45), 0 2px 6px rgba(0,0,0,0.35);
}
.post-card-text {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.post-card-text .post-meta { margin: 0; line-height: 1.6; }
.post-card-title {
    font-size: 19.5px;
    font-weight: 700;
    line-height: 1.45;
    margin: 7px 0 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.post-card-text .post-card-title + .post-meta { margin-top: 6px; }
.post-card-excerpt {
    margin-top: 9px;
    font-size: 14.5px;
    line-height: 1.75;
    color: var(--ml-text);
}
.post-card-excerpt p {
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.post-card-thumb {
    position: relative;
    flex: 0 0 168px;
    align-self: stretch;
    border-radius: 5px;
    overflow: hidden;
    display: block;
}
.post-card-thumb img.thumb {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    float: none;
    object-fit: cover;
    border-radius: 5px;
    display: block;
    transition: transform .4s ease;
}
.post-card:hover .post-card-thumb img.thumb { transform: scale(1.05); }
.post-card.thumb-left .post-card-thumb { order: -1; }
/* 有封面时文字列给出下限高度，避免卡片过矮导致封面被压扁 */
.post-card:not(.no-thumb) .post-card-text { min-height: 118px; }
@media (max-width: 768px) {
    .post-card { padding: 16px 14px 14px; gap: 12px; }
    .post-card-thumb { flex-basis: 104px; }
    .post-card:not(.no-thumb) .post-card-text { min-height: 88px; }
    .post-card-title { font-size: 16.5px; }
    .post-card-excerpt { font-size: 13px; line-height: 1.65; }
    .post-card-excerpt p { -webkit-line-clamp: 2; line-clamp: 2; }
    .post-card-text .post-meta { font-size: 12px; }
}