/*
 * 对酒当歌分享 · 主题样式
 * ------------------------------------------------------------
 *      官方主题 core.min.css 之上的轻量覆盖层，本文件沿用同一思路：
 *   1. 沿用 Vue 主题的变量体系与视觉语言：主题蓝主色（字体已改为零加载的系统原生栈）
 *      (#3b82f6)、--content-max-width:85ch、优雅的代码高亮配色、侧边栏激活项
 *      3px 右侧色条指示器。
 *   2. 在 Vue 主题基础上做少量「中文长文阅读」友好的微调：略放大 font-size /
 *      行高，并为 --font-family 补充 CJK 字体回退，保证中文显示一致。
 *   3. 保留并继续托管站点功能必需的组件样式（手机端底部导航 / 子菜单 /
 *      搜索遮罩 / 加载动画 / 锚点滚动偏移 / 正文 .game-nav 按钮）——
 *      这些组件样式绝不能删除，移动端体验依赖它们。
 */

:root {
  /* ---- 文字与主色：沿用 Vue 主题 ---- */
  --color-text: #34495e;
  --theme-color: #3b82f6;
  /* 原 #42b983（Vue 绿）→ 蓝色 */

  /* ---- 字体：Vue 主题原配，附 CJK 回退以保证中文一致 ---- */
  /* 优化版系统原生字体栈：零加载，各平台用各自最好看的自带字体。
     英文→系统 UI 字体(-apple-system/Segoe UI/Roboto)；中文→苹方/雅黑/Linux 兜底。 */
  --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "WenQuanYi Micro Hei", sans-serif;
  --font-family-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

  /* 覆盖官方 core 的 --font-weight:350（过轻，Windows 下中文笔画发虚、不锐利）→ 正常 400 */
  --font-weight: 400;

  /* ---- 排版：对齐 ---- */
  --font-size: 0.875rem;
  /* 14px，正文/P 标签缩小 */
  --line-height: 1.7;
  /* 与参考站 --base-line-height 一致 */
  --content-max-width: clamp(60ch, 80vw, 110ch);
  /* 与参考站一致：响应式阅读列宽 */
  --margin-block: 0.5em;
  /* 段间距（缩小：原 1.2em，减小网盘链接等多段落间的空隙） */

  /* ---- UI 通用过渡时长：统一，一处可调（覆盖所有 transition / animation 的 0.2s） ---- */
  --ui-transition: 0.2s ease;

  /* ---- 标题字号：docsify v5 原生模块化字号阶梯（--modular-scale: 1.333，锚点 1rem=16px） ----
     直接用官方变量控制 H1~H6，不要再另造 --doc-h* 变量 + !important 覆盖。
     H1~H4 的实际值在这里调即可（H5/H6 用 --font-size-m/-s）。 */
  --font-size-xxxl: 2.0rem;
  /* 标题1 ≈ 32px */
  --font-size-xxl: 1.6rem;
  /* 标题2 ≈ 26px */
  --font-size-xl: 1.1rem;
  /* 标题3 ≈ 18px */
  --font-size-l: 0.95rem;
  /* 标题4 ≈ 15px */
  --font-size-m: 0.75rem;
  /* 标题5 ≈ 12px（ms--1） */
  --font-size-s: 0.563rem;
  /* 标题6 ≈ 9px（ms--2） */

  /* =================== 侧边栏：独立控制（字号 / 颜色 / 背景 / 间距） =================== */
  --sidebar-width: 320px;
  /* 侧边栏宽度（收紧，避免过宽） */
  --sidebar-bg: #dbeafe;
  /* 背景色：浅蓝（与主蓝 #3b82f6 协调，菜单文字清晰） */
  --sidebar-border-color: var(--border-color);
  /* 右边框色 */

  /* 站点标题 h1.app-name */
  --sidebar-name-color: var(--theme-color);
  --sidebar-name-font-size: 1.6rem;
  /* 站点标题字号（加大） */
  --sidebar-name-font-weight: 700;
  --sidebar-name-padding-block: 0.9em;
  /* 标题栏上下内边距（目标高度≈80px） */
  --sidebar-name-margin-bottom: 0.4em;
  /* 标题栏与下方搜索框的间距 */

  /* 导航链接——字号独立，不随正文 --font-size 变化 */
  --sidebar-font-size: 1.0625rem;
  /* 17px（子级菜单链接） */
  --sidebar-link-color: var(--color-text);
  /* 链接文字色 */
  --sidebar-link-color-active: var(--theme-color);
  /* 当前页：主题蓝 */
  --sidebar-link-color-hover: #60a5fa;
  /* hover：浅蓝色 */
  --sidebar-link-spacing: 1.1em;
  /* 链接上下间距（更透气） */

  /* 分组标题 */
  --sidebar-group-title-color: #7b8794;
  /* 分组标题：中等灰，浅灰卡片上仍清晰 */
  --sidebar-group-title-font-size: 1.0625rem;
  /* 17px（父级菜单） */
  --sidebar-group-title-font-weight: 600;
  --sidebar-group-title-spacing: 0.85em;
  /* 分组标题下方间距 */

  /* 侧边栏展开/折叠箭头（chevron）颜色 */
  --sidebar-chevron-collapsed-color: var(--color-mono-3);
  /* 折叠时：灰 */
  --sidebar-chevron-expanded-color: var(--theme-color);
  /* 展开时：主题蓝 */

  /* 侧边栏展开/收起切换按钮（右侧竖条）颜色 */
  --sidebar-toggle-bg: #dbeafe;
  /* 按钮背景：浅蓝 */
  --sidebar-toggle-bg-hover: #bfdbfe;
  /* hover 背景：稍深浅蓝 */
  --sidebar-toggle-color: var(--theme-color);
  /* 三个点：主题蓝 */
  --sidebar-toggle-color-hover: #1d4ed8;
  /* hover 三个点：深蓝 */

  /* ---- 标题颜色：独立变量，改这一处即可统一调整 H1~H6 颜色 ---- */
  --heading-color: var(--theme-color);
  /* 主题蓝（与 --theme-color 统一） */
  --heading-color-hover: #1d4ed8;
  /* 标题 hover：深蓝 */

  /* ---- 代码：Vue 主题的优雅高亮配色 ---- */
  --code-color: #e96900;
  --codeblock-comment: #8e908c;
  --codeblock-function: #c94922;
  --codeblock-important: #c94922;
  --codeblock-keyword: var(--theme-color);
  --codeblock-operator: #22a2c9;
  --codeblock-property: #c08b30;
  --codeblock-punctuation: #525252;
  --codeblock-selector: #6679cc;
  --codeblock-tag: #2973b7;
  --codeblock-variable: #3d8fd1;
}

/* =========================================================
 * 全局 SVG 图标尺寸约束（统一，不再逐个补）
 * 站点内联图标均来自 #icon-* 雪碧图（<svg><use/></svg>），
 * 这类 svg 没有显式 width/height，会被 viewBox 撑得巨大。
 * 在此对所有 UI 装饰图标统一约束：固定 1.25rem、不收缩、
 * 跟随文字颜色。以后新增任何图标都自动受控，无需再逐个加尺寸。
 * ========================================================= */
.sidebar svg,
.app-nav svg,
.search svg,
.results-panel svg {
  width: 1.25rem !important;
  height: 1.25rem !important;
  flex-shrink: 0 !important;
  fill: currentColor !important;
  vertical-align: middle;
}

