/* ================= 核心 CSS 变量 (Vitepress 风格) ================= */
:root {
    --vp-c-bg: #ffffff;
    --vp-c-bg-alt: #f6f6f7;
    --vp-c-divider: #e2e2e3;
    --vp-c-text-1: #3c3c43;
    --vp-c-text-2: #3c3c43c7;
    --vp-c-text-3: #3c3c4399;
    --vp-c-brand: #3451b2;
    --vp-c-brand-light: #3a5ccc;
    --vp-nav-height: 64px;
    --vp-sidebar-width: 272px;
    --vp-toc-width: 300px;
    --vp-font-family-base: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --vp-font-family-mono: "JetBrains Mono", source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
}

@media (prefers-color-scheme: dark) {
    :root {
        --vp-c-bg: #1e1e20;
        --vp-c-bg-alt: #161618;
        --vp-c-divider: #32363f;
        --vp-c-text-1: #fffff5db;
        --vp-c-text-2: #ebebf599;
        --vp-c-text-3: #ebebf566;
        --vp-c-brand: #a8b1ff;
    }
}

html {
    box-sizing: border-box;
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--vp-nav-height) + 24px);
}

/* ================= 首次加载进度条 =================
   简约的屏幕居中横线，跟随主题底色，加载完成后淡出。
   仅在硬加载（页面刷新/首次进入）时显示，SPA hash 路由切换不触发。 */
.app-loader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--vp-c-bg);
    transition: opacity 0.5s ease, visibility 0.5s ease;
}
.app-loader.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.app-loader-track {
    width: 128px;
    height: 2px;
    background-color: var(--vp-c-divider);
    border-radius: 999px;
    overflow: hidden;
    position: relative;
}
.app-loader-thumb {
    position: absolute;
    top: 0;
    left: 0;
    width: 36%;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, var(--vp-c-brand), transparent);
    animation: app-loader-slide 1.4s ease-in-out infinite;
}
@keyframes app-loader-slide {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(380%); }
}
@media (prefers-reduced-motion: reduce) {
    .app-loader-thumb { animation: none; opacity: 0.6; }
}

*,
*::before,
*::after {
    box-sizing: inherit;
}

body {
    margin: 0;
    padding: 0;
    font-family: var(--vp-font-family-base);
    color: var(--vp-c-text-1);
    background-color: var(--vp-c-bg);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

/* ================= 布局系统 & 顶部导航 ================= */
.vp-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--vp-nav-height);
    background-color: var(--vp-c-bg);
    border-bottom: 1px solid var(--vp-c-divider);
    z-index: 40;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 32px;
}

.vp-nav .logo {
    font-weight: 600;
    font-size: 1.2rem;
    display: flex;
    align-items: center;
    gap: 8px;
}

.vp-nav .logo svg {
    width: 24px;
    height: 24px;
    fill: var(--vp-c-brand);
}

/* 顶部操作区 (搜索 + 移动端菜单) */
.nav-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.search-placeholder {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9rem;
    color: var(--vp-c-text-3);
    background: var(--vp-c-bg-alt);
    padding: 6px 12px;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.2s;
}

.search-placeholder:hover {
    background: var(--vp-c-divider);
}

.mobile-menu-btn {
    display: none;
    background: none;
    border: none;
    color: var(--vp-c-text-1);
    cursor: pointer;
    padding: 4px;
}

.mobile-backdrop {
    display: none;
    position: fixed;
    top: var(--vp-nav-height);
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 25;
    backdrop-filter: blur(2px);
    transition: opacity 0.3s;
    opacity: 0;
    pointer-events: none;
}

.mobile-backdrop.show {
    opacity: 1;
    pointer-events: auto;
}

.vp-layout {
    padding-top: var(--vp-nav-height);
    display: flex;
    max-width: 100vw;
    margin: 0 auto;
}

/* 左侧栏 */
.vp-sidebar {
    width: var(--vp-sidebar-width);
    position: fixed;
    top: var(--vp-nav-height);
    bottom: 0;
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--vp-c-divider);
    background-color: var(--vp-c-bg);
    overflow-x: hidden;
    z-index: 30;
    transition: transform 0.3s ease;
}

/* 一键展开/收缩控制栏 */
.sidebar-controls {
    display: flex;
    gap: 8px;
    padding: 16px 32px 0 32px;
}

.sidebar-controls button {
    flex: 1;
    background: var(--vp-c-bg-alt);
    border: 1px solid var(--vp-c-divider);
    color: var(--vp-c-text-2);
    padding: 6px 0;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.8rem;
    transition: background 0.2s, color 0.2s;
}

