/* 穿书 v2 统一导航栏样式 */
.juean-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  background: rgba(8,18,13,0.96); border-bottom: 1px solid rgba(255,255,255,0.06);
  height: 56px;
}
.juean-nav-inner {
  max-width: 1200px; margin: 0 auto; height: 100%;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 24px;
}
.juean-nav-logo {
  display: flex; align-items: center; gap: 8px; text-decoration: none;
  flex-shrink: 0;
}
.juean-nav-logo-text {
  font-size: 18px; font-weight: 700; color: #fff; letter-spacing: 2px;
  font-family: var(--font-display, 'Noto Serif SC', serif);
}
.juean-nav-links {
  display: flex; align-items: center; gap: 8px; flex-wrap: nowrap;
}
.juean-nav-links a {
  color: var(--text-secondary); text-decoration: none; font-size: 14px;
  padding: 6px 12px; border-radius: 8px; transition: all 0.2s; white-space: nowrap;
}
.juean-nav-links a:hover { color: var(--accent); background: rgba(232,168,56,0.06); }
.juean-nav-links .nav-wjh { color: var(--gold, #f59e0b); font-weight: 600; }

.juean-nav-user {
  display: flex; align-items: center; gap: 12px; flex-shrink: 0;
}
.juean-nav-coins {
  font-size: 13px; color: var(--gold, #f59e0b); font-weight: 600;
  background: rgba(245,158,11,0.08); padding: 4px 10px; border-radius: 999px;
}
.juean-nav-profile {
  font-size: 14px; color: var(--text-secondary); text-decoration: none;
  padding: 4px 10px; border-radius: 8px;
}
.juean-nav-profile:hover { color: var(--accent); }
.juean-nav-login {
  font-size: 14px; color: var(--accent); text-decoration: none;
  padding: 6px 16px; border: 1px solid var(--accent); border-radius: 8px;
  transition: all 0.2s;
}
.juean-nav-login:hover { background: var(--accent); color: #fff; }

/* Mobile */
.juean-nav-mbtn { display: none; background: none; border: none; color: var(--text-secondary); font-size: 22px; cursor: pointer; padding: 4px; }
.juean-mobile-menu {
  display: none; position: fixed; inset: 0; z-index: 999;
  background: rgba(8,18,13,0.98); flex-direction: column; align-items: center;
  justify-content: center; gap: 20px;
}
.juean-mobile-menu.open { display: flex; }
.juean-mobile-menu a { font-size: 20px; color: var(--text-secondary); padding: 12px; letter-spacing: 2px; text-decoration: none; }
.juean-mobile-menu a:hover { color: var(--accent); }
.juean-mobile-close { position: absolute; top: 20px; right: 20px; background: none; border: none; color: var(--text-tertiary); font-size: 24px; cursor: pointer; }

@media (max-width: 768px) {
  .juean-nav-links { display: none !important; }
  .juean-nav-mbtn { display: block !important; }
  /* 手机端只保留登录按钮和汉堡菜单，隐藏金币和头像文字避免挤乱 */
  .juean-nav-coins { display: none !important; }
  .juean-nav-profile { display: none !important; }
  .juean-nav { padding: 0 2px; }
  .juean-nav-inner { padding: 0 10px; gap: 4px; }
  .juean-nav-logo-text { font-size: 15px; max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .juean-nav-login { font-size: 13px; padding: 4px 10px; flex-shrink: 0; }
  .juean-nav-mbtn { font-size: 20px; flex-shrink: 0; }
}


/* ===== 移动端菜单修复 ===== */
@media (max-width: 768px) {
  /* 导航栏: 纯色背景(非rgba)避免滑动时GPU blend合成白屏 */
  .juean-nav {
    background: #08120d !important;
    border-bottom: 1px solid rgba(255,255,255,0.04) !important;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    contain: layout style paint;
  }
  /* 禁用导航栏所有transition，避免滑动时触发repaint */
  .juean-nav, .juean-nav a, .juean-nav-links a, .juean-nav-logo,
  .juean-nav-user a, .juean-nav-coins, .juean-nav-profile,
  .juean-nav-login, .juean-nav-mbtn {
    transition: none !important;
  }
  .juean-nav-links a:hover, .juean-nav-login:hover {
    background: transparent !important;
    transform: none !important;
  }

  /* 移动菜单: 全不透明背景避免白闪 */
  .juean-mobile-menu {
    background: #0a1a14;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }

  .juean-mobile-menu.open {
    animation: fadeIn 0.2s ease-out;
  }

  /* 菜单按钮: 防止点击闪烁 */
  .juean-nav-mbtn {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  /* 菜单链接: 防止点击闪烁 */
  .juean-mobile-menu a {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    padding: 14px 24px;
    border-radius: 10px;
  }

  .juean-mobile-menu a:active {
    background: rgba(167, 139, 250, 0.1);
  }
}
.juean-nav-spacer { height:56px; }