/* =========================================================
 * 全局去除 UI 区域链接下划线（统一，不再逐个补）
 * 覆盖：侧栏菜单 / 顶栏 / 桌面搜索结果 / 移动端导航按钮 / 子菜单 /
 *       移动搜索结果 等所有 UI 装饰链接，含 hover/active/focus/visited 各态。
 * 内部文字或图标子元素也一并强制无下划线，防止被官方 a 样式覆盖。
 * 注意：正文卡片 .markdown-section 内的内容超链接保留其动画下划线，不在此列。
 * ========================================================= */
.sidebar-nav a,
.sidebar-nav a:hover,
.sidebar-nav a:active,
.sidebar-nav a:focus,
.sidebar-nav a:visited,
.app-nav a,
.app-nav a:hover,
.app-nav a:active,
.app-nav a:focus,
.app-nav a:visited,
.search a,
.search a:hover,
.search a:active,
.search a:focus,
.search a:visited,
.results-panel a,
.results-panel a:hover,
.results-panel a:active,
.results-panel a:focus,
.results-panel a:visited,
.mobile-nav-item,
.mobile-nav-item:hover,
.mobile-nav-item:active,
.mobile-nav-item:focus,
.mobile-nav-item.active,
.mobile-nav-item:visited,
.mobile-nav-more-item,
.mobile-nav-more-item:hover,
.mobile-nav-more-item:active,
.mobile-nav-more-item:focus,
.mobile-nav-more-item:visited,
.mobile-nav-submenu-item,
.mobile-nav-submenu-item:hover,
.mobile-nav-submenu-item:active,
.mobile-nav-submenu-item:focus,
.mobile-nav-submenu-item:visited,
.mobile-search a,
.mobile-search a:hover,
.mobile-search a:active,
.mobile-search a:focus,
.mobile-search a:visited {
  text-decoration: none !important;
}

.sidebar-nav a *,
.app-nav a *,
.search *,
.results-panel *,
.mobile-nav-item *,
.mobile-nav-more-item *,
.mobile-nav-submenu-item * {
  text-decoration: none !important;
}

/* =================== 侧边栏（官方核心样式，无自定义覆盖） =================== */
/* 侧边栏视觉完全由官方 core.min.css 提供：index.html 的 <body> 带
   sidebar-group-box / sidebar-chevron-left 等官方类。仅通过上方 :root 中的
   --sidebar-* 官方变量做字号/颜色/背景/间距的定制，不写任何自定义
   .sidebar-nav 规则（避免覆盖官方 chevron / 分组 / 激活态）。
   唯一例外：下方「搜索框动画」仅作用于搜索插件注入的 .sidebar .search input，
   是独立插件元素，不影响上述官方侧边栏状态。 */

/* 侧边栏右侧柔和阴影，与浅蓝底/蓝主题协调（蓝色调） */
.sidebar {
  box-shadow: 2px 0 10px rgba(30, 64, 175, 0.10) !important;
}

/* =================== 侧边栏标题栏（站点标题区 .sidebar .app-name） =================== */
/* 关键：docsify v5 把 h1.app-name 渲染在 .sidebar-nav 内部，
   因此必须用 .sidebar .app-name 命中（不能用 .sidebar > h1 直接子元素）。
   官方 core 仅用 --sidebar-name-* 控制字号/颜色/字重，无高度变量；
   这里通过 font-size 加大字号、padding-block 加高，不改变 chevron / 分组 / 激活态。 */
.sidebar .app-name {
  padding-block: var(--sidebar-name-padding-block);
  margin-bottom: var(--sidebar-name-margin-bottom);
  font-size: var(--sidebar-name-font-size);
  line-height: 1.3;
}


/* =================== 标题锚点滚动偏移 =================== */
/* docsify 用 heading 自身的 id 或内部 .anchor 做锚点跳转；
   加大 scroll-margin-top，防止点击搜索结果后标题紧贴视口顶部（尤其 h4+h4 时 margin-top 为 0 的情况） */
.markdown-section :is(h1, h2, h3, h4, h5, h6),
.markdown-section :is(h1, h2, h3, h4, h5, h6) .anchor {
  scroll-margin-top: 36px !important;
}

/* =================== 标题颜色：H1~H6 统一用 --heading-color（一处可改） =================== */
.markdown-section :is(h1, h2, h3, h4, h5, h6) {
  color: var(--heading-color);
}

/* 标题 hover：变深蓝（标题非 <a>，不会触发下划线动画） */
.markdown-section :is(h1, h2, h3, h4, h5, h6):hover {
  color: var(--heading-color-hover);
}

/* docsify v5 把标题文本包在 <a class="anchor"> 里，core.min.css 会给 .anchor 默认/悬停状态加下划线；
   这里强制标题内所有链接永远无下划线，hover 只变色。 */
.markdown-section :is(h1, h2, h3, h4, h5, h6) a,
.markdown-section :is(h1, h2, h3, h4, h5, h6) a:hover,
.markdown-section :is(h1, h2, h3, h4, h5, h6) a:not(:hover) {
  text-decoration: none !important;
  text-decoration-color: transparent !important;
}

/* =================== H1/H2 基础定位与文字颜色 =================== */
.markdown-section :is(h1, h2) {
  position: relative;
  padding-bottom: 0;
  /* 去标题底部内边距，让下方装饰元素紧贴文字底部（H1 短紫条定位需要） */
  color: #2563eb;
  /* H1/H2 比默认主题蓝(#3b82f6)更深一档，H3~H6 仍用 --heading-color 不变 */
}

/* H2 下方紧跟 H4（中间无段落）时，把 H4 的 margin-top 收到 0.5em，
   避免 H2 下方官方默认间距与 H4 默认 2.8em 折叠后留白过大。 */
.markdown-section h2+h4 {
  margin-top: 0.5em;
}

/* 统一 H4 上下间距：顶部 2.2em，底部 0.3em */
.markdown-section h4 {
  margin-top: 2.2em;
  margin-bottom: 0.3em;
}

/* 连续两个 H4 之间不再叠加 3em 顶部边距，只保留前一个 H4 的底部 0.5em */
.markdown-section h4+h4 {
  margin-top: 0;
}

/* callout（[!IMPORTANT] 等）后紧跟 H4：上间距收为 1.5em。
   注意：callout 自身 margin-block = 1.5rem（官方 core），与 h4 的 margin-top 会折叠取较大值，
   所以真正决定间距的是 callout 的 margin-bottom；要让 1.5em 生效，需同时压低 callout 的 margin-bottom。 */
.markdown-section .callout+h4 {
  margin-top: 1.5em;
}

/* H1 保留原紫色短装饰条（H2 不再共用，单独改浅蓝渐变底栏） */
/* H1：保留短装饰条形态，纯紫改为紫色系渐变（与 H2 整块背景区分） */
.markdown-section h1::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -8px;
  width: 2em;
  height: 10px;
  background: linear-gradient(90deg, #9f7aea 0%, #c4b5fd 100%);
  border-radius: 4px;
}

