/* 共享导航样式，在页面样式之后加载，保持全站覆盖顺序。 */
/* 金色描边胶囊：墨字 + 细金边 + 透明底，hover 淡金底。配社群卡墨金调性 */
.nav-links a.nav-join { gap: 7px; color: #1d1b18; font-weight: 600; background: transparent; border: 1px solid rgba(192,146,79,0.55); border-radius: 999px; padding: 5px 15px; margin-left: 4px; transition: background 0.2s, border-color 0.2s; }
.nav-links a.nav-join::after { display: none; }
.nav-links a.nav-join:hover { color: #1d1b18; border-color: #c0924f; background: #faf6ee; }
.nav-join-dot { width: 5px; height: 5px; border-radius: 50%; background: #c0924f; flex-shrink: 0; }
.mobile-menu a.nav-join { display: inline-flex; align-items: center; gap: 10px; color: #1d1b18; font-weight: 600; border: 1px solid rgba(192,146,79,0.55); border-radius: 999px; padding: 10px 24px; margin-top: 4px; }
.mobile-menu a.nav-join .nav-join-dot { width: 7px; height: 7px; }
/* 登录后：加入社群升为墨色实心主按钮（菜单里唯一主动作） */
.mobile-menu.is-authed a.nav-join { background: #1d1b18; color: #fff; border-color: #1d1b18; padding: 13px 30px; }
.mobile-menu.is-authed a.nav-join .nav-join-dot { background: #d8b576; }
/* 登录后：账户行降为底部低调 footer（头像+昵称 + 编辑资料·退出登录），主按钮位让给「加入社群」。由 auth.js 注入 .is-account */
.mobile-menu-cta.is-account { position: absolute; bottom: 34px; left: 0; right: 0; margin: 0; padding: 0; width: auto; background: transparent; box-shadow: none; border-radius: 0; display: flex; flex-direction: column; align-items: center; gap: 9px; color: #9a8e80; }
.mobile-menu-cta.is-account .acct-row { display: inline-flex; align-items: center; gap: 8px; }
.mobile-menu-cta.is-account .acct-name { font-size: 14px; font-weight: 600; color: #4a4a4a; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mobile-menu-cta.is-account .acct-actions { display: inline-flex; align-items: center; gap: 9px; font-size: 13px; }
.mobile-menu-cta.is-account .acct-edit, .mobile-menu-cta.is-account .acct-bind, .mobile-menu-cta.is-account .acct-logout { color: #9a8e80; border-bottom: 1px solid #d9cfc2; padding-bottom: 1px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.mobile-menu-cta.is-account .acct-sep { color: #cabfb0; }
/* 移动菜单第 7 个链接（实战课加入后）：各页内联 CSS 的入场延迟只写到 nth-child(6)，这里全站兜底 */
.mobile-menu.active a:nth-child(7):not(.mobile-menu-cta) { transition-delay: 0.23s; }

/* 三栏：左 logo、中链接居中、右登录。菜单收短后左右留白对称，不再挤成左一坨。 */
.nav-inner { display: grid; grid-template-columns: minmax(160px, 1fr) auto minmax(160px, 1fr); align-items: center; justify-content: initial; gap: 0; }
.nav-logo { justify-self: start; }
.nav-links {
  flex: none; min-width: 0; justify-self: center; justify-content: center;
  gap: 2px; padding: 4px;
  background: #f3f1ec;
  border: 1px solid rgba(26, 22, 16, 0.05);
  border-radius: 999px;
}
.nav-links a:not(.nav-cta) {
  color: #3a3a3a; font-size: 14px; font-weight: 500;
  padding: 7px 14px; border-radius: 999px;
  transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}
.nav-links a:not(.nav-cta)::after { display: none; }
.nav-links a:not(.nav-cta):hover {
  color: #1a1a1a; background: #fff;
  box-shadow: 0 1px 3px rgba(26, 22, 16, 0.08);
}
.nav-links a:not(.nav-cta).active {
  color: #1a1a1a; font-weight: 600; background: #fff;
  box-shadow: 0 1px 3px rgba(26, 22, 16, 0.08);
}
@media (prefers-reduced-motion: reduce) {
  .nav-links a:not(.nav-cta) { transition: none; }
}
.nav-right { display: flex; align-items: center; justify-self: end; }
.nav-end { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; }
.nav-cta { margin-left: 0; }
/* 汉堡：不等长两道线（Linear 风），第二根 span 隐藏 */
.hamburger { display: none; flex-direction: column; gap: 6px; cursor: pointer; min-width: 44px; min-height: 44px; align-items: flex-end; justify-content: center; padding-right: 11px; margin-left: 0; touch-action: manipulation; }
.hamburger span { width: 22px; height: 2px; background: #1a1a2e; border-radius: 2px; opacity: 1; transition: transform 0.3s cubic-bezier(.2,.9,.3,1), width 0.3s cubic-bezier(.2,.9,.3,1); }
.hamburger span:nth-child(2) { display: none; }
.hamburger span:nth-child(3) { width: 14px; }
.hamburger.active span:nth-child(1) { transform: translateY(4px) rotate(45deg); }
.hamburger.active span:nth-child(3) { width: 22px; transform: translateY(-4px) rotate(-45deg); }
/* 汉堡显示断点与全站 nav-links 隐藏断点对齐在 1279px（各页 @1279 切汉堡；本共享块"后到优先"注入最晚，
   若停在旧的 768px 会盖过各页的 1279 规则 → 769–1279px 出现 nav-links 已隐藏、汉堡未显示的空白带，
   home 用外链 home.css 尤其中招，2026-07-09 修）。 */
@media (max-width: 1279px) {
  .nav-inner { grid-template-columns: 1fr auto; }
  .nav-links, .nav-end { display: none; }
  .hamburger { display: flex; }
}
/* 压暗层：跟随 .mobile-menu.active 的纯 CSS 联动（+ 选择器），各页旧开关 JS 无需改动 */
.mobile-menu-dim { position: fixed; left: 0; right: 0; top: 64px; bottom: 0; z-index: 998; background: rgba(20,22,40,0.32); opacity: 0; pointer-events: none; transition: opacity 0.25s ease; touch-action: none; overscroll-behavior: contain; }
.mobile-menu.active + .mobile-menu-dim, .mobile-menu-dim.active { opacity: 1; pointer-events: auto; }
/* 白卡面板（inset:auto 清掉各页旧全屏 inset:0 的 bottom） */
.mobile-menu { display: flex; position: fixed; inset: auto; top: 70px; left: 10px; right: 10px; z-index: 999; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; border: 1px solid rgba(0,0,0,0.04); border-radius: 20px; padding: 14px 10px 12px; box-shadow: 0 24px 60px -12px rgba(20,22,40,0.28), 0 2px 6px rgba(20,22,40,0.08); opacity: 0; transform: translateY(-10px) scale(0.985); transform-origin: top center; pointer-events: none; transition: opacity 0.22s ease, transform 0.26s cubic-bezier(.2,.9,.3,1); touch-action: manipulation; overscroll-behavior: contain; }
.mobile-menu.active { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.mobile-menu a:not(.mobile-menu-cta) { display: flex; align-items: center; color: #1a1a1a; font-size: 16.5px; font-weight: 600; padding: 12px 14px; border-radius: 12px; opacity: 1; transform: none; transition: background 0.15s ease, color 0.2s; }
.mobile-menu.active a:not(.mobile-menu-cta) { transition-delay: 0s; }
.mobile-menu a:not(.mobile-menu-cta):active { background: #f3f4fa; }
/* 光点列表：空心点常态，当前页主题蓝实点 */
.mobile-menu a:not(.mobile-menu-cta):not(.nav-join)::before { content: ''; width: 8px; height: 8px; border-radius: 999px; margin-right: 12px; flex-shrink: 0; background: transparent; border: 1.5px solid rgba(26,26,46,0.22); }
.mobile-menu a.active { color: #2563eb; }
.mobile-menu a.active::before { background: #2563eb; border-color: #2563eb; box-shadow: 0 0 8px rgba(37,99,235,0.4); }
/* 加入社群：同度量鎏金浅底行（#id 提权压过 _NAV_JOIN_CSS 两种状态） */
#mobileMenu a.nav-join, #mobileMenu.is-authed a.nav-join { margin: 10px 0 0; align-self: stretch; display: flex; align-items: center; gap: 0; background: linear-gradient(120deg, rgba(232,200,145,0.18), rgba(216,181,118,0.10)); border: 1px solid rgba(192,146,79,0.26); border-radius: 12px; padding: 12px 14px; font-size: 16.5px; font-weight: 600; color: #8a6336; letter-spacing: 0; }
#mobileMenu a.nav-join:active { background: rgba(216,181,118,0.22); }
#mobileMenu a.nav-join .nav-join-dot, #mobileMenu.is-authed a.nav-join .nav-join-dot { width: 8px; height: 8px; margin: 0 12px 0 0; border-radius: 999px; flex-shrink: 0; background: #c0924f; box-shadow: 0 0 8px rgba(216,181,118,0.55); }
/* 登录：墨黑实心按钮沉底 */
.mobile-menu .mobile-menu-cta { display: block; margin: 12px 8px 2px; padding: 12px 0; width: auto; text-align: center; background: #1a1a2e; color: #fff !important; font-size: 14px; font-weight: 600; border-radius: 10px; letter-spacing: 0.01em; opacity: 1; transform: none; transition: none; }
/* 登录态账号区：单行布局——左头像+昵称、右动作组，与菜单行同节奏（压过 _NAV_JOIN_CSS 的 absolute 居中堆叠旧布局） */
.mobile-menu .mobile-menu-cta.is-account { position: static; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin: 12px 6px 0; padding: 13px 8px 3px; width: auto; background: transparent; border-radius: 0; border-top: 1px solid #f0f1f6; }
.mobile-menu .mobile-menu-cta.is-account .acct-row { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.mobile-menu .mobile-menu-cta.is-account .acct-name { font-size: 14px; font-weight: 600; color: #1a1a2e; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mobile-menu .mobile-menu-cta.is-account .acct-actions { display: inline-flex; align-items: center; gap: 10px; font-size: 12.5px; flex-wrap: wrap; }
.mobile-menu .mobile-menu-cta.is-account .acct-edit, .mobile-menu .mobile-menu-cta.is-account .acct-bind, .mobile-menu .mobile-menu-cta.is-account .acct-logout { color: #8a8fa3; border-bottom: 0; padding: 6px 0; }
.mobile-menu .mobile-menu-cta.is-account .acct-edit:active, .mobile-menu .mobile-menu-cta.is-account .acct-bind:active, .mobile-menu .mobile-menu-cta.is-account .acct-logout:active { color: #1a1a2e; }
.mobile-menu .mobile-menu-cta.is-account .acct-sep { color: #d4d6e0; }
