/* ============================================================
   styles/mobile.css
   手机端样式（≤768px）
   ============================================================ */

@media (max-width: 768px) {
  /* 隐藏左侧边栏 */
  #sidebar { display: none; }

  /* 主区域减少 padding */
  #main-wrap { padding: 12px 10px 28px; }

  /* 顶部导航收起（小屏展示汉堡菜单后期扩展） */
  .header-nav { display: none; }

  /* Logo 字体缩小 */
  .header-logo { font-size: 17px; }

  /* Hero banner 精简 */
  .hero-stats   { display: none; }
  .hero-banner  { padding: 20px; }
  .hero-title   { font-size: 18px; }
  .hero-sub     { font-size: 13px; }

  /* 卡片 2 列 */
  .card-grid {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  /* 功能按钮 3 列 */
  .fn-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }

  /* 预览区单列 */
  .preview-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  /* section box padding 缩小 */
  .section-box { padding: 16px 14px; }

  /* 扩展工具卡片 2 列 */
  .ext-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* footer 单列垂直排列 */
  #footer {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
}

/* 极小屏（≤480px） */
@media (max-width: 480px) {
  /* 卡片单列 */
  .card-grid { grid-template-columns: 1fr; }

  /* 功能按钮 2 列 */
  .fn-grid { grid-template-columns: repeat(2, 1fr); }

  /* 扩展工具卡片单列 */
  .ext-grid { grid-template-columns: 1fr; }

  /* hero 进一步压缩 */
  .hero-banner { padding: 16px; }
  .hero-title  { font-size: 16px; }
  .hero-badges { display: none; }

  /* 分类 Tab 水平滚动 */
  .cat-tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
  .cat-tab  { flex-shrink: 0; }
}