/* H2：去掉官方灰分割线，改为标题整行浅蓝渐变背景块（横向贯穿，标题文字包含在内，区块氛围感最强） */
.markdown-section h2 {
  margin: 0 0 0.8em 0;
  /* 上0 右0 下0.8em 左0 */
  border-bottom: none;
  background: linear-gradient(90deg, #93c5fd 0%, #bfdbfe 45%, #eff6ff 100%);
  padding: 0.35em 0.5em;
  border-radius: 4px;
}

/* H2 后的提示段落（粗体说明）上下间距归零 */
.markdown-section h2+p {
  margin: 0;
}

/* H2 提示段落后的第一个 H4 上间距收紧，避免与上方 p 的 margin-bottom 叠加导致空白过大 */
.markdown-section h2+p+h4 {
  margin-top: 1em;
}

/* =================== 正文超链接：下划线从中间向左右展开 + hover 变蓝 =================== */
/* 用 ::after 伪元素做下划线，默认 scaleX(0) 居中收缩，hover 时 scaleX(1) 向左右展开；
   排除 .game-nav-btn 等导航按钮，避免按钮底部出现多余的展开线。 */
.markdown-section a:not(.game-nav-btn):not(.anchor):not(:is(h1, h2, h3, h4, h5, h6) a) {
  position: relative;
  text-decoration: none;
  color: #60a5fa;
  transition: color 1s ease;
}

.markdown-section a:not(.game-nav-btn):not(.anchor):not(:is(h1, h2, h3, h4, h5, h6) a)::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  background-color: var(--theme-color);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 1s ease;
}

.markdown-section a:not(.game-nav-btn):not(.anchor):not(:is(h1, h2, h3, h4, h5, h6) a):hover {
  text-decoration: none;
  color: var(--theme-color);
}

.markdown-section a:not(.game-nav-btn):not(.anchor):not(:is(h1, h2, h3, h4, h5, h6) a):hover::after {
  transform: scaleX(1);
}

/* =================== 加载动画（轻量） =================== */
#app {
  min-height: 100vh;
}

/* =================== 正文内容区卡片化 ===================
   页面其余区域（html / body / 侧边栏 / 顶栏）为浅灰 #F2F2F2，
   正文内容区（.markdown-section）整成白底卡片：圆角 + 阴影 + 留白。
   width:auto 取消官方 72ch 固定宽度，margin 上下左右相等，
   使卡片在内容区水平居中并随分辨率自适应。 */
html,
body {
  background: #DBEAFE !important;
  /* 页面底层浅蓝 */
}

.app-nav {
  background: #DBEAFE !important;
  /* 顶栏与页面其余区域同色 */
}

/* 让正文卡片在内容区里水平居中（避免 margin:auto 在绝对定位父容器下失效） */
main>.content {
  display: flex !important;
  justify-content: center !important;
  align-items: flex-start !important;
}

.markdown-section {
  background: #ffffff !important;
  border-radius: 0 !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
  width: calc(100% - 48px) !important;
  max-width: 900px !important;
  margin: 0 0 24px 0 !important;
  padding: 24px clamp(16px, 4vw, 68px) 32px !important;
  /* 左右内边距随屏宽自适应：宽屏68px → 窄屏自动收到16px */
  text-align: left !important;
  /* 防止继承 main 的 text-align:center */
  flex-shrink: 0 !important;
  /* 防止 flex 容器把它压窄 */
  overflow-wrap: break-word !important;
  word-break: break-word !important;
  /* 防止正文长 URL / 表格把卡片撑宽，进而撑宽 body 导致底部导航溢出 */
}


/* =================== 搜索框动画 =================== */
/* 仅作用于搜索插件注入的输入框 .sidebar .search input（独立插件元素，
   不触碰官方 .sidebar-nav / chevron / 分组 / 激活态）。
   仓库原配 transition: var(--search-input-transition) 但该变量未赋值（不生效），
   这里补具体过渡值并加焦点发光，让动画真正可见；同时沿用仓库的
   --search-input-* 变量与 :focus 切换搜索图标背景的做法。 */
