/* mobile.css — M11 手机版共享样式（PLAN_MOBILE §1/§3）。
   硬约束：桌面视觉零变化。除 .m-only（新增纯手机元素的桌面开关）和
   .hmenu（新增容器在桌面上的等价布局）这两类"为新标记而写"的规则外，
   一切新样式都写在媒体查询内；不修改任何现有桌面规则的取值。
   断点：主 760px（手机/小平板竖屏），次 420px（只调字号/间距）。 */

/* 新增的纯手机元素（≡ 菜单按钮、筛选按钮、遮罩、摘要行、底部操作条…）：
   桌面一律隐藏——元素是本轮新增的，隐藏即桌面零变化 */
.m-only { display: none; }

/* 篮内 ↑/↓ 排序按钮（M11-2）：仅手机断点显示，桌面保留拖拽排序，视觉零变化 */
.bitem .mv { display: none; }

/* 试卷页工具栏的「设置」折叠容器（M11-3 新标记）：桌面 display:contents，
   四个选项仍是 .toolbar 的直接 flex 项，布局与改造前完全一致 */
.tbset, .tbset-body { display: contents; }
.tbset > summary { display: none; }

/* 顶栏右侧按钮的容器（index / upload）：桌面 display:contents，
   按钮仍是 header 的直接 flex 项，布局与改造前完全一致 */
.hmenu { display: contents; }