.sidebar-controls button:hover {
    background: var(--vp-c-brand-light);
    color: white;
    border-color: var(--vp-c-brand-light);
}

@media (prefers-color-scheme: dark) {
    .sidebar-controls button:hover {
        background: var(--vp-c-brand);
        color: #000;
        border-color: var(--vp-c-brand);
    }
}

.sidebar-menu-container {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 16px 16px 16px 32px;
    scrollbar-width: thin;
}

.sidebar-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;

}

.sidebar-footer .sidebar-footer-text {
    padding: 16px 32px;
    border-top: 1px solid var(--vp-c-divider);
    font-size: 0.8rem;
    color: var(--vp-c-text-3);
    text-align: left;
    line-height: 1.6;
}

.sidebar-footer .sidebar-footer-toggle {
    cursor: pointer;
    color: var(--vp-c-text-3);
    font-size: 1rem;
    transition: color 0.2s;
    margin-right: 12px;
}

.sidebar-footer a {
    color: var(--vp-c-text-3);
    text-decoration: none;
}



.sidebar-footer a:hover {
    color: var(--vp-c-brand);
}

.sidebar-resizer {
    position: absolute;
    top: 0;
    right: -2px;
    bottom: 0;
    width: 6px;
    cursor: col-resize;
    z-index: 10;
    transition: background-color 0.2s;
}

.sidebar-resizer:hover,
.sidebar-resizer.dragging {
    background-color: var(--vp-c-brand);
}

.vp-main {
    margin-left: var(--vp-sidebar-width);
    margin-right: var(--vp-toc-width);
    flex: 1;
    min-width: 0;
    padding: 48px 64px 96px;
    transition: margin-left 0.3s ease, margin-right 0.3s ease;
}

.vp-main-inner {
    max-width: 1200px;
    margin: 0 auto;
}

.vp-aside {
    width: var(--vp-toc-width);
    position: fixed;
    top: var(--vp-nav-height);
    bottom: 0;
    right: max(0px, calc((100vw - 100vw) / 2));
    overflow-y: auto;
    padding: 48px 32px 96px 32px;
    scrollbar-width: thin;
}

/* ================= 侧边菜单逻辑 ================= */
.sidebar-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sidebar-menu li {
    margin-top: 4px;
}

.dir-group details summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 12px;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--vp-c-text-1);
    cursor: pointer;
    user-select: none;
    border-radius: 6px;
    transition: background-color 0.2s;
}

.dir-group details summary:hover {
    background-color: var(--vp-c-bg-alt);
}

.dir-group details summary::-webkit-details-marker {
    display: none;
}

.dir-group details summary::after {
    content: "▸";
    font-size: 1rem;
    color: var(--vp-c-text-3);
    transition: transform 0.2s;
}

.dir-group details[open]>summary::after {
    transform: rotate(90deg);
}

.nested-menu {
    padding-left: 12px !important;
    margin-top: 4px;
    border-left: 1px solid var(--vp-c-divider);
    margin-left: 6px;
}

.sidebar-menu a {
    display: block;
    padding: 6px 12px;
    color: var(--vp-c-text-2);
    text-decoration: none;
    font-size: 0.9rem;
    border-radius: 6px;
    transition: color 0.25s, background-color 0.25s;
    word-break: break-all;
}

.sidebar-menu a:hover {
    color: var(--vp-c-brand);
}

.sidebar-menu a.active {
    color: var(--vp-c-brand);
    background-color: rgba(52, 81, 178, 0.08);
    font-weight: 500;
}

@media (prefers-color-scheme: dark) {
    .sidebar-menu a.active {
        background-color: rgba(168, 177, 255, 0.15);
    }
}

/* ================= 右侧大纲 (TOC) ================= */
.toc-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--vp-c-text-1);
    margin-bottom: 8px;
    letter-spacing: 0.5px;
}

/* 右侧目录收起按钮 */
.toc-toggle-btn {
    background: none;
    border: none;
    color: var(--vp-c-text-3);
    cursor: pointer;
    padding: 2px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s, background 0.2s;
}

.toc-toggle-btn:hover {
    color: var(--vp-c-brand);
    background: var(--vp-c-bg-alt);
}

.toc-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    border-left: 1px solid var(--vp-c-divider);
    font-size: 0.85rem;
}

