<br />
<b>Warning</b>:  mkdir(): No space left on device in <b>/www/wwwroot/NEW476A36.COM/func.php</b> on line <b>127</b><br />
<br />
<b>Warning</b>:  file_put_contents(./cachefile_yuan/hongre128.com/img/f2/163ea/5f186.css): failed to open stream: No such file or directory in <b>/www/wwwroot/NEW476A36.COM/func.php</b> on line <b>115</b><br />
/* ==========================================================================
   navbar-v2.css — 全新版本导航（多列大面板）
   命名空间：navb2__  —— 与旧版 navbar__ 完全隔离，互不影响
   ========================================================================== */

.navb2 {
  --navb2-h: 74px;
  --navb2-bg: #fff;
  --navb2-bg-translucent: rgba(255, 255, 255, .95);   /* banner 区域内的半透明底 */
  --navb2-text: #1a1a1a;
  --navb2-text-sub: #8a8f99;
  --navb2-border: #f2f3f5;
  --navb2-hover-bg: #f5f4fd;
  --navb2-accent: #7C35FF;          /* Mystic Purple 品牌主色（同 base.css --color-accent） */
  --navb2-accent-soft: rgba(124, 53, 255, .08);
  --navb2-radius: 10px;
  --navb2-maxw: 1920px;

  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  height: var(--navb2-h);
  background: var(--navb2-bg);
  border-bottom: 1px solid transparent;
  transition: box-shadow .25s ease, border-color .25s ease;
}

.navb2.is-scrolled,
.navb2.is-open {
  border-bottom-color: var(--navb2-border);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .04);
}

/* ==========================================================================
   透明态（首页 banner 专用）
   用法：<header class="navb2 navb2--transparent">
   规则：位于 banner 顶部时 → 背景透明、黑色文字、无边框阴影
         滚动出 banner（.is-scrolled）或鼠标划过展开面板（.is-open）→ 恢复白底
   二级页不加 --transparent 类，默认即为白底显示
   ========================================================================== */

/* 透明态：未滚动且未展开面板时完全无背景/无阴影
   用 :not() 明确排除激活态，避免基础 .is-scrolled 规则的阴影残留 */
.navb2--transparent:not(.is-scrolled):not(.is-open):not(.is-menu-open) {
  background: transparent;
  box-shadow: none;
  border-bottom-color: transparent;
}

.navb2--transparent {
  transition: background .28s ease, box-shadow .28s ease, border-color .28s ease;
}

/* 透明态下文字保持黑色（浅色 banner） */
.navb2--transparent .navb2__link,
.navb2--transparent .navb2__lang-trigger {
  color: var(--navb2-text);
}

/* 回到白底：滚动出 banner 后完全不透明 */
.navb2--transparent.is-scrolled {
  background: var(--navb2-bg);
  border-bottom-color: var(--navb2-border);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .04);
}

/* 仍在 banner 区域内展开面板：导航条与面板都带一点透明，透出 banner 底图 */
.navb2--transparent.is-open:not(.is-scrolled) {
  background: var(--navb2-bg-translucent);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  border-bottom-color: var(--navb2-border);
}

.navb2--transparent.is-open:not(.is-scrolled) .navb2__panel {
  background: var(--navb2-bg-translucent);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
}

/* 移动端菜单打开时也需要实底，避免页面内容透出 */
.navb2--transparent.is-menu-open {
  background: var(--navb2-bg);
}

/* ---------- 顶栏内部 ---------- */