@media (max-width: 760px) {
  /* 坑1：iOS 输入框字号 <16px 时聚焦会自动放大整页 —— 手机断点下统一 16px */
  input, select, textarea { font-size: 16px; }

  /* FIX-MOBILE-HIDDEN：手机断点内恢复手机元素的显示。桌面仍是文件顶部的
     .m-only{display:none}，零变化不受影响。注意：此规则之后的按元素规则
     （.m-menu / #mMask / #mSummary / .bitem .mv / .pickbar / .toolbar .m-only /
     .drop .m-only 等）有相同或更高特异度、且写在后面，都会正常覆盖它。
     不用 display:revert——微信 X5 等老内核不可靠。新增 .m-only 元素时，
     若不是普通块级展示，记得在此处之后补一条 display 覆盖。 */
  .m-only { display: block; }

  /* 坑6：KaTeX 长公式窄屏溢出，允许横向滑动 */
  .katex-display { overflow-x: auto; }

  /* 顶栏「≡」菜单面板（M11-2 首页 / M11-5 上传页共用） */
  .hmenu { display: none; position: fixed; top: 52px; left: 0; right: 0;
           z-index: 55; background: #2f4f7f; color: #fff;
           flex-direction: column; padding: 4px 0 8px;
           box-shadow: 0 8px 20px rgba(0,0,0,.25); }
  .hmenu.open { display: flex; }
  .hmenu button, .hmenu .hrow {
           text-align: left; background: none; color: #fff; border: 0;
           border-radius: 0; padding: 12px 18px; font-size: 16px;
           min-height: 44px; display: flex; align-items: center; gap: 8px; }
  .hmenu button:active { background: rgba(255,255,255,.15); }
  .hmenu .hrow { font-size: 14px; opacity: .92; }
  .m-menu { display: inline-block; }

  /* 手机断点内需要隐藏的桌面元素（分页数字按钮、工具条内重复按钮等） */
  .hide-m { display: none !important; }

  /* §2.4 login：卡片不超屏（box-sizing 保证 92vw 含内边距）；输入 16px 已由
     上面的全局规则覆盖；按钮 ≥44px */
  body > .card { width: min(340px, 92vw); box-sizing: border-box; padding: 28px 20px; }
  body > .card button { padding: 12px 10px; min-height: 44px; }

  /* ---- M11-2 首页（§2.1） ---- */
  /* 顶栏：左「筛选」+ 标题 + 右「≡」；触控目标 ≥44px */
  header { padding: 0 10px; gap: 10px; }
  header h1 { font-size: 16px; }
  header .m-only { display: inline-block; min-width: 44px; min-height: 44px;
          padding: 6px 12px; font-size: 15px; }

  /* 左侧筛选 → 滑出抽屉 + 遮罩；筛选项 onchange 逻辑不变（即时刷新） */
  .layout { display: block; }
  #mMask { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.45);
          z-index: 45; }
  #mMask.open { display: block; }
  aside { position: fixed; top: 0; bottom: 0; left: 0; width: min(86vw, 320px);
          z-index: 50; transform: translateX(-105%); transition: transform .22s ease;
          box-shadow: 0 0 24px rgba(0,0,0,.25); }
  aside.open { transform: none; }
  #mDrawerClose { display: block; width: 100%; min-height: 44px; border: 0;
          background: var(--blue); color: #fff; border-radius: 8px;
          font-size: 15px; cursor: pointer; margin-bottom: 8px; }
  aside select { padding: 8px; }
  .lv button { padding: 8px 0; min-height: 44px; }

  /* 当前筛选摘要行（筛选栏在抽屉里，主区顶部提示已选条件与题数） */
  #mSummary { display: block; font-size: 13px; color: #555; background: #fff;
          border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px;
          margin-bottom: 10px; }

  /* 题卡单列：题图整宽、信息在下、操作按钮排满且 ≥44px */
  .layout main { padding: 12px 12px 90px; }
  .cards { grid-template-columns: 1fr; }
  .card { flex-direction: column; gap: 8px; }
  .card img { width: 100%; max-height: 60vh; max-height: 60dvh; }
  .ops { margin-top: 0; }
  .ops button { flex: 1 1 auto; min-height: 44px; padding: 8px 10px; font-size: 14px; }

  /* 分页器触控化：只留 上一页/当前页/下一页 + 页码说明（其余 .hide-m 已隐藏） */
  .pager button { min-height: 44px; min-width: 44px; padding: 8px 14px; font-size: 15px; }
  .pager .pinfo { font-size: 14px; }

  /* 试题篮 → 底部抽屉（坑2：dvh 带 vh 回退；坑4：底部安全区） */
  .basket { left: 0; right: 0; bottom: 0; top: auto; width: 100%;
          max-height: 78vh; max-height: 78dvh;
          border-radius: 14px 14px 0 0; border-left: 0; border-right: 0; border-bottom: 0; }
  .basket .hd { padding: 12px 14px; }
  .basket .hd button { min-height: 36px; padding: 6px 10px; font-size: 13px; }
  .basket .ft { display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
          padding: 10px 14px; padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
  .basket .ft button { min-height: 44px; font-size: 14px; }
  #bOpen { bottom: calc(16px + env(safe-area-inset-bottom)); }
  .bitem { padding: 8px 0; }
  .bitem img { width: 96px; }
  .bitem button { width: 44px; height: 44px; font-size: 18px; }
  .bitem .mv { display: flex; flex-direction: column; gap: 2px; }
  .bitem .mv button { width: 44px; height: 31px; font-size: 15px;
          color: var(--blue); border: 1px solid var(--line); border-radius: 6px; }
  .bitem .mv button:disabled { opacity: .35; }

  /* 模态框：96vw / 92dvh（坑2），底部留安全区；关闭钮加大触控 */
  .modal .box { width: 96vw; max-height: 92vh; max-height: 92dvh; padding: 16px;
          margin-bottom: env(safe-area-inset-bottom); }
  .close { width: 36px; height: 36px; font-size: 16px; }
  .similar-item { flex-wrap: wrap; }
  .similar-item img { width: 130px; }

  /* ---- M11-3 试卷页（§2.2） ---- */
  /* 工具栏：主操作常驻（自动换行两行内），三个勾选项 + 题图缩放收进「设置」 */
  .toolbar { padding: 6px 10px; gap: 8px; }
  .toolbar button { min-height: 44px; padding: 8px 14px; font-size: 14px; }
  .tbset { display: block; position: relative; }
  .tbset > summary { display: flex; align-items: center; list-style: none;
          min-height: 44px; padding: 8px 14px; font-size: 14px;
          border: 1px solid #3b6fb5; color: #3b6fb5; background: #fff;
          border-radius: 6px; cursor: pointer; }
  .tbset > summary::-webkit-details-marker { display: none; }
  .tbset[open] > summary { background: #eef3fa; }
  .tbset[open] > .tbset-body { display: flex; flex-direction: column; gap: 12px;
          position: absolute; top: calc(100% + 6px); left: 0; z-index: 40;
          background: #fff; border: 1px solid #ccc; border-radius: 8px;
          padding: 12px 14px; box-shadow: 0 6px 18px rgba(0,0,0,.16);
          min-width: 250px; }
  .toolbar .tb-hint { display: none; }
  .toolbar .m-only { display: inline; font-size: 13px; }

  /* A4 缩放由 mobile.js 写行内 transform；这里只裁掉缩放前的布局溢出，
     保证 documentElement.scrollWidth 不超屏（坑5 的打印复原见文末 @media print） */
  .sheet-wrap { overflow: hidden; }

  /* 「换一题」移到题目下方右对齐并加大（按钮在卷面内、随整页缩放，
     故尺寸给大；.no-print 打印不出现，不影响版面） */
  .q { flex-wrap: wrap; }
  .q .swap { flex-basis: 100%; display: flex; justify-content: flex-end;
          align-items: center; min-height: 72px; padding: 8px 16px;
          border: 0; background: none; color: #3b6fb5; font-size: 22px; }

  /* ---- M11-5 上传页（§2.3） ---- */
  /* 拖拽区：触屏没有拖拽，主文案改为「点此选择文件」 */
  .drop { padding: 18px 14px; font-size: 15px; }
  .drop .drop-t { display: none; }
  .drop .m-only { display: inline; }
  .panel { padding: 12px 14px; }
  body > main { padding: 12px 12px 60px; }

  /* 作业列表：<table> 改卡片列表（renderJobs 已在 td 上写 data-label） */
  table.jobs, table.jobs tbody { display: block; }
  table.jobs tr { display: block; border: 1px solid var(--line); border-radius: 8px;
          padding: 4px 10px; margin-bottom: 10px; background: #fff; }
  table.jobs th { display: none; }
  table.jobs td { display: flex; justify-content: space-between; align-items: center;
          gap: 10px; border-bottom: 1px dashed #eef0f2; padding: 6px 0; font-size: 13px; }
  table.jobs td::before { content: attr(data-label); color: #888; flex: none; }
  table.jobs td:last-child { border-bottom: 0; justify-content: flex-end;
          gap: 8px; padding-top: 8px; }
  table.jobs td:last-child::before { content: none; }
  button.act { min-height: 44px; padding: 8px 14px; font-size: 14px; }

  /* 挑选页：单列、题图整宽、勾选框放大（右上角悬浮，不占一列） */
  #pickPanel .cards { grid-template-columns: 1fr; padding-bottom: 130px; }
  #cards .card { flex-direction: column; gap: 8px; position: relative; }
  #cards .card img { width: 100%; }
  #cards .card input[type=checkbox] { position: absolute; top: 10px; right: 10px;
          transform: scale(1.6); background: #fff; border-radius: 4px; padding: 4px; }
  #cards .card select { font-size: 14px; }

  /* 挑选页 sticky 底部操作条（全选/全不选/按大题选/入库；工具栏里的同款按钮
     已加 hide-m 在断点内隐藏） */
  .pickbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45;
          background: #fff; border-top: 1px solid var(--line);
          box-shadow: 0 -4px 14px rgba(0,0,0,.08);
          display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 12px;
          padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
  .pickbar .act { flex: 1 1 auto; }
  .pickbar select { flex: 1.6 1 auto; min-height: 44px; padding: 8px;
          border: 1px solid #ccc; border-radius: 6px; }
  .pickbar .act.main { flex-basis: 100%; }
}

@media (max-width: 420px) {
  /* 次断点：只调字号/间距（后续阶段按需补充） */
}

/* 坑5：打印时 transform 会毁掉 A4 版面 —— 媒体查询里强制清掉缩放（author
   !important 覆盖 mobile.js 写的行内 style；beforeprint/afterprint 再兜底），
   并解除包裹容器的行内高度/裁剪，让 .sheet 恢复 210mm 打印宽度 */
@media print {
  .sheet { transform: none !important; }
  .sheet-wrap { height: auto !important; overflow: visible !important; }
}