/* 苗码 MIAOMA · 移动端公共适配（v1.36.0）
   ------------------------------------------------------------------
   定位：全站 30 个页面的「窄屏安全基线」。各页面仍在自身 <style> 内保留
         专属断点；本文件在 <head> 末尾加载，对同优先级规则做兜底覆盖。
   内容：
     1) 横向溢出防护（不破坏 sticky 顶栏）
     2) 媒体元素自适应
     3) 长串换行
     4) 内联固定列宽在窄屏失效
     5) 表单控件：防 iOS 聚焦缩放 + 可收缩
     6) 触控目标最小尺寸
     7) 弹性工具条换行
     8) 表格横向滚动兜底
   注意：断点用 768px，与各页面既有的 760px 断点兼容。
   ------------------------------------------------------------------ */

@media (max-width: 768px) {
  /* 1) 横向溢出防护 -------------------------------------------------
     overflow-x:clip 不会创建滚动容器，因此不会破坏 .topbar 的 position:sticky；
     旧浏览器回退为 hidden（会创建容器，但能兜住溢出）。 */
  html {
    overflow-x: hidden;
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }
  body { max-width: 100%; }

  /* 2) 媒体元素自适应 ---------------------------------------------- */
  img, svg, video, canvas, iframe, embed, object { max-width: 100%; }
  img, video { height: auto; }
  pre, code, .mono, .code, .codebox { max-width: 100%; overflow-x: auto; }

  /* 3) 长串（编号 / 网址 / 拉丁学名）不撑破版面 --------------------- */
  body { overflow-wrap: anywhere; }

  /* 4) 内联声明的桌面固定列宽，在窄屏一律让位 ---------------------- */
  [style*="min-width"] { min-width: 0 !important; }

  /* 5) 表单控件 ---------------------------------------------------- */
  input, select, textarea {
    font-size: 16px !important;   /* ≥16px 可避免 iOS Safari 聚焦时自动放大页面 */
    min-width: 0;
    max-width: 100%;
  }
  select { width: 100%; }

  /* 6) 触控目标 ----------------------------------------------------
     说明：安全合规中心的侧栏按钮使用 .nav button{all:unset}，其选择器权重
     高于此处的 button，故不会被撑高。 */
  a.btn, .btn, .tagbtn, .btns a, [role="button"],
  input[type="button"], input[type="submit"], button { min-height: 38px; }
  .btn { display: inline-flex; align-items: center; }

  /* 7) 弹性工具条允许换行，避免溢出 ------------------------------- */
  .opts, .btns, .toolbar, .bar, .filterbar, .row, .rows, .frow, .actions { flex-wrap: wrap; }

  /* 8) 表格横向滚动兜底 ------------------------------------------- */
  .tw, .tblwrap, .tablewrap, .tscroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* 9) 顶栏：刘海屏安全区 + 链接可点区域 --------------------------- */
  .topbar {
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
    flex-wrap: wrap;      /* 链接过多时换行，不再横向挤压 */
    row-gap: 6px;
  }
  .topbar a, .topbar button { min-height: 36px; display: inline-flex; align-items: center; }
  /* 长标题与英文副题、账号名在窄屏不再被压成竖排单字 */
  .topbar h1 { font-size: 14px; }
  .topbar h1 small { display: none; }
  .topbar .uname {
    white-space: nowrap; flex: 0 0 auto;
    max-width: 42vw; overflow: hidden; text-overflow: ellipsis;
  }

  /* 10) 弹窗 / 轻提示不超出屏幕 ---------------------------------- */
  .toast, .tipbar { max-width: calc(100vw - 24px); }

  /* 11) 栅格子项允许收缩：避免子元素 min-content 撑宽整列 --------- */
  .grid > *, .layout > *, .cards > * { min-width: 0; }

  /* 12) 页脚 / 面包屑 / 「更多」等次级链接的可点面积 -------------- */
  .site-foot a, .site-foot span a, .foot a, footer a,
  a.more, .sec-head a.more, #map-crumb a, .empty a,
  .maplink, a.home-below,
  .note a, .hint a, .bar a, .tip a, .import-tip a,
  .cl-meta a, .lmeta a, .cl-meta .linked, .lmeta .linked,
  /* 轮廓库卡片：页面内用的是 .cnlib-card .cl-meta a / .lcard .lmeta a（权重更高），
     此处必须带上同等权重的前缀，否则公共规则会被页面规则压掉 */
  .cnlib-card .cl-meta a, .lcard .lmeta a,
  .filterbar .freset, #fb-reset { display: inline-flex; align-items: center; min-height: 36px; }
  #btn-back {
    min-width: 40px; min-height: 36px;
    display: inline-flex; align-items: center; justify-content: center;
  }

  /* 13) 小图标按钮（表格内操作等）保证横向可点宽度 ---------------- */
  .p-del, td .btn, .bar .btn.sm { min-width: 42px; }

  /* 14) 字号下限：全站 ≤10.5px 的辅助小字在窄屏提升到 11.5px ----- */
  small,
  .beta-tag, .cnt, .topbar h1 small, .card .id, .card .ex .lb, .card .clause,
  .card .alias span, .card .ct .py, .card .tag-cat, .card .src, .card .src .badge,
  .std-tag .s, .stat .s, .stat .k, .pstep .tag, .side-foot, .tag, .mono,
  .qbadge, .wbadge,
  .sec-head .kicker, .bar > span, .brand p,
  .cl-ctag, .ctag, .cl-badge, .cl-meta i, .lmeta i,
  /* 同上：轮廓库卡片标签的页面规则带两个类名，这里补上同权重选择器 */
  .cnlib-card .cl-ctag, .cnlib-card .cl-badge, .cnlib-card .cl-meta i,
  .lcard .ctag, .lcard .lmeta i,
  .cover .no, .tcard .ph .no, .tcard .bd .lt { font-size: 11.5px; }
  .topbar a .cnt, .hero .acts .cnt, .libtabs button .cnt { font-size: 11.5px; }
}