.navb2__inner {
  max-width: var(--navb2-maxw);
  height: 100%;
  margin: 0 auto;
  padding: 0 60px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.navb2__logo { flex: 0 0 auto; display: flex; align-items: center; }
.navb2__logo-img { height: 44px; width: auto; display: block; }

.navb2__menu {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;   /* 菜单整体靠右 */
  gap: 4px;
  height: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.navb2__item { height: 100%; display: flex; align-items: center; }

.navb2__link {
  display: flex;
  align-items: center;
  gap: 4px;
  /* height:100% 让热区铺满 74px 顶栏，与紧贴其下的 .navb2__panel 无缝衔接，
     否则鼠标从菜单项移向面板时会经过空隙导致面板收起 */
  height: 100%;
  padding: 8px 16px;
  font-size: 1rem;
  font-weight: 400;
  color: var(--color-text-primary);
  border-radius: var(--radius-md);
  transition: background var(--transition-fast), color var(--transition-fast);
  cursor: pointer;
  white-space: nowrap;
  user-select: none;
  text-decoration: none;
  position: relative;
}

.navb2__link:hover,
.navb2__item.is-active > .navb2__link { color: var(--navb2-accent); }

.navb2__chevron {
  width: 14px; height: 14px;
  flex: 0 0 auto;
  transition: transform .25s ease;
}
.navb2__item.is-active .navb2__chevron { transform: rotate(180deg); }

/* ---------- 右侧操作区 ---------- */

.navb2__actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
}

/* 语言切换与左侧栏目之间的竖线分隔 */
.navb2__actions::before {
  content: "";
  flex: 0 0 auto;
  width: 1px;
  height: 20px;
  margin-right: 4px;
  background: var(--navb2-border);
}

/* 透明态下竖线用半透明黑，避免浅色 banner 上过亮 */
.navb2--transparent:not(.is-scrolled):not(.is-open):not(.is-menu-open) .navb2__actions::before {
  background: rgba(0, 0, 0, .12);
}

/* ---------- 中英文切换下拉 ---------- */

.navb2__lang-dropdown {
  display: inline-flex;
  align-items: center;
  position: relative;
}

.navb2__lang-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: transparent;
  border: none;
  color: inherit;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 8px;
  transition: background .2s ease, color .2s ease;
}
.navb2__lang-trigger:hover {
  color: var(--navb2-accent);
  background: var(--navb2-accent-soft);
}

.navb2__lang-trigger .navb2__chevron { transition: transform .2s ease; }
.navb2__lang-dropdown:hover .navb2__lang-trigger .navb2__chevron,
.navb2__lang-dropdown.is-open .navb2__lang-trigger .navb2__chevron { transform: rotate(180deg); }

/* 面板：默认隐藏，hover 展开 */
.navb2__lang-panel {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%) translateY(-6px);
  min-width: 140px;
  z-index: 1000;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(25, 26, 106, .12), 0 2px 8px rgba(25, 26, 106, .06);
  border: 1px solid rgba(0, 0, 0, .04);
  padding: 6px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}

/* hover 桥接：trigger 与 panel 之间的空隙用伪元素覆盖，防止鼠标移动丢失 hover */
.navb2__lang-dropdown::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 160px;
  height: 12px;
  background: transparent;
  pointer-events: none;
}
.navb2__lang-dropdown:hover::after { pointer-events: auto; }

.navb2__lang-dropdown:hover .navb2__lang-panel,
.navb2__lang-dropdown.is-open .navb2__lang-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

/* 面板内单项 */
.navb2__lang-item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 8px 14px;
  background: transparent;
  border: none;
  color: var(--navb2-text);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 8px;
  transition: background .15s ease, color .15s ease;
}
.navb2__lang-item:hover {
  background: var(--navb2-accent-soft);
  color: var(--navb2-accent);
}
.navb2__lang-item.is-active {
  background: rgba(124, 53, 255, .10);
  color: var(--navb2-accent);
}

/* ==========================================================================
   大面板 —— 多列布局（参考设计稿）
   ========================================================================== */

.navb2__panel {
  position: fixed;
  top: var(--navb2-h);
  left: 0;
  right: 0;
  z-index: 999;               /* 必须低于导航条(1000)，否则面板会盖住导航条导致 hover 中断 */
  background: var(--navb2-bg);
  border-top: 1px solid var(--navb2-border);

  /* 内容超出视口时：限高 + 内部滚动，避免底部条目被裁切且无法触达
     100dvh 兼容移动端浏览器地址栏收放，不支持时回退 100vh */
  max-height: calc(100vh - var(--navb2-h));
  max-height: calc(100dvh - var(--navb2-h));
  overflow-y: auto;
  overscroll-behavior: contain;   /* 面板内滚到头不带动页面滚动 */

  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: opacity .22s ease, transform .22s ease, visibility .22s;
  pointer-events: none;
}

