@charset "utf-8";
/* =============================================================
   东阳木雕专题 · 三级左侧导航（三级目录）
   独立文件，不并入全站 style.css；命名空间 .mnav-
   仅注入 topics/mudiao.html 与 topics/mudiao/*.html
   层级：L1 专题 → L2 模块 → L3 模块内条目（章节 / 详页）
   ============================================================= */

:root { --mnav-w: 272px; --mnav-railw: 48px; --mnav-top: 92px; }

/* ---------- 内容让位 ---------- */
html.mnav-open body { padding-left: var(--mnav-w); }
html.mnav-rail body { padding-left: var(--mnav-railw); }

/* ---------- 容器 ---------- */
#mnav {
  position: fixed; left: 0; top: 0; bottom: 0; width: var(--mnav-w); z-index: 90;
  display: flex; flex-direction: column;
  background: #fff; border-right: 1px solid var(--line);
  font-family: var(--font-sans); font-size: 13px; line-height: 1.6;
  transition: width .22s ease, transform .26s ease;
}
#mnav, #mnav *, #mnav-bd, #mnav-fab { box-sizing: border-box; }

/* ---------- 完整态 ---------- */
.mnav-full { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.mnav-mini { display: none; }

/* 品牌区（与全站 topbar 同色，左侧无缝衔接） */
.mnav-hd {
  flex: 0 0 auto; position: relative; padding: 15px 44px 15px 18px;
  background: var(--pku-red-dark, #6E0508);
}
.mnav-hd .k { font-size: 9.5px; letter-spacing: 2.1px; color: rgba(255,255,255,.62); font-weight: 600; }
.mnav-hd .t { font-family: var(--font-serif); font-size: 16px; margin-top: 5px; line-height: 1.4; }
.mnav-hd .t a { color: #fff; text-decoration: none; }
.mnav-hd .t a:hover { color: #FFD9D9; }
.mnav-hd .s { font-size: 11px; color: rgba(255,255,255,.58); margin-top: 3px; }

.mnav-x {
  position: absolute; right: 11px; top: 15px; width: 26px; height: 26px; padding: 0;
  border: 1px solid rgba(255,255,255,.34); background: transparent; border-radius: 7px;
  color: rgba(255,255,255,.85); font-size: 15px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.mnav-x:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.6); color: #fff; }

/* 当前位置面包屑 */
.mnav-crumb {
  flex: 0 0 auto; padding: 9px 16px; border-bottom: 1px solid var(--line);
  background: #FBFAF8; font-size: 11.5px; color: var(--ink-mute);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mnav-crumb b { color: var(--pku-red); font-weight: 600; }
.mnav-crumb i { font-style: normal; color: #C9C2B9; margin: 0 5px; }

/* 滚动区 */
.mnav-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 2px 0 40px; }
.mnav-body::-webkit-scrollbar { width: 8px; }
.mnav-body::-webkit-scrollbar-thumb { background: #E2DED8; border-radius: 4px; }
.mnav-body::-webkit-scrollbar-thumb:hover { background: #CFC9C1; }

/* 分组标题 */
.mnav-g { margin: 15px 17px 5px; font-size: 10.5px; letter-spacing: 1.4px; color: var(--ink-mute); font-weight: 600; }
.mnav-g::before {
  content: ""; display: inline-block; width: 12px; height: 2px; border-radius: 2px;
  background: var(--pku-red); vertical-align: middle; margin-right: 7px;
}
/* ★ 总纲组（全站收敛页）：整组加重，永远排第一 */
.mnav-g-star { color: var(--pku-red); }
.mnav-g-star::before { width: 15px; }

/* ---------- L2 模块行 ---------- */
.mnav-item { margin: 1px 0; }
.mnav-row { display: flex; align-items: stretch; }
.mnav-m {
  flex: 1 1 auto; min-width: 0; display: flex; gap: 9px; align-items: flex-start;
  padding: 8px 2px 8px 17px; color: var(--ink); text-decoration: none;
  border-left: 2px solid transparent; transition: background .16s, color .16s;
}
.mnav-m:hover { background: #F7F4F1; color: var(--pku-red); }
/* ★ 六组版：编号降权 —— 只作稳定引用锚（正文有交叉引用），不作排序依据 */
.mnav-m .no {
  flex: 0 0 auto; min-width: 15px; font-family: var(--font-serif);
  font-size: 10px; font-weight: 400; letter-spacing: 0; color: #CFC9C1; padding-top: 4px;
}
.mnav-m .nm { flex: 1 1 auto; min-width: 0; }
.mnav-item.on > .mnav-row > .mnav-m {
  background: var(--pku-red-light); border-left-color: var(--pku-red);
  color: var(--pku-red); font-weight: 600;
}
.mnav-item.on > .mnav-row > .mnav-m .no { color: var(--pku-red); font-weight: 400; opacity: .7; }
.mnav-tg {
  flex: 0 0 auto; width: 30px; padding: 0; border: 0; background: transparent;
  cursor: pointer; color: #BEB7AE; font-size: 10px; line-height: 1;
}
.mnav-tg span { display: inline-block; transition: transform .18s ease; }
.mnav-tg:hover { color: var(--pku-red); }
.mnav-item.open > .mnav-row > .mnav-tg { color: var(--pku-red); }
.mnav-item.open > .mnav-row > .mnav-tg span { transform: rotate(90deg); }

/* ---------- L3 条目行 ---------- */
.mnav-subs { display: none; padding: 1px 0 8px; }
.mnav-item.open > .mnav-subs { display: block; }
.mnav-srow { display: flex; align-items: stretch; }
.mnav-s {
  flex: 1 1 auto; min-width: 0; display: flex; gap: 8px; align-items: flex-start;
  padding: 5px 2px 5px 29px; color: var(--ink-soft); text-decoration: none;
  font-size: 12.6px; line-height: 1.55; border-left: 2px solid transparent;
  transition: background .16s, color .16s;
}
.mnav-s .dt {
  flex: 0 0 auto; width: 5px; height: 5px; margin-top: 7px; border-radius: 50%;
  background: #D6D0C8; transition: background .16s, box-shadow .16s;
}
.mnav-s .tx { flex: 1 1 auto; min-width: 0; }
.mnav-s:hover { color: var(--pku-red); background: #F9F7F4; }
.mnav-s:hover .dt { background: var(--pku-red); }
.mnav-s.on { color: var(--pku-red); font-weight: 600; }
.mnav-s.on .dt { background: var(--pku-red); box-shadow: 0 0 0 3px rgba(148,7,10,.13); }
.mnav-d {
  flex: 0 0 auto; width: 24px; margin: 3px 7px 3px 0; border-radius: 5px;
  display: flex; align-items: center; justify-content: center;
  color: #C6C0B8; text-decoration: none; font-size: 12px;
}
.mnav-d:hover { color: #fff; background: var(--pku-red); }

/* ---------- 收起态（窄轨） ---------- */
html.mnav-rail #mnav { width: var(--mnav-railw); }
html.mnav-rail .mnav-full { display: none; }
html.mnav-rail .mnav-mini {
  display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0;
  align-items: center; padding-top: 11px; overflow-y: auto;
}
.mnav-mini::-webkit-scrollbar { width: 0; }
.mnav-x2 {
  width: 30px; height: 30px; margin-bottom: 10px; padding: 0; flex: 0 0 auto;
  border: 1px solid var(--line); background: #fff; border-radius: 8px;
  color: var(--ink-mute); font-size: 14px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.mnav-x2:hover { border-color: var(--pku-red); color: var(--pku-red); }
.mnav-rail-list { display: flex; flex-direction: column; align-items: center; gap: 2px; padding-bottom: 18px; }
.mnav-rl {
  width: 34px; padding: 6px 0; border-radius: 7px; text-align: center; text-decoration: none;
  font-family: var(--font-serif); font-size: 11.5px; font-weight: 700; color: #A9A29A;
}
.mnav-rl:hover { background: #F5F2EE; color: var(--pku-red); }
.mnav-rl.on { background: var(--pku-red); color: #fff; }
.mnav-rl.sep { width: 20px; height: 1px; padding: 0; background: var(--line); margin: 6px 0; }

/* 完整目录已展示「本模块」全部条目时，收起页面内重复的胶囊页签；
   窄轨态与移动端保留（此时左栏不显示 L3，仍需页内页签指路）。 */
html.mnav-open .md-subnav { display: none; }

/* 移动端专属，桌面隐藏 */
#mnav-bd, #mnav-fab { display: none; }

/* ---------- 移动端：抽屉 ---------- */
@media (max-width: 959px) {
  html.mnav-open body, html.mnav-rail body, html.mnav-mob body { padding-left: 0 !important; }
  #mnav {
    width: min(86vw, 320px); z-index: 210;
    transform: translateX(-100%); box-shadow: 0 0 0 rgba(0,0,0,0);
  }
  html.mnav-rail #mnav { width: min(86vw, 320px); }
  #mnav .mnav-full { display: flex !important; }
  #mnav .mnav-mini { display: none !important; }
  html.mnav-drawer #mnav { transform: translateX(0); box-shadow: 0 12px 48px rgba(0,0,0,.28); }

  #mnav-bd {
    display: block; position: fixed; inset: 0; z-index: 200;
    background: rgba(24,18,15,.46); opacity: 0; pointer-events: none;
    transition: opacity .24s ease;
  }
  html.mnav-drawer #mnav-bd { opacity: 1; pointer-events: auto; }

  #mnav-fab {
    display: flex; align-items: center; gap: 6px;
    position: fixed; left: 14px; bottom: 16px; z-index: 190;
    height: 42px; padding: 0 15px 0 13px; border: 0; border-radius: 21px;
    background: var(--pku-red); color: #fff; font-size: 13px; font-family: var(--font-sans);
    cursor: pointer; box-shadow: 0 6px 20px rgba(148,7,10,.34);
  }
  #mnav-fab span:first-child { font-size: 14px; line-height: 1; }
  html.mnav-drawer #mnav-fab { display: none; }
}

/* =============================================================
   页眉适配（关键）
   站点顶部主导航的自然宽度 = 品牌 387 + 导航 664 = 1051px，
   故 style.css 把折叠断点定在 1100px。左栏一旦占位，内容盒变窄，
   1101–1373px 区间会横向溢出 —— 这里按「可用宽度」等效前移。
   品牌区缩放值直接复用站点自身 @media(max-width:960px) 的做法，
   不触碰站点主导航的结构与交互。
   ============================================================= */
@media (min-width: 1260px) and (max-width: 1373px) {
  html.mnav-open .brand-logo { height: 30px; }
  html.mnav-open .brand-divider { height: 22px; }
  html.mnav-open .brand-sub { font-size: 15px; letter-spacing: .5px; }
}
@media (min-width: 1101px) and (max-width: 1148px) {
  html.mnav-rail .brand-logo { height: 30px; }
  html.mnav-rail .brand-divider { height: 22px; }
  html.mnav-rail .brand-sub { font-size: 15px; letter-spacing: .5px; }
}

/* =============================================================
   中窄桌面（960–1259px）：展开态退回「浮层」
   此时按钮式推挤会把内容盒压到 1100px 断点以下，页眉必然溢出；
   浮层不改变内容宽度，只把三级目录临时覆盖在页面上。
   ============================================================= */
@media (min-width: 960px) and (max-width: 1259px) {
  html.mnav-open body { padding-left: var(--mnav-railw); }
  html.mnav-open #mnav {
    width: var(--mnav-w); z-index: 120;
    box-shadow: 0 10px 44px rgba(46,26,20,.22);
  }
  html.mnav-open #mnav-bd {
    display: block; position: fixed; inset: 0; z-index: 110;
    background: rgba(24,18,15,.22); opacity: 1; pointer-events: auto;
  }
}

/* 2026-09-28 六组版：条目级「新增」徽章已全部移除（生产语言不外泄），
   原 .mnav-m .mnav-nb / .mnav-rl.mnav-nw 两段随之删除。 */

/* =============================================================
   跨页延伸导航 .mdx-*（2026-09-28 · 六组版）
   页底一块：所属组 · 上一篇/下一篇 · 相关模块 · 全站六组地图
   命名空间独立，不碰站点既有 .md- / .mdq- / .mdp- 等
   ============================================================= */
.mdx-note { font-size:12.5px; color:var(--ink-mute); line-height:1.9; margin:-4px 0 22px; }
.mdx-note i { font-style:normal; padding:1px 9px; border-radius:20px;
  background:var(--pku-red-light); color:var(--pku-red); font-size:11.5px; margin-right:8px; }
.mdx-note b { color:var(--ink-soft); }

.mdx-pn { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-bottom:26px; }
.mdx-pn a { display:block; border:1px solid var(--line); border-radius:10px;
  padding:16px 18px; background:#fff; text-decoration:none; transition:all .18s; }
.mdx-pn a:hover { border-color:var(--pku-red); box-shadow:0 6px 20px rgba(74,4,7,.08); }
.mdx-pn .k { display:block; font-size:11.5px; color:var(--ink-mute); letter-spacing:1px; }
.mdx-pn .t { display:block; font-family:var(--font-serif); font-size:16px; color:var(--ink); margin-top:6px; }
.mdx-pn a:hover .t { color:var(--pku-red); }
.mdx-pn .nx { text-align:right; }

.mdx-h { font-size:13px; color:var(--ink-mute); letter-spacing:1px; margin:0 0 12px; }
.mdx-h::before { content:""; display:inline-block; width:14px; height:2px; border-radius:2px;
  background:var(--pku-red); vertical-align:middle; margin-right:8px; }
.mdx-rel { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:30px; }
.mdx-rel a { display:block; border:1px solid var(--line); border-radius:10px;
  padding:14px 16px; background:#fff; text-decoration:none; transition:all .18s; }
.mdx-rel a:hover { border-color:var(--pku-red); background:var(--pku-red-light); }
.mdx-rel b { display:block; font-size:14px; color:var(--ink); margin-bottom:5px; }
.mdx-rel span { display:block; font-size:12.5px; color:var(--ink-mute); line-height:1.7; }
.mdx-rel a:hover b { color:var(--pku-red); }

.mdx-groups { display:grid; gap:12px; }
.mdx-g { border:1px solid var(--line); border-radius:12px; background:#fff; padding:14px 16px 16px; }
.mdx-gt { display:flex; align-items:center; gap:8px; font-size:12px; letter-spacing:1.2px;
  color:var(--ink-mute); margin-bottom:11px; }
.mdx-gt::before { content:""; width:14px; height:2px; border-radius:2px; background:var(--pku-red); }
.mdx-g-star { border-color:#EDD; background:#FFFCFC; }
.mdx-g-star .mdx-gt { color:var(--pku-red); font-weight:600; }
.mdx-cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.mdx-c { display:block; padding:12px 14px; border:1px solid var(--line);
  border-radius:9px; background:#fff; text-decoration:none; transition:all .18s; }
.mdx-c b { display:block; font-family:var(--font-serif); font-size:10.5px; letter-spacing:1.2px;
  color:#C6C0B8; font-weight:400; margin-bottom:4px; }
.mdx-c span { display:block; font-size:13.5px; color:var(--ink); line-height:1.5; }
.mdx-c:hover { border-color:var(--pku-red); background:var(--pku-red-light); }
.mdx-c:hover b, .mdx-c:hover span { color:var(--pku-red); }
.mdx-c.on { background:var(--pku-red-light); border-color:var(--pku-red); }
.mdx-c.on b, .mdx-c.on span { color:var(--pku-red); }
.mdx-c.on span { font-weight:600; }

@media (max-width:1000px) {
  .mdx-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mdx-rel { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:700px) {
  .mdx-cards, .mdx-rel, .mdx-pn { grid-template-columns:1fr; }
}

/* ---------- 打印 ---------- */
@media print {
  #mnav, #mnav-fab, #mnav-bd { display: none !important; }
  html.mnav-open body, html.mnav-rail body { padding-left: 0 !important; }
}
