/* ============================================================
   base.css — 全局布局: 顶栏(标题+菜单) + 内容区
   布局约定: body 为纵向 flex, 顶栏固定高, main 占满剩余空间;
   图谱页 (#tab-graph) 撑满 main, 其余页签限宽居中便于阅读
   ============================================================ */
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  background: var(--bg);
  color: var(--txt);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: background .25s, color .25s;
  font: 14px/1.6 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* ---------- 顶栏: 菜单位于页面最顶部, 左侧仅保留标题 ---------- */
.topbar {
  flex: none;
  display: flex;
  align-items: center;
  gap: 22px;
  height: 50px;
  padding: 0 20px;
  border-bottom: 1px solid var(--line);
  background: var(--panel);
}
.brand { font-size: 16px; font-weight: 600; white-space: nowrap; letter-spacing: .3px; }
.topbar nav { display: flex; gap: 2px; height: 100%; }
.topbar nav button {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  color: var(--dim);
  padding: 0 15px;
  cursor: pointer;
  font-size: 14px;
  height: 100%;
}
.topbar nav button:hover { color: var(--txt); }
.topbar nav button.on { color: var(--acc); border-bottom-color: var(--acc); }
.topbar .health { margin-left: auto; font-size: 12px; color: var(--dim); }
#themeBtn {
  background: var(--panel2);
  border: 1px solid var(--line);
  border-radius: 8px;
  width: 32px;
  height: 32px;
  cursor: pointer;
  font-size: 15px;
  color: var(--txt);
  transition: transform .2s, border-color .2s;
}
#themeBtn:hover { transform: rotate(20deg); border-color: var(--acc); }

/* ---------- 内容区: 每个页签纵向 flex 铺满, 表格区弹性滚动, 底部不留白 ---------- */
main { flex: 1; min-height: 0; overflow: hidden; padding: 14px 24px; }
.tab-page { max-width: 1280px; margin: 0 auto; }
.tab-page:not(.hidden), #tab-graph:not(.hidden) {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
/* 表格/结果容器: 占满剩余高度, 内部滚动 */
.tbl-fill { flex: 1; min-height: 0; overflow: auto; }
.hidden { display: none !important; }