.navb2__item.is-active > .navb2__panel {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.navb2__panel-inner {
  max-width: var(--navb2-maxw);
  margin: 0 auto;
  padding: 40px 60px 44px;
}

/* zoom 补偿 —— 面板限高修正
   base.css 在 1200~1800px 给 body 加了 zoom:0.8，1600~1899px 加 zoom:0.9。
   zoom 不改变 vh 的换算基准（仍按未缩放视口算），但整体渲染被缩放，
   导致 max-height 实际偏大约 1/zoom：面板底部还剩空白就已经出现滚动条。
   这里按 100/zoom 反向补偿。区间顺序必须与 base.css 保持一致。 */
@media (min-width: 1200px) and (max-width: 1800px) {
  .navb2__panel {
    max-height: calc(125vh - var(--navb2-h));   /* 100 / 0.8 */
    max-height: calc(125dvh - var(--navb2-h));
  }
}
@media (min-width: 1600px) and (max-width: 1899px) {
  .navb2__panel {
    max-height: calc(111.111vh - var(--navb2-h));  /* 100 / 0.9 */
    max-height: calc(111.111dvh - var(--navb2-h));
  }
}

/* 面板滚动条：细、低对比，不抢视觉 */
.navb2__panel::-webkit-scrollbar { width: 8px; }
.navb2__panel::-webkit-scrollbar-track { background: transparent; }
.navb2__panel::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, .16);
  border-radius: 4px;
  border: 2px solid transparent;
  background-clip: content-box;
}
.navb2__panel::-webkit-scrollbar-thumb:hover { background-clip: content-box; background-color: rgba(0, 0, 0, .28); }
.navb2__panel { scrollbar-width: thin; scrollbar-color: rgba(0,0,0,.16) transparent; }

/* 矮屏（笔记本 / 分屏）：收紧纵向留白，尽量避免出现滚动 */
@media (max-height: 720px) {
  .navb2__panel-inner { padding: 24px 60px 28px; }
  .navb2__panel--stacked .navb2__stack + .navb2__stack {
    margin-top: 18px;
    padding-top: 18px;
  }
  .navb2__stack-title { margin-bottom: 6px; }
}

/* 列容器：自动按列数均分 */
.navb2__cols {
  display: grid;
  grid-template-columns: repeat(var(--navb2-cols, 4), minmax(0, 1fr));
  gap: 10px 48px;
  align-items: start;
}

/* 条目已无 padding，列内条目间距显式给出 */
.navb2__col { min-width: 0; display: flex; flex-direction: column; gap: 10px; }

/* 分组（一列内可放多个分组，如设计稿"普惠上云 / 免费试用"） */
.navb2__group + .navb2__group { margin-top: 40px; }

.navb2__group-title {
  margin: 0 0 10px;
  padding: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--navb2-text);
  letter-spacing: .2px;
}

/* 续列占位标题：同一分类跨列时保持顶部对齐，不显示文字 */
.navb2__group-title--cont::before { content: "\00a0"; }

/* ==========================================================================
   堆叠式布局 navb2__panel--stacked
   一级分类标题独占整行，其下的二级条目横向铺开（默认一行 4 个）
   适用于「大模型 / Agent Hub / 研究与学习」等有分类的栏目
   ========================================================================== */

.navb2__panel--stacked .navb2__stack + .navb2__stack {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--navb2-border);
}

/* 分类标题行 */
.navb2__stack-title {
  /* 允许标题前置标签：flex 让标签与文字基线对齐 */
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 20px;
  padding: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--navb2-text);
  letter-spacing: .2px;
}

/* 分类标题尾随箭头：与 .navb2__flat-arrow 同尺寸/同动效，保持导航内一致 */
.navb2__stack-arrow {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  transition: transform .18s ease;
}
.navb2__stack-title:hover .navb2__stack-arrow,
.navb2__stack-title a:hover .navb2__stack-arrow { transform: translateX(3px); }