.toc-menu a {
    display: block;
    padding: 4px 0 4px 16px;
    color: var(--vp-c-text-2);
    text-decoration: none;
    transition: color 0.25s;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.toc-menu a:hover {
    color: var(--vp-c-text-1);
}

.toc-menu li.h3 a {
    padding-left: 28px;
}

/* ================= Markdown 内容样式 ================= */
.vp-doc h1 {
    font-size: 2.2rem;
    font-weight: 700;
    margin: 0 0 24px;
    line-height: 1.3;
}

.vp-doc h2 {
    font-size: 1.65rem;
    font-weight: 600;
    margin: 48px 0 16px;
    border-top: 1px solid var(--vp-c-divider);
    padding-top: 24px;
    line-height: 1.3;
}

.vp-doc h3 {
    font-size: 1.35rem;
    font-weight: 600;
    margin: 32px 0 16px;
    line-height: 1.3;
}

.vp-doc p {
    margin: 16px 0;
    line-height: 1.7;
}

.vp-doc a {
    color: var(--vp-c-brand);
    text-decoration: none;
    font-weight: 500;
}

.vp-doc a:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.vp-doc code {
    font-family: var(--vp-font-family-mono);
    font-size: 0.85em;
    background-color: var(--vp-c-bg-alt);
    color: var(--vp-c-brand);
    /* 让行内代码带一点主题色，视觉更精致 */
    padding: 3px 6px;
    border-radius: 4px;
}

/* 2. 多行代码块：强制使用暗黑背景，完美配合 Prism Tomorrow 高亮主题 */
.vp-doc pre {
    background-color: #1e1e20 !important;
    /* 强制纯暗黑背景 */
    border-radius: 8px;
    padding: 16px;
    overflow-x: auto;
    margin: 16px 0;
    font-family: var(--vp-font-family-mono);
    font-size: 0.9em;
    line-height: 1.5;
}

/* 3. 多行代码块内的基础文字：重置为浅灰色，防止非高亮的普通字符看不清 */
.vp-doc pre code {
    background-color: transparent;
    padding: 0;
    color: #cfd3dc !important;
    /* 基础字符颜色设为浅灰色 */
}

.vp-doc blockquote {
    margin: 16px 0;
    padding: 8px 16px;
    border-left: 4px solid var(--vp-c-brand);
    color: var(--vp-c-text-2);
    background: rgba(52, 81, 178, 0.05);
    border-radius: 0 8px 8px 0;
}

@media (prefers-color-scheme: dark) {
    .vp-doc blockquote {
        background: rgba(168, 177, 255, 0.05);
    }
}

/* ================= 容器块（::: tip / info / warning / danger） ================= */
.vp-doc .custom-block {
    margin: 16px 0;
    padding: 14px 16px;
    border-left: 4px solid;
    border-radius: 8px;
    font-size: 0.92rem;
    line-height: 1.7;
}

.vp-doc .custom-block .custom-block-title {
    margin: 0 0 6px;
    font-weight: 600;
    font-size: 1em;
}

.vp-doc .custom-block p {
    margin: 6px 0;
}

.vp-doc .custom-block.tip {
    border-color: #10b981;
    background: rgba(16, 185, 129, 0.08);
}

.vp-doc .custom-block.tip .custom-block-title {
    color: #10b981;
}

.vp-doc .custom-block.info {
    border-color: var(--vp-c-brand);
    background: rgba(52, 81, 178, 0.07);
}

.vp-doc .custom-block.info .custom-block-title {
    color: var(--vp-c-brand);
}

.vp-doc .custom-block.warning {
    border-color: #d97706;
    background: rgba(217, 119, 6, 0.09);
}

.vp-doc .custom-block.warning .custom-block-title {
    color: #d97706;
}

.vp-doc .custom-block.danger {
    border-color: #e5484d;
    background: rgba(229, 72, 77, 0.08);
}

.vp-doc .custom-block.danger .custom-block-title {
    color: #e5484d;
}

.vp-doc table {
    width: 100%;
    border-collapse: collapse;
    margin: 16px 0;
    display: block;
    overflow-x: auto;
}

.vp-doc th,
.vp-doc td {
    border: 1px solid var(--vp-c-divider);
    padding: 8px 16px;
    text-align: left;
}

.vp-doc th {
    background-color: var(--vp-c-bg-alt);
    font-weight: 600;
}

.vp-doc img {
    max-width: 100%;
    border-radius: 8px;
}

/* ================= Mermaid 图表卡片 ================= */
.vp-doc .mermaid-card {
    margin: 24px 0;
    border: 1px solid var(--vp-c-divider);
    border-radius: 8px;
    background-color: var(--vp-c-bg-alt);
    overflow: hidden;
}

.vp-doc .mermaid-card-error {
    border-color: #e5484d;
}

/* 工具栏 */
.vp-doc .mermaid-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 12px;
    background-color: var(--vp-c-bg-soft, rgba(0,0,0,0.03));
    border-bottom: 1px solid var(--vp-c-divider);
    font-size: 12px;
}

