/* ===== 顶部导航 =====
 * 从 base.css 里拆出来给编辑器也用（编辑页只引 editor.css，不引 base.css）。
 * 样式只有这一份：哪个页面引它，菜单长得都一样。
 * 结构由 assets/js/nav.js 按 LIST 渲染，这里只管长相。
 */
.nav {
  position: sticky; top: 0; z-index: 50; flex: 0 0 auto;
  background: rgba(255, 255, 255, .92); backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
}
/* 不依赖 base.css 的 .wrap：编辑器没引 base.css 也能自己撑开 */
.nav__inner {
  max-width: 1140px; margin: 0 auto; padding: 0 20px;
  display: flex; align-items: center; gap: 22px; height: 60px;
}
.logo {
  font-weight: 800; font-size: 19px; color: var(--brand);
  display: flex; align-items: center; gap: 8px; flex: 0 0 auto;
}
.logo .dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
}
.nav__links { display: flex; gap: 20px; margin-left: 8px; font-size: 14px; color: var(--muted); }
.nav__links a { white-space: nowrap; }
.nav__links a:hover { color: var(--brand); }
/* 当前页高亮：只有 nav.js 一处判断，所有页面同一套规则 */
.nav__links a.is-active { color: var(--brand); font-weight: 600; }
.nav__spacer { flex: 1; }

/* 链接区滑得动时，右边缘渐隐，提示"还有"（只在真溢出时才加这个类） */
.nav__links.is-scrollable {
  -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 22px), transparent);
  mask-image: linear-gradient(90deg, #000 calc(100% - 22px), transparent);
}

/* 窄屏：一项都不藏，链接区横向滑动（以前藏了「求职百科/关于」，
   加上别的页面本来就没这两项，导致菜单看起来时有时无） */
@media (max-width: 720px) {
  .nav__inner { height: 54px; gap: 10px; padding: 0 14px; }
  .logo { font-size: 17px; white-space: nowrap; }
  .nav__links {
    gap: 13px; font-size: 13px; margin-left: 0; white-space: nowrap;
    flex: 0 1 auto; min-width: 0; overflow-x: auto;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .nav__links::-webkit-scrollbar { display: none; }
  .nav__spacer { display: none; }
  .nav .btn { padding: 7px 13px; font-size: 12.5px; white-space: nowrap; flex: 0 0 auto; margin-left: auto; }
  /* 窄屏塞不下「免费制作」+ 账号入口：只留账号入口（它才是这页最该点的）。
     注意这是按钮，不是菜单项，菜单项一个都没少 */
  .nav__inner > .btn { display: none; }
  #navAcct { flex: 0 0 auto; margin-left: auto; }
  #navAcct .acct__btn { padding: 6px 11px; font-size: 12.5px; max-width: 108px; }
}