/* 三级栏目导航沿用二级导航的 1440px 内容宽度与页面常用的 40px 间距。 */
.notification-category-nav {
  width: 1440px;
  margin: 0 auto;
  padding-top: 40px;
  /* 二级菜单宽 160px，“全部”宽 76px，左侧补 42px 使两者中心上下对齐。 */
  padding-left: 42px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

/* 字号与列表标题统一为 18px，使用页面正文色和紧凑圆角，保持三级导航的层级。 */
.notification-category-nav a {
  display: flex;
  min-height: 48px;
  padding: 10px 20px;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  color: var(--text);
  font-size: 18px;
  line-height: 28px;
  white-space: nowrap;
}

/* 当前栏目及悬停项沿用全站主题蓝，底色使用同色的低透明度，避免颜色割裂。 */
.notification-category-nav a.active,
.notification-category-nav a:hover {
  color: var(--blue);
  background: rgba(22, 92, 145, .08);
}

/* 键盘聚焦保留明确轮廓，便于直接通过回车跳转栏目。 */
.notification-category-nav a:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: -2px;
}

/* 手机端沿用公共设备判断，隐藏二级导航，三级栏目改为纵向排列。 */
html.is-mobile .notification-filter-page .inner-subnav { display: none; }
html.is-mobile .notification-category-nav {
  width: auto;
  margin: 0 16px;
  padding-top: 24px;
  /* 手机端隐藏二级导航，取消桌面对齐偏移，保持原有纵向布局。 */
  padding-left: 0;
  flex-direction: column;
  gap: 4px;
}
html.is-mobile .notification-category-nav a {
  min-height: 44px;
  padding: 10px 16px;
  justify-content: flex-start;
  font-size: 16px;
  line-height: 24px;
}