:root{
  --bg:#f4f5f7; --card:#fff; --text:#1a1d23; --sub:#6b7280; --line:#e5e7eb;
  --blue:#2563eb; --blue-soft:#eff4ff; --green:#059669;
  --radius:14px; --shadow:0 1px 3px rgba(16,24,40,.06),0 1px 2px rgba(16,24,40,.04);
  --safe-b:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
/* hidden 属性必须能盖过 display:flex 之类的规则，否则像 .sheet 这种面板关不掉 */
[hidden]{display:none!important}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--text);
  font:15px/1.5 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;
  padding-bottom:calc(64px + var(--safe-b));
  -webkit-text-size-adjust:100%;
}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}

/* ---------- 登录 ---------- */
.login-body{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px;background:linear-gradient(160deg,#eef2ff,#f4f5f7 60%)}
.login-card{width:100%;max-width:360px;background:var(--card);border-radius:20px;padding:32px 26px;box-shadow:0 8px 30px rgba(16,24,40,.08)}
.login-logo{font-size:34px;text-align:center;margin-bottom:8px}
.login-card h1{margin:0 0 22px;text-align:center;font-size:21px;letter-spacing:.5px}
.login-sub{margin:4px 0 24px;text-align:center;color:var(--sub);font-size:13px}
.login-card label{display:block;margin-bottom:14px;font-size:13px;color:var(--sub)}
.login-card input{width:100%;margin-top:6px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-size:16px;background:#fbfbfc}
.login-card input:focus{outline:none;border-color:var(--blue);background:#fff}
.login-card button[type="submit"]{width:100%;margin-top:8px;padding:13px;border-radius:10px;background:var(--blue);color:#fff;font-size:16px;font-weight:600}
.login-err{background:#fef2f2;color:#b91c1c;font-size:13px;padding:10px 12px;border-radius:8px;margin-bottom:14px}
.login-ok{background:#ecfdf5;color:#047857;font-size:13px;padding:10px 12px;border-radius:8px;margin-bottom:14px}
.code-row{display:flex;gap:8px;margin-top:6px;align-items:stretch}
.code-row input{flex:1;min-width:0;margin-top:0!important}
.sendbtn{flex:0 0 auto;width:auto;padding:0 14px;border-radius:10px;border:1px solid var(--line);background:#f8fafc;
  color:var(--blue);font-size:13.5px;font-weight:600;white-space:nowrap}
.sendbtn:disabled{color:var(--sub);background:#f3f4f6;cursor:default}
.mail-hint{display:block;margin-top:6px;font-size:12px;color:var(--sub)}
.msg-btn{display:inline-block;margin-top:18px;padding:11px 26px;border-radius:10px;background:var(--blue);
  color:#fff;text-decoration:none;font-size:15px;font-weight:600}
.remember-row{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--text);margin:2px 0 14px;cursor:pointer;user-select:none}
.remember-row input{width:18px;height:18px;margin:0;accent-color:var(--blue);flex:0 0 auto}

/* ---------- 顶部 ---------- */
.topbar{position:sticky;top:0;z-index:20;background:#f4f5f7;border-bottom:1px solid transparent;padding:10px 14px 0}
.searchrow{position:relative;display:flex;align-items:center;gap:8px}
#q{flex:1;min-width:0;padding:11px 38px 11px 38px;border:1px solid var(--line);border-radius:12px;font-size:16px;background:#fff;box-shadow:var(--shadow)}
#q:focus{outline:none;border-color:var(--blue)}
.searchrow::before{content:"🔍";position:absolute;left:13px;font-size:14px;opacity:.55;pointer-events:none}
#clearq{position:absolute;right:66px;width:26px;height:26px;border-radius:50%;color:var(--sub);font-size:13px}
.logoutbtn{flex:0 0 auto;padding:0 12px;height:38px;border-radius:10px;background:#fff;border:1px solid var(--line);
  color:var(--sub);font-size:13px;box-shadow:var(--shadow)}
.logoutbtn:hover{color:#b91c1c;border-color:#fecaca;background:#fef2f2}
.tabs{display:flex;gap:8px;overflow-x:auto;padding:10px 0 10px;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:0 0 auto;padding:6px 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:13.5px;color:var(--sub);white-space:nowrap}
.tab.on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:600}

/* ---------- 列表 ---------- */
.list{padding:4px 14px 14px;max-width:760px;margin:0 auto}
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:13px 15px;margin-bottom:10px;cursor:pointer;transition:transform .12s}
.card:active{transform:scale(.985)}
.card-top{display:flex;align-items:baseline;gap:8px;margin-bottom:7px}
.card-name{font-size:16px;font-weight:600;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.badge{flex:0 0 auto;font-size:11px;padding:2px 7px;border-radius:6px;background:var(--blue-soft);color:var(--blue);font-weight:600}
.badge.gray{background:#f3f4f6;color:#9ca3af}
.badge.warn{background:#fef3c7;color:#b45309}
.row{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--sub);margin-top:5px;flex-wrap:wrap}
.row b{color:var(--text);font-weight:500}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px}
.copy{padding:1px 8px;border-radius:6px;background:var(--blue-soft);color:var(--blue);font-size:12px;font-weight:600;flex:0 0 auto}
.copy:active{background:#dbe6ff}
.dot{width:3px;height:3px;border-radius:50%;background:#d1d5db;flex:0 0 auto}
.bindtag{display:inline-block;font-size:12px;padding:2px 8px;border-radius:6px;background:#ecfdf5;color:#059669;font-weight:600;margin-right:6px}
.bindtag.none{background:#f3f4f6;color:#9ca3af}
.bindtag.ali{background:#eff6ff;color:#2563eb}

/* ---------- 底部栏 ---------- */
.bottombar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;background:#fff;border-top:1px solid var(--line);padding-bottom:var(--safe-b)}
.bt{flex:1;padding:11px 0 12px;font-size:12.5px;color:var(--sub);white-space:nowrap;text-align:center}
.bt.active{color:var(--blue);font-weight:600}

/* ---------- 详情面板 ---------- */
.sheet{position:fixed;inset:0;z-index:50;display:flex;align-items:flex-end}
.sheet-mask{position:absolute;inset:0;background:rgba(17,24,39,.4)}
.sheet-panel{position:relative;width:100%;max-height:88vh;background:#fff;border-radius:20px 20px 0 0;display:flex;flex-direction:column;animation:up .22s ease-out}
@keyframes up{from{transform:translateY(30px);opacity:.6}to{transform:none;opacity:1}}
.sheet-head{display:flex;align-items:center;padding:16px 18px 10px;border-bottom:1px solid var(--line)}
.sheet-head h2{margin:0;font-size:17px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sheet-body{padding:14px 18px;overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch}
.sheet-foot{display:flex;gap:10px;padding:12px 18px calc(16px + var(--safe-b));border-top:1px solid var(--line)}
.sheet-foot button{flex:1;padding:12px;border-radius:11px;font-size:15px;font-weight:600}
.btn-primary{background:var(--blue);color:#fff}
.btn-ghost{background:#f3f4f6;color:var(--text)}
.iconbtn{width:32px;height:32px;border-radius:50%;color:var(--sub);font-size:15px}

.fld{padding:9px 0;border-bottom:1px solid #f3f4f6}
.fld:last-child{border-bottom:0}
.fld-k{font-size:12px;color:var(--sub);margin-bottom:3px}
.fld-v{font-size:15px;word-break:break-all;display:flex;align-items:center;gap:8px}
.fld-v input,.fld-v select,.fld-v textarea{width:100%;padding:8px 10px;border:1px solid var(--line);
  border-radius:8px;font-size:15px;font-family:inherit;background:#fff;box-sizing:border-box}
.fld-v textarea{resize:vertical;min-height:52px}
.fld-v input:focus,.fld-v select:focus,.fld-v textarea:focus{outline:none;border-color:var(--blue)}
.add-card{border:1.5px dashed #cbd5e1;background:transparent;box-shadow:none;color:var(--sub);
  text-align:center;font-size:14px;padding:16px}
.add-card:hover{border-color:var(--blue);color:var(--blue);background:#f8fbff}
.btn-ghost.danger{background:#fef2f2;color:#b91c1c}
.exp{font-size:12px;padding:1px 7px;border-radius:5px;background:#fff7ed;color:#c2410c;font-weight:500}

.link-shop{display:flex;align-items:center;gap:6px;padding:8px 10px;background:#f9fafb;border-radius:8px;margin-bottom:6px;font-size:14px}
.link-shop .nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- 表格视图（桌面宽屏） ---------- */
/* 注意：这里绝不能加 overflow:hidden（原意是为了圆角），
   它会让 position:sticky 的表头失效 —— 表头会跟着内容滚走。圆角改用单元格自己做。 */
.tbl{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0;background:#fff;
  border-radius:12px;box-shadow:var(--shadow);font-size:13.5px}
.tbl th{background:#f8fafc;text-align:left;font-weight:600;color:var(--sub);font-size:12.5px;
  padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:9px 12px;border-bottom:1px solid #f1f3f5;vertical-align:middle;
  white-space:nowrap;overflow:hidden}
/* 列宽固定，内容超长显示省略号，这样任何宽度下都不会横向溢出 */
/* 店铺表 10 列（桌面） */
.tbl-shop th:nth-child(1),.tbl-shop td:nth-child(1){width:15%}
.tbl-shop th:nth-child(2),.tbl-shop td:nth-child(2){width:7%}
.tbl-shop th:nth-child(3),.tbl-shop td:nth-child(3){width:12%}
.tbl-shop th:nth-child(4),.tbl-shop td:nth-child(4){width:9%}
.tbl-shop th:nth-child(5),.tbl-shop td:nth-child(5){width:12%}
.tbl-shop th:nth-child(6),.tbl-shop td:nth-child(6){width:16%}
.tbl-shop th:nth-child(7),.tbl-shop td:nth-child(7){width:8%}
.tbl-shop th:nth-child(8),.tbl-shop td:nth-child(8){width:5%}
.tbl-shop th:nth-child(9),.tbl-shop td:nth-child(9){width:6%}
.tbl-shop th:nth-child(10),.tbl-shop td:nth-child(10){width:10%}
/* 手机号表 8 列（桌面） */
.tbl-phone th:nth-child(1),.tbl-phone td:nth-child(1){width:14%}
.tbl-phone th:nth-child(2),.tbl-phone td:nth-child(2){width:8%}
.tbl-phone th:nth-child(3),.tbl-phone td:nth-child(3){width:20%}
.tbl-phone th:nth-child(4),.tbl-phone td:nth-child(4){width:8%}
.tbl-phone th:nth-child(5),.tbl-phone td:nth-child(5){width:22%}
.tbl-phone th:nth-child(6),.tbl-phone td:nth-child(6){width:8%}
.tbl-phone th:nth-child(7),.tbl-phone td:nth-child(7){width:8%}
.tbl-phone th:nth-child(8),.tbl-phone td:nth-child(8){width:12%}
/* 单元格内的文本自己收缩，保证后面的复制图标永远露出来。
   注意选择器必须限定在 td 内部：td 自己也可能带 .mono 类，
   直接写 .tbl .mono 会命中 td，把 table-cell 变成 inline-block，整列塌掉。 */
.tbl td .mono{display:inline-block;max-width:calc(100% - 24px);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
.tbl tbody tr{cursor:pointer;transition:background .1s}
.tbl tbody tr:hover{background:#f7faff}
.tbl tbody tr:last-child td{border-bottom:0}
/* 圆角落在四个角的单元格上（不用 overflow:hidden 裁） */
.tbl thead tr th:first-child{border-top-left-radius:12px}
.tbl thead tr th:last-child{border-top-right-radius:12px}
.tbl tbody tr:last-child td:first-child{border-bottom-left-radius:12px}
.tbl tbody tr:last-child td:last-child{border-bottom-right-radius:12px}
.tbl .c-name{font-weight:600;color:var(--text);text-overflow:ellipsis}
.tbl .c-note{color:var(--sub);font-size:12.5px;text-overflow:ellipsis}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums}
.tbl .muted{color:#c8ccd4}
.copy.mini{opacity:.3;margin-left:5px;padding:0 5px;font-size:11px;line-height:17px;border-radius:4px;
  background:#eef2ff;color:#4b6cf6;vertical-align:1px;transition:opacity .12s}
.tbl tr:hover .copy.mini{opacity:1}
.st{font-size:12px;padding:1px 7px;border-radius:5px;font-weight:500}
.st.ok{background:#ecfdf5;color:#059669}
.st.off{background:#f3f4f6;color:#9ca3af}
.st.wk{background:#fef3c7;color:#b45309}
/* 营业执照：有限公司/企业 vs 个体工商户 */
.lic{display:inline-block;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;vertical-align:middle;font-size:12.5px;padding:1px 7px;border-radius:5px}
.lic.corp{background:#eef2ff;color:#4338ca}
.lic.solo{background:#f0fdf4;color:#15803d}
.lic.person{background:#f3f4f6;color:#4b5563}
.lic.unfilled{background:#fef2f2;color:#b91c1c}
.kindtag{font-size:11px;padding:1px 6px;border-radius:4px;white-space:nowrap;flex:0 0 auto}
.kindtag.k-lic{background:#e0e7ff;color:#3730a3}
.kindtag.k-per{background:#f3f4f6;color:#6b7280}

/* ---------- 执照页：一个执照一块，下面挂它名下的店 ---------- */
.lic-group{background:#fff;border-radius:14px;box-shadow:var(--shadow);margin-bottom:12px;overflow:hidden}
.lic-head{display:flex;align-items:center;gap:10px;padding:12px 15px;
  background:#fafbfc;border-bottom:1px solid #f1f3f5}
.lic-head .lic{font-size:13.5px;font-weight:600;max-width:none}
.lic-meta{margin-left:auto;font-size:12.5px;color:var(--sub);white-space:nowrap}
.lic-shops{padding:2px 0}
.lic-shop{display:grid;grid-template-columns:1.7fr 58px 1.4fr 1fr 1.1fr auto;gap:10px;
  align-items:center;padding:9px 15px;border-bottom:1px solid #f7f8fa;cursor:pointer;font-size:13.5px}
.lic-shop:last-child{border-bottom:0}
.lic-shop:hover{background:#f7faff}
.ls-name{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ls-acct,.ls-pwd,.ls-phone{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--sub);font-size:13px}
@media (max-width:899px){
  .lic-shop{display:block;padding:11px 15px}
  .ls-name{display:block;font-weight:600;margin-bottom:4px;font-size:15px}
  .ls-plat{margin-bottom:6px}
  .ls-acct,.ls-pwd,.ls-phone{display:inline-block;margin-right:14px;font-size:12.5px}
  .ls-acct::before{content:"账号 "}
  .ls-pwd::before{content:"密码 "}
  .ls-phone::before{content:"手机 "}
}

@media (min-width:900px){
  /* 顶栏和列表用同一套留白，保证左右对齐 */
  .topbar{padding:12px max(22px, calc((100vw - 1280px) / 2 + 22px)) 0}
  .list{max-width:1280px;padding:6px 22px 24px}
  .tabs{padding:10px 0 12px}
  .card{margin-bottom:8px}
  /* 表头钉住，滚到下面也知道哪列是什么 */
  .tbl thead th{position:sticky;top:var(--topbar-h,110px);z-index:6;
    box-shadow:inset 0 -1px 0 var(--line)}
  .bottombar{max-width:440px;margin:0 auto;border-radius:14px 14px 0 0;
    border-left:1px solid var(--line);border-right:1px solid var(--line)}
  body{padding-bottom:calc(58px + var(--safe-b))}

  /* 电脑上详情/编辑改成居中的对话框，不再铺满整屏 */
  .sheet{align-items:center;justify-content:center;padding:24px}
  .sheet-mask{background:rgba(17,24,39,.45)}
  .sheet-panel{width:580px;max-width:100%;max-height:calc(100vh - 96px);
    border-radius:16px;box-shadow:0 24px 64px rgba(16,24,40,.22);
    animation:sheet-in .16s ease-out}
  @keyframes sheet-in{from{transform:scale(.97);opacity:.5}to{transform:none;opacity:1}}
  .sheet-head{padding:18px 22px 12px}
  .sheet-head h2{font-size:17px}
  .sheet-body{padding:6px 22px 16px}
  .sheet-foot{padding:14px 22px 18px}
  .sheet-foot button{padding:11px}
}

/* ---------- 手机：也用表格，靠隐藏次要列换取密度 ---------- */
@media (max-width:899px){
  .list{padding:4px 8px 14px}
  .tbl{border-radius:10px;font-size:12.5px}
  .tbl th{padding:7px 4px;font-size:10.5px}
  .tbl td{padding:8px 4px}
  .tbl .mono{font-size:11px;max-width:calc(100% - 17px)}
  .copy.mini{opacity:1;padding:0 2px;font-size:9.5px;line-height:14px;margin-left:2px}
  .badge{font-size:10px;padding:1px 4px}
  .st{font-size:10px;padding:0 3px}

  /* 店铺表只留：店铺 / 账号 / 密码 / 手机 / 状态
     账号和手机号必须留够宽度，否则会被省略号吃掉 */
  .tbl-shop th:nth-child(2),.tbl-shop td:nth-child(2),
  .tbl-shop th:nth-child(6),.tbl-shop td:nth-child(6),
  .tbl-shop th:nth-child(7),.tbl-shop td:nth-child(7),
  .tbl-shop th:nth-child(8),.tbl-shop td:nth-child(8),
  .tbl-shop th:nth-child(10),.tbl-shop td:nth-child(10){display:none}
  .tbl-shop th:nth-child(1),.tbl-shop td:nth-child(1){width:23%}
  .tbl-shop th:nth-child(3),.tbl-shop td:nth-child(3){width:25%}
  .tbl-shop th:nth-child(4),.tbl-shop td:nth-child(4){width:15%}
  .tbl-shop th:nth-child(5),.tbl-shop td:nth-child(5){width:28%}
  .tbl-shop th:nth-child(9),.tbl-shop td:nth-child(9){width:9%}
  /* 店名用 12px，六个中文字刚好放下；密码用 10.5px 让 junjun22 完整显示 */
  .tbl-shop td:nth-child(1){font-size:12px}
  .tbl-shop td:nth-child(4){font-size:10.5px}
  /* 密码列太窄，去掉复制图标把地方让给内容 */
  .tbl-shop td:nth-child(4) .copy.mini{display:none}
  .tbl-shop td:nth-child(4) .mono{max-width:100%}

  /* 手机号表只留：号码 / 状态 / 实名 / 使用者 / 绑店 */
  .tbl-phone th:nth-child(3),.tbl-phone td:nth-child(3),
  .tbl-phone th:nth-child(7),.tbl-phone td:nth-child(7),
  .tbl-phone th:nth-child(8),.tbl-phone td:nth-child(8){display:none}
  .tbl-phone th:nth-child(1),.tbl-phone td:nth-child(1){width:30%}
  .tbl-phone th:nth-child(2),.tbl-phone td:nth-child(2){width:12%}
  .tbl-phone th:nth-child(4),.tbl-phone td:nth-child(4){width:14%}
  .tbl-phone th:nth-child(5),.tbl-phone td:nth-child(5){width:32%}
  .tbl-phone th:nth-child(6),.tbl-phone td:nth-child(6){width:12%}
}

/* ---------- 其它 ---------- */
.empty{text-align:center;padding:60px 20px;color:var(--sub)}
.empty-ico{font-size:40px;margin-bottom:10px;opacity:.4}
.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);background:rgba(17,24,39,.9);color:#fff;padding:9px 18px;border-radius:20px;font-size:13.5px;z-index:99}