/* ============================================================
   手机版排版修正 —— 由 build.py 注入 Claude Design 的 7 个页面
   ============================================================
   为什么放这里而不是改 styles.css：
   styles.css 每次从 Claude Design 重新导出都会被覆盖，修在那里会
   反覆失效。这里只放「responsive bug 修正」，不做设计决策 ——
   若 Claude Design 之后自己修好了，这些规则也只是重复，不会冲突。
   ============================================================ */

/* --- BUG 1（2026-07-26 Frankie 回报）：手机版整页横向溢出 ---
   .filterbar__row 是 flex 但没有 flex-wrap。
   里面右半组（17 parts + Relevance 下拉 + Grid/Table）本身就要 328px，
   而手机可用宽度只有约 319px → 挤不下又不能换行 →
   整个 document 被撑到 602px，浏览器只好缩小整页，右边露出空白。
   症状：搜寻框右边的「17 parts / Relevance / Grid / Table」跑到画面外。 */
@media (max-width: 860px) {
  .filterbar { padding-left: 16px; padding-right: 16px; }
  .filterbar__row { flex-wrap: wrap; gap: 12px; }
  .search { flex: 1 1 100%; }                 /* 搜寻框独占一行 */
  .filterbar__view {                          /* 计数 + 排序 + 检视切换 移到下一行 */
    flex: 1 1 100%;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
  }
  .filterbar__view select { flex: 1 1 auto; min-width: 0; }
}

/* 最后一道防线：任何情况都不允许整页横向捲动。
   （.hdr__nav-inner 自己有 overflow-x:auto，是刻意的横向捲动导航，不受影响） */
@media (max-width: 860px) {
  html, body { overflow-x: hidden; }
}