/* ============================================================
   移动端体验层（≤768px）
   桌面端完全不受影响：所有规则都被媒体查询包裹。
   ============================================================ */
@media (max-width:768px){
  :root{ --tabbar-h:60px; }

  /* ---------- 基础手感 ---------- */
  body{ -webkit-tap-highlight-color:transparent; overscroll-behavior-y:contain; font-size:14px; }
  a,button,label,[role="button"]{ touch-action:manipulation; }

  /* ---------- 顶栏 ---------- */
  .topbar{ height:52px; padding:0 12px; }
  .brand{ font-size:15px; gap:6px; }
  .brand .mark{ width:26px; height:26px; border-radius:8px; font-size:14px; }
  .brand .tag{ display:none; }
  .acc-box{ padding:0 8px; }
  .acc-meta{ display:none; }
  .menu-btn{ font-size:24px; margin-right:2px; }

  /* ---------- 侧边抽屉 ---------- */
  .sidebar{ top:52px; height:calc(100vh - 52px); width:240px; padding-top:4px; }
  .sidebar > a, .sidebar .nav-parent{ padding:14px 18px; font-size:15px; min-height:50px; }
  .sidebar .nav-sub a{ padding:12px 18px 12px 44px; font-size:14px; min-height:46px; }

  /* ---------- 主内容区：为底部标签栏留白 ---------- */
  main{ padding:12px 12px 132px; }
  .foot{ padding-bottom:132px; }

  /* ---------- 卡片 / 内容 ---------- */
  .card{ padding:12px; border-radius:12px; margin-bottom:12px; }
  .card h3{ font-size:15px; }
  .banner{ font-size:13px; padding:12px; border-radius:12px; }
  .hint{ font-size:12px; }

  /* ---------- 触控目标 ---------- */
  .btn{ min-height:44px; padding:0 16px; font-size:14px; border-radius:11px; }
  .btn.sm{ min-height:36px; padding:0 12px; font-size:13px; }
  input,select,textarea{ font-size:16px; }  /* ≥16px 防 iOS 聚焦自动放大 */
  .tbl input,.tbl select{ font-size:14px; }
  .tabbar a{ padding:8px 14px; font-size:13px; }

  /* ---------- 栅格 / 表单折叠 ---------- */
  .grid2,.grid3,.grid4{ grid-template-columns:1fr; }
  .filter-bar{ grid-template-columns:1fr 1fr; gap:8px; padding:10px; }
  .row{ flex-wrap:wrap; }

  /* ---------- 自定义下拉：底部抽屉化 ---------- */
  .csel-panel{ border-radius:16px 16px 0 0; }
  .csel-opt{ padding:11px 12px; font-size:14px; min-height:44px; display:flex; align-items:center; }
  .csel-search-input{ font-size:16px; padding:9px 12px; }

  /* ---------- toast 上移（避开底部标签栏） ---------- */
  #toast{ bottom:96px; font-size:14px; }

  /* ---------- 底部标签栏 ---------- */
  .mtab{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:40;
    height:calc(var(--tabbar-h) + env(safe-area-inset-bottom,0px));
    padding-bottom:env(safe-area-inset-bottom,0px);
    background:var(--surface); border-top:1px solid var(--border);
    box-shadow:0 -4px 16px rgba(20,26,40,.06);
  }
  .mtab a{
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
    color:var(--muted); font-size:11px; min-height:56px; text-decoration:none;
  }
  .mtab a .mt-ico{ width:23px; height:23px; }
  .mtab a.active{ color:var(--primary); font-weight:600; }

  /* ---------- 表格 → 卡片 ---------- */
  table.m-hide{ display:none; }
  .m-cards{ display:flex; flex-direction:column; gap:10px; margin-top:4px; }
  .mc-card{ background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:12px 12px 4px; box-shadow:var(--shadow); }
  .mc-title{
    font-size:15px; font-weight:600; color:var(--text); padding-bottom:10px; margin-bottom:2px;
    border-bottom:1px solid var(--border-2); word-break:break-word;
  }
  .mc-body{ display:flex; flex-direction:column; }
  .mc-field{
    display:grid; grid-template-columns:84px 1fr; gap:8px; font-size:13px; align-items:start;
    padding:8px 0; border-bottom:1px solid var(--border-2);
  }
  .mc-field:last-child{ border-bottom:none; }
  .mc-k{ color:var(--muted); font-size:12px; line-height:1.5; padding-top:1px; }
  .mc-v{ color:var(--text); line-height:1.5; min-width:0; word-break:break-word; }
  .mc-v input, .mc-v select{ width:100% !important; max-width:100%; min-height:40px; }
  .mc-v .csel{ display:block; width:100%; }
  .mc-v .csel-box{ width:100%; max-width:100%; min-height:40px; }
  .mc-v audio{ width:100%; max-width:100%; }
  .mc-ops{ display:flex; gap:8px; flex-wrap:wrap; padding:10px 0; }
}
@media (min-width:769px){
  .mtab{ display:none !important; }
  .m-cards{ display:none !important; }
}
