/* ============ 部门端手机版样式（只给 /bx/ 用，管理端仍是桌面版） ============
   做法：base.css 提供设计变量与通用件（按钮、标签、输入框），
   这里只重排布局 —— 顶栏 + 底部 tab + 卡片流。
   桌面浏览器打开也走这套（居中、限宽），保证两端视觉一致。 */

:root{
  --m-bar-h:52px;
  --m-tab-h:58px;
  --m-pad:12px;
  --m-radius:14px;
}

html{-webkit-text-size-adjust:100%}
.m-body{
  background:#eef1f5;
  font-size:15px;
  min-height:100%;
  overscroll-behavior-y:contain;
}
.m-body input,.m-body textarea,.m-body select{font-size:16px} /* ≥16px：iOS 聚焦不放大 */

/* ---------------- 登录 ---------------- */
.m-login{
  min-height:100vh;
  min-height:100dvh;
  display:flex;align-items:center;justify-content:center;
  padding:24px 20px calc(24px + env(safe-area-inset-bottom));
  background:linear-gradient(170deg,#2563eb 0%,#1d4ed8 38%,#eef1f5 38.1%,#eef1f5 100%);
}
.m-login-in{
  width:100%;max-width:420px;
  background:#fff;border-radius:18px;padding:26px 20px 22px;
  box-shadow:0 12px 40px -18px rgba(17,24,39,.45);
}
.m-login-mark{
  width:52px;height:52px;border-radius:14px;background:var(--blue);color:#fff;
  display:grid;place-items:center;font-size:17px;font-weight:800;letter-spacing:-.5px;
  margin-bottom:14px;
}
.m-login-in h1{font-size:21px;line-height:1.35;letter-spacing:.2px}
.m-login-sub{font-size:13px;color:var(--text-3);margin:6px 0 20px;line-height:1.6}
.m-login-keep{
  margin-top:14px;text-align:center;font-size:11.5px;color:var(--text-3);line-height:1.7;
  background:#f4f7fb;border-radius:10px;padding:9px 12px;
}
.m-login-foot{
  margin-top:18px;text-align:center;font-size:11.5px;color:var(--text-3);line-height:1.7;
}

/* ---------------- 顶栏 ---------------- */
.m-bar{
  position:fixed;top:0;left:0;right:0;z-index:40;
  height:calc(var(--m-bar-h) + env(safe-area-inset-top));
  padding:env(safe-area-inset-top) 14px 0;
  background:rgba(255,255,255,.96);
  backdrop-filter:saturate(180%) blur(8px);
  border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;
}
.m-bar-l{display:flex;align-items:center;gap:10px;min-width:0}
.m-mark{
  width:30px;height:30px;border-radius:9px;background:var(--blue);color:#fff;
  display:grid;place-items:center;font-size:12px;font-weight:800;flex:0 0 auto;
}
.m-bar-t{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.m-bar-t b{font-size:15px;letter-spacing:.2px}
.m-bar-t span{font-size:11px;color:var(--text-3);margin-top:2px}
.m-user{
  border:0;background:none;padding:0;display:grid;place-items:center;
}
.m-user .avatar{
  width:32px;height:32px;border-radius:50%;background:var(--blue);color:#fff;
  display:grid;place-items:center;font-size:13px;font-weight:700;
}

/* 用户菜单 */
.m-pop{
  position:absolute;top:calc(var(--m-bar-h) + env(safe-area-inset-top) - 6px);right:12px;
  width:180px;background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:0 16px 36px -18px rgba(17,24,39,.4);overflow:hidden;z-index:60;
}
.m-pop-head{padding:12px 14px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.m-pop-head b{font-size:14px}
.m-pop-head span{font-size:11.5px;color:var(--text-3)}
.m-pop button{
  display:block;width:100%;text-align:left;padding:12px 14px;border:0;background:#fff;
  font-size:14px;color:var(--text);border-bottom:1px solid var(--line);
}
.m-pop button:last-child{border-bottom:0;color:var(--err)}
.m-pop button:active{background:var(--bg-2)}

/* ---------------- 主体 ---------------- */
.m-main{
  padding:calc(var(--m-bar-h) + env(safe-area-inset-top) + var(--m-pad)) var(--m-pad)
          calc(var(--m-tab-h) + env(safe-area-inset-bottom) + 18px);
  max-width:640px;margin:0 auto;
}

/* ---------------- 卡片 ---------------- */
.m-card{
  background:#fff;border-radius:var(--m-radius);padding:14px;
  box-shadow:0 1px 2px rgba(17,24,39,.04);
  margin-bottom:12px;
}
.m-card-h{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-bottom:12px;
}
.m-card-h b{font-size:15px}
.m-hint{font-size:12px;color:var(--text-3)}
.m-link{
  border:0;background:none;color:var(--blue);font-size:13.5px;font-weight:600;padding:4px 0;
}

/* 键值行 */
.m-kv{
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
  padding:7px 0;border-bottom:1px dashed var(--line);
  font-size:14px;
}
.m-kv:last-child{border-bottom:0}
.m-kv>span{color:var(--text-2);flex:0 0 auto}
.m-kv>b{font-weight:600;text-align:right;word-break:break-all}
.m-amount{color:var(--blue);font-size:16px}

.m-tip{font-size:12px;color:var(--text-3);line-height:1.6;margin-top:8px}

/* 详情页状态块：只说"现在到哪一步"，不铺整条进度 */
.m-state{padding:16px 14px}
.m-state-name{
  display:flex;align-items:center;gap:9px;
  font-size:21px;font-weight:800;letter-spacing:.2px;line-height:1.25;
}
.m-state-name::before{
  content:'';width:10px;height:10px;border-radius:50%;
  background:currentColor;flex:0 0 auto;
}
.m-state-name.is-blue{color:#1d4ed8}
.m-state-name.is-warn{color:#b45309}
.m-state-name.is-ok{color:#047857}
.m-state-name.is-err{color:#b91c1c}
.m-state-sub{margin-top:7px;font-size:13.5px;color:var(--text-2);line-height:1.55}

/* ---------------- 列表 ---------------- */
.m-chips{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.m-select{
  flex:0 0 auto;height:34px;padding:0 10px;border:1px solid var(--line-2);
  border-radius:9px;background:#fff;color:var(--text);font-size:14px;
}
.m-stat{font-size:12.5px;color:var(--text-3);margin-left:auto}

.m-item{
  display:block;width:100%;text-align:left;
  background:#fff;border:0;border-radius:var(--m-radius);padding:14px;
  margin-bottom:10px;box-shadow:0 1px 2px rgba(17,24,39,.05);
}
.m-item:active{background:#fafbfc}
.m-item-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.m-item-sn{font-size:12.5px;color:var(--text-3);font-family:ui-monospace,Menlo,monospace;letter-spacing:.3px}
.m-item-body{
  margin:8px 0 10px;font-size:14.5px;line-height:1.55;color:var(--text);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.m-item-foot{display:flex;align-items:center;justify-content:space-between;gap:10px}
.m-item-amount{font-size:16px;font-weight:700;color:var(--blue)}
.m-item-time{font-size:11.5px;color:var(--text-3)}
.m-item-prog{margin-top:10px}

.m-empty{padding:56px 0;text-align:center;color:var(--text-3)}
.m-empty-big{font-size:15px;color:var(--text-2);margin-bottom:6px}

.m-pager{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:8px 2px 0;font-size:12.5px;color:var(--text-3);
}
.m-pager-btns{display:flex;gap:8px}

/* ---------------- 表单 ---------------- */
.m-body .field{margin-bottom:14px}
.m-body .field>label{display:block;font-size:13px;font-weight:600;color:var(--text-2);margin-bottom:6px}
.m-body .input,.m-body .textarea{
  width:100%;height:46px;padding:0 12px;border:1px solid var(--line-2);border-radius:10px;
  background:#fff;
}
.m-body .textarea{height:auto;padding:10px 12px;line-height:1.6;resize:vertical;min-height:160px}
.m-body .input:disabled{background:var(--bg-2);color:var(--text-2)}
.m-body .input:focus,.m-body .textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.m-body .btn{height:46px;padding:0 16px;border-radius:10px;font-size:15px}
.m-body .btn-sm{height:34px;padding:0 12px;font-size:13px;border-radius:9px}
.m-body .btn-lg{height:50px;font-size:16px}
.m-body .btn-block{width:100%}
.m-body .mt-8{margin-top:8px}
.m-body .money{position:relative}
.m-body .money .yuan{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-3);font-size:16px}
.m-body .money .input{padding-left:30px}
.m-body .count-bar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-top:6px;font-size:12px;color:var(--text-3);
}
.m-body .count-bar.over .cnt{color:var(--err)}

/* ---------------- 详情 ---------------- */
.m-detail-bar{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.m-detail-bar b{font-size:14px;font-family:ui-monospace,Menlo,monospace;flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-back{
  width:34px;height:34px;border-radius:10px;border:1px solid var(--line);
  background:#fff;font-size:17px;line-height:1;color:var(--text);flex:0 0 auto;
}
.m-back:active{background:var(--bg-2)}

/* 报告单预览：按容器宽度等比缩放，双指仍可放大 */
.m-sheet-wrap{
  position:relative;overflow:hidden;border-radius:8px;background:#fff;
  border:1px solid var(--line);
}
.m-sheet-host{position:relative;width:100%;overflow:hidden}
.m-sheet-host .a4-sheet{
  transform-origin:top left;
  box-shadow:none!important;
  margin:0!important;
}

/* ---------------- 账号 ---------------- */
.m-face-row{display:flex;gap:14px;align-items:flex-start;margin-bottom:12px}
.m-face{
  width:86px;height:106px;flex:0 0 auto;border-radius:10px;overflow:hidden;
  background:var(--bg-2);border:1px dashed var(--line-2);
  display:grid;place-items:center;font-size:12px;color:var(--text-3);text-align:center;
}
.m-face img{width:100%;height:100%;object-fit:cover}
.m-face-meta{flex:1 1 auto;min-width:0}
.m-face-meta .m-kv{font-size:13.5px}

.m-seal-slot{
  min-height:74px;border-radius:10px;background:var(--bg-2);
  display:grid;place-items:center;padding:10px;margin-bottom:12px;
}
.m-seal-slot.has-seal{background:#fff;border:1px solid var(--line)}
.m-seal-slot .seal-img{max-width:100%;max-height:110px;object-fit:contain}
.m-seal-slot .ph{font-size:12.5px;color:var(--text-3);text-align:center;line-height:1.7}

.m-logout{color:var(--err);border-color:#f3c9c9;background:#fff;margin-top:4px}

/* ---------------- 底部 tab ---------------- */
.m-tabs{
  position:fixed;left:0;right:0;bottom:0;z-index:40;
  height:calc(var(--m-tab-h) + env(safe-area-inset-bottom));
  padding-bottom:env(safe-area-inset-bottom);
  background:rgba(255,255,255,.97);
  backdrop-filter:saturate(180%) blur(8px);
  border-top:1px solid var(--line);
  display:flex;align-items:stretch;
}
.m-tabs a{
  flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  color:var(--text-3);font-size:11px;position:relative;
}
.m-tabs a svg{
  width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;
}
.m-tabs a.on{color:var(--blue);font-weight:600}
.m-tabs .nav-dot{
  position:absolute;top:8px;right:calc(50% - 16px);
  width:7px;height:7px;border-radius:50%;background:var(--err);
}

/* ---------------- 弹层（底部 sheet） ---------------- */
.m-mask{
  position:fixed;inset:0;z-index:80;background:rgba(17,24,39,.5);
  display:flex;align-items:flex-end;justify-content:center;
}
.m-sheet{
  width:100%;max-width:640px;max-height:92vh;max-height:92dvh;
  background:#fff;border-radius:18px 18px 0 0;
  display:flex;flex-direction:column;overflow:hidden;
  animation:m-up .22s ease-out;
}
@keyframes m-up{from{transform:translateY(18px);opacity:.6}to{transform:none;opacity:1}}
.m-sheet-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 16px;border-bottom:1px solid var(--line);flex:0 0 auto;
}
.m-sheet-head b{font-size:15.5px}
.m-sheet-x{
  width:32px;height:32px;border:0;background:var(--bg-2);border-radius:50%;
  font-size:18px;line-height:1;color:var(--text-2);
}
.m-sheet-body{
  padding:16px;overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1 1 auto;
}
.m-sheet-foot{
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  border-top:1px solid var(--line);flex:0 0 auto;background:#fff;
}

/* 采集人脸按钮 + 预览 */
.m-shot{
  width:100%;height:48px;border-radius:10px;border:1px dashed var(--blue);
  background:rgba(37,99,235,.06);color:var(--blue);font-size:15px;font-weight:600;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.m-shot-ico{font-size:18px;line-height:1}
.m-face-preview{
  width:112px;height:140px;border-radius:10px;overflow:hidden;margin-top:10px;
  background:var(--bg-2);border:1px solid var(--line);
  display:grid;place-items:center;font-size:12px;color:var(--text-3);
}
.m-face-preview img{width:100%;height:100%;object-fit:cover}

.m-drop{
  border:1px dashed var(--line-2);border-radius:10px;background:var(--bg-2);
  padding:16px;text-align:center;font-size:14px;color:var(--text-2);
  display:flex;flex-direction:column;gap:4px;align-items:center;
}
.m-drop.busy{opacity:.7}
.m-apply-preview{
  margin-top:10px;min-height:60px;border-radius:10px;overflow:hidden;
  background:var(--bg-2);display:grid;place-items:center;padding:8px;
}
.m-apply-preview img{max-width:100%;max-height:200px;object-fit:contain;display:block}
.m-apply-preview .ph{font-size:12px;color:var(--text-3)}

/* ---------------- 人脸采集/比对遮罩 ---------------- */
.fv-mask{
  position:fixed;inset:0;z-index:200;background:#0b1020;
  display:flex;align-items:center;justify-content:center;
}
.fv-sheet{
  width:100%;max-width:520px;height:100%;max-height:100dvh;
  display:flex;flex-direction:column;
  padding:calc(12px + env(safe-area-inset-top)) 16px calc(14px + env(safe-area-inset-bottom));
  color:#fff;
}
.fv-head{display:flex;align-items:center;justify-content:space-between;padding:2px 2px 10px}
.fv-head b{font-size:16px;font-weight:600}
.fv-x{
  width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,255,255,.14);
  color:#fff;font-size:20px;line-height:1;
}
.fv-stage{
  position:relative;flex:1 1 auto;border-radius:18px;overflow:hidden;
  background:#000;display:grid;place-items:center;min-height:0;
}
.fv-stage video{
  width:100%;height:100%;object-fit:cover;
  transform:scaleX(-1); /* 前置摄像头镜像，跟照镜子一样 */
}
.fv-ring{
  position:absolute;width:64%;aspect-ratio:3/4;max-width:300px;
  border:2px solid rgba(255,255,255,.75);border-radius:50%;
  box-shadow:0 0 0 2000px rgba(6,10,22,.42);
  pointer-events:none;
}
.fv-tip{
  position:absolute;left:0;right:0;bottom:14px;text-align:center;
  font-size:14px;color:#fff;padding:0 16px;text-shadow:0 1px 6px rgba(0,0,0,.6);
}
.fv-tip.is-err{color:#ffd5d5}
.fv-tip.is-ok{color:#b7f7d8}
.fv-note{font-size:12px;color:rgba(255,255,255,.6);text-align:center;padding:6px 0;min-height:16px}
.fv-foot{padding-top:6px}
.fv-foot .btn{
  width:100%;height:46px;border-radius:12px;background:rgba(255,255,255,.14);
  color:#fff;border:0;
}

/* ---------------- 提示条 ---------------- */
.m-body .toast{
  bottom:calc(var(--m-tab-h) + env(safe-area-inset-bottom) + 18px);
}

/* ---------------- 打印：报告单按原尺寸输出 ---------------- */
@media print{
  .m-bar,.m-tabs,.m-sheet-wrap ~ *,.no-print{display:none!important}
  .m-main{padding:0!important;max-width:none!important}
  .m-card{box-shadow:none!important;border:0!important;padding:0!important;margin:0!important}
  .m-sheet-wrap{border:0!important;overflow:visible!important}
  .m-sheet-host{overflow:visible!important;height:auto!important}
  .m-sheet-host .a4-sheet{transform:none!important}
  .m-detail-bar{display:none!important}
}

/* ---------------- 平板/桌面：居中限宽，别把手机版拉成怪样子 ---------------- */
@media (min-width:720px){
  .m-main{max-width:680px;padding-top:calc(var(--m-bar-h) + 20px)}
  .m-card{padding:18px}
  .m-tabs{max-width:680px;left:50%;transform:translateX(-50%);border:1px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0}
}