.sidebar .search input {
  min-width: 0;
  min-height: 52px;
  padding: 0.9em 1em;
  padding-inline-end: 40px;
  /* 给 clear-button 预留空间 */
  background-image: var(--search-input-background-image);
  background-position: var(--search-input-background-position);
  background-repeat: var(--search-input-background-repeat);
  background-size: var(--search-input-background-size);
  background-color: #fff;
  font-size: var(--search-input-font-size, 0.9375rem);
  color: var(--search-input-color, var(--color-text));
  border: 1px solid var(--sidebar-border-color, #e2e6ea);
  border-radius: 8px;
  /* 入场动画：加载时轻微淡入下滑（仅一次） */
  animation: search-in 0.5s ease both,
    /* 待机呼吸动画：未点击/未聚焦时持续可见的绿色光圈，明显但不刺眼 */
    search-idle 2.8s ease-in-out 0.7s infinite;
  /* 交互动画：边框色 + 阴影 + 变换 平滑过渡 */
  transition: border-color var(--ui-transition), box-shadow var(--ui-transition), background-color var(--ui-transition), transform var(--ui-transition);
}

.sidebar .search input:focus {
  /* 聚焦时停止待机呼吸，改用静态发光，避免动画干扰输入 */
  animation: none;
  /* 仓库同款：focus 切换搜索图标背景（变量由搜索插件提供，保持图标不丢） */
  background-image: var(--search-input-background-image--focus, var(--search-input-background-image));
  background-position: var(--search-input-background-position--focus, var(--search-input-background-position));
  background-size: var(--search-input-background-size--focus, var(--search-input-background-size));
  /* 焦点发光：蓝色柔和弥散光 + 轻微上浮（与待机呼吸统一蓝色调） */
  border-color: rgba(59, 130, 246, 0.8);
  box-shadow: 0 0 16px 3px rgba(59, 130, 246, 0.18);
  /* 大 blur → 柔和光晕 */
  transform: translateY(-1px);
  outline: none;
}

.sidebar .search input::placeholder {
  color: var(--search-input-placeholder-color, #9aa5b1);
  transition: color var(--ui-transition);
}

.sidebar .search input:focus::placeholder {
  color: rgba(59, 130, 246, 0.6);
}

@keyframes search-in {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 待机呼吸动画：未点击搜索框时，蓝色弥散光晕缓缓缩放 + 边框只轻微泛蓝，
   用带 blur 的阴影代替硬光环，看起来更柔和、更高级 */
@keyframes search-idle {

  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0);
    border-color: var(--sidebar-border-color, #e2e6ea);
  }

  50% {
    /* blur 大、透明度低 → 柔和弥散光，而非锐利光环 */
    box-shadow: 0 0 18px 2px rgba(59, 130, 246, 0.18);
    border-color: rgba(59, 130, 246, 0.25);
  }
}


/* =================== 搜索结果面板样式覆盖 ===================
   docsify 搜索插件默认把 "找到 X 个结果" 和摘要设成 var(--font-size-s)，
   在中文站点上几乎看不清；且摘要里会原样显示网盘链接 URL，显得杂乱。 */
.search .results-status {
  font-size: 1.125rem !important;
  /* 约 18px，原来约 9px / 15px */
  color: var(--color-text) !important;
  margin-bottom: 0.5em !important;
}

.search .matching-post {
  padding: 0 0 0.9em 0.3em !important;
}

/* 搜索结果标题：取消单行截断，转行显示 */
.search .matching-post .title.clamp-1 {
  display: block !important;
  -webkit-line-clamp: unset !important;
  overflow: visible !important;
  white-space: normal !important;
  word-break: break-word !important;
}

/* 搜索结果标题：粗体蓝，hover/focus/current 变深蓝 */
.search .matching-post a .title {
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  color: #3b82f6 !important;
}

.search .matching-post a:hover .title,
.search .matching-post a:focus .title,
.search .matching-post.current a .title {
  color: #1d4ed8 !important;
}

/* 搜索结果面包屑（自定义注入 .result-category）：前加 📁 图标 */
.search .matching-post a .result-category {
  display: block !important;
  font-size: 12px !important;
  /* 比标题小、可读 */
  font-weight: 400 !important;
  color: #9ca3af !important;
  letter-spacing: 0.02em !important;
  margin: 0 0 0.3em 0 !important;
}

.search .matching-post a .result-category::before {
  content: '📁';
  display: inline-block;
  margin-right: 0.35em;
  font-size: 1em;
  line-height: 1;
}

/* 鼠标移到结果项/面包屑上：面包屑保持浅灰不变蓝 */
.search .matching-post:hover a .result-category,
.search .matching-post:focus a .result-category,
.search .matching-post a:hover .result-category,
.search .matching-post.current a .result-category,
.search .matching-post a .result-category:hover {
  color: #9ca3af !important;
}

/* 搜索结果正文摘录（docsify 真实 DOM 是 <p class="content clamp-2">）：隐藏 */
.search .matching-post .content,
.search .matching-post p:not(.empty) {
  display: none !important;
}


/* =================== 正文内的导航按钮（.game-nav 等） =================== */
.markdown-section .game-nav {
  display: flex;
  gap: 0.9375rem;
  margin: 1.5625rem 0;
  flex-wrap: wrap;
}

.markdown-section .game-nav-btn {
  padding: 0.625rem 1.25rem;
  box-sizing: border-box;
  background: #eff6ff;
  color: #1d4ed8;
  text-decoration: none;
  border-radius: 8px;
  border: 1px solid #bfdbfe;
  font-weight: 700;
  font-size: 0.875rem;
  transition: background-color var(--ui-transition), border-color var(--ui-transition), color var(--ui-transition), box-shadow var(--ui-transition);
  white-space: nowrap;
}

.markdown-section .game-nav-btn:hover {
  background: #dbeafe;
  border-color: #60a5fa;
  color: #1e40af;
}

/* =================== 手机端底部导航栏（自定义，不可删除） =================== */
.mobile-nav {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100vw;
  max-width: 100vw;
  background: #fff;
  border-top: 1px solid var(--border-color, #eee);
  z-index: 9999;
  padding: 0.5rem 0;
  padding-bottom: max(0.5rem, env(safe-area-inset-bottom));
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.06);
  box-sizing: border-box;
}

.mobile-nav.force-show {
  display: block !important;
}

/* 手机底部导航图标尺寸（从全局 svg 规则拆出，单独放大） */
.mobile-nav svg {
  width: 1.4rem !important;
  height: 1.4rem !important;
  flex-shrink: 0 !important;
  fill: currentColor !important;
}

.mobile-nav-item.mobile-nav-search .mobile-nav-icon svg {
  width: 1.6rem !important;
  height: 1.6rem !important;
}

.mobile-nav-container {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.mobile-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0.375rem 0.25rem;
  color: #666;
  font-size: 13px;
  transition: color var(--ui-transition);
  min-width: 0;
  flex: 1;
  white-space: nowrap;
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
}

.mobile-nav-item:hover,
.mobile-nav-item.active,
.mobile-nav-item:active,
.mobile-nav-item:focus {
  color: var(--theme-color);
}

.mobile-nav-item.mobile-nav-search {
  color: var(--theme-color);
  font-size: 13px;
}

.mobile-nav-item.mobile-nav-search .mobile-nav-icon {
  font-size: 1.85rem;
}

.mobile-nav-icon {
  font-size: 1.375rem;
  margin-bottom: 0.125rem;
  height: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 子菜单 / 更多菜单弹层 */
.mobile-nav-submenu,
.mobile-nav-more-popup {
  display: none;
  position: fixed;
  bottom: 4.375rem;
  background: #fff;
  border-radius: 12px;
  padding: 0.5rem 0;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.12);
  min-width: 9.375rem;
  z-index: 10000;
  border: 1px solid var(--border-color, #eee);
}

/* 更多菜单：右对齐，贴住底部「更多」按钮 */
.mobile-nav-more-popup {
  right: 0.625rem;
  max-width: calc(100vw - 1.25rem);
}

.mobile-nav-submenu.show,
.mobile-nav-more-popup.show {
  display: block;
  animation: fadeIn var(--ui-transition);
}

.mobile-nav-more-popup::after {
  content: "";
  position: absolute;
  bottom: -6px;
  right: 1.125rem;
  /* 对齐「更多」按钮中心（原 1.5625rem 偏右） */
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #fff;
}

.mobile-nav-more-item,
.mobile-nav-submenu-item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0.625rem 0.9375rem 0.625rem calc(0.9375rem + 8px);
  color: #333;
  font-size: 1rem;
  border-radius: 8px;
  transition: all var(--ui-transition);
}

.mobile-nav-more-item:hover,
.mobile-nav-submenu-item:hover,
.mobile-nav-more-item:active,
.mobile-nav-submenu-item:active,
.mobile-nav-more-item:focus,
.mobile-nav-submenu-item:focus {
  background: #f5f5f5;
  color: var(--theme-color);
}

/* 子菜单位置：以对应底部按钮中心为锚点水平居中，
   并限制最大宽度防止在窄屏（≤360px）下超出视口左右边缘 */
.mobile-nav-submenu {
  max-width: calc(100vw - 1rem);
}

#submenu-games {
  left: 21.4%;
  margin-left: 0;
  transform: translateX(-50%);
}

#submenu-movie {
  left: 35.7%;
  margin-left: 0;
  transform: translateX(-50%);
}

#submenu-tv {
  left: 64.3%;
  margin-left: 0;
  transform: translateX(-50%);
}

#submenu-animetv {
  left: 78.6%;
  margin-left: 0;
  transform: translateX(-50%);
}

/* =================== 手机端搜索遮罩（自定义，不可删除） =================== */
.mobile-search-overlay {
  display: none;
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100dvh;
  background: rgba(0, 0, 0, 0.95);
  z-index: 999999;
  padding: 1.25rem;
  padding-top: 5rem;
  box-sizing: border-box;
}

