/* ==========================================================
   安宜星·实名认证  手机端样式层
   只在 ≤820px 生效，PC 端一行都不受影响
   ========================================================== */
@media (max-width:820px){

/* ---------- 基础 ---------- */
html{-webkit-text-size-adjust:100%}
body{
  font-size:15px;
  line-height:1.7;
  /* 给底部 Tab 栏让位，含 iPhone 安全区 */
  padding-bottom:calc(58px + env(safe-area-inset-bottom, 0px));
}
body.no-tabbar{padding-bottom:0}
/* 没有底部栏的页面（如登录页）不留白 */
body:not(:has(.m-tabbar)){padding-bottom:0}
.wrap,.wrap-sm{padding:0 16px}
img{max-width:100%}
/* iOS 上输入框字号 <16px 会触发页面放大 */
input,select,textarea{font-size:16px !important}

/* ---------- 顶部导航：只留 logo + 主按钮 ---------- */
.nav-in{
  height:54px;
  padding:0 14px !important;
  gap:10px !important;
}
.nav-menu{display:none !important}
.logo{font-size:15px;gap:8px}
.logo-mark{width:28px;height:28px}
.logo-sub{font-size:15px}
.nav-actions{gap:8px !important;margin-left:auto}
.nav-actions .small.muted{display:none}
.nav-actions .btn{height:32px !important;padding:0 13px !important;font-size:13px !important}
body.cab-mode .nav-in{padding:0 14px !important}
/* 控制台的「退出」在抽屉里，顶部不占位 */
body.cab-mode .nav-actions .btn-ghost{display:none}

/* 控制台顶部：汉堡按钮 */
.m-burger{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border:1px solid var(--line);border-radius:9px;
  background:#fff;color:var(--ink-2);cursor:pointer;flex:none;
}
.m-burger:active{background:#f3f7fd}

/* ---------- 前台底部 Tab 栏 ---------- */
.m-tabbar{
  position:fixed;left:0;right:0;bottom:0;z-index:1100;
  display:flex;align-items:stretch;
  background:rgba(255,255,255,.97);
  backdrop-filter:saturate(180%) blur(12px);
  border-top:1px solid var(--line);
  padding-bottom:env(safe-area-inset-bottom, 0px);
  box-shadow:0 -2px 12px rgba(15,23,42,.05);
}
.m-tabbar a,.m-tabbar button{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;padding:7px 2px 6px;color:#8a97a8;font-size:10.5px;line-height:1.2;
  -webkit-tap-highlight-color:transparent;
}
/* button 版本（控制台「更多」）要清掉浏览器默认样式 */
.m-tabbar button{
  border:0;background:transparent;cursor:pointer;font-family:inherit;
}
.m-tabbar a svg,.m-tabbar button svg{width:21px;height:21px;display:block;stroke:currentColor;fill:none;
  stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.m-tabbar a.on,.m-tabbar button.on{color:var(--blue);font-weight:600}
.m-tabbar a:active,.m-tabbar button:active{background:#f4f8fe}
.m-tabbar button span{line-height:1.2}

/* ---------- 控制台：底部 Tab（5 项，含「更多」） ---------- */
.m-tabbar.cab-tab a{font-size:10.5px}

/* ---------- 控制台侧栏 → 抽屉 ---------- */
.cab{display:block}
.side{display:none !important}
.main{padding:16px 14px calc(20px + env(safe-area-inset-bottom, 0px)) !important}

.m-drawer{display:block;position:fixed;inset:0;z-index:1400;visibility:hidden;opacity:0;transition:.22s}
.m-drawer.on{visibility:visible;opacity:1}
.m-drawer-mask{position:absolute;inset:0;background:rgba(15,23,42,.42)}
.m-drawer-panel{
  position:absolute;right:0;top:0;bottom:0;width:76%;max-width:300px;
  background:#fff;box-shadow:-8px 0 30px rgba(15,23,42,.18);
  transform:translateX(100%);transition:transform .24s cubic-bezier(.32,.72,0,1);
  display:flex;flex-direction:column;
  padding-bottom:env(safe-area-inset-bottom, 0px);
}
.m-drawer.on .m-drawer-panel{transform:translateX(0)}
.m-drawer-head{
  padding:16px 18px 12px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;
}
.m-drawer-head b{font-size:15px;color:var(--ink)}
.m-drawer-close{
  width:30px;height:30px;border:0;background:#f2f5fa;border-radius:8px;
  color:var(--ink-2);font-size:17px;line-height:1;cursor:pointer;
}
.m-drawer-bal{padding:14px 18px 16px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#f7fbff,#fff)}
.m-drawer-bal .lb{font-size:11.5px;color:var(--muted)}
.m-drawer-bal .vl{font-size:24px;font-weight:600;color:var(--ink);letter-spacing:-.4px;margin:2px 0 10px}
.m-drawer-nav{flex:1;overflow-y:auto;padding:8px 10px 20px;-webkit-overflow-scrolling:touch}
.m-drawer-nav .grp{font-size:11px;color:#94a3b8;padding:12px 8px 6px;letter-spacing:.4px}
.m-drawer-nav a{
  display:flex;align-items:center;gap:11px;padding:12px 10px;border-radius:9px;
  color:var(--ink-2);font-size:15px;
}
.m-drawer-nav a i{width:18px;text-align:center;font-style:normal;font-size:14px;opacity:.8}
.m-drawer-nav a.on{background:var(--blue-50);color:var(--blue);font-weight:600}
.m-drawer-nav a:active{background:#f2f6fc}

/* ---------- Hero ---------- */
.hero{padding:34px 0 54px}
.hero-grid{grid-template-columns:1fr !important;gap:26px !important}
h1.hero-title{font-size:29px !important;line-height:1.32}
h2.sec-title{font-size:23px !important}
.hero p.lead{font-size:14.5px;margin-top:14px}
.hero-cta{gap:10px;margin-top:22px}
.hero-cta .btn{flex:1;min-width:calc(50% - 5px);height:44px;font-size:14.5px}
.hero-trust{margin-top:26px;padding-top:20px;display:grid;grid-template-columns:1fr 1fr;gap:14px 0}
.hero-trust div{padding:0 14px !important;border-left:0 !important;font-size:11.5px}
.hero-trust div:first-child{padding-left:14px !important}
.hero-trust b{font-size:19px}
.hero + .section,.hero + .section-sm{margin-top:-22px;border-radius:22px 22px 0 0}

/* ---------- 区块 ---------- */
.section{padding:36px 0 !important}
.section-sm{padding:28px 0 !important}
.sec-sub{font-size:14px;margin-top:9px}
.eyebrow{font-size:11.5px;margin-bottom:10px}

/* ---------- 栅格全部单列 ---------- */
.grid-2,.grid-3,.grid-4,.prod,.pk-grid{grid-template-columns:1fr !important}
.stat-grid{grid-template-columns:1fr 1fr !important;gap:10px !important}

/* ---------- 卡片 ---------- */
.card,.prod-card{border-radius:12px}
.stat{padding:14px 14px !important}
.stat .vl{font-size:21px !important}
.stat .lb{font-size:11.5px}
.stat .ft{font-size:11px}

/* ---------- 面板 ---------- */
.panel{border-radius:11px;margin-bottom:14px}
.panel-head{padding:13px 14px !important}
.panel-head h3{font-size:14px}
.panel-body{padding:14px !important}
.page-head{margin-bottom:14px !important;gap:10px !important}
.page-head h1{font-size:19px !important}
.page-head .desc{font-size:12.5px}

/* ---------- 表格 → 卡片 ---------- */
.tbl{border-collapse:separate;border-spacing:0}
.tbl thead{display:none}
.tbl tbody,.tbl tr,.tbl td{display:block;width:100%}
.tbl tr{
  border:1px solid var(--line);border-radius:11px;background:#fff;
  margin-bottom:10px;padding:4px 13px;box-shadow:0 1px 2px rgba(15,23,42,.03);
}
.tbl tr:hover td{background:transparent}
.tbl td{
  border:0 !important;padding:7px 0 !important;font-size:13.5px !important;
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
  text-align:right !important;white-space:normal !important;
  border-bottom:1px dashed #f1f4f9 !important;
}
.tbl td:last-child{border-bottom:0 !important}
.tbl td:before{
  content:attr(data-label);
  flex:none;color:var(--muted);font-size:12.5px;font-weight:400;
  text-align:left;max-width:40%;
}
.tbl td:not([data-label]):before{content:"";display:none}
.tbl td:not([data-label]){justify-content:flex-end}
.tbl .r{text-align:right !important}
.tbl .c{text-align:right !important}
/* 面板内嵌的无边框表格保持原样（如档位对照） */
.tbl.keep{display:table;border-spacing:0}
.tbl.keep thead{display:table-header-group}
.tbl.keep tr{display:table-row;border:0;border-radius:0;margin:0;padding:0;box-shadow:none;background:transparent}
.tbl.keep td{display:table-cell;text-align:left !important;padding:10px 8px !important;border-bottom:1px solid #f1f4f9 !important;font-size:12.5px !important}
.tbl.keep td:before{display:none}
.tbl.keep th{display:table-cell;font-size:11.5px;padding:9px 8px !important}

/* 通用横滚容器（宽表兜底） */
.m-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -2px;padding:0 2px}
.m-scroll .tbl{min-width:640px}
/* 价格表：手机端改成卡片，每档一张，操作按钮不跑偏 */
.m-scroll .price-table{display:block;min-width:0;border-collapse:separate}
.m-scroll .price-table thead{display:none}
.m-scroll .price-table tbody,
.m-scroll .price-table tr,
.m-scroll .price-table td{display:block;width:100%}
.m-scroll .price-table tr{
  border:1px solid var(--line);border-radius:12px;background:#fff;
  margin-bottom:10px;padding:8px 14px;box-shadow:0 1px 2px rgba(15,23,42,.03);
}
.m-scroll .price-table td{
  border:0 !important;padding:7px 0 !important;white-space:normal !important;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  border-bottom:1px dashed #f1f4f9 !important;text-align:right;
}
.m-scroll .price-table td:last-child{border-bottom:0 !important;padding-top:10px !important}
.m-scroll .price-table td:before{
  content:attr(data-label);color:var(--muted);font-size:12.5px;flex:none;
}
.m-scroll .price-table td.amt{font-size:17px;font-weight:600;color:var(--ink)}
.m-scroll .price-table td.amt:before{font-weight:400}
.m-scroll .price-table td.p{font-size:13.5px;color:var(--ink-2)}
.m-scroll .price-table td[data-label="操作"]{justify-content:flex-end}
.m-scroll .price-table td[data-label="操作"]:before{display:none}
.m-scroll .price-table td[data-label="操作"] .btn{width:100%}

/* 横滚容器内的普通表格：保持表格布局，靠左右滑动看全 */
.m-scroll .tbl{min-width:620px;display:table}
.m-scroll .tbl thead{display:table-header-group}
.m-scroll .tbl tbody{display:table-row-group}
.m-scroll .tbl tr{
  display:table-row;border:0;border-radius:0;margin:0;padding:0;
  box-shadow:none;background:transparent;
}
.m-scroll .tbl th,.m-scroll .tbl td{
  display:table-cell;white-space:nowrap;
  border:0 !important;border-bottom:1px solid #f1f4f9 !important;
  text-align:left !important;padding:11px 12px !important;font-size:12.5px !important;
}
.m-scroll .tbl td:before{display:none}

/* 页面里写死的内联多列网格，手机上统一压成单列 */
.main [style*="grid-template-columns"],
.wrap [style*="grid-template-columns"],
.wrap-sm [style*="grid-template-columns"]{
  grid-template-columns:1fr !important;
  gap:14px !important;
}
/* 两列按钮组（支付方式）保持两列 */
.pay-row[style*="grid-template-columns"]{grid-template-columns:1fr 1fr !important;gap:9px !important}

/* 只在手机上出现的提示（本文件整体已在媒体查询内） */
.m-only{display:inline}

/* ---------- 表单 ---------- */
.form-row{margin-bottom:14px}
.form-row label{font-size:13px}
.inp{height:46px !important;border-radius:10px;font-size:16px !important}
textarea.inp{height:auto !important;min-height:96px}
.btn{height:44px;font-size:15px;border-radius:10px}
.btn-sm{height:34px !important;padding:0 13px !important;font-size:13px !important}
.btn-lg{height:48px;font-size:15.5px}
.btn-block{width:100%}
.inp-group{gap:9px}
/* 输入框 width:100% 会把按钮挤出去，flex 里必须允许收缩 */
.inp-group .inp{width:auto;min-width:0;flex:1 1 0}
.inp-group .btn{height:46px !important;padding:0 14px !important;font-size:14px !important;flex:none}

/* ---------- 登录 ---------- */
.auth-wrap{min-height:auto;padding:24px 16px 32px}
.auth-card{max-width:100%;padding:26px 20px 24px !important;border-radius:15px !important;box-shadow:0 8px 26px rgba(16,54,110,.08) !important}
.auth-card h2{font-size:21px !important}
.auth-card .sub{font-size:13px !important;margin-bottom:18px !important}

/* ---------- 提示 ---------- */
.alert{padding:11px 13px;font-size:13px;border-radius:9px;margin-bottom:13px;line-height:1.7}

/* ---------- 选项卡 ---------- */
.tabs{display:flex;width:100%;margin-bottom:14px !important}
.tabs a{flex:1;text-align:center;padding:10px 8px !important;font-size:13.5px !important}

/* ---------- 套餐卡 ---------- */
.pk{padding:20px 18px !important}
.pk .pk-amt{font-size:26px !important}
.pk .pk-sub{min-height:auto}

/* ---------- 支付方式 ---------- */
.pay-row{grid-template-columns:1fr 1fr;gap:9px}
.pay-opt{padding:12px 13px}
.pay-tx b{font-size:13.5px}
.pay-tx span{font-size:11.5px}

/* ---------- API 文档 ---------- */
.doc{grid-template-columns:1fr !important;gap:0 !important}
.doc-nav{
  position:static !important;display:none;
}
/* grid 子项默认 min-width:auto，长代码会把整页撑宽，必须归零 */
.doc-body{min-width:0;max-width:100%}
.doc-body .code{max-width:100%;overflow-x:auto}
.doc-body .param-tbl{max-width:100%}
/* 任何块里的长串都不许顶破版心 */
.doc-body p,.doc-body li,.doc-body td{word-break:break-word}
.doc-body h2{font-size:20px !important}
.doc-body h3{font-size:15.5px !important;margin:24px 0 9px !important}
.doc-body p{font-size:14px !important;line-height:1.8 !important}
.doc-body ul.dot li{font-size:14px !important}
.code{font-size:11.5px !important;padding:13px 14px !important;border-radius:9px;line-height:1.7}
.param-tbl{font-size:12px !important;table-layout:auto}
.param-tbl td,.param-tbl th{padding:8px 7px !important}
/* 5 列的请求参数表：压窄前三列，示例列在手机上价值低，直接收起来 */
.param-tbl.p5 th:nth-child(1),.param-tbl.p5 td:nth-child(1){width:auto !important}
.param-tbl.p5 th:nth-child(2),.param-tbl.p5 td:nth-child(2){width:56px !important}
.param-tbl.p5 th:nth-child(3),.param-tbl.p5 td:nth-child(3){width:40px !important;text-align:center}
.param-tbl.p5 th:nth-child(5),.param-tbl.p5 td:nth-child(5){display:none}
.param-tbl td{word-break:break-word}
.method{font-size:11px}

/* ---------- CTA / 页脚 ---------- */
.cta-band{padding:26px 20px !important;border-radius:15px !important;gap:16px}
.cta-band h2{font-size:20px !important}
.cta-band p{font-size:13px}
.cta-band .btn{width:100%}

.footer{padding:30px 0 22px !important}
.footer-grid{grid-template-columns:1fr 1fr !important;gap:22px !important}
.footer-grid>div:first-child{grid-column:1 / -1}
.footer-grid .desc{font-size:12.5px;margin-top:8px}
.footer h4{font-size:12.5px;margin-bottom:8px}
.footer a{font-size:13px;padding:3px 0;display:block}
.footer-bottom{margin-top:20px;padding-top:16px;font-size:11.5px;flex-direction:column;gap:6px;align-items:flex-start}

/* ---------- 客服浮窗：右下角圆钮，点击直接跳客服 ---------- */
.kefu{top:auto !important;bottom:calc(76px + env(safe-area-inset-bottom, 0px)) !important;transform:none !important;right:12px}
.kefu-btn{
  width:50px !important;height:50px !important;padding:0 !important;
  border-radius:50% !important;
  box-shadow:0 6px 18px rgba(22,104,220,.34) !important;
  justify-content:center;
}
.kefu-btn .kefu-tx{display:none}
.kefu-btn svg{width:23px;height:23px}
.kefu-pop{display:none !important}

/* ---------- 分页 ---------- */
.pager{justify-content:center;padding:14px 10px !important;gap:5px}
.pager a,.pager span.pg{min-width:34px;height:34px;font-size:13px}

/* ---------- 其它细节 ---------- */
.breadcrumb,.crumb{display:none}
h1,h2,h3{word-break:break-word}
.mono,.code,pre{word-break:break-all}

/* 长表格（后台列表）允许横向滚动而不是撑破页面 */
.panel-body.np{overflow-x:auto;-webkit-overflow-scrolling:touch}

}