.vp-doc .mermaid-toolbar-title {
    color: var(--vp-c-text-3);
    user-select: none;
}

.vp-doc .mermaid-card-error .mermaid-toolbar-title {
    color: #e5484d;
}

.vp-doc .mermaid-btn-group {
    display: flex;
    gap: 4px;
}

.vp-doc .mermaid-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: none;
    border-radius: 4px;
    background: transparent;
    color: var(--vp-c-text-3);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.vp-doc .mermaid-btn:hover {
    background: var(--vp-c-divider);
    color: var(--vp-c-brand);
}

.vp-doc .mermaid-btn.active {
    background: var(--vp-c-brand);
    color: #fff;
}

/* 图表显示区（可拖拽缩放） */
.vp-doc .mermaid-stage {
    position: relative;
    height: 360px;
    overflow: hidden;
    background-color: #fafafa;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
}

.vp-doc .mermaid-stage-error {
    align-items: center;
    justify-content: center;
}

.vp-doc .mermaid-viewport {
    transform-origin: center center;
    transition: none;
    display: block;
    text-align: center;
}

.vp-doc .mermaid-viewport svg {
    max-width: 100%;
    height: auto;
    display: inline-block;
}

.vp-doc .mermaid-err-tip {
    color: #e5484d;
    font-size: 13px;
    padding: 16px;
    text-align: center;
}

/* 源码区 */
.vp-doc .mermaid-source {
    margin: 0;
    padding: 14px 16px;
    background-color: #1e2a3a;
    border-top: 1px solid var(--vp-c-divider);
    font-family: var(--vp-font-mono, Consolas, Monaco, 'Courier New', monospace);
    font-size: 13px;
    line-height: 1.7;
    color: #e0e0e0;
    overflow-x: auto;
    white-space: pre;
}

/* 全屏状态：通过 class 切换，不移动 DOM，保留 transform 状态 */
.vp-doc .mermaid-card.mermaid-card-fullscreen {
    position: fixed;
    inset: 0;
    z-index: 10000;
    border-radius: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    background-color: #fafafa;
}

.vp-doc .mermaid-card.mermaid-card-fullscreen .mermaid-stage {
    flex: 1;
    height: auto;
}

/* 兼容旧渲染失败的代码块（保留兜底） */
.vp-doc pre.mermaid-error {
    border: 1px dashed red !important;
    background-color: #fff0f0 !important;
}

/* 隐藏 mermaid 10.x 渲染失败时生成的错误 SVG（id 以 "dmermaid" 开头，是 <svg> 元素）。
   重要：必须限定为 svg 元素，不能写成 [id^="dmermaid"]。
   原因：mermaid.render(id, code) 内部会创建临时测量容器（<div>），其 id 为 "d" + 传入的 id。
   当传入 id 以 "mermaid" 开头（如 mermaid-svg-xxx）时，临时 div 的 id 就变成 "dmermaid-svg-xxx"，
   若用 [id^="dmermaid"] 通配会把该 div 也 display:none，
   导致 flowchart/classDiagram/gantt 的 foreignObject 内 HTML 尺寸测量为 0，
   mermaid 退回默认 16x16 viewBox（流程图/类图变成小点、甘特图宽度为 0）。
   限定为 svg 元素可避开 div 临时测量容器，同时仍隐藏错误 SVG。 */
svg[id^="dmermaid"] {
    display: none !important;
}

@media (prefers-color-scheme: dark) {
    .vp-doc .mermaid-card {
        background-color: var(--vp-c-bg);
    }

    .vp-doc .mermaid-stage {
        background-color: #1a1a2e;
    }

    .vp-doc pre.mermaid-error {
        background-color: #3a1a1a !important;
    }

    .vp-doc .mermaid-card.mermaid-card-fullscreen {
        background-color: #1a1a2e;
    }
}

/* ================= 搜索弹窗组件样式 ================= */
.search-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding-top: 12vh;
}

.search-modal-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(4px);
}

.search-modal-content {
    position: relative;
    width: 100%;
    max-width: 560px;
    background: var(--vp-c-bg);
    border-radius: 8px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: 70vh;
    margin: 0 16px;
}

.search-box {
    display: flex;
    align-items: center;
    padding: 16px;
    border-bottom: 1px solid var(--vp-c-divider);
    color: var(--vp-c-brand);
}

.search-box input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 1.1rem;
    color: var(--vp-c-text-1);
    padding: 0 12px;
    font-family: inherit;
}