.mobile-search-overlay.show {
  display: block;
  animation: fadeIn var(--ui-transition);
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.mobile-search-container {
  max-width: 37.5rem;
  margin: 0 auto;
  position: relative;
}

.mobile-search-box {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  background: #fff;
  border-radius: 0.75rem;
  padding: 0.3125rem;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.mobile-search-input {
  flex: 1;
  height: 44px;
  padding: 0 0.9375rem;
  line-height: 44px;
  border: none;
  border-radius: 0.5rem;
  font-size: 1rem;
  outline: none;
  background: transparent;
}

.mobile-search-input::placeholder {
  color: #999;
}

.mobile-search-btn {
  width: 44px;
  height: 44px;
  padding: 0;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--theme-color);
  color: #fff;
  border: none;
  border-radius: 0.5rem;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 700;
  transition: filter var(--ui-transition);
}

.mobile-search-btn svg {
  width: 1rem !important;
  height: 1rem !important;
}

.mobile-search-btn:hover {
  filter: brightness(0.92);
}

.mobile-search-close {
  position: absolute;
  top: -2.75rem;
  right: 0;
  width: 44px;
  height: 44px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1.5rem;
  cursor: pointer;
  z-index: 10001;
}

.mobile-search-close svg {
  width: 1rem !important;
  height: 1rem !important;
}

.mobile-search-results {
  margin-top: clamp(0.75rem, 3vw, 1.25rem);
  max-height: calc(100dvh - 12rem);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: rgba(255, 255, 255, 0.96);
  border-radius: 0.75rem;
  padding: 0;
  display: none;
}

.mobile-search-results.has-content {
  display: block;
  padding: clamp(8px, 2.5vw, 12px);
}

.mobile-search-no-results,
.mobile-search-loading {
  padding: 1.875rem;
  text-align: center;
  color: #666;
  font-size: 0.875rem;
}

/* 手机搜索结果：直接搬运官方 .matching-post，镜像官方外观（官方样式 scoped 在 .search，clone 后需重定义） */
.mobile-search-results-list .matching-post {
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.mobile-search-results-list .matching-post:last-child {
  border-bottom: none;
}

.mobile-search-results-list .matching-post a {
  display: block;
  padding: clamp(10px, 3vw, 14px) clamp(12px, 4vw, 18px);
  color: #333;
  text-decoration: none;
  border-radius: 0.5rem;
  transition: background var(--ui-transition);
}

.mobile-search-results-list .matching-post a:hover,
.mobile-search-results-list .matching-post a:active,
.mobile-search-results-list .matching-post a:focus {
  background: #f5f5f5;
}

/* 手机搜索结果与 PC 端保持一致：标题可换行，不截断省略 */
.mobile-search-results-list .matching-post .title,
.mobile-search-results-list .matching-post .title.clamp-1 {
  display: block !important;
  font-weight: 600;
  font-size: clamp(0.8125rem, 3.8vw, 0.9375rem);
  line-height: 1.4;
  margin: 0;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  -webkit-line-clamp: unset !important;
  word-break: break-word !important;
}

/* 手机搜索结果与 PC 端保持一致：不显示正文摘要 */
.mobile-search-results-list .matching-post .content,
.mobile-search-results-list .matching-post p.content,
.mobile-search-results-list .matching-post p:not(.title):not(.result-category) {
  display: none !important;
}

.mobile-search-results-list .matching-post .result-category {
  display: block;
  font-size: clamp(0.6875rem, 2.8vw, 0.75rem);
  color: #9ca3af !important;
  margin-bottom: 2px;
}

/* 与 PC 端一致：分类前加 📁 图标 */
.mobile-search-results-list .matching-post .result-category::before {
  content: '\1F4C1';
  display: inline-block;
  margin-right: 0.35em;
  font-size: 1em;
  line-height: 1;
}

.mobile-search-results-list .matching-post a:hover .result-category,
.mobile-search-results-list .matching-post a:focus .result-category {
  color: #9ca3af !important;
}

.icon-spin {
  animation: spin 1s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/* 搜索遮罩显示时隐藏正文内「本页目录」（避免与搜索结果重叠）。
   旧 docsify-plugin-toc 的 .page-toc / nav.toc-nav / .toc / aside.toc 选择器已随插件移除而删除。 */
body.search-active div[class*="toc"],
body.search-active nav[class*="toc"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* =================== 手机端响应式 =================== */
@media (max-width: 767px) {
  body {
    padding-bottom: 3.5rem;
    font-size: 0.9375rem;
    overflow-x: hidden;
    /* 防止正文长链接/表格把 body 撑宽，导致底部导航一起溢出视口 */
  }

  /* 手机端底部导航：用媒体查询锁定显示，不再依赖 JS 切换 display 的时序。
     否则滚动触发浏览器地址栏伸缩(resize)时，force-show 可能被瞬间移除而闪没。
     JS 的 .force-show 仍保留，作为 iPad 横屏等 UA 匹配的兜底。 */
  .mobile-nav {
    display: block !important;
    overflow-x: hidden; /* 防止任何子项溢出导致整页横向滚动 */
  }

  /* 手机端底部导航有 7 个按钮，较挤；收紧图标/字号/内边距，
     避免标签在窄屏(≤390px)下溢出、挤到相邻按钮 */
  .mobile-nav-container {
    padding: 0 0.25rem;
  }

  .mobile-nav-item {
    padding: 0.35rem 0.05rem;
    font-size: 12px;
    overflow: hidden; /* 标签万一仍超出则截断，不再视觉溢出 */
  }

  .mobile-nav svg {
    width: 1.25rem !important;
    height: 1.25rem !important;
  }

  .mobile-nav-item.mobile-nav-search .mobile-nav-icon svg {
    width: 1.4rem !important;
    height: 1.4rem !important;
  }

  .mobile-nav-icon {
    font-size: 1.15rem;
    height: 1.1rem;
  }

  /* 手机端取消内容容器左右内边距，让白色卡片真正贴边铺满（否则右侧露背景底色） */
  main > .content {
    padding: 0 !important;
  }

  .markdown-section {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    /* 手机端白色卡片占满整个界面，无左右间隙 */
    padding: 1rem clamp(12px, 4vw, 24px) !important;
    /* 上下 1rem；左右内边距随屏宽自适应（文字不贴边） */
    padding-top: 2.5rem !important;
    /* 手机端顶部留出足够呼吸空间，避免页面刚加载时内容紧贴屏幕边缘 */
  }

  /* 手机端正文段落单独放大到 14px，不连动 li/blockquote/td 等继承元素 */
  .markdown-section p {
    font-size: 1rem;
  }

  .markdown-section h1 {
    font-size: 1.6rem;
    margin: 0.8em 0 0.4em;
  }

  .markdown-section h2 {
    font-size: 1.35rem;
    margin: 0.7em 0 0.35em;
  }

  .markdown-section h3 {
    font-size: 1.15rem;
    margin: 0.6em 0 0.3em;
  }

  .markdown-section h4 {
    font-size: 1rem;
    margin-top: 2.5em;
    margin-bottom: 0.5em;
  }

  /* 手机端单独设字号；间距对齐 PC 端 h4（含 h4+h4 margin-top:0），避免小于正文 p(14px) 且层级一致 */

  /* 隐藏正文内的自定义导航菜单（改用底部导航栏） */
  .game-nav {
    display: none !important;
  }
}

@media (max-width: 480px) {
  .markdown-section .game-nav {
    gap: 0.5rem;
  }

  .markdown-section .game-nav-btn {
    padding: 0.5rem 0.625rem;
  }
}


/* ============================================================
   自定义 chevron（替代官方脆弱的背景渐变方案）
   ------------------------------------------------------------
   官方 core.min.css 用 a.page-link 的 background 渐变画折叠箭头，
   依赖 page-link 类 + --sidebar-chevron-*-color 变量，在浅色侧边栏上极弱、
   且易因 .collapse / .active 类状态错乱而“消失”。
   这里清除官方背景渐变，改用伪元素画 chevron，颜色/可见性完全可控。
   ============================================================ */
:root:has(body[class*=sidebar-chevron]) {
  --sidebar-pagelink-bg-empty: transparent;
}

/* 1) 清除官方 chevron 背景渐变（含默认/折叠/激活三态） */
.sidebar-nav a.page-link {
  background: none !important;
}

/* 2) 仅「有子菜单的父级」显示展开/收起符号（不依赖 app-sub-sidebar 类） */
.sidebar-nav li:has(> ul)>a,
.sidebar-nav li:has(> ul)>p>a {
  position: relative;
}

/* 收起态：右向 chevron（灰，确保浅底可见） */
.sidebar-nav li:has(> ul)>a::after,
.sidebar-nav li:has(> ul)>p>a::after {
  content: "";
  position: absolute;
  right: 0.45em;
  top: calc(50% - 0.3em);
  width: 0.5em;
  height: 0.5em;
  border-right: 2px solid #6b7280;
  /* 收起：中灰（浅底清晰可见） */
  border-bottom: 2px solid #6b7280;
  transform: rotate(-45deg);
  transition: transform var(--ui-transition), border-color var(--ui-transition);
}

/* 展开态（li 不带 .collapse）：下向 chevron，变蓝 */
.sidebar-nav li:has(> ul):not(.collapse)>a::after,
.sidebar-nav li:has(> ul):not(.collapse)>p>a::after {
  transform: rotate(45deg);
  border-color: var(--theme-color);
}

/* =================== 侧边栏分组折叠（自定义 JS 控制 .collapse 类） =================== */
/* 官方 core 在 body 带 sidebar-chevron-* 时会隐藏 .collapse 的子列表，
   这里补一条兜底规则，确保折叠/展开可靠工作、不受官方内部选择器变更影响。 */
.sidebar-nav li.collapse>ul {
  display: none;
}

/* ============================================================
   同步官方 sidebar-group-underline 变量（兜底）
   ------------------------------------------------------------
   官方 core.min.css 已在 :root:has(body.sidebar-group-underline)
   中设置这些变量，但偶尔因缓存/加载顺序导致下划线未生效。
   在 theme.css 中再声明一次，确保分组标题下划线可靠显示。
   ============================================================ */
:root:has(body.sidebar-group-underline) {
  --sidebar-group-title-border: 1px solid var(--sidebar-border-color);
  --sidebar-group-title-spacing: 0.35em;
  --sidebar-group-spacing: 0.5em;
}

/* ============================================================
   侧边栏边距与分组折叠修复
   ------------------------------------------------------------
   - 加大官方私有变量 --_sidebar-inset，让侧边栏内容与边框
     之间留白更大（左右边距）。
   - 加大 --_sidebar-list-inset，让子项缩进更明显。
   - 强制 li.group 下的子列表始终显示，并禁用 group-title
     的点击/双击事件，避免双击分组标题后子项被折叠或整
     个分组“消失”。
   ============================================================ */
:root {
  --_sidebar-inset: 28px;
  --_sidebar-list-inset: 1em;
  --sidebar-search-menu-gap: 2.2em;
  /* 搜索框到菜单栏的间距（用户目标值） */
  --sidebar-menu-padding-left: 0.7em;
  /* 菜单栏左边距（在官方 inset 基础上再内缩） */
}

/* 菜单栏（导航列表 .sidebar-nav > ul）左边距加大；
   只作用于菜单列表，不影响标题栏 / 搜索框的边距。 */
.sidebar-nav>ul {
  padding-left: var(--sidebar-menu-padding-left);
}

/* 搜索框到菜单栏的间距：直接给搜索框加 margin-bottom，
   稳定命中（不依赖菜单列表 ul 选择器是否命中官方 DOM）。 */
.sidebar .search {
  margin-bottom: var(--sidebar-search-menu-gap);
}

/* 父级链接（带子菜单的 🎮游戏 / 🎬电影 等）：与子级区分字号。
   用 :has() 选中「li 下直接包含 ul」的父级 a，
   不依赖 app-sub-sidebar 类名，兼容 docsify v5 不同渲染路径。 */
.sidebar-nav li:has(> ul)>a,
.sidebar-nav li:has(> ul)>p>a {
  font-size: var(--sidebar-group-title-font-size);
  /* 19px（父级） */
}

/* 菜单栏默认常规字重（不加粗） */
.sidebar-nav a {
  font-weight: 400;
}

/* 选中当前页（docsify 给当前链接加 .active）：加粗 + 蓝色 */
.sidebar-nav a.active,
.sidebar-nav li.active>a {
  font-weight: 700;
  color: var(--sidebar-link-color-active);
}

/* 鼠标移上去：无下划线 + 蓝色（与选中态统一为同一蓝色），但不变粗 */
.sidebar-nav a:hover {
  text-decoration: none;
  font-weight: 400;
  color: var(--sidebar-link-color-active);
  /* 蓝色（与选中态一致） */
}

/* ============================================================
   Waline 留言板样式覆盖
   ------------------------------------------------------------
   Waline 从 CDN 异步加载，官方样式在某些尺寸/字号上与站点
   视觉不统一，这里用 !important 兜底覆盖。
   ============================================================ */

/* 0. 主题色统一（官方推荐：覆盖 --waline-* 变量，一处改全站生效）
      绿 → 站点蓝，避免到处写硬编码色值 */
:root {
  --waline-theme-color: #3b82f6;
  /* 主色：提交按钮/链接/激活 */
  --waline-active-color: #1d4ed8;
  --waline-border-color: #ddd;
  /* 边框色（仅无边框项才需另覆盖） */
  --waline-color: #444;
}

/* 1. 缩小底部工具栏按钮（表情 / 预览），避免占位过大（去边框/背景见第 7 组统一规则） */
.wl-actions .wl-action,
.wl-actions .wl-action:hover,
.wl-actions .wl-action:active,
.wl-actions .wl-action:focus {
  width: 1.75rem !important;
  height: 1.75rem !important;
  padding: 0.25rem !important;
  border-radius: 0.375rem !important;
}

.wl-actions .wl-action svg {
  width: 1.25rem !important;
  height: 1.25rem !important;
}

/* 2. 隐藏图片上传按钮（黄色/图片图标）—— 站点已关闭 imageUploader，
      但 Waline 实际用 label.wl-action（无 .wl-image 类）渲染该按钮，
      直接隐藏工具栏第一个 action 最稳妥，同时保留类名兜底 */
.wl-actions .wl-action:first-child,
.wl-actions label.wl-action,
.wl-action[for="wl-image-upload"],
.wl-actions .wl-image,
.wl-action.wl-image {
  display: none !important;
}

/* 3. 增大昵称 / 邮箱输入框字号，避免填写后文字过小 */
.wl-header .wl-header-item .wl-input {
  font-size: 0.9375rem !important;
  padding: 0.5rem 0.625rem !important;
}

.wl-header .wl-header-item label {
  font-size: 0.875rem !important;
}

/* 4. 提交按钮也同步略小一号，避免与输入区比例失调 */
.wl-form .wl-btn {
  font-size: 0.875rem !important;
  padding: 0.375rem 0.875rem !important;
}

/* 5. 统一留言板背景与主题色，去掉零散浅灰背景 */
/* 面板 / 编辑器聚焦 / 昵称·邮箱·IP 等元信息标签：去掉默认浅灰背景，
   与站点卡片（白底）保持一致，不再出现突兀的灰色块 */
.wl-panel {
  background: transparent !important;
}

.wl-editor:focus {
  background-color: #f8fafc !important;
  /* 聚焦仅极淡蓝灰，便于辨识输入区 */
}

/* 浏览器 / 系统 / 地址 标签：去掉默认灰底、padding，统一字号颜色 */
.wl-card .wl-meta>span {
  background: transparent !important;
  color: #6b7280 !important;
  font-size: 0.875rem !important;
  padding: 0 !important;
  /* 去掉默认 2px 上下 padding */
}

/* 主题色已由顶部 :root 的 --waline-theme-color / --waline-active-color 变量统一控制，
   提交按钮与激活态自动变蓝，无需在此硬编码覆盖。 */

/* 表情 / 动图 选择弹窗内部元素去描边去背景（与留言板按钮同款无边框风格）
   覆盖：表情 hover 灰底、预览框、激活分类标签、标签分隔线、动图输入框与缩略图
   （弹窗容器本身保留背景、只用阴影浮起，见下方 .wl-emoji-popup / .wl-gif-popup） */
.wl-emoji-popup button:hover,
.wl-emoji-popup .wl-emoji-preview,
.wl-emoji-popup .wl-tab.active,
.wl-emoji-popup .wl-tabs::before,
.wl-gif-popup input,
.wl-gif-popup img,
.wl-gif-popup img:hover {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* 表情 / 动图 弹窗容器：需要背景、不要边框，用阴影替代边框做浮起效果 */
.wl-emoji-popup,
.wl-emoji-popup:hover,
.wl-gif-popup,
.wl-gif-popup:hover {
  background: #ffffff !important;
  border: none !important;
  outline: none !important;
  box-shadow: 0 4px 16px rgba(30, 64, 175, 0.12) !important;
  border-radius: 0.5rem !important;
}

/* 6. 评论元信息（浏览器 / 系统版本）横向排列
   版本信息保持在昵称/时间下方独立一行，但内部横向排列，
   避免 Baidu13.74 / Android 15 上下堆叠 */
.wl-card .wl-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.25rem 0.6rem !important;
}

/* 昵称：深蓝 + 粗体 + 加大 */
.wl-card .wl-head .wl-nick,
.wl-card .wl-head .wl-nick:hover,
.wl-card .wl-head .wl-nick:visited {
  color: #1d4ed8 !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  /* 加大（默认约 0.875rem） */
}

/* 头部行高也收一点，减少昵称/时间与版本行之间的空白 */
.wl-card .wl-head {
  line-height: 1.2 !important;
  margin-bottom: -0.5rem !important;
}

.wl-card .wl-meta>* {
  display: inline-flex !important;
  align-items: center !important;
}

/* 7. 统一：所有非主按钮（工具栏表情/预览、评论操作、关闭、回复框取消/登录）
       去背景、去描边、去浏览器默认 focus 轮廓，并覆盖全部交互态。
       主按钮 .wl-btn.primary（提交）保留蓝色，不在此列。
       注：.wl-operation button（更多...）不在此规则，保留 Waline 默认边框/背景，避免看不见。 */
.wl-actions .wl-action,
.wl-actions .wl-action:hover,
.wl-actions .wl-action:active,
.wl-actions .wl-action:focus,
.wl-actions .wl-action:focus-visible,
.wl-comment-actions button,
.wl-comment-actions a,
.wl-comment-actions button:hover,
.wl-comment-actions a:hover,
.wl-comment-actions button:active,
.wl-comment-actions a:active,
.wl-comment-actions button:focus,
.wl-comment-actions a:focus,
.wl-comment-actions button:focus-visible,
.wl-comment-actions a:focus-visible,
.wl-close,
.wl-close:hover,
.wl-close:active,
.wl-close:focus,
.wl-close:focus-visible,
.wl-info .wl-btn:not(.primary),
.wl-info .wl-btn:not(.primary):hover,
.wl-info .wl-btn:not(.primary):active,
.wl-info .wl-btn:not(.primary):focus,
.wl-info .wl-btn:not(.primary):focus-visible {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* 取消回复的 X 按钮加大，避免太小难点击 */
.wl-close {
  width: 2.5rem !important;
  height: 2.5rem !important;
  font-size: 1.5rem !important;
  line-height: 1 !important;
}

/* 「取消回复」文字按钮加大，便于点击 */
.wl-info .wl-btn:not(.primary) {
  font-size: 1rem !important;
  padding: 0.5rem 1rem !important;
  min-height: 2.25rem !important;
}

/* 「更多...」加载按钮：不要灰色边框，但要浅蓝背景（站点浅蓝）让按钮清晰可点 */
.wl-operation button {
  border: none !important;
  background: #dbeafe !important;
  color: var(--theme-color) !important;
  font-weight: 600 !important;
  border-radius: 0.375rem !important;
  padding: 0.5rem 1rem !important;
  box-shadow: none !important;
  outline: none !important;
}

/* ============================================================
   正文内 TOC（由 index.html 的 buildInContentToc() 注入）
   抓取当前页 h2 生成「本页目录」卡片，置于正文顶部
   ============================================================ */
.in-content-toc {
  margin: 1.25rem 0 1.75rem;
  padding: 0.85rem 1.1rem;
  border: 1px solid var(--border-color, #eaecef);
  border-left: 3px solid var(--theme-color, #3b82f6);
  border-radius: 8px;
  background: rgba(59, 130, 246, 0.06);
  /* 浅蓝兜底（color-mix 不支持时） */
  background: color-mix(in srgb, var(--theme-color, #3b82f6) 6%, transparent);
  font-size: 0.9rem;
}

.in-content-toc__title {
  margin: 0 0 0.5rem;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: var(--theme-color, #3b82f6);
}

.in-content-toc ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.in-content-toc li {
  position: relative;
  margin: 0.35rem 0;
  padding-left: 0.95rem;
}

.in-content-toc li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--theme-color, #3b82f6);
  opacity: 0.55;
}

.in-content-toc a {
  color: var(--color-text, #34495e);
  text-decoration: none;
  transition: color 0.15s ease;
}

.in-content-toc a:hover,
.in-content-toc a:focus {
  color: var(--theme-color, #3b82f6);
}

/* 取消正文链接的扫光下划线动画（TOC 链接不需要） */
.in-content-toc a::after {
  display: none !important;
}

/* 手机端（窄屏）彻底隐藏本页目录：屏幕窄，侧边栏主导航已足够，
   不生成 DOM 已在 JS 中处理，这里再加 CSS 兜底防缓存残留 */
@media (max-width: 767px) {
  .in-content-toc {
    display: none !important;
  }
}

/* ============================================================
   中等宽度（768px–1599px）：右侧悬浮目录按钮，点击展开。
   宽屏固定面板放不下时，改用不占顶部空间的悬浮按钮。
   ============================================================ */
@media (min-width: 768px) and (max-width: 1599px) {
  .in-content-toc {
    position: fixed;
    top: 8rem;
    right: 0;
    z-index: 100;
    width: 4.5rem;
    margin: 0;
    padding: 0.65rem 0.3rem;
    background: #ffffff;
    border: 1px solid var(--border-color, #eaecef);
    border-right: none;
    border-left: 3px solid var(--theme-color, #3b82f6);
    border-radius: 8px 0 0 8px;
    box-shadow: -2px 2px 10px rgba(0, 0, 0, 0.08);
    cursor: pointer;
    overflow: hidden;
    transition: width 0.2s ease, padding 0.2s ease, box-shadow 0.2s ease;
  }

  .in-content-toc:hover {
    box-shadow: -2px 2px 14px rgba(0, 0, 0, 0.12);
  }

  .in-content-toc.is-open {
    width: 11rem;
    padding: 0.75rem 1rem;
    cursor: default;
    box-shadow: -4px 4px 20px rgba(0, 0, 0, 0.12);
  }

  /* 收起时标题显示“显示目录” */
  .in-content-toc__title {
    margin: 0;
    font-size: 0;
    text-align: center;
    color: var(--theme-color, #3b82f6);
  }

  .in-content-toc__title::before {
    content: '显示目录';
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    white-space: nowrap;
  }

  .in-content-toc.is-open .in-content-toc__title {
    margin: 0 0 0.4rem;
    font-size: 0.9rem;
    text-align: left;
  }

  .in-content-toc.is-open .in-content-toc__title::before {
    content: none;
  }

  /* 收起时隐藏列表，展开时恢复 */
  .in-content-toc ul {
    display: none;
    margin: 0;
    padding: 0;
  }

  .in-content-toc.is-open ul {
    display: block;
  }

  .in-content-toc.is-open li {
    margin: 0.25rem 0;
    padding-left: 0.85rem;
  }

  .in-content-toc.is-open li::before {
    top: 0.58em;
    width: 4px;
    height: 4px;
  }
}

/* ============================================================
   宽屏（≥1600px）：正文内 TOC 变为右侧固定目录（类似 docsify-plugin-toc）
   仅在屏幕足够宽、右侧不会覆盖正文时启用。
   ============================================================ */
@media (min-width: 1600px) {

  /* 所有宽屏页都给正文卡片右侧让出空间（即使本页无目录也留位），
     保证切换页面时正文位置恒定、不跳动 */
  .markdown-section {
    margin-right: 15rem !important;
  }

  .in-content-toc {
    position: fixed;
    top: 7rem;
    right: 7rem;
    width: 13rem;
    max-height: calc(100vh - 4rem);
    overflow-y: auto;
    z-index: 20;
    margin: 0;
    padding: 0.75rem 1rem;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    font-size: 1.1rem;
  }

  .in-content-toc__title {
    margin: 0 0 0.4rem;
    font-size: 0.9rem;
  }

  .in-content-toc li {
    margin: 0.25rem 0;
    padding-left: 0.85rem;
  }

  .in-content-toc li::before {
    top: 0.58em;
    width: 4px;
    height: 4px;
  }
}

/* ============================================================
   大屏（≥1920px，常见桌面 / 4K 屏 + 200% 缩放）：正文适度加宽
   - 根字号 16px → 17px，整站 rem 协调放大
   - 正文 900px → 1100px，避免常见宽屏下两侧留白过大
   ============================================================ */
@media (min-width: 1920px) {
  html {
    font-size: 106.25%; /* 17px */
  }

  .markdown-section {
    max-width: 1100px !important;
    margin-right: 16rem !important;
  }

  .in-content-toc {
    right: 7.5rem;
    width: 14rem;
  }
}

/* ============================================================
   PC 端网盘链接转二维码（点击展开）
   - 仅 PC 端（JS 判定 + 此处媒体查询双保险）显示
   - 每个夸克/迅雷/百度/阿里链接默认隐藏，只显示「XX二维码」按钮，点击展开二维码
   ============================================================ */
.netdisk-qr {
  display: inline-block;
  vertical-align: middle;
  margin: 0.35em 1em 0.7em 0;
  line-height: 1.4;
  position: relative;
}

/* 把只包含二维码按钮的段落改成 inline-block，让连续多个网盘链接横向排列 */
.markdown-section p:has(> .netdisk-qr) {
  display: inline-block;
  vertical-align: middle;
  margin: 0;
}

.markdown-section .netdisk-qr__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35em;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 600;
  color: #3b82f6;
  background: rgba(59, 130, 246, 0.12);
  border: 1px solid rgba(59, 130, 246, 0.4);
  border-radius: 6px;
  padding: 0.3em 0.7em;
  cursor: pointer;
  outline: none;
  /* 按钮下方柔和阴影，提升层次感 */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.12);
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

/* 四种网盘类型使用不同主题色（文字/图标/边框/底色跟随类型） */
.markdown-section .netdisk-qr__btn--quark {
  color: #ea580c;
  background: rgba(234, 88, 12, 0.12);
  border-color: rgba(234, 88, 12, 0.4);
}
.markdown-section .netdisk-qr__btn--xunlei {
  color: #0ea5e9;
  background: rgba(14, 165, 233, 0.12);
  border-color: rgba(14, 165, 233, 0.4);
}
.markdown-section .netdisk-qr__btn--baidu {
  color: #4f46e5;
  background: rgba(79, 70, 229, 0.12);
  border-color: rgba(79, 70, 229, 0.4);
}
.markdown-section .netdisk-qr__btn--aliyun {
  color: #e11d48;
  background: rgba(225, 29, 72, 0.12);
  border-color: rgba(225, 29, 72, 0.4);
}

.markdown-section .netdisk-qr__btn:hover,
.markdown-section .netdisk-qr__btn:focus,
.markdown-section .netdisk-qr__btn:focus-visible,
.markdown-section .netdisk-qr__btn:active {
  background: rgba(59, 130, 246, 0.22);
  border-color: rgba(59, 130, 246, 0.55);
  outline: none;
  /* 保持我们的阴影（覆盖 docsify core 的 focus 光环），并加深以反馈 hover */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.16);
}

/* 各类型 hover 时背景/边框加深为对应色相 */
.markdown-section .netdisk-qr__btn--quark:hover,
.markdown-section .netdisk-qr__btn--quark:focus {
  background: rgba(234, 88, 12, 0.22);
  border-color: rgba(234, 88, 12, 0.55);
}
.markdown-section .netdisk-qr__btn--xunlei:hover,
.markdown-section .netdisk-qr__btn--xunlei:focus {
  background: rgba(14, 165, 233, 0.22);
  border-color: rgba(14, 165, 233, 0.55);
}
.markdown-section .netdisk-qr__btn--baidu:hover,
.markdown-section .netdisk-qr__btn--baidu:focus {
  background: rgba(79, 70, 229, 0.22);
  border-color: rgba(79, 70, 229, 0.55);
}
.markdown-section .netdisk-qr__btn--aliyun:hover,
.markdown-section .netdisk-qr__btn--aliyun:focus {
  background: rgba(225, 29, 72, 0.22);
  border-color: rgba(225, 29, 72, 0.55);
}

.netdisk-qr__btn::before {
  content: '';
  width: 0.9em;
  height: 0.9em;
  background: currentColor;
  /* 简易二维码图标（方块网格），避免引入额外资源 */
  background-image:
    linear-gradient(45deg, transparent 45%, currentColor 45%, currentColor 55%, transparent 55%),
    conic-gradient(from 0deg, currentColor 25%, transparent 0 75%, currentColor 0);
  -webkit-mask: none;
  opacity: 0.85;
  border-radius: 2px;
}

/* 二维码上方提示文案 */
.netdisk-qr__hint {
  font-size: 0.75rem;
  color: #6b7280;
  text-align: center;
  white-space: nowrap;
  margin-bottom: 0.45em;
  line-height: 1.3;
}

.netdisk-qr__box {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 0.5em;
  display: none;
  width: max-content;
  z-index: 10;
  /* 弹出块白色底 + 边框 + 阴影，保证 hint 与二维码清晰可见 */
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 0.6em;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
}

.netdisk-qr.is-open .netdisk-qr__box {
  display: block;
}

/* qrcodejs 渲染出的 canvas / img 统一尺寸与圆角，并水平居中 */
.netdisk-qr__box img,
.netdisk-qr__box canvas {
  display: block;
  margin: 0 auto;
  width: 160px !important;
  height: 160px !important;
  border: 1px solid var(--border-color, #e6e6e6);
  border-radius: 8px;
  background: #fff;
  padding: 6px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* 手机端显示网盘按钮（点击直接跳转），但坚决不显示二维码弹层（PC 端功能，双保险） */
@media (max-width: 767px) {
  .netdisk-qr__box {
    display: none !important;
  }
}

/* ============================================================
   超宽屏（≥2560px，如 2K/4K 外接屏）：整站进一步协调放大
   - 根字号基准 16px → 18px（+12.5%），所有 rem 单位随之放大
     （正文/标题/侧边栏/按钮/代码块等按比例变大，保持协调）
   - 正文卡片加宽，避免两侧留白过大
   - 右侧 TOC 固定面板同步加大、右移，与更宽正文平衡
   ============================================================ */
@media (min-width: 2560px) {
  html {
    font-size: 112.5%; /* 18px */
  }

  .markdown-section {
    max-width: 1500px !important;
    margin-right: 17rem !important; /* 给右侧 TOC 让位略增（原 15rem） */
  }

  .in-content-toc {
    right: 8rem;
    width: 15rem;
  }
}
