/* ==========================================================
   手机版适配 CSS（仅宽度 ≤ 600px 时生效）
   电脑版样式见 style.css，本文件在其之后引入，覆盖电脑默认值
   ========================================================== */
@media (max-width: 600px) {

  /* 转屏触发：进入手机样式时播放动画（100ms，肉眼不可见），JS 监听后刷新一次页面 */
  .rotate-trigger {
    display: block;
    animation: rotateShake 100ms;
  }

  /* 横幅：内容靠左，距左边 12px */
  .banner {
    justify-content: flex-start;
    padding-left: 12px;
  }
  /* 横幅小字：手机端不显示（横幅放不下） */
  .banner-url {
    display: none;
  }
  /* 联系管理员页（banner-sm）：手机端小横幅，上下内边距更小 */
  .banner-sm {
    padding: 6px 0 6px 12px;
    margin-top: 6px;
  }

  /* 电脑导航条：手机端隐藏，改用底部 Tab */
  .nav-bar {
    display: none;
  }

  /* 家族谱引导页：手机端 4 列（仿小程序） */
  .page-hint {
    font-size: 12px;
    margin-bottom: 14px;
  }
  .grid {
    gap: 8px;
  }
  .grid-item {
    width: calc((100% - 3 * 8px) / 4); /* 手机端 4 列 */
    padding: 9px 0;
    font-size: 13px;
    border-radius: 8px;
  }
  .info-title {
    font-size: 15px;
  }
  .info-text {
    font-size: 11px;
  }

  /* 公共热线页：手机端 4 列，字号再调小 */
  .pub-page-title {
    font-size: 15px;
    margin-bottom: 14px;
  }
  .pub-bar-btn {
    padding: 0 12px;
    height: 42px;
    font-size: 12px;
  }
  .pub-info {
    font-size: 12px;
  }
  .pub-group {
    padding: 6px;
    margin-bottom: 12px;
  }
  .pub-grid {
    gap: 6px;
  }
  .pub-item {
    width: calc((100% - 3 * 6px) / 4); /* 手机端 4 列 */
    padding: 8px 0;
    font-size: 11px;
    border-radius: 6px;
  }

  /* 家族谱分支动态页：手机端字号/尺寸调小 */
  .clan-main {
    padding: 6px;
  }
  .back {
    font-size: 11px;
    padding: 4px 2px;
    width: 44px;
    white-space: normal;
    text-align: center;
    line-height: 1.5;
  }
  .root-box {
    width: 220px;
    height: 38px;
    font-size: 17px;
    letter-spacing: 2px;
  }
  .v-box {
    width: 34px;
    height: 132px;
  }
  .v-box .sub,
  .h-box .sub {
    font-size: 11px;
  }
  .h-box .sub {
    padding: 8px 10px;
  }
  .sub {
    font-size: 11px;
  }
  .t-top,
  .t-right {
    font-size: 10px;
  }
  .nd-title {
    font-size: 16px;
  }
  .nd-sub {
    font-size: 12px;
  }

  /* 底部 Tab 栏：固定在屏幕底部 */
  .tab-bar {
    display: flex;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 999;
    background: #fff;
    border-top: 2px solid #99522e;
  }
  /* 首页深色玻璃 Tab（仅首页，与背景融合） */
  .home-body .tab-bar {
    background: rgba(8, 20, 38, 0.88);
    border-top: 1px solid rgba(143, 195, 240, 0.35);
  }
  .tab-item {
    flex: 1;
    text-align: center;
    padding: 12px 0 14px;
    color: #99522e;
    text-decoration: none;
    font-size: 14px;
  }
  .home-body .tab-item { color: #cfe2f5; }
  .tab-item.active {
    background: #99522e;
    color: #fff;
    font-weight: bold;
  }
  .home-body .tab-item.active {
    background: #FFC64B;
    color: #2E4E7E;
  }
  /* 底部 Tab 占位：内容区底部留空，避免被遮挡 */
  .footer {
    padding-bottom: 70px;
  }
  /* 四字图：手机版分散对齐（首尾贴边、中间均匀） */
  .banner-texts {
    justify-content: space-between;
    gap: 0;
  }

  /* 主体 */
  .main { padding: 20px 12px 30px; }
  .intro h2 { font-size: 20px; }
  .intro p { font-size: 13px; }
  .card { width: 100%; padding: 20px 16px; }

  /* 功能卡：字号调小，描述保持两行 */
  .p-card { padding: 12px; }
  .p-card-noline { padding: 0; }
  .pub-body { padding: 10px 10px; }
  .pub-title { font-size: 15px; }
  .pub-desc { font-size: 10px; padding-left: 0.8em; }
  .pub-btn { padding: 0 6px; }
  .pub-btn-t { font-size: 13px; }
  .pub-btn-a { font-size: 13px; }
}