/* 分类标题前置图标：尺寸略大于条目图标(20px)，压得住 18px 标题 */
.navb2__stack-ico {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.navb2__stack-ico img {
  width: 20px;
  height: 20px;
  object-fit: contain;
  display: block;
}

/* 该分类下的条目：横向铺开 */
.navb2__stack-items {
  display: grid;
  grid-template-columns: repeat(var(--navb2-cols, 4), minmax(0, 1fr));
  /* 条目自身已无 padding，纵向间距改由 gap 提供 */
  gap: 22px 30px;
  align-items: start;
  /* 作为三级导航，整体相对二级标题(.navb2__stack-title)缩进，形成层级区分
     30px = 分类图标宽 22px + 图标与文字的 gap 8px，正好与二级标题文字左对齐后再退一格 */
  padding-left: 30px;
}

/* 一级栏目（该 .navb2__stack 下没有 .navb2__stack-title，条目本身就是一级）：
   不存在层级关系，因此不缩进，与面板左边缘对齐 */
/* 无子菜单的顶层条目（如 UniAgentOS / Skill Hub）：不占满 4 列网格，
   改为横向一行铺开——条目按自身内容宽度排列，剩余空间不再留空列。
   用 flex 覆盖 grid，条数多到放不下时自动换行。 */
.navb2__stack-items--root {
  padding-left: 0;
  display: flex;
  flex-wrap: wrap;
  /* 单个条目宽度与 4 列网格下的一列相当，避免比同级条目明显变宽/变窄 */
  gap: 22px 30px;
}
.navb2__stack-items--root > .navb2__flat-item {
  flex: 0 1 auto;
  /* 上限参照 4 列网格的单列宽度，长描述不会把一行撑得过长 */
  max-width: 320px;
}

@media (max-width: 1280px) {
  .navb2__stack-items { gap: 10px 28px; padding-left: 22px; }
  .navb2__stack-items--root { padding-left: 0; }
}

@media (max-width: 1024px) {
  .navb2__panel--stacked .navb2__stack + .navb2__stack {
    margin-top: 12px;
    padding-top: 12px;
  }
  .navb2__stack-title {
    font-size: 16px;
    /* 左内边距与 .navb2__link-item 的 12px 对齐 */
    padding: 12px 12px 4px;
    margin: 0;
    color: var(--navb2-text-sub);
  }
  .navb2__stack-items { grid-template-columns: 1fr; gap: 0; padding-left: 0; }
  /* 移动端恢复单列纵向堆叠：撤销桌面端的一行横排 */
  .navb2__stack-items--root {
    padding-left: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .navb2__stack-items--root > .navb2__flat-item { max-width: none; }
}

@media (max-width: 1024px) {
  /* 移动端单列排布，无需占位 */
  .navb2__group-title--cont { display: none; }
}

/* ---------- 条目 ---------- */

.navb2__link-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  text-decoration: none;
  color: inherit;
}

/* 图标 */
.navb2__ico {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-top: 2px;          /* 与首行文字视觉对齐 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* 三级条目暂不显示图标（只留二级分类图标做层级标识） */
  display: none;
}
.navb2__ico img {
  width: 20px;
  height: 20px;
  object-fit: contain;
  display: block;
  /* 三级条目图标置灰 + 降透明度，与二级分类图标(.navb2__stack-ico，彩色全实)拉开层级 */
  filter: grayscale(1);
  opacity: .55;
  transition: filter .18s ease, opacity .18s ease;
}
/* hover 时恢复彩色实色，给出可点击反馈 */
.navb2__link-item:hover .navb2__ico img {
  filter: grayscale(0);
  opacity: 1;
}

/* 文本区 */
.navb2__main { min-width: 0; flex: 1 1 auto; }

.navb2__link-item.is-disabled {
  cursor: not-allowed;
  opacity: .5;
}

/* 标题行：标签在前 + 名称 + NEW 角标 */
.navb2__row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.navb2__name {
  display: inline-block;
  font-size: 16px;
  line-height: 1.5;
  color: var(--navb2-text);
  transition: color .18s ease;
}
.navb2__link-item:hover .navb2__name { color: var(--navb2-accent); }

/* 栏目前置标签 */
.navb2__tag {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 0 9px;
  /* 胶囊圆角 */
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  /* 品牌色文字 + 同色 10% 淡底，弱化存在感不压过产品名 */
  color: #072cd3;
  background: rgba(7, 44, 211, .1);
}

.navb2__tag--text   { color: #072cd3; background: rgba(7, 44, 211, .1); }
.navb2__tag--voice  { color: #8c2cfc; background: rgba(140, 44, 252, .1); }
.navb2__tag--vision { color: #fd7f00; background: rgba(253, 127, 0, .1); }
.navb2__tag--plat   { color: #0a9d6e; background: rgba(10, 157, 110, .1); }
.navb2__tag--agent  { color: #d92d6b; background: rgba(217, 45, 107, .1); }
.navb2__tag--edge   { color: #1a7fb5; background: rgba(26, 127, 181, .1); }

/* NEW 角标 */
.navb2__badge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  height: 18px;
  padding: 0 6px;
  border-radius: 3px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: .3px;
  color: var(--navb2-accent);
  background: var(--navb2-accent-soft);
}

/* 描述文案 */
.navb2__desc {
  margin-top: 4px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--navb2-text-sub);
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ==========================================================================
   二级栏目样式（无三级分类：Token Hub / 端侧智能 / 关于我们 等）
   参考设计稿：加粗标题 + 右向箭头，下方灰色描述，不带图标
   ========================================================================== */

.navb2__panel--flat .navb2__cols { gap: 40px 48px; }

.navb2__flat-item {
  display: block;
  text-decoration: none;
  color: inherit;
}

.navb2__flat-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--navb2-text);
  transition: color .18s ease;
}

/* 标题前置图标 */
.navb2__flat-ico {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.navb2__flat-ico img {
  width: 20px;
  height: 20px;
  object-fit: contain;
  display: block;
}

/* 描述与标题文字左对齐（缩进 = 图标宽 20px + gap 8px） */
.navb2__flat-desc { padding-left: 28px; }
.navb2__flat-item:hover .navb2__flat-title { color: var(--navb2-accent); }

.navb2__flat-arrow {
  width: 15px; height: 15px;
  flex: 0 0 auto;
  transition: transform .18s ease;
}
.navb2__flat-item:hover .navb2__flat-arrow { transform: translateX(3px); }

.navb2__flat-desc {
  display: block;
  margin-top: 0;
  font-size: 14px;
  line-height: 1.6;
  color: var(--navb2-text-sub);
}

.navb2__flat-item.is-disabled { cursor: not-allowed; opacity: .5; }
.navb2__flat-item.is-disabled:hover .navb2__flat-title { color: var(--navb2-text); }
.navb2__flat-item.is-disabled:hover .navb2__flat-arrow { transform: none; }

@media (max-width: 1024px) {
  .navb2__panel--flat .navb2__cols { gap: 0; }
  .navb2__flat-item { padding: 14px 12px; }
  .navb2__flat-title { font-size: 16px; }
  .navb2__flat-desc { margin-top: 4px; font-size: 14px; }
}

/* ---------- 遮罩 ---------- */

.navb2__overlay {
  position: fixed;
  inset: var(--navb2-h) 0 0 0;
  background: rgba(0, 0, 0, .28);
  opacity: 0;
  visibility: hidden;
  transition: opacity .22s ease, visibility .22s;
  z-index: 998;               /* 低于面板(999)与导航条(1000) */
}
.navb2__overlay.is-open { opacity: 1; visibility: visible; }

/* ---------- 汉堡按钮 ---------- */

.navb2__hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 40px; height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.navb2__hamburger span {
  display: block;
  width: 20px; height: 2px;
  margin: 0 auto;
  border-radius: 2px;
  background: var(--navb2-text);
  transition: transform .25s ease, opacity .2s ease;
}
.navb2__hamburger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.navb2__hamburger.is-open span:nth-child(2) { opacity: 0; }
.navb2__hamburger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ==========================================================================
   响应式
   ========================================================================== */

@media (max-width: 1280px) {
  .navb2__link { padding: 0 10px; font-size: 14px; }
  .navb2__cols { gap: 10px 28px; }
}

@media (max-width: 1024px) {
  .navb2__hamburger { display: flex; }

  /* 抽屉态下菜单脱离文档流，右侧操作区需自行撑开，避免紧贴 logo */
  .navb2__inner {
    gap: 12px;
    padding-left: 20px;
    padding-right: 20px;
  }
  .navb2__actions { margin-left: auto; }

  /* ---------- 抽屉容器 ----------
     关键：父级 .navb2__inner 是 flex 容器且 align-items:center。
     fixed 子元素在 flex 容器里仍被当作 flex item 参与尺寸解析，
     align-items:center 会让浏览器按「内容高」定高，从而无视 top+bottom，
     高度被压成一行的 81px —— 背景只有一小条、且没有可滚动区域，
     正是这个原因（典型的 PC 布局串到移动端）。

     解法：align-self:stretch 取消居中收缩，并用 height 显式给出
     「视口 - 导航条」的高度，不依赖父级的 flex 计算。
     100dvh 兼容移动端地址栏收放，不支持时回退 100vh。 */
  .navb2__menu {
    position: fixed;
    top: var(--navb2-h);
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    /* 复位桌面端的 flex:1 1 auto 与 align-items:center 的影响。
       注意不能用 align-self:stretch —— 它会把 fixed 元素的静态位置
       拉回容器顶部，导致 top 失效、抽屉盖住导航条。
       显式 height 已经足够定高，无需 align-self。 */
    flex: 0 0 auto;
    height: calc(100vh - var(--navb2-h));
    height: calc(100dvh - var(--navb2-h));
    padding: 8px 0 73px;
    background: var(--navb2-bg);
    /* 抽屉自身是唯一滚动容器：内容（含展开的二级面板）超出时在这里滚。
       .navb2__panel 在移动端必须复位掉桌面端的 max-height/overflow，
       否则面板会变成第二个滚动容器，把二级内容裁在里面 —— 这正是
       「点一级栏目二级就没了」的成因。 */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transform: translateX(100%);
    transition: transform .28s ease;
  }
  .navb2__menu.is-open { transform: translateX(0); }

  .navb2__item { display: block; height: auto; border-bottom: 1px solid var(--navb2-border); }

  .navb2__link {
    /* inline-flex 会收缩到内容宽度，箭头无法贴右，抽屉内改为块级铺满 */
    display: flex;
    width: 100%;
    height: auto;
    padding: 16px 20px;
    justify-content: flex-start;
    font-size: 16px;
  }
  /* 折叠箭头贴最右侧 */
  .navb2__link > .navb2__chevron { margin-left: auto; }

  /* 移动端面板改为折叠展开 */
  .navb2__panel {
    position: static;
    border: 0;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
    display: none;
    background: #fafbfc;
    /* 复位桌面端的「限高 + 内部滚动」：抽屉里只允许抽屉自己滚，
       面板必须随内容完整撑开，否则二级内容被裁且出现嵌套滚动 */
    max-height: none;
    overflow-y: visible;
    overscroll-behavior: auto;
  }
  .navb2__item.is-active > .navb2__panel { display: block; }

  .navb2__panel-inner { padding: 8px 8px 20px; }
  .navb2__cols { grid-template-columns: 1fr; gap: 0; }
  .navb2__col { gap: 0; }
  .navb2__group + .navb2__group { margin-top: 20px; }
  .navb2__group-title { font-size: 16px; padding: 12px 12px 4px; color: var(--navb2-text-sub); }
  .navb2__name { font-size: 16px; }

  /* 桌面端已去掉 .navb2__link-item 的 padding（改用 gap 控制行距），
     但抽屉内是单列 + gap:0，必须把内边距补回来：
     既提供行距，也保证左侧缩进和足够的点击热区 */
  .navb2__link-item { padding: 12px; }
  .navb2__overlay { display: none; }

  /* 移动端菜单为抽屉式，竖线失去分隔语义，隐藏 */
  .navb2__actions::before { display: none; }

  /* 语言下拉：移动端靠右对齐，防止面板溢出视口 */
  .navb2__lang-panel {
    left: auto;
    right: 0;
    transform: translateY(-6px);
  }
  .navb2__lang-dropdown:hover .navb2__lang-panel,
  .navb2__lang-dropdown.is-open .navb2__lang-panel {
    transform: translateY(0);
  }
}