/* 三个页面（Markets / Whales / On-chain）共用的顶部标签。
   一份样式三处引用，切换页面时标签长得一模一样、位置不跳：
   index.html（generate_web.py 生成）、whales.html、prelist.html（onchain_signal.py 生成）。

   做成下划线文字而不是胶囊：页面里的筛选按钮（All / Perps / Spot）全是胶囊，
   换页的标签要一眼和"筛选"区分开。当前页用 aria-current="page" 标出来。 */

.site-head { display: flex; align-items: center; gap: 28px; min-width: 0; }
.site-title { margin: 0; font-size: 20px; font-weight: 700; color: #fff; letter-spacing: -0.3px; white-space: nowrap; }
.site-nav { display: flex; align-items: center; gap: 22px; }
.site-nav a {
  position: relative;
  padding: 4px 0;
  color: #64748b;
  font-size: 13px;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.12s;
}
.site-nav a:hover { color: #cbd5e1; text-decoration: none; }
.site-nav a[aria-current="page"] { color: #fff; }
.site-nav a[aria-current="page"]::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -3px;
  height: 2px;
  border-radius: 1px;
  background: #6b7fff;
}

/* Whales / On-chain 两页没有主页那样的通栏顶栏，用这个把标题行撑到整宽、
   底下画同一条分隔线。负边距抵掉 body 的内边距，高度和主页顶栏一致。 */
.page-head {
  margin: -16px -32px 16px;
  padding: 16px 32px;
  min-height: 59px;
  border-bottom: 1px solid #1e2030;
}

/* 手机：标签本身就说明了在哪一页，标题省掉；On-chain Signal 缩成 On-chain。
   这样主页顶栏的标签、闹钟、Lock 能在 375px 里排成一行。 */
@media (max-width: 640px) {
  .site-title { display: none; }
  .site-nav-long { display: none; }
  .site-nav { gap: 18px; }
  .page-head { margin: -10px -14px 12px; padding: 10px 14px; min-height: 49px; }
}