.search-box .esc-hint {
    font-size: 0.75rem;
    color: var(--vp-c-text-3);
    background: var(--vp-c-bg-alt);
    padding: 2px 6px;
    border-radius: 4px;
    border: 1px solid var(--vp-c-divider);
}

.search-results {
    list-style: none;
    margin: 0;
    padding: 8px 0;
    overflow-y: auto;
    flex: 1;
}

.search-results li {
    margin: 0;
    padding: 0 8px;
}

.search-results a {
    display: block;
    padding: 12px 16px;
    border-radius: 6px;
    color: var(--vp-c-text-2);
    text-decoration: none;
    transition: background 0.15s;
}

.search-results a:hover,
.search-results a.is-active {
    background: var(--vp-c-bg-alt);
    color: var(--vp-c-brand);
}

.search-results .res-title {
    font-weight: 600;
    color: var(--vp-c-text-1);
    margin-bottom: 4px;
    display: block;
}

.search-results .res-excerpt {
    font-size: 0.85rem;
    color: var(--vp-c-text-3);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.search-results .highlight {
    color: var(--vp-c-brand);
    font-weight: bold;
    background: rgba(52, 81, 178, 0.1);
    padding: 0 2px;
    border-radius: 2px;
}

/* ================= 布局收起控制（侧边栏 / 目录） ================= */
/* 浮动展开按钮基础样式：默认隐藏，由 body 的收起类控制显示 */
#sidebar-float-btn,
#toc-float-btn {
    position: fixed;
    z-index: 35;
    display: none;
    align-items: center;
    justify-content: center;
    background: var(--vp-c-bg);
    border: 1px solid var(--vp-c-divider);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    color: var(--vp-c-brand);
    cursor: pointer;
    transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
}

#sidebar-float-btn {
    left: 16px;
    bottom: 24px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

#toc-float-btn {
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 44px;
    border-radius: 8px 0 0 8px;
}

#sidebar-float-btn:hover,
#toc-float-btn:hover {
    background: var(--vp-c-bg-alt);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
}

#sidebar-float-btn:hover {
    transform: scale(1.05);
}

#toc-float-btn:hover {
    transform: translateY(-50%) translateX(-2px);
}

/* PC 端（>768px）侧边栏收起状态 */
@media (min-width: 769px) {
    body.sidebar-collapsed .vp-sidebar {
        transform: translateX(-100%);
        box-shadow: none;
    }

    body.sidebar-collapsed .vp-main {
        margin-left: 0;
    }

    /* 收起后显示对应的浮动展开按钮 */
    body.sidebar-collapsed #sidebar-float-btn {
        display: flex;
    }

    /* PC 端目录收起状态 */
    body.toc-collapsed .vp-aside {
        display: none;
    }

    body.toc-collapsed .vp-main {
        margin-right: 0;
    }

    body.toc-collapsed #toc-float-btn {
        display: flex;
    }
}

/* ================= 移动端终极适配 ================= */
@media (max-width: 768px) {

    /* 核心修复：缩小导航栏 padding，减少 nav-actions 的间距 */
    .vp-nav {
        padding: 0 16px;
    }

    .nav-actions {
        gap: 4px;
    }

    /* 缩小按钮间隙 */

    /* 搜索按钮在移动端只保留图标，隐藏文字 */
    .mobile-menu-btn {
        display: block;
    }

    .search-placeholder .search-text {
        display: none;
    }

    .search-placeholder {
        padding: 8px;
        border-radius: 50%;
    }

    /* 遮罩层开启 */
    .mobile-backdrop {
        display: block;
    }

    /* 左边栏转换为抽屉交互 */
    .vp-sidebar {
        left: 0;
        transform: translateX(-100%);
        transition: transform 0.3s ease;
        width: 280px !important;
        box-shadow: 4px 0 16px rgba(0, 0, 0, 0.1);
    }

    .vp-sidebar.open {
        transform: translateX(0);
    }

    .sidebar-resizer {
        display: none !important;
    }

    /* 核心内容区铺满屏幕 */
    .vp-layout {
        padding-top: var(--vp-nav-height);
    }

    .vp-main {
        margin-left: 0;
        margin-right: 0;
        padding: 24px 16px 64px;
    }

    /* 右侧大纲强制隐藏 */
    .vp-aside {
        display: none;
    }

    /* 修复左下角悬浮按钮在移动端干扰 */
    .sidebar-float-toggle {
        display: none !important;
    }

    /* 移动端不显示 PC 端的浮动展开按钮（用汉堡按钮代替） */
    #sidebar-float-btn,
    #toc-float-btn {
        display: none !important;
    }
}