/* 远山信笺网页台：跟桌面软件同一套浅色规格。
   按钮只准灰 / 蓝 / 红。绿和橙只给数字，不上按钮。 */
:root{
  --nav:#F5F6F8;
  --panel:#FFFFFF;
  --border:#DEE0E3;
  --text:#1F2329;
  --muted:#8F959E;
  --hint:#646A73;
  --go:#3370FF;
  --go2:#245BDB;
  --halt:#D83931;
  --halt2:#C02A24;
  --on:#2EA121;
  --wash:#E8F3FF;
  --btn:#EFF0F1;
  --btn2:#E4E5E7;
  --warm:#C2730C;
  --ivory:#FFFFFF;
  --font:"Microsoft YaHei UI","Microsoft YaHei",sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--nav);color:var(--text);font:13px/1.5 var(--font)}
a{color:var(--go);text-decoration:none}
a:hover{text-decoration:underline}
.hide{display:none !important}

.top{
  min-height:52px;height:auto;background:var(--panel);border-bottom:1px solid var(--border);
  display:flex;align-items:center;padding:8px 20px;gap:16px;flex-wrap:wrap;
}
.brand{font-size:15px;font-weight:600;letter-spacing:.02em;white-space:nowrap}
.brand small{font-weight:400;color:var(--hint);margin-left:8px;font-size:12px}
.top .gap{flex:1}
.top .meta{
  color:var(--hint);font-size:12px;white-space:nowrap;
  display:inline-flex;align-items:baseline;gap:6px;
}
.top .meta b{color:var(--text);font-weight:600}
.top .meta .money{
  color:var(--warm);font-size:16px;font-weight:600;
  font-variant-numeric:tabular-nums;line-height:1;
}
.top-ops{display:flex;align-items:center;gap:8px;flex-shrink:0}
.login-card .sub{
  color:var(--hint);font-size:12px;margin:-12px 0 18px;line-height:1.5;
}
.top-search{
  width:240px;flex:0 0 auto;margin:0;
  padding:6px 10px;background:var(--nav);border:1px solid var(--border);
  border-radius:4px;font:13px var(--font);color:var(--text);
}
.todo{
  display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px;
}
.todo button{background:var(--wash);color:var(--go)}
.todo button:hover{background:#D6E4FF}

.tabs{
  display:flex;gap:4px;background:var(--panel);border-bottom:1px solid var(--border);
  padding:0 16px;
}
.tab{
  appearance:none;background:none;border:0;border-bottom:2px solid transparent;
  color:var(--hint);padding:12px 14px;cursor:pointer;font:13px var(--font);
}
.tab:hover{color:var(--text)}
.tab.on{color:var(--go);border-bottom-color:var(--go);font-weight:600}

.page{max-width:1320px;margin:0 auto;padding:20px 20px 48px}

.u{
  display:inline;white-space:nowrap;font-style:normal;
  font-size:12px;font-weight:500;line-height:1;
}
.top .u{margin-left:2px;color:var(--warm)}
.amt{
  display:inline-flex;align-items:baseline;gap:4px;
  white-space:nowrap;font-variant-numeric:tabular-nums;
}
.amt .u{color:var(--warm)}
.take-tbl{
  width:100%;
  font-size:12px;
  table-layout:fixed;
}
.take-tbl col.take-n{width:13%}
.take-tbl col.take-p{width:24.666%}
.take-tbl th,
.take-tbl td{
  padding:6px 4px;
  white-space:nowrap;
}
.take-tbl th:not(.r),
.take-tbl td:not(.r){
  overflow:hidden;
  text-overflow:ellipsis;
}
.take-tbl th.r,
.take-tbl td.r{
  overflow:visible;
}
.take-tbl .amt{font-size:12px;gap:2px}
.take-tbl .amt .u{font-size:10px}
th.r,td.r{text-align:right;font-variant-numeric:tabular-nums}

.kpi{
  display:grid;grid-template-columns:repeat(4,minmax(180px,1fr));gap:12px;
}
.kpi.sub{
  margin-top:12px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
}
.kpi-item{
  background:var(--panel);border:1px solid var(--border);border-radius:8px;
  padding:18px 20px;min-width:0;
}
.kpi.sub .kpi-item{padding:14px 16px}
.kpi-item .lab{
  color:var(--hint);font-size:12px;line-height:1.2;white-space:nowrap;
}
.kpi-item .num{
  margin-top:10px;font-size:28px;font-weight:600;line-height:1;
  font-variant-numeric:tabular-nums;letter-spacing:-.03em;color:var(--text);
  white-space:nowrap;display:flex;align-items:baseline;flex-wrap:nowrap;gap:6px;
}
.kpi.sub .kpi-item .num{margin-top:8px;font-size:22px}
.kpi-item .num .u{font-size:14px;font-weight:500;color:var(--muted)}
.kpi-item .num.钱{color:var(--warm)}
.kpi-item .num.钱 .u{color:var(--warm)}
.kpi-item .num.on{color:var(--on)}
.kpi-item .num.go{color:var(--go)}
.kpi-item .sub{margin-top:8px;color:var(--muted);font-size:12px;white-space:nowrap}
.kpi-item .sub.up{color:var(--on)}
.kpi-item .sub.down{color:var(--halt)}
.board-note{
  margin:10px 0 0;color:var(--hint);font-size:12px;line-height:1.5;
}
.kpi-item.go{cursor:pointer}
.kpi-item.go:hover{border-color:var(--go)}
.trend{
  display:flex;align-items:flex-end;gap:6px;height:108px;padding:4px 0 0;
}
.tcol{
  flex:1;min-width:0;height:100%;display:flex;flex-direction:column;
  align-items:center;justify-content:flex-end;gap:6px;
}
.tbar{
  width:100%;max-width:22px;background:var(--go);border-radius:3px 3px 0 0;
  min-height:2px;
}
.tlab{font-size:10px;color:var(--hint);white-space:nowrap;line-height:1}
@media (max-width:1200px){
  .kpi{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi.sub{grid-template-columns:repeat(3,minmax(0,1fr))}
  .top{flex-wrap:wrap;height:auto;padding:8px 16px}
}

.login-wrap{
  min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;
}
.login-card{
  width:400px;background:var(--panel);border:1px solid var(--border);
  border-radius:8px;padding:28px 32px;
}
.login-card .brand{margin-bottom:22px}
.login-card button{width:100%;height:36px}

.card{
  background:var(--panel);border:1px solid var(--border);border-radius:8px;
  padding:16px 18px;margin:0 0 12px;
}
.card h2{
  font-size:13px;margin:0 0 12px;color:var(--text);font-weight:600;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.hint{color:var(--hint);font-size:12px}
.hint b{color:var(--warm);font-weight:600;font-variant-numeric:tabular-nums}
.hint .u{margin-left:4px}
.say{
  padding:8px 12px;border-radius:4px;margin:0 0 12px;font-size:12px;display:none;
}
.say.bad{background:#FDECEE;color:var(--halt);display:block}
.say.good{background:#E6F4EA;color:var(--on);display:block}

label{display:block;color:var(--hint);font-size:12px;margin:0 0 4px}
input,select,textarea{
  width:100%;padding:6px 10px;background:var(--panel);color:var(--text);
  border:1px solid var(--border);border-radius:4px;font:13px var(--font);outline:none;
}
input:focus,select:focus,textarea:focus{border-color:var(--go)}
textarea{height:120px;font-family:Consolas,monospace;color:var(--text);resize:vertical}

button{
  padding:6px 14px;background:var(--go);color:var(--ivory);border:none;
  border-radius:4px;cursor:pointer;font:13px var(--font);
}
button:hover{background:var(--go2)}
button.ghost{background:var(--btn);color:var(--text)}
button.ghost:hover{background:var(--btn2)}
button.bad{background:var(--halt);color:var(--ivory)}
button.bad:hover{background:var(--halt2)}
button.sm{padding:3px 10px;font-size:12px}
button:disabled{opacity:.5;cursor:not-allowed}
a.ghost{
  display:inline-flex;align-items:center;justify-content:center;
  padding:6px 14px;background:var(--btn);color:var(--text);
  border-radius:4px;text-decoration:none;font:13px var(--font);
}
a.ghost:hover{background:var(--btn2);color:var(--text);text-decoration:none}
a.ghost.sm{padding:3px 10px;font-size:12px}

.row{display:flex;gap:12px;flex-wrap:wrap}
.row>*{flex:1;min-width:140px}
.row.tight>*{min-width:110px}
.row.pack-row>*{flex:1 1 100%;min-width:0}
.pack-pick{min-width:0}
.pack-pick select{width:100%}
.toolbar{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin:0 0 10px;
}
.toolbar .gap{flex:1;min-width:8px}
.toolbar input,
.toolbar select{
  width:auto;
  height:32px;
  margin:0;
  flex:0 0 auto;
  box-sizing:border-box;
}
.toolbar select{min-width:160px;flex:1 1 180px;max-width:240px}
.toolbar input[type="date"]{width:148px;flex:0 0 auto;min-width:0}
.toolbar button{height:32px;flex-shrink:0;white-space:nowrap}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.check{display:flex;align-items:center;gap:6px;color:var(--hint);font-size:12px;margin:8px 0}
.check input{width:auto}

.格{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:10px}
.块{background:var(--nav);border:1px solid var(--border);border-radius:6px;padding:12px 14px}
.card h2>button,.card h2>.actions{flex:0 0 auto;margin:0}
.dlg.wide{width:640px}
.dlg.wide .take{margin-top:12px}

.menu-sheet{display:flex;flex-direction:column;gap:14px}
.menu-g .lab{
  font-size:12px;color:var(--hint);margin:0 0 8px;font-weight:500;
}
.menu-g .row{
  display:grid;grid-template-columns:1fr 1fr;gap:8px;
}
.menu-g .row button{
  width:100%;min-width:0;height:36px;margin:0;
}
.menu-g.risk{
  padding:10px 10px 12px;
  background:#FDECEC;
  border:1px solid #F5C2C0;
  border-radius:8px;
}
.menu-g.risk .lab{color:var(--halt)}
.menu-g.risk .row{grid-template-columns:1fr}
.take-bar{
  display:flex;align-items:center;gap:10px;margin:10px 0 4px;
}
.take-bar input[type=range]{flex:1;min-width:0;padding:0;height:24px;background:transparent}
.take-bar span{color:var(--hint);font-size:12px;white-space:nowrap}
.块 .k{color:var(--hint);font-size:12px}
.块 .v{font-size:22px;color:var(--text);font-weight:600;line-height:1.3;margin-top:2px}
.块 .v.钱{color:var(--warm)}
.块 .v.蓝{color:var(--go)}
.块 .v.绿{color:var(--on)}

table{width:100%;border-collapse:collapse;font-size:12px}
th{
  text-align:left;color:var(--hint);font-weight:600;padding:8px 8px;
  border-bottom:1px solid var(--border);white-space:nowrap;background:var(--nav);
}
td{padding:8px;border-bottom:1px solid var(--border);vertical-align:middle}
tr:hover td{background:#FAFBFC}
code{font-family:Consolas,monospace;color:var(--text);font-size:12px}
.acc{color:var(--go);cursor:pointer}
.acc:hover{text-decoration:underline}
.secret{
  font-family:Consolas,monospace;word-break:break-all;
  background:var(--nav);border:1px solid var(--border);
  border-radius:4px;padding:8px 10px;margin:8px 0;font-size:12px;
}
.pill{
  display:inline-block;padding:1px 8px;border-radius:10px;font-size:11px;
  background:var(--btn);color:var(--hint);white-space:nowrap;
}
.pill.停,.pill.作废{background:#FDECEE;color:var(--halt)}
.pill.on,.pill.在用,.pill.正常{background:#E6F4EA;color:var(--on)}
.pill.到期{background:#F3F4F5;color:var(--muted)}
.td-ops{white-space:nowrap}
.缩{color:var(--muted)}
.scroll{overflow:auto;max-height:440px;border:1px solid var(--border);border-radius:6px}
.scroll table{margin:0}
.scroll th{position:sticky;top:0}
.empty{color:var(--muted);padding:28px 8px;text-align:center}

.bar{display:flex;gap:20px;flex-wrap:wrap;align-items:baseline}
.num{font-size:18px;color:var(--go);font-weight:600}
.money{font-size:18px;color:var(--warm);font-weight:600}

.mask{
  position:fixed;inset:0;background:rgba(31,35,41,.36);
  display:flex;align-items:center;justify-content:center;z-index:20;padding:16px;
  overflow:auto;
}
.dlg{
  width:400px;max-width:100%;max-height:calc(100vh - 32px);
  overflow:auto;background:var(--panel);border:1px solid var(--border);
  border-radius:8px;padding:18px 20px;
}
.dlg h3{margin:0 0 12px;font-size:14px}
.dlg-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}

.pager{
  display:flex;align-items:center;gap:8px;margin-top:10px;
  color:var(--hint);font-size:12px;flex-wrap:wrap;
}
.pager .gap{flex:1}
.banner{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  background:var(--wash);border:1px solid #C2D6FF;border-radius:4px;
  padding:8px 12px;margin:0 0 10px;font-size:12px;color:var(--text);
}

.split{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.split3{grid-template-columns:1fr 1fr 1fr}
@media (max-width:860px){
  .split,.split3{grid-template-columns:1fr}
  .top{flex-wrap:wrap;height:auto;padding:8px 12px}
}

/* —— 管理后台：一块工作台，不是灰海里漂卡片 —— */
html:has(body.hq){height:100%;background:#0F1419}
body.hq{
  font-size:14px;
  background:#fff;
  min-height:100%;
}
body.hq:has(.app:not(.hide)){
  height:100%;
  overflow:hidden;
}

/* 登录：整屏分栏 */
body.hq .login-wrap{
  padding:0;
  min-height:100vh;
  background:#fff;
  align-items:stretch;
  justify-content:stretch;
}
body.hq .login-box{
  display:flex;
  width:100%;
  min-height:100vh;
  background:#fff;
  border:0;
  border-radius:0;
  overflow:hidden;
  box-shadow:none;
}
body.hq .login-pane{
  width:min(440px, 36vw);
  flex-shrink:0;
  background:#0F1419;
  color:#fff;
  padding:56px 48px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
body.hq .login-pane .brand{
  font-size:24px;
  color:#fff;
  margin:0;
  letter-spacing:.04em;
}
body.hq .login-pane p{
  margin:12px 0 0;
  color:#8B919A;
  font-size:14px;
}
body.hq .login-foot{
  color:#5C6370;
  font-size:13px;
}
body.hq .login-card{
  flex:1;
  width:auto;
  max-width:none;
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  padding:48px 12%;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
body.hq .login-card > *{max-width:360px;width:100%}
body.hq .login-title{
  margin:0 0 28px;
  font-size:22px;
  font-weight:600;
}
body.hq .login-card .brand,
body.hq .login-kicker{display:none}
body.hq .login-card label{margin-bottom:6px;font-size:13px}
body.hq .login-card input{
  height:40px;
  padding:8px 12px;
  border-radius:6px;
  margin-bottom:16px;
  font-size:14px;
}

/* 壳 */
body.hq .app{
  display:flex;
  height:100vh;
  min-height:100vh;
  align-items:stretch;
  overflow:hidden;
}
body.hq .side{
  width:232px;
  flex-shrink:0;
  background:#0F1419;
  display:flex;
  flex-direction:column;
}
body.hq .side-brand{
  min-height:56px;
  padding:16px 22px;
  border-bottom:1px solid #1E2430;
  font-size:15px;
  font-weight:600;
  letter-spacing:.04em;
  color:#fff;
  line-height:1.3;
}
body.hq .side-brand small{
  display:block;
  margin:4px 0 0;
  font-size:12px;
  font-weight:400;
  color:#8B919A;
  letter-spacing:0;
}
body.hq .side-nav{
  padding:12px 10px;
  display:flex;
  flex-direction:column;
  gap:2px;
  background:transparent;
  border:0;
}
body.hq .tab{
  appearance:none;
  text-align:left;
  width:100%;
  height:36px;
  min-width:0;
  border:0;
  border-bottom:0;
  border-radius:6px;
  padding:0 14px;
  color:#A8ADB4;
  font-size:14px;
  line-height:36px;
  background:transparent;
  display:flex;
  align-items:center;
}
body.hq .tab:hover{background:#1A2130;color:#fff}
body.hq .tab.on{
  background:rgba(51,112,255,.16);
  color:#fff;
  font-weight:600;
  border-bottom:0;
  box-shadow:inset 3px 0 0 var(--go);
}
body.hq .main{
  flex:1;
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  background:#F4F5F7;
  overflow:hidden;
}
body.hq .top{
  height:56px;
  min-height:56px;
  padding:0 24px 0 28px;
  position:sticky;
  top:0;
  z-index:10;
  background:#fff;
  border-bottom:1px solid var(--border);
  box-shadow:none;
  flex-wrap:nowrap;
  flex-shrink:0;
  gap:16px;
}
body.hq .top-left{
  display:flex;
  align-items:baseline;
  gap:12px;
  min-width:0;
  flex-shrink:1;
}
body.hq .top-title{
  margin:0;
  font-size:16px;
  font-weight:600;
  letter-spacing:0;
  color:var(--text);
  white-space:nowrap;
}
body.hq .top #刷新于{
  font-size:12px;
  color:var(--muted);
  white-space:nowrap;
}
body.hq .head-ops{
  margin-left:0;
  display:flex;
  gap:8px;
  align-items:center;
  flex-shrink:0;
}
body.hq .top-search{
  width:280px;
  height:32px;
  border-radius:6px;
  padding:0 12px;
  background:#F5F6F8;
  border:1px solid transparent;
}
body.hq .top-search:focus{background:#fff;border-color:var(--go)}
body.hq .who{
  display:flex;
  align-items:center;
  gap:10px;
}
body.hq .avatar{
  width:32px;
  height:32px;
  border-radius:50%;
  background:var(--wash);
  color:var(--go);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:600;
  flex-shrink:0;
}
body.hq .who-name{font-size:13px;font-weight:600;color:var(--text);line-height:1.2}
body.hq .who-bal{
  font-size:12px;color:var(--hint);
  display:inline-flex;align-items:baseline;gap:4px;line-height:1.2;
}
body.hq .who-bal .money{font-size:13px}

/* 工作区 */
body.hq .page{
  max-width:none;
  width:100%;
  margin:0;
  padding:0;
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  overflow:hidden;
}
body.hq .page > section.fill:not(.hide){
  display:flex !important;
  flex:1;
  flex-direction:column;
  min-height:0;
  width:100%;
  align-items:stretch;
  background:#fff;
}
/* 档案 / 开卡 / 查卡 打开后改成整页下拉，不再把内容裁在视口里 */
body.hq .page > section.fill:not(.hide):has(.panel:not(.hide)){
  display:block !important;
  overflow:auto;
}
body.hq .page > section.fill:not(.hide):has(.panel:not(.hide)) .sheet{
  min-height:360px;
  display:flex;
  flex-direction:column;
}
body.hq .page > section.fill:not(.hide):has(.panel:not(.hide)) .panel-head{
  position:sticky;
  top:0;
  z-index:2;
  background:#FAFBFC;
  padding-top:4px;
}
body.hq .sheet{
  flex:1;
  min-height:0;
  width:100%;
  display:flex;
  flex-direction:column;
  background:#fff;
  border:0;
  border-radius:0;
  margin:0;
  padding:0;
  overflow:hidden;
}
body.hq .sheet .scroll{
  flex:1;
  min-height:0;
  max-height:none;
  border:0;
  border-radius:0;
}
body.hq .panel{
  flex-shrink:0;
  width:100%;
  min-width:0;
  overflow-x:hidden;
  background:#FAFBFC;
  border:0;
  border-bottom:1px solid var(--border);
  border-radius:0;
  margin:0;
  padding:16px 28px 20px;
}
body.hq .panel-head{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 14px;
}
body.hq .panel-head h2{
  margin:0;
  padding:0;
  font-size:14px;
  font-weight:600;
}
body.hq .panel-head button{margin-left:auto}
body.hq .panel .row{margin:0}
body.hq .panel .actions{margin-top:14px}
body.hq .panel textarea{margin-top:12px;width:100%}
body.hq .panel .hint{margin-top:12px}
body.hq .grow{flex:3 1 280px;min-width:220px}
body.hq .actions.end{
  flex:0 0 auto;
  align-items:flex-end;
  min-width:0;
}
body.hq .page > section.dash:not(.hide){
  display:block;
  flex:1;
  min-height:0;
  overflow:auto;
  padding:24px 28px 48px;
  width:100%;
  background:#F4F5F7;
}
body.hq #say{
  position:fixed;
  top:68px;
  right:28px;
  z-index:30;
  min-width:240px;
  max-width:360px;
  margin:0;
  box-shadow:0 8px 24px rgba(31,35,41,.12);
}

/* 总览 */
body.hq .todo{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:10px 14px;
  margin:0 0 16px;
}
body.hq .todo button{
  height:28px;
  min-width:0;
  background:transparent;
  border-color:transparent;
  color:var(--go);
  padding:0 10px;
}
body.hq .todo button:hover{background:var(--wash)}
body.hq .meter{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;
  background:transparent;
  border:0;
}
body.hq .meter-item{
  padding:22px 24px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  min-width:0;
}
body.hq .meter-item:last-child{border-right:1px solid var(--border)}
body.hq .meter-item .lab{color:var(--hint);font-size:12px}
body.hq .meter-item .num{
  margin-top:10px;
  font-size:28px;
  font-weight:600;
  line-height:1.1;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.03em;
  display:flex;
  align-items:baseline;
  gap:6px;
}
body.hq .meter-item .num.钱{color:var(--warm)}
body.hq .meter-item .num .u{font-size:13px;font-weight:500;color:var(--warm)}
body.hq .meter-item .sub{margin-top:8px;color:var(--muted);font-size:12px}
body.hq .meter-item .sub.up{color:var(--on)}
body.hq .meter-item .sub.down{color:var(--halt)}
body.hq .statline{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:12px;
  background:transparent;
  border:0;
  margin-top:16px;
  overflow:visible;
}
body.hq .stat{
  appearance:none;
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  height:auto;
  min-width:0;
  min-height:0;
  padding:16px 18px;
  text-align:left;
  color:var(--hint);
  font-size:12px;
  line-height:1.4;
  display:block;
}
body.hq .stat:last-child{border-right:1px solid var(--border)}
body.hq .stat b{
  display:block;
  margin-top:6px;
  color:var(--text);
  font-size:20px;
  font-weight:600;
  font-variant-numeric:tabular-nums;
}
body.hq .stat b.on{color:var(--on)}
body.hq .stat.go{cursor:pointer}
body.hq .stat.go:hover{border-color:var(--go);background:#fff;color:var(--text)}
body.hq .dash .card{
  border-radius:10px;
  padding:0;
  margin:0;
  overflow:hidden;
  background:#fff;
}
body.hq .dash .card h2{
  margin:0;
  padding:16px 20px 0;
  font-size:13px;
  font-weight:600;
}
body.hq .split{gap:16px;margin-top:16px}
body.hq .dash-wide{margin-top:16px}
body.hq .trend{height:120px;gap:6px;padding:8px 20px 16px}
body.hq .tbar{max-width:26px;border-radius:3px 3px 0 0}
body.hq .tlab{font-size:11px}
body.hq .dash .scroll{max-height:280px;border:0;border-radius:0}

/* 定价：套餐卡片，不再铺一张空落落的大表 */
body.hq .page > section.plans:not(.hide){
  display:block;
  flex:1;
  min-height:0;
  overflow:auto;
  padding:20px 28px 48px;
  width:100%;
  background:#F4F5F7;
}
body.hq .plans .board-note{margin:0 0 16px;max-width:720px}
body.hq .plan-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  align-items:stretch;
}
body.hq .plan-empty{
  grid-column:1/-1;
  background:#fff;
  border:1px dashed var(--border);
  border-radius:10px;
  color:var(--muted);
  text-align:center;
  padding:48px 16px;
}
body.hq .plan-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:20px 22px 16px;
  display:flex;
  flex-direction:column;
  min-width:0;
}
body.hq .plan-card.off{background:#FAFBFC}
body.hq .plan-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
body.hq .plan-name{
  font-size:16px;
  font-weight:600;
  line-height:1.3;
  min-width:0;
}
body.hq .plan-tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  justify-content:flex-end;
  flex-shrink:0;
}
body.hq .plan-dur{
  margin-top:6px;
  color:var(--hint);
  font-size:13px;
}
body.hq .plan-price{
  margin:18px 0 8px;
  color:var(--warm);
}
body.hq .plan-price .amt{
  font-size:28px;
  font-weight:600;
  letter-spacing:-.03em;
  gap:6px;
}
body.hq .plan-price .amt .u{font-size:14px;font-weight:500}
body.hq .plan-card.off .plan-price,
body.hq .plan-card.off .plan-price .amt .u{color:var(--muted)}
body.hq .plan-sold{color:var(--muted);font-size:12px}
body.hq .plan-ops{
  display:flex;
  flex-wrap:nowrap;
  gap:8px;
  margin-top:auto;
  padding-top:16px;
}
body.hq .plan-ops button{
  min-width:0;
  flex:1 1 0;
  height:32px;
  padding:0 6px;
  font-size:12px;
}
body.hq .pill.试用{background:var(--wash);color:var(--go)}

/* 筛选：够宽一行，不够就折，不要横滑条 */
body.hq .toolbar{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin:0;
  padding:12px 28px;
  border-bottom:1px solid var(--border);
  flex-shrink:0;
  overflow:visible;
}
body.hq .toolbar .gap{flex:1;min-width:8px}
body.hq .toolbar input,
body.hq .toolbar select{
  height:32px;
  margin:0;
  border-radius:6px;
  font-size:13px;
  padding:0 10px;
  background:#F5F6F8;
  border:1px solid transparent;
  box-sizing:border-box;
}
body.hq .toolbar input:focus,
body.hq .toolbar select:focus{
  background:#fff;
  border-color:var(--go);
}
body.hq .toolbar .tool-search{
  width:280px;
  max-width:none;
  flex:0 0 280px;
}
body.hq .toolbar.filters > input:not([type="date"]){
  flex:1 1 220px;
  width:auto;
  min-width:160px;
  max-width:280px;
}
body.hq .toolbar.filters > select{
  flex:0 1 160px;
  width:160px;
  min-width:140px;
}
body.hq .toolbar.filters.logs > input:not([type="date"]){
  flex:1 1 200px;
  width:auto;
  min-width:160px;
  max-width:280px;
}
body.hq .toolbar.filters.logs > select{
  flex:0 1 180px;
  width:180px;
  min-width:140px;
  max-width:220px;
}
body.hq .toolbar.filters.logs > input[type="date"]{
  flex:0 0 auto;
  width:auto;
  min-width:0;
  max-width:none;
}

/* 表 */
body.hq table{font-size:13px}
body.hq .sheet table{
  width:100%;
  table-layout:auto;
}
body.hq .sheet .scroll:has(.empty) table{height:100%}
body.hq .sheet th,
body.hq .sheet td{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body.hq .sheet td.empty{
  white-space:normal;
  overflow:visible;
}
body.hq .sheet th.ops,
body.hq .sheet td.td-ops,
body.hq .sheet td.actions:not(.empty){
  width:128px;
  min-width:128px;
  overflow:visible;
  text-overflow:unset;
  position:sticky;
  right:0;
  background:#fff;
  z-index:1;
  box-shadow:-6px 0 8px -8px rgba(31,35,41,.18);
}
body.hq tr:hover td.td-ops,
body.hq tr:hover td.actions{
  background:#F7F8FA;
}
body.hq td.actions,
body.hq .td-ops{
  display:table-cell;
  white-space:nowrap;
  text-align:right;
}
body.hq th{
  padding:10px 16px;
  background:#FAFBFC;
  font-size:12px;
  font-weight:500;
  color:var(--muted);
  border-bottom:1px solid var(--border);
}
body.hq td{
  padding:12px 16px;
  border-bottom:1px solid #F0F1F3;
}
body.hq tr:hover td{background:#F7F8FA}
body.hq .pill{padding:1px 8px;border-radius:999px;font-size:12px}
body.hq input, body.hq select, body.hq textarea{
  border-radius:6px;
  padding:8px 12px;
  font-size:14px;
}
body.hq td.empty{
  color:var(--muted);
  padding:0 16px;
  text-align:center;
  height:100%;
  min-height:0;
  vertical-align:middle;
  border-bottom:0;
}

/* 按钮：同一高度、同一最小宽度；幽灵钮必须有边 */
body.hq button{
  appearance:none;
  -webkit-appearance:none;
  height:32px;
  min-width:88px;
  padding:0 16px;
  border-radius:6px;
  font-size:13px;
  line-height:1;
  border:1px solid transparent;
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  vertical-align:middle;
}
body.hq button.ghost{
  background:#fff;
  border-color:#D0D3D8;
  color:var(--text);
}
body.hq button.ghost:hover{
  background:#F7F8FA;
  border-color:#C0C4CC;
}
body.hq button.ghost:disabled{
  opacity:.4;
  cursor:not-allowed;
}
body.hq button.sm{
  height:32px;
  min-width:88px;
  padding:0 16px;
  font-size:13px;
}
body.hq button:focus{
  outline:none;
  box-shadow:none;
}
body.hq button:focus-visible{
  outline:2px solid var(--go);
  outline-offset:1px;
}
body.hq .login-card button{
  height:40px;
  width:100%;
  min-width:0;
}
body.hq .pager{
  margin:0;
  padding:0 28px;
  border-top:1px solid var(--border);
  font-size:13px;
  flex-shrink:0;
  flex-wrap:nowrap;
  gap:8px;
  height:52px;
  min-height:52px;
}
body.hq .pager button{
  min-width:88px;
  height:32px;
}
body.hq .td-ops button,
body.hq td.actions button{
  height:auto;
  min-width:0;
  padding:0 0 0 12px;
  line-height:inherit;
  border:0 !important;
  background:transparent !important;
  color:var(--go);
  font-size:13px;
  border-radius:0;
  display:inline;
  flex-shrink:0;
}
body.hq .td-ops button:first-child,
body.hq td.actions button:first-child{padding-left:0}
body.hq .td-ops button:hover,
body.hq td.actions button:hover{color:var(--go2);text-decoration:underline}
body.hq .td-ops button.bad,
body.hq td.actions button.bad{
  color:var(--halt) !important;
  background:transparent !important;
}

/* 设置：全宽列表，不是小卡片 */
body.hq .settings{
  overflow:auto;
}
body.hq .set-row{
  display:flex;
  align-items:center;
  gap:24px;
  min-height:72px;
  padding:18px 28px;
  border-bottom:1px solid #F0F1F3;
  width:100%;
}
body.hq .set-row:last-child{border-bottom:1px solid #F0F1F3}
body.hq .set-k{font-size:14px;font-weight:600}
body.hq .set-v{margin-top:4px;color:var(--hint);font-size:13px}
body.hq .set-row .actions{margin-left:auto;flex-shrink:0}

body.hq .banner{
  border-radius:0;
  border:0;
  border-bottom:1px solid #C2D6FF;
  margin:0;
  padding:10px 28px;
  flex-shrink:0;
}

body.hq .dlg{
  width:420px;
  max-height:calc(100vh - 40px);
  overflow:auto;
  border-radius:10px;
  padding:22px 24px;
  box-shadow:0 16px 48px rgba(31,35,41,.18);
}
body.hq .dlg.wide{width:680px}
body.hq .dlg h3{font-size:16px;margin-bottom:16px}
body.hq .dlg button{
  height:32px;
  min-width:88px;
}
body.hq .dlg button.ghost{
  background:#fff;
  border-color:#D0D3D8;
  color:var(--text);
}
body.hq .dlg button.bad{background:var(--halt);color:#fff}
body.hq .dlg .menu-sheet button{min-width:0}

@media (max-width:1100px){
  body.hq .meter{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
  body.hq .statline{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
  body.hq .plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  body.hq:has(.app:not(.hide)){height:auto;overflow:auto}
  body.hq .login-box{flex-direction:column;width:100%;min-height:100vh}
  body.hq .login-pane{width:auto;min-height:140px;padding:28px 24px}
  body.hq .login-card{padding:32px 24px;margin:0 auto}
  body.hq .app{flex-direction:column;height:auto;overflow:visible}
  body.hq .side{width:100%;height:auto}
  body.hq .side-nav{flex-direction:row;overflow-x:auto;padding:8px}
  body.hq .tab{width:auto;white-space:nowrap}
  body.hq .tab.on{box-shadow:none}
  body.hq .top{height:auto;min-height:52px;padding:10px 16px;flex-wrap:wrap}
  body.hq .page{overflow:visible}
  body.hq .page > section.fill:not(.hide){min-height:70vh}
  body.hq .page > section.dash:not(.hide),
  body.hq .page > section.plans:not(.hide){padding:16px}
  body.hq .plan-grid{grid-template-columns:1fr}
  body.hq .toolbar,
  body.hq .pager,
  body.hq .set-row,
  body.hq .panel{padding-left:16px;padding-right:16px}
  body.hq .stat{border-right:1px solid var(--border)}
  body.hq td.empty{height:240px;min-height:240px}
  body.hq .dossier td.empty{height:auto;min-height:0;padding:16px 8px}
}

/* 档案：短卡片 + 操作账分页，不再一次铺几十行 */
.dossier-meter{margin:0 0 12px}
.dossier-ops{margin:0 0 4px !important;flex-wrap:wrap}
.dossier-facts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px 28px;
  padding:14px 0 16px;
  margin-top:4px;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.dossier-k{
  font-size:12px;color:var(--hint);font-weight:600;margin:0 0 6px;
}
.dossier-v{font-size:13px;color:var(--text);line-height:1.55;word-break:break-word}
.dossier-sec{margin-top:16px}
.dossier-table{margin:0}
.dossier-table td{white-space:normal;word-break:break-word}
.dossier-table td:first-child{white-space:nowrap;width:1%}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{
  display:inline-block;background:#fff;border:1px solid var(--border);
  border-radius:4px;padding:4px 10px;font-size:12px;color:var(--text);
}
.dossier-pager{
  display:flex;align-items:center;gap:10px;margin-top:10px;
  color:var(--hint);font-size:12px;flex-wrap:wrap;
  height:auto;min-height:0;padding:0;border:0;
  justify-content:flex-start;
}
.dossier-pager .gap{flex:0 0 4px;width:4px;min-width:4px}
.dossier td.empty{
  height:auto;min-height:0;padding:16px 8px;border-bottom:0;
}
body.hq .dossier .meter{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
body.hq .dossier .meter-item{padding:14px 16px}
body.hq .dossier .meter-item .num{font-size:22px;margin-top:6px}
body.hq .dossier .meter-item .sub{margin-top:6px}
body.hq .dossier .actions button.sm{
  min-width:0;height:32px;padding:0 12px;
}
body.hq .dossier-pager{
  height:auto;min-height:0;padding:0;border:0;margin-top:10px;font-size:12px;
}
body.hq .dossier-pager button{
  min-width:0;height:28px;padding:0 12px;font-size:12px;
}
body.hq .dossier td.empty{
  height:auto;min-height:0;padding:16px 8px;
}
@media (max-width:1100px){
  body.hq .dossier .meter{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .dossier-facts{grid-template-columns:1fr}
  body.hq .dossier .meter{grid-template-columns:1fr}
}
