:root{
  --header-bg:#0B1F4B;
  --header-h:54px;
  --sider-w:120px;
  --tabbar-h:40px;
  --primary:#08B9CE;
  --primary-dark:#00A2B5;
  --primary-weak:#E6F8FB;
  --cta:#FB733D;
  --text:#2B3E43;
  --text-2:#566669;
  --text-3:#88969A;
  --line:#DDE4EA;
  --line-2:#EDF1F5;
  --head:#F4F7FA;
  --bg:#F0F2F5;
  --green:#1BC467;
  --red:#FF586C;
  --orange:#F26C30;
  --radius:6px;
  --shadow:0 1px 2px rgba(6,32,81,.05);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;font-size:13px;color:var(--text);
  background:var(--bg);-webkit-font-smoothing:antialiased;overflow:hidden;
}
button{font-family:inherit;font-size:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;outline:0}
.i{flex:none}
.mono{font-family:Consolas,Menlo,monospace;font-size:12px}
.muted{color:var(--text-3)}
.dim td{color:#a8b3ba}
.down{color:var(--red)}
.grow{flex:1}
.ellipsis{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- 椤舵爮 ---------- */
.app{height:100vh;display:flex;flex-direction:column}
.topbar{height:var(--header-h);flex:none;display:flex;align-items:center;gap:16px;background:var(--header-bg);color:#fff;padding:0 12px}
.brand{display:flex;align-items:center;gap:8px;min-width:190px}
.brand-name{font-size:16px;font-weight:700;white-space:nowrap;letter-spacing:.3px}
.topbar-search{display:flex;align-items:center;gap:8px;height:28px;width:250px;background:#fff;border-radius:14px;padding:0 12px;color:#9aa7ad}
.topbar-search input{border:0;background:none;flex:1;min-width:0;color:var(--text);font-size:13px}
.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:2px}
.tb-btn{display:flex;align-items:center;gap:6px;height:32px;padding:0 10px;border-radius:4px;color:#dbe6f5;font-size:13px;position:relative}
.tb-btn:hover{background:rgba(255,255,255,.1);color:#fff}
.tb-btn .txt{white-space:nowrap}
.tb-btn .q{width:15px;height:15px;border-radius:50%;border:1.2px solid #cbd8ec;display:grid;place-items:center;font-size:10px}
.tb-btn .dot{position:absolute;left:20px;top:6px;width:6px;height:6px;border-radius:50%;background:var(--red);border:1px solid var(--header-bg)}
.tb-user{display:flex;align-items:center;gap:6px;height:32px;padding:0 8px;border-radius:4px;cursor:pointer}
.tb-user:hover{background:rgba(255,255,255,.1)}
.avatar{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#08B9CE,#41d6e6);display:grid;place-items:center;font-size:11px;font-weight:700}
.tb-user-name{max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.win-ctrl{display:flex;gap:1px;margin-left:8px;padding-left:8px;border-left:1px solid rgba(255,255,255,.15)}
.win-ctrl button{width:26px;height:24px;border-radius:3px;color:#c9d6ea;font-size:11px}
.win-ctrl button:hover{background:rgba(255,255,255,.12)}
.win-ctrl button:last-child:hover{background:#e14b52;color:#fff}

/* ---------- 渚ф爮 + 椋炲嚭鑿滃崟 ---------- */
.body{flex:1;display:flex;min-height:0;position:relative}
.sider{width:var(--sider-w);flex:none;background:#fff;border-right:1px solid var(--line-2);padding:6px 0;overflow-y:auto}
.sider::-webkit-scrollbar{width:0}
.nav-item{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:48px;color:var(--text-2);font-size:12px;position:relative}
.nav-item:hover{background:#F5F8FA;color:var(--text)}
.nav-item.active{color:var(--primary);font-weight:700;background:#F2FBFD}
.nav-item.active::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:2px;background:var(--primary)}

.flyout{position:absolute;left:var(--sider-w);top:0;z-index:40;display:none}
.flyout.open{display:block}
.flyout-panel{background:#fff;border:1px solid var(--line-2);border-radius:0 6px 6px 6px;box-shadow:0 10px 26px rgba(6,32,81,.14);padding:12px 14px 14px;min-width:210px}
.flyout-head{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;color:var(--text);padding:2px 4px 10px}
.guide-link{font-size:12px;font-weight:400;color:var(--cta)}
.flyout-cols{display:flex;gap:14px}
.flyout-col{min-width:92px;display:flex;flex-direction:column;gap:2px}
.col-title{height:4px}
.flyout-item{text-align:left;height:30px;padding:0 10px;border-radius:4px;color:var(--text-2);font-size:13px;white-space:nowrap}
.flyout-item:hover{background:var(--primary-weak);color:var(--primary-dark)}
.flyout-item.on{color:var(--primary);font-weight:700;background:#F2FBFD}

/* ---------- 鏍囩鏍?---------- */
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.tabbar{height:var(--tabbar-h);flex:none;display:flex;align-items:flex-end;gap:3px;padding:6px 10px 0;background:#fff;border-bottom:1px solid var(--line-2);overflow-x:auto;overflow-y:hidden}
.tabbar::-webkit-scrollbar{height:0}
.tab{display:flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:5px 5px 0 0;background:#F2F5F8;color:var(--text-2);font-size:13px;white-space:nowrap;position:relative}
.tab:hover{background:#EDF2F6}
.tab.active{background:#fff;color:var(--text);font-weight:700}
.tab.active::after{content:"";position:absolute;left:8px;right:8px;bottom:-1px;height:2px;background:var(--primary)}
.tab-ico{color:#93a0a6;display:inline-grid;place-items:center}
.tab.active .tab-ico{color:var(--primary)}
.tab .x{font-size:11px;color:#9aa7ad;padding:2px;border-radius:50%;line-height:1}
.tab .x:hover{background:#dbe1e7;color:#5a686d}

/* ---------- 鍐呭 ---------- */
.content{flex:1;min-height:0;overflow:auto;padding:10px;background:var(--bg)}
.content::-webkit-scrollbar{width:10px}
.content::-webkit-scrollbar-thumb{background:#c9d2da;border-radius:6px;border:3px solid transparent;background-clip:content-box}
.page-single{display:flex;flex-direction:column;gap:10px}
.page-split{display:flex;gap:10px;align-items:flex-start}
.page-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:10px}

.card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:14px 16px}
.card.p0{padding:0;overflow:hidden}
.card-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.card-title{font-size:14px;font-weight:700}
.card-sub{font-size:12px;color:var(--text-3)}
.card-head .right{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:12px;color:var(--text-3)}

/* ---------- 宸︿晶鍒嗙被鏍?---------- */
.side{width:180px;flex:none;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:12px 0;min-height:520px}
.side-head{display:flex;align-items:center;padding:0 14px 10px;font-weight:700;font-size:13px}
.side-acts{margin-left:auto;display:flex;gap:8px;color:var(--text-3)}
.side-acts button:hover{color:var(--primary)}
.tree{display:flex;flex-direction:column}
.tree-item{text-align:left;height:32px;padding:0 16px;color:var(--text-2);font-size:13px}
.tree-item:hover{background:#F5F8FA;color:var(--text)}
.tree-item.on{color:var(--primary);background:#F2FBFD;font-weight:700}

/* ---------- 杩囨护鏉?/ 宸ュ叿鏉?---------- */
.filterbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;border-bottom:1px solid var(--line-2)}
.filterbar .fl{color:var(--text-2);font-size:13px;white-space:nowrap}
.fb-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.chk{display:inline-flex;align-items:center;gap:5px;color:var(--text-2);font-size:13px;cursor:pointer;user-select:none}
.chk input{margin:0;accent-color:var(--primary)}
.field{display:flex;align-items:center;gap:6px;height:30px;border:1px solid var(--line);border-radius:4px;padding:0 8px;background:#fff;color:var(--text-3)}
.field input{border:0;background:none;width:150px;color:var(--text);font-size:13px}
.field.wide{min-width:340px;flex:1;max-width:430px}
.field.wide input{width:100%}
.field.date{color:var(--text-2);font-size:12px;background:#fff}
.dash{color:var(--text-3)}
.btn{height:30px;padding:0 12px;border-radius:4px;border:1px solid var(--line);background:#fff;color:var(--text-2);display:inline-flex;align-items:center;gap:6px;font-size:13px}
.btn:hover{border-color:var(--primary);color:var(--primary)}
.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:700}
.btn-primary:hover{background:var(--primary-dark);border-color:var(--primary-dark);color:#fff}
.btn-search{background:var(--primary);border-color:var(--primary);color:#fff;padding:0 10px}
.btn-search:hover{background:var(--primary-dark);color:#fff}
.btn-adv{border:0;color:var(--text-2);font-size:13px;display:inline-flex;align-items:center;gap:2px;padding:0 4px}
.btn-adv:hover{color:var(--primary)}
.btn-split{height:30px;padding:0 12px;border:1px solid var(--line);border-radius:4px;background:#fff;color:var(--text-2);display:inline-flex;align-items:center;gap:4px}
.btn-split:hover{border-color:var(--primary);color:var(--primary)}
.toolbar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--line-2)}
.link{color:var(--primary);cursor:pointer}
.link:hover{text-decoration:underline}
.link-danger{color:var(--red)}
.link-danger:hover{text-decoration:underline}
.mini-select{height:28px;border:1px solid var(--line);border-radius:4px;padding:0 6px;background:#fff;color:var(--text-2)}
.mini-input{height:28px;border:1px solid var(--line);border-radius:4px;padding:0 8px;width:90px;background:#fff}
.mini-input.wide{width:180px}
.chip-input{height:28px;display:inline-flex;align-items:center;padding:0 8px;border:1px solid var(--line);border-radius:4px;color:var(--text-2);font-size:12px}
.hint-inline{color:var(--text-3);font-size:12px}
.tip{display:inline-grid;place-items:center;width:12px;height:12px;border-radius:50%;border:1px solid #c2ccd3;color:#9aa7ad;font-size:9px;margin-left:4px;cursor:help}

/* ---------- 琛ㄦ牸 ---------- */
.table-scroll{overflow:auto;max-height:calc(100vh - 320px)}
.table-scroll.tall{max-height:calc(100vh - 300px)}
.table-scroll::-webkit-scrollbar{width:10px;height:10px}
.table-scroll::-webkit-scrollbar-thumb{background:#ccd5dd;border-radius:6px;border:3px solid transparent;background-clip:content-box}
table.grid{width:100%;border-collapse:collapse;font-size:13px}
table.grid th{background:var(--head);color:var(--text-2);font-weight:400;text-align:left;padding:10px 10px;white-space:nowrap;border-bottom:1px solid var(--line-2);position:sticky;top:0;z-index:1}
table.grid td{padding:9px 10px;border-bottom:1px solid var(--line-2);vertical-align:middle}
table.grid.compact td{height:44px}
table.grid tbody tr:hover td{background:#F7FBFD}
table.grid .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
table.grid th.num{text-align:right}
table.grid th.sortable{position:relative;padding-right:18px}
table.grid th.sortable::after{content:"";position:absolute;right:6px;top:50%;margin-top:-2px;border:4px solid transparent;border-top-color:#c4cfd6}
table.grid .w30{width:30px;color:#a7b3ba}
table.grid .w34{width:34px}
table.grid .w34 input{accent-color:var(--primary)}
table.grid .w80{width:80px}
table.grid .w100{width:100px}
table.grid .w120{width:120px}
table.grid .w150{width:150px}
table.grid .w170{width:170px}
table.grid .ops{white-space:nowrap}
table.grid .ops .link + .link{margin-left:10px}
table.grid tfoot .totals td{background:#F7FAFC;font-weight:700;border-top:1px solid var(--line);position:sticky;bottom:0;box-shadow:0 -1px 0 var(--line-2)}
.cell-prod{display:flex;align-items:center;gap:8px;min-width:180px}
.thumb{width:26px;height:26px;border-radius:4px;background:#EEF3F6;border:1px solid #E3E9EE;display:inline-block;flex:none;
  background-image:linear-gradient(135deg,#E9F4F7,#DCE9EF)}
.pn{font-size:13px;color:var(--text);line-height:1.3}
.psub{font-size:11px;color:var(--text-3);line-height:1.3;margin-top:2px}
.empty{padding:40px 0;text-align:center;color:var(--text-3)}

.tag{display:inline-block;height:20px;line-height:20px;padding:0 7px;border-radius:10px;font-size:11px;background:#EEF3F6;color:var(--text-2)}
.tag.green{background:#E9F9EF;color:#12A456}
.tag.orange{background:#FFF2E9;color:var(--cta)}
.tag.teal{background:var(--primary-weak);color:var(--primary-dark)}
.tag.red{background:#FFEDEF;color:var(--red)}

.pager{display:flex;align-items:center;gap:6px;justify-content:flex-end;padding:12px 14px;font-size:12px;color:var(--text-3);flex-wrap:wrap}
.pager button{min-width:26px;height:26px;border:1px solid var(--line);border-radius:3px;background:#fff;color:var(--text-2);font-size:12px}
.pager button.on{background:var(--primary);border-color:var(--primary);color:#fff}
.pager button:disabled{color:#c8d1d7}
.pager .mini{height:26px;border:1px solid var(--line);border-radius:3px;background:#fff;color:var(--text-2);font-size:12px}
.pager .mini-input{height:26px;width:44px;text-align:center}

.totals-bar{display:flex;align-items:center;gap:26px;padding:10px 14px;border-top:1px solid var(--line-2);font-size:13px;color:var(--text-2);justify-content:flex-end}
.totals-bar b{font-weight:700;color:var(--text);min-width:90px;text-align:right}

/* ---------- KPI ---------- */
.kpi-strip{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--line-2);background:#fff}
.kpi-cell{flex:1 1 160px;min-width:150px;padding:14px 18px;border-right:1px solid var(--line-2)}
.kpi-cell:last-child{border-right:0}
.kpi-l{font-size:12px;color:var(--text-3);display:flex;align-items:center}
.kpi-n{font-size:20px;font-weight:700;margin-top:8px;font-variant-numeric:tabular-nums;letter-spacing:.2px}
.subtabs{display:flex;gap:26px;padding:12px 16px 0;border-bottom:1px solid var(--line-2)}
.subtabs button{position:relative;padding:0 0 10px;color:var(--text-2);font-size:14px}
.subtabs button.on{color:var(--text);font-weight:700}
.subtabs button.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--primary)}

/* ---------- 棣栭〉 ---------- */
.quick-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.quick{height:76px;border:1px solid var(--line-2);border-radius:var(--radius);background:#F7FAFC;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--text-2)}
.quick:hover{border-color:#CFEFF5;background:#F2FBFD;color:var(--primary-dark)}
.hot-list{display:flex;flex-direction:column;gap:10px}
.hot-row{display:flex;align-items:center;gap:10px;font-size:13px}
.rank{width:20px;height:20px;border-radius:50%;background:#EEF3F6;color:var(--text-2);display:grid;place-items:center;font-size:11px}
.hot-name{width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hot-bar{flex:1;height:8px;background:#EEF3F6;border-radius:4px;overflow:hidden}
.hot-bar i{display:block;height:100%;background:linear-gradient(90deg,#59D8E6,#08B9CE)}
.hot-amt{width:110px;text-align:right;font-variant-numeric:tabular-nums}
.hot-qty{width:70px;text-align:right;color:var(--text-3)}

/* ---------- 璁剧疆 / 琛ㄥ崟 ---------- */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
.form-item.full{grid-column:1 / -1}
.form-item label{display:block;font-size:12px;color:var(--text-2);margin-bottom:6px}
.form-item label b{color:var(--red);font-weight:400;margin-left:2px}
.input{width:100%;height:32px;border:1px solid var(--line);border-radius:4px;padding:0 10px;background:#fff}
textarea.input{height:auto;padding:8px 10px;resize:vertical}
.input:focus{border-color:var(--primary);box-shadow:0 0 0 2px rgba(8,185,206,.14)}
.form-foot{margin-top:16px;display:flex;justify-content:flex-end;gap:8px}
.form-row{display:flex;gap:12px;margin-bottom:12px}
.form-item{flex:1;min-width:0}
.hint{font-size:11px;color:var(--text-3);margin-top:4px;line-height:1.5}
.pref-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 2px;border-bottom:1px dashed var(--line-2)}
.pref-row b{font-weight:700}
.pref-row:last-of-type{border-bottom:0}
.switch{width:36px;height:18px;border-radius:10px;background:#d6dde3;position:relative;cursor:pointer;transition:.15s;flex:none}
.switch::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:.15s}
.switch.on{background:var(--primary)}
.switch.on::after{left:20px}
.kv{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed var(--line-2);font-size:13px}
.kv:last-child{border-bottom:0}
.kv span{color:var(--text-3)}
.kv-list{padding:2px 2px 0}

/* ---------- 寮圭獥 / 鎻愮ず ---------- */
.mask{position:fixed;inset:0;background:rgba(6,32,81,.42);display:grid;place-items:center;z-index:60}
.dialog{background:#fff;border-radius:8px;width:560px;max-width:calc(100vw - 40px);max-height:88vh;display:flex;flex-direction:column;box-shadow:0 18px 46px rgba(6,32,81,.24)}
.dialog.wide{width:760px}
.dlg-head{display:flex;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line-2)}
.dlg-title{font-size:15px;font-weight:700}
.dlg-head .x{margin-left:auto;color:var(--text-3);padding:4px 6px;border-radius:4px;font-size:13px}
.dlg-head .x:hover{background:#F1F4F7;color:var(--text)}
.dlg-body{padding:16px 18px;overflow:auto}
.dlg-foot{padding:12px 18px;border-top:1px solid var(--line-2);display:flex;justify-content:flex-end;gap:8px}
.total-line{display:flex;justify-content:flex-end;align-items:baseline;gap:14px;font-size:13px;color:var(--text-2);padding-top:6px}
.total-line b{font-size:18px;color:var(--cta);font-variant-numeric:tabular-nums}
.mt10{margin-top:10px}

.toast-root{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:90;display:flex;flex-direction:column;gap:8px;align-items:center}
.toast{background:#243338;color:#fff;font-size:13px;padding:8px 16px;border-radius:16px;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.toast.ok{background:#12A456}
.toast.err{background:#E14B52}

/* ---------- v3 新增：高级查询 / 批量 / 列设置 / 抽屉 / 弹层 ---------- */
.adv-panel{display:flex;align-items:center;gap:17px;flex-wrap:wrap;padding:10px 14px;background:#FAFCFD;border-bottom:1px solid var(--line-2)}
.adv-panel.hide{display:none}
.adv-item{display:flex;align-items:center;gap:6px}
.adv-item label{color:var(--text-3);font-size:12px}
.btn-sm{height:26px;padding:0 9px;font-size:12px}
.batch-bar{display:flex;align-items:center;gap:10px;padding:8px 14px;background:#F0FAFC;border-bottom:1px solid #D8F1F5;color:#0F6E7B;font-size:13px}
.batch-bar b{font-weight:700}
.gear{padding:2px;color:#a7b3ba;border-radius:3px}
.gear:hover{color:var(--primary);background:#EEF6F8}

.pop{position:fixed;z-index:120;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 10px 26px rgba(6,32,81,.16);min-width:170px;padding:6px}
.pop-title{padding:6px 10px;font-size:12px;color:var(--text-3);border-bottom:1px solid var(--line-2);margin-bottom:4px}
.colset{display:flex;flex-direction:column;gap:2px;padding:2px 4px;max-height:280px;overflow:auto}
.colset label{display:flex;align-items:center;gap:7px;height:26px;padding:0 6px;border-radius:4px;font-size:13px;color:var(--text-2);cursor:pointer}
.colset label:hover{background:#F4F8FA}
.colset input{accent-color:var(--primary)}
.pop-foot{display:flex;gap:8px;padding:6px 6px 2px;border-top:1px solid var(--line-2);margin-top:4px}
.pop-foot button{flex:1;height:26px;border-radius:4px;color:var(--text-2);font-size:12px;border:1px solid var(--line)}
.pop-foot button:hover{color:var(--primary);border-color:var(--primary)}
.menu{display:flex;flex-direction:column;min-width:150px;padding:2px}
.menu button{text-align:left;height:30px;padding:0 10px;border-radius:4px;font-size:13px;color:var(--text-2)}
.menu button:hover{background:var(--primary-weak);color:var(--primary-dark)}
.menu.ctx{position:fixed;z-index:130;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 10px 26px rgba(6,32,81,.18);padding:4px}

.price-pop{position:absolute;top:46px;left:214px;z-index:110;width:420px;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 12px 30px rgba(6,32,81,.18);overflow:hidden}
.price-pop.hide{display:none}
.pp-row{display:flex;align-items:center;gap:12px;width:100%;padding:9px 12px;border-bottom:1px solid var(--line-2);text-align:left}
.pp-row:hover{background:#F5FBFD}
.pp-name{flex:1;min-width:0;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-name em{font-style:normal;color:var(--text-3);font-size:11px;margin-left:6px}
.pp-price{color:var(--text-2);font-size:12px;white-space:nowrap}
.pp-stock{color:var(--primary-dark);font-size:12px;width:64px;text-align:right}
.pp-empty{padding:16px;text-align:center;color:var(--text-3);font-size:13px}

.drawer-mask{position:fixed;inset:0;background:rgba(6,32,81,.32);z-index:70}
.drawer{position:fixed;top:0;right:0;bottom:0;width:560px;max-width:92vw;background:#fff;z-index:71;display:flex;flex-direction:column;box-shadow:-10px 0 32px rgba(6,32,81,.18);animation:slidein .16s ease}
@keyframes slidein{from{transform:translateX(28px);opacity:.6}to{transform:none;opacity:1}}
.dr-head{display:flex;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line-2);font-size:15px;font-weight:700}
.dr-head button{margin-left:auto;color:var(--text-3);font-size:13px;padding:4px 6px;border-radius:4px}
.dr-head button:hover{background:#F1F4F7;color:var(--text)}
.dr-body{flex:1;overflow:auto;padding:16px 18px}
.dr-foot{padding:12px 18px;border-top:1px solid var(--line-2);display:flex;justify-content:flex-end;gap:8px}

.msg-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 2px 12px;border-bottom:1px solid var(--line-2);margin-bottom:12px}
.msg-count{font-size:12px;color:var(--text-3)}
.msg-count b{color:var(--primary);font-weight:700}
.msg-list{display:flex;flex-direction:column;gap:8px}
.msg-item{position:relative;display:flex;gap:10px;padding:12px 14px;border:1px solid var(--line-2);border-radius:8px;
  background:#fff;cursor:pointer;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}
.msg-item:hover{border-color:#BFE9F1;background:#F8FDFE;box-shadow:0 1px 3px rgba(6,32,81,.06)}
.msg-item.unread{background:#F4FCFE;border-color:#CDEFF6}
.msg-item:focus-visible{outline:2px solid var(--primary-weak);outline-offset:2px}
.msg-dot{flex:0 0 auto;width:6px;height:6px;border-radius:50%;background:var(--primary);margin-top:8px;opacity:0;transition:opacity .15s}
.msg-item.unread .msg-dot{opacity:1}
.msg-main{flex:1 1 auto;min-width:0}
.msg-line{display:flex;align-items:baseline;gap:8px;min-width:0}
.msg-type{flex:0 0 auto;font-size:11px;line-height:18px;padding:0 6px;border-radius:4px;background:var(--head);
  color:var(--text-2);border:1px solid var(--line)}
.msg-type.t-stock{background:#FFF3E9;color:#B4571F;border-color:#FADFC8}
.msg-type.t-money{background:#E9FBF6;color:#0B7F63;border-color:#C9F0E4}
.msg-title{flex:1 1 auto;min-width:0;font-size:13px;font-weight:600;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg-time{flex:0 0 auto;font-size:11px;color:var(--text-3);font-variant-numeric:tabular-nums}
.msg-body{margin-top:4px;font-size:12px;line-height:1.7;color:var(--text-2);word-break:break-word;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.msg-meta{margin-top:6px;font-size:11px;color:var(--text-3)}
.msg-empty{padding:36px 0;text-align:center;color:var(--text-3);font-size:13px}
.help-list{display:flex;flex-direction:column;gap:12px}
.help-item{border-bottom:1px dashed var(--line-2);padding-bottom:10px}
.help-item b{font-size:13px}
.help-item:last-child{border-bottom:0}

.perm-table td,.perm-table th{text-align:center}
.perm-table td:first-child,.perm-table th:first-child{text-align:left}
.perm-table input{accent-color:var(--primary);opacity:.55}
.role-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;padding:14px}
.role-card{border:1px solid var(--line-2);border-radius:6px;padding:12px}
.role-head{display:flex;justify-content:space-between;font-weight:700;font-size:13px;margin-bottom:8px}
.role-head .muted{font-weight:400;font-size:12px}
.pm{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-2);height:26px}
.pm span{width:48px}
.pm input{accent-color:var(--primary)}

.preview-box{border:1px dashed var(--line);border-radius:6px;padding:10px 12px;background:#FAFCFD;min-height:80px;font-size:13px}
.pv-row{display:flex;justify-content:space-between;padding:3px 0;color:var(--text-2)}
.pv-row b{color:var(--orange)}
.link-row{margin:6px 0 2px}

.float-bar{position:sticky;bottom:6px;display:flex;justify-content:center;pointer-events:none;padding:4px 0}
.float-bar button{pointer-events:auto;height:28px;padding:0 14px;border-radius:14px;background:#fff;border:1px solid var(--line);box-shadow:0 4px 12px rgba(6,32,81,.12);color:var(--text-2);font-size:12px;display:inline-flex;align-items:center;gap:4px}
.float-bar button:hover{color:var(--primary);border-color:var(--primary)}
.float-panel{margin:0 12px 12px;border:1px solid var(--line-2);border-radius:6px;overflow:hidden;background:#fff}
.float-panel.hide{display:none}
.fp-head{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:#F7FAFC;font-size:12px;color:var(--text-2);border-bottom:1px solid var(--line-2)}

body.dense table.grid.compact td{height:34px;padding-top:5px;padding-bottom:5px}
body.dense table.grid th{padding-top:7px;padding-bottom:7px}

/* ---------- v4：角色 / 销售定制 / 汇率 / 配货打印 ---------- */
.role-select{height:24px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.10);color:#fff;border-radius:4px;font-size:12px;padding:0 4px;margin-left:2px}
.role-select option{color:#2B3E43}
.scope-note{padding:8px 14px;background:#FFF8EE;border-bottom:1px solid #FBE4C8;color:#9A6212;font-size:12px}

.line-block{border:1px solid var(--line-2);border-radius:6px;margin:4px 0 12px;overflow:hidden}
.line-head{display:flex;align-items:center;padding:8px 12px;background:#F7FAFC;border-bottom:1px solid var(--line-2);font-size:13px}
.line-head .right{margin-left:auto}
.line-picker{display:flex;gap:8px;padding:8px 12px;border-bottom:1px solid var(--line-2);background:#fff}
.line-picker select{flex:1}
.line-table th{background:#FBFDFE}
.line-table .mini-input{width:70px;height:26px;text-align:right}
.line-sum{display:flex;gap:22px;justify-content:flex-end;padding:8px 12px;background:#FBFDFE;font-size:12px;color:var(--text-2);border-top:1px solid var(--line-2)}
.line-sum b{color:var(--text);font-variant-numeric:tabular-nums}

.attach-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:6px 0 10px}
.attach-box{border:1px dashed var(--line);border-radius:6px;padding:8px 10px;background:#FCFDFE;min-height:92px}
.ab-head{font-size:12px;font-weight:700;color:var(--text-2);margin-bottom:8px}
.ab-head .muted{font-weight:400;display:block;font-size:11px;margin-top:2px}
.ab-btn{width:100%;height:30px;border:1px dashed #C9D8E0;border-radius:4px;color:var(--text-3);background:#fff;font-size:12px}
.ab-btn:hover{border-color:var(--primary);color:var(--primary)}
.ab-note{font-size:11px;color:var(--text-3);margin-top:6px}

.rate-now{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:4px}
.rate-now > div{border:1px solid var(--line-2);border-radius:6px;padding:12px 14px;background:#FBFDFE}
.rate-label{font-size:12px;color:var(--text-3)}
.rate-value{font-size:15px;margin-top:6px;color:var(--text)}
.rate-value b{font-size:20px;color:var(--primary-dark)}

.print-sheet{border:1px solid var(--line);border-radius:6px;padding:22px 26px;background:#fff;max-width:760px;margin:8px auto}
.print-sheet h3{margin:0 0 14px;text-align:center;font-size:17px;letter-spacing:2px}
.ps-meta{display:flex;flex-wrap:wrap;gap:22px;font-size:13px;color:var(--text-2);margin-bottom:12px}
.ps-table th,.ps-table td{padding:9px 10px}
.ps-sign{margin-top:22px;font-size:13px;color:var(--text-2)}
.print-log{margin-top:14px}
.print-log .grid{margin-top:8px}

.edit-log{margin-top:12px;border-top:1px dashed var(--line-2);padding-top:10px}
.el-title{font-size:12px;color:var(--text-3);margin-bottom:6px}
.el-row{display:flex;gap:12px;font-size:12px;color:var(--text-2);padding:3px 0}
.el-row span:first-child{width:130px;color:var(--text-3)}
.el-row span:nth-child(2){width:56px;color:var(--text-3)}

@media print{
  .topbar,.sider,.tabbar,.flyout{display:none !important}
  .content{padding:0}
  .print-sheet{border:0;margin:0;max-width:none}
}

/* ---------- v5：登录 / 安全 ---------- */
#loginOverlay{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#0B1F4B 0%,#123A6B 60%,#0E2C57 100%)}
.login-card{width:392px;background:#fff;border-radius:10px;padding:26px 28px 22px;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.login-brand{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.login-logo{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,#08B9CE,#00A2B5);color:#fff;
  display:grid;place-items:center;font-weight:700;font-size:17px}
.login-brand b{font-size:16px}
.login-sub{font-size:12px;color:var(--text-3);margin-top:2px}
.login-form{margin-top:14px}
.login-form label{display:block;font-size:12px;color:var(--text-2);margin:12px 0 6px}
.login-err{min-height:18px;color:var(--red);font-size:12px;margin:8px 0 2px}
.login-btn{width:100%;height:36px;margin-top:4px}
.login-hint{font-size:11px;color:var(--text-3);margin-top:14px;line-height:1.6;text-align:center}
.role-select:disabled{opacity:.8;cursor:not-allowed}
.scope-note-inline{font-size:12px;color:var(--text-3)}

/* ---------- v6：登录页（split-screen 风格，参考 Untitled UI / TailAdmin 登录页布局） ---------- */
#loginOverlay{position:fixed;inset:0;z-index:200;display:flex;background:#0B1F4B}
.lg-shell{display:grid;grid-template-columns:minmax(420px,520px) 1fr;width:100%}
.lg-form-side{background:#fff;display:flex;align-items:center;justify-content:center;padding:40px 48px;overflow:auto}
.lg-inner{width:100%;max-width:372px}
.lg-brand{display:flex;gap:10px;align-items:center;margin-bottom:32px}
.lg-mark{width:40px;height:40px;border-radius:11px;background:linear-gradient(135deg,#08B9CE,#00A2B5);color:#fff;display:grid;place-items:center;font-weight:700;font-size:17px;box-shadow:0 6px 16px rgba(8,185,206,.35)}
.lg-brand-txt b{display:block;font-size:15px;color:#0F2233}
.lg-brand-txt span{font-size:12px;color:#88969A}
.lg-title{margin:0;font-size:26px;letter-spacing:.5px;color:#0F2233}
.lg-sub{margin:8px 0 26px;font-size:13px;color:#6B7C86}
.lg-field{margin-bottom:16px}
.lg-field label{display:block;font-size:12px;color:#566669;margin-bottom:7px}
.lg-input{display:flex;align-items:center;gap:9px;height:44px;border:1px solid #DDE4EA;border-radius:8px;padding:0 12px;background:#FBFCFD;transition:.15s}
.lg-input:focus-within{border-color:#08B9CE;background:#fff;box-shadow:0 0 0 3px rgba(8,185,206,.14)}
.lg-input svg{color:#9AA7AD;flex:none}
.lg-input input{flex:1;border:0;background:none;height:100%;font-size:14px;color:#1B2A32;min-width:0}
.lg-input input::placeholder{color:#AEBAC0}
.lg-eye{width:28px;height:28px;border-radius:6px;display:grid;place-items:center;color:#9AA7AD}
.lg-eye:hover{background:#EEF3F6;color:#08B9CE}
.lg-eye.on{color:#08B9CE}
.lg-caps{display:none;font-size:11px;color:#E0A100;margin-top:6px}
.lg-caps.on{display:block}
.lg-row{display:flex;align-items:center;justify-content:space-between;margin:2px 0 10px;font-size:12px;color:#6B7C86}
.lg-check{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.lg-check input{accent-color:#08B9CE}
.lg-help{color:#98A6AD}
.lg-err{min-height:20px;font-size:12px;color:#E14B52;margin-bottom:6px}
.lg-btn{position:relative;width:100%;height:44px;border-radius:8px;background:linear-gradient(135deg,#08B9CE,#00A2B5);color:#fff;font-size:15px;font-weight:600;letter-spacing:2px;box-shadow:0 8px 20px rgba(8,185,206,.28);transition:.18s;display:grid;place-items:center}
.lg-btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(8,185,206,.34)}
.lg-btn.loading{pointer-events:none;opacity:.92}
.lg-btn .lg-spin{display:none;width:16px;height:16px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:lspin .7s linear infinite}
.lg-btn.loading .lg-btn-txt{display:none}
.lg-btn.loading .lg-spin{display:block}
@keyframes lspin{to{transform:rotate(360deg)}}
.lg-hint{margin-top:16px;font-size:11px;color:#98A6AD;line-height:1.7;text-align:center}
.lg-hint b{color:#566669}
.lg-foot{margin-top:24px;text-align:center;font-size:11px;color:#B3BFC6}
.lg-art{position:relative;overflow:hidden;background:radial-gradient(120% 120% at 20% 15%,#123A6B 0%,#0B1F4B 55%,#071633 100%);display:flex;align-items:center;padding:0 64px}
.lg-grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:44px 44px}
.lg-orb{position:absolute;border-radius:50%;filter:blur(50px);opacity:.5}
.lg-orb-a{width:320px;height:320px;background:#08B9CE;right:-60px;top:-40px}
.lg-orb-b{width:260px;height:260px;background:#2B6CB0;left:10%;bottom:-80px;opacity:.4}
.lg-art-inner{position:relative;color:#fff;max-width:460px}
.lg-art-badge{display:inline-block;font-size:12px;letter-spacing:1px;color:#9FE7F0;border:1px solid rgba(159,231,240,.35);border-radius:999px;padding:5px 12px;margin-bottom:22px}
.lg-quote{font-size:26px;line-height:1.45;font-weight:700;letter-spacing:.5px}
.lg-points{list-style:none;margin:26px 0 30px;padding:0;display:flex;flex-direction:column;gap:14px}
.lg-points li{display:flex;gap:10px;font-size:13px;color:#C7D6E4;line-height:1.6}
.lg-points li i{width:6px;height:6px;border-radius:50%;background:#08B9CE;margin-top:7px;flex:none}
.lg-points b{color:#fff;margin-right:6px;font-weight:600}
.lg-metrics{display:flex;gap:34px;border-top:1px solid rgba(255,255,255,.12);padding-top:20px}
.lg-metrics div{display:flex;flex-direction:column;gap:4px}
.lg-metrics b{font-size:20px;color:#fff}
.lg-metrics span{font-size:11px;color:#8FA6BC}
#loginOverlay.shake .lg-form-side{animation:lgshake .32s}
@keyframes lgshake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
@media (max-width:980px){.lg-shell{grid-template-columns:1fr}.lg-art{display:none}.lg-form-side{padding:32px 24px}}

/* 登录页铺满修正（覆盖 v5 的居中规则） */
#loginOverlay{align-items:stretch;justify-content:flex-start}
.lg-shell{min-height:100vh;height:100%}
.lg-form-side{height:100%}
.lg-art{height:100%;min-height:100vh}
@media (max-height:760px){.lg-form-side{padding:26px 48px}.lg-brand{margin-bottom:22px}.lg-title{font-size:23px}.lg-sub{margin:6px 0 18px}.lg-field{margin-bottom:12px}.lg-hint{margin-top:12px}.lg-foot{margin-top:14px}}

/* ---------- v7：右上角账号菜单 ---------- */
.topbar .tb-user{display:flex;align-items:center;gap:7px;height:34px;padding:0 8px;border-radius:6px;color:#dbe6f5;cursor:pointer}
.topbar .tb-user:hover{background:rgba(255,255,255,.10)}
.tb-user-meta{display:flex;flex-direction:column;align-items:flex-start;line-height:1.18;max-width:120px}
.tb-user-name{font-size:12.5px;color:#fff;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-user-role{font-size:10.5px;color:#9FB2CC}
.tb-user .caret{color:#9FB2CC;margin-left:2px}
.tb-user[aria-expanded="true"]{background:rgba(255,255,255,.14)}

.un-menu{position:fixed;z-index:130;width:238px;background:#fff;border:1px solid #E3E9EE;border-radius:10px;
  box-shadow:0 16px 40px rgba(6,32,81,.20);padding:6px;color:var(--text);text-align:left}
.um-head{display:flex;align-items:center;gap:10px;padding:10px 10px 11px}
.um-avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#08B9CE,#41D6E6);color:#fff;
  display:grid;place-items:center;font-weight:700;font-size:14px;flex:none}
.um-id{min-width:0}
.um-id b{display:block;font-size:13px;color:var(--text)}
.um-id span{font-size:11px;color:var(--text-3);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.um-list{display:flex;flex-direction:column;border-top:1px solid var(--line-2);padding-top:4px}
.um-list button{text-align:left;height:34px;padding:0 10px;border-radius:6px;font-size:13px;color:#3B4C54}
.um-list button:hover{background:#F2F9FB;color:#00A2B5}
.um-list button.danger{color:#E14B52}
.um-list button.danger:hover{background:#FFF1F2;color:#C42F38}
.um-sep{height:1px;background:var(--line-2);margin:4px 8px}
.um-empty{padding:16px;text-align:center;color:var(--text-3)}

/* ---------- v9：移动端适配 ---------- */
.nav-toggle{display:none;width:34px;height:34px;border-radius:6px;color:#dbe6f5;align-items:center;justify-content:center}
.nav-toggle:hover{background:rgba(255,255,255,.10)}
.nav-mask{display:none;position:fixed;inset:0;background:rgba(6,32,81,.42);z-index:45}

@media (max-width: 900px){
  .nav-toggle{display:flex}
  .topbar{height:52px;gap:8px;padding:0 8px}
  .brand{min-width:0}
  .brand-name{font-size:14px;max-width:140px;overflow:hidden;text-overflow:ellipsis}
  .topbar-search{display:none}
  .tb-btn .txt{display:none}
  .tb-btn{padding:0 6px}
  .win-ctrl{display:none}
  .tb-user-name{max-width:64px;font-size:12px}
  .tb-user-role{display:none}

  /* 侧栏改为抽屉 */
  .sider{position:fixed;left:0;top:52px;bottom:0;width:200px;z-index:50;transform:translateX(-102%);
    transition:transform .2s ease;box-shadow:8px 0 24px rgba(6,32,81,.16);padding:8px 0}
  body.nav-open .sider{transform:none}
  body.nav-open .nav-mask{display:block}
  .nav-item{flex-direction:row;justify-content:flex-start;gap:10px;height:44px;padding:0 16px;font-size:13px}
  .nav-item.active::before{top:6px;bottom:6px}
  .flyout{left:200px;top:52px !important}
  .flyout-panel{max-height:calc(100vh - 80px);overflow:auto}

  .tabbar{padding:6px 8px 0;gap:2px}
  .tab{font-size:12px;padding:0 8px}
  .content{padding:8px}
  .page-split{flex-direction:column}
  .side{width:100%;min-height:0;padding:8px 0}
  .side-head{padding:0 12px 8px}
  .tree{flex-direction:row;flex-wrap:wrap;gap:4px;padding:0 10px 6px}
  .tree-item{height:28px;padding:0 10px;border-radius:14px;background:#F4F7FA;font-size:12px}
  .tree-item.on{background:var(--primary-weak)}

  .two-col{grid-template-columns:1fr}
  .kpi-cell{flex:1 1 45%;min-width:45%;border-right:0;border-bottom:1px solid var(--line-2)}
  .kpi-n{font-size:18px}
  .quick-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form-grid{grid-template-columns:1fr}
  .form-row{flex-direction:column;gap:10px}
  .filterbar{padding:10px;gap:8px}
  .filterbar .field.wide{min-width:0;max-width:none;width:100%}
  .fb-right{width:100%;margin-left:0;flex-wrap:wrap}
  .toolbar{padding:8px 10px;flex-wrap:wrap;gap:6px}
  .adv-panel{gap:10px}
  .adv-item{flex:1 1 100%}
  .batch-bar{flex-wrap:wrap}
  .table-scroll{max-height:none}
  table.grid{font-size:12px}
  table.grid th,table.grid td{padding:8px 8px}
  .pager{padding:10px;justify-content:center}
  .pager .mini,.pager .mini-input{display:none}

  .dialog,.dialog.wide{width:calc(100vw - 20px);max-height:92vh}
  .dlg-body{padding:12px}
  .drawer{width:100%;max-width:100%}
  .attach-grid{grid-template-columns:1fr 1fr}
  .rate-now{grid-template-columns:1fr}
  .print-sheet{padding:14px;margin:0}
  .float-bar{bottom:2px}
  .float-panel{margin:0 8px 8px}

  /* 登录页单列 */
  .lg-shell{grid-template-columns:1fr}
  .lg-art{display:none}
  .lg-form-side{padding:28px 20px}
  .lg-inner{max-width:100%}
  .lg-title{font-size:22px}
  .login-hint{font-size:11px}
}

@media (max-width: 480px){
  .kpi-cell{flex:1 1 100%;min-width:100%}
  .brand-name{max-width:120px}
  .attach-grid{grid-template-columns:1fr}
  .tb-user-meta{display:none}
}

/* ---------- v10：移动端二级菜单改为居中面板 ---------- */
.flyout-mask{display:none;position:fixed;inset:0;background:rgba(6,32,81,.38);z-index:44}
@media (max-width: 900px){
  /* 覆盖桌面端“贴侧栏”的定位，改成居中面板 */
  .flyout{left:0 !important;right:0 !important;top:52px !important;bottom:0 !important;
    display:flex;align-items:flex-start;justify-content:center;padding:14vh 12px 12px;z-index:46}
  body.flyout-open .flyout-mask{display:block}
  .flyout:not(.open){display:none !important}
  .flyout-panel{width:min(92vw,360px);max-height:64vh;overflow:auto;border-radius:12px;
    box-shadow:0 20px 52px rgba(6,32,81,.30);border:1px solid rgba(255,255,255,.6)}
  .flyout-head{position:sticky;top:0;background:#fff;z-index:1;border-radius:12px 12px 0 0}
  .flyout-cols{flex-direction:column;gap:0}
  .flyout-col{width:100%}
  .flyout-col + .flyout-col{border-left:0;border-top:1px solid var(--line-2)}
  .flyout-item{width:100%;height:40px;font-size:14px;text-align:left;padding:0 14px}
  .flyout .col-title{display:none}
  .sider{z-index:47}
  .nav-mask{z-index:45}
}

/* ---------- v11：分组管理 ---------- */
.pick-list{border:1px solid var(--line-2);border-radius:6px;max-height:240px;overflow:auto;padding:4px 6px;background:#FBFCFD}
.pick-item{display:flex;align-items:center;gap:8px;height:34px;padding:0 6px;border-radius:4px;font-size:13px;cursor:pointer}
.pick-item:hover{background:#F1F8FA}
.pick-item input{accent-color:var(--primary)}
.pick-item span:first-of-type{min-width:64px;font-weight:600}
.pick-item .muted{font-size:12px}

/* ---------- v12：角色权限可视化 ---------- */
.perm-help{padding:12px 16px;background:#F3FAFC;border-bottom:1px solid #DDF0F4;color:#2B4A52;font-size:12.5px;line-height:1.85}
.perm-help b{color:#0B6E7B}
.perm-wrap{display:flex;min-height:420px}
.perm-roles{width:180px;border-right:1px solid var(--line-2);padding:10px 8px;background:#FAFCFD;flex:none}
.perm-role{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;padding:9px 10px;border-radius:6px;margin-bottom:4px;text-align:left}
.perm-role:hover{background:#EFF7FA}
.perm-role.on{background:#E4F6F9;box-shadow:inset 2px 0 0 var(--primary)}
.pr-name{font-size:13px;font-weight:600;color:var(--text)}
.pr-name i{font-style:normal;font-size:10px;color:#8C9AA0;font-weight:400;margin-left:4px}
.pr-meta{font-size:11px;color:var(--text-3)}
.perm-main{flex:1;min-width:0;padding:14px 16px}
.perm-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.ph-title{font-size:14px;font-weight:700}
.ph-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.ph-scope{font-size:12px;color:var(--text-2);display:flex;align-items:center;gap:6px}
.perm-tpl{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.tpl-btn{display:flex;flex-direction:column;gap:2px;align-items:flex-start;border:1px solid var(--line);border-radius:6px;
  padding:7px 10px;background:#fff;min-width:118px;text-align:left}
.tpl-btn b{font-size:12.5px;color:var(--text)}
.tpl-btn span{font-size:11px;color:var(--text-3)}
.tpl-btn:hover{border-color:var(--primary);background:#F5FCFD}
.tpl-btn:disabled{opacity:.5;cursor:not-allowed}
.perm-sum{margin-top:12px;padding:10px 12px;background:#FAFCFD;border:1px dashed var(--line);border-radius:6px;
  font-size:12.5px;color:#2B4A52;line-height:1.7}
.perm-save-hint{margin-top:8px;font-size:11.5px;color:var(--text-3)}
.perm-table th{white-space:nowrap}
.perm-table input[type=checkbox]{width:15px;height:15px;accent-color:var(--primary)}
@media (max-width:900px){
  .perm-wrap{flex-direction:column}
  .perm-roles{width:100%;border-right:0;border-bottom:1px solid var(--line-2);display:flex;gap:6px;overflow:auto;padding:8px}
  .perm-role{margin-bottom:0;white-space:nowrap;width:auto;padding:7px 12px}
  .perm-role.on{box-shadow:inset 0 -2px 0 var(--primary)}
  .perm-main{padding:12px}
  .tpl-btn{min-width:calc(50% - 4px)}
}

/* ---------- v14：附件 / 运单号 / 大字号二次打印 / 配货单精简 ---------- */
.file-hidden{display:none}
.thumbs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.thumb-item{position:relative;width:46px;height:46px;border:1px solid var(--line);border-radius:5px;overflow:hidden;
  display:grid;place-items:center;background:#F7FAFC;flex:none}
.thumb-item img{width:100%;height:100%;object-fit:cover}
.thumb-item .file-ico{font-size:10px;color:#C0392B;font-weight:700}
.thumb-item button{position:absolute;right:0;top:0;width:15px;height:15px;border-radius:0 0 0 5px;background:rgba(0,0,0,.55);
  color:#fff;font-size:11px;line-height:15px;text-align:center}
.thumb-item button:hover{background:#E14B52}

.track-block{margin:6px 0 10px}
.track-block .ab-head{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--text-2);margin-bottom:8px}
.track-block .ab-head .btn{margin-left:auto}
.track-row{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.tr-no{width:16px;font-size:11px;color:var(--text-3);text-align:right}
.track-row .input{flex:1}

.edit-block{margin-top:8px}
.edit-log-box{border:1px dashed var(--line);border-radius:6px;padding:10px 12px;font-size:12px;color:var(--text-3);background:#FAFCFD}

.kv-block{margin-top:10px}
.kb-title{font-size:12px;color:var(--text-3);margin-bottom:4px}

/* 大字号二次打印提示 */
.big-confirm-mask{display:flex;align-items:center;justify-content:center}
.big-confirm{background:#fff;border-radius:12px;padding:28px 32px;max-width:520px;width:calc(100vw - 40px);
  box-shadow:0 24px 60px rgba(6,32,81,.30);text-align:center}
.big-confirm .bc-num{font-size:34px;font-weight:800;color:#E14B52;letter-spacing:2px;line-height:1.3}
.big-confirm .bc-sub{margin-top:12px;font-size:15px;color:var(--text-2);line-height:1.7}
.big-confirm .bc-actions{margin-top:22px;display:flex;gap:12px;justify-content:center}
.big-confirm .bc-actions .btn{min-width:110px;height:38px}

/* 配货单：只 4 个字段，字号加大 */
.ps-simple{max-width:720px}
.ps-simple .ps-title{text-align:center;font-size:22px;font-weight:800;letter-spacing:4px;margin-bottom:18px}
.ps-simple .ps-line{display:flex;gap:14px;align-items:baseline;margin:8px 0}
.ps-simple .ps-k{font-size:15px;color:#5B6B72;min-width:80px}
.ps-simple .ps-v{font-size:18px;font-weight:700}
.ps-table{width:100%;border-collapse:collapse;margin-top:14px}
.ps-table th,.ps-table td{border:1px solid #D8E1E6;padding:14px 12px;text-align:left}
.ps-table th{font-size:16px;background:#F5F9FB}
.ps-table .ps-name{font-size:20px;font-weight:700}
.ps-table .ps-qty{font-size:20px;font-weight:700;text-align:right;white-space:nowrap}
.ps-table .ps-qty-col{width:130px;text-align:right}
@media print{
  .big-confirm,.tabbar,.card-head .right{display:none !important}
  .ps-simple{max-width:none;border:0}
  .ps-table .ps-name,.ps-table .ps-qty{font-size:22px}
}

/* ---------- v15：实时汇率 ---------- */
.rate-badge{display:inline-block;font-size:10.5px;padding:1px 7px;border-radius:9px;margin-left:6px;vertical-align:1px}
.rate-badge.manual{background:#F1F4F6;color:#7A8A90}
.rate-badge.live{background:#E4F6F9;color:#0B7C8A}
.rate-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px}
.rate-actions .hint{flex:1;min-width:240px;font-size:11.5px;color:var(--text-3);line-height:1.7}

/* ---------- v16：汇率操作区重做 ---------- */
.rate-tools{display:flex;align-items:center;gap:8px}
.btn-ghost{background:#fff;border:1px solid var(--line);color:var(--text-2);border-radius:17px;height:32px;padding:0 14px;font-size:12.5px}
.btn-ghost:hover{border-color:var(--primary);color:var(--primary-dark);background:#F7FDFE}

.btn-sync{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 14px 0 12px;border-radius:17px;
  border:1px solid #BFE7EE;color:#0A7180;font-size:12.5px;font-weight:600;
  background:linear-gradient(180deg,#F6FDFE 0%,#E9F8FB 100%);
  box-shadow:0 1px 2px rgba(8,185,206,.10);transition:.16s}
.btn-sync:hover{border-color:#7FD8E6;background:linear-gradient(180deg,#FFFFFF,#DFF6FA);
  box-shadow:0 3px 10px rgba(8,185,206,.18);transform:translateY(-1px)}
.btn-sync:active{transform:translateY(0);box-shadow:0 1px 2px rgba(8,185,206,.14)}
.btn-sync .sync-ico{transition:transform .2s}
.btn-sync.loading{pointer-events:none;opacity:.85}
.btn-sync.loading .sync-ico{animation:rate-spin .9s linear infinite}
@keyframes rate-spin{to{transform:rotate(360deg)}}
.live-dot{width:6px;height:6px;border-radius:50%;background:#C4CFD4;margin-left:2px;flex:none}
.live-dot.on{background:#22B573;box-shadow:0 0 0 3px rgba(34,181,115,.16)}

.rate-when{font-size:11px;color:#22B573;margin-left:6px}
.rate-src{display:inline-block;font-size:10.5px;color:var(--text-3);border:1px solid var(--line-2);
  border-radius:8px;padding:0 6px;margin-left:6px;vertical-align:2px}
.live-num{color:#0A7180}

.btn-apply{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 16px 0 6px;border-radius:20px;
  border:1px solid #CDEFF4;background:linear-gradient(180deg,#FFFFFF,#F0FBFD);transition:.16s}
.btn-apply:hover{border-color:#7FD8E6;box-shadow:0 4px 14px rgba(8,185,206,.18);transform:translateY(-1px)}
.btn-apply .apply-num{display:inline-grid;place-items:center;min-width:56px;height:28px;padding:0 10px;border-radius:14px;
  background:linear-gradient(135deg,#08B9CE,#00A2B5);color:#fff;font-size:13.5px;font-weight:700;
  font-variant-numeric:tabular-nums;letter-spacing:.3px}
.btn-apply .apply-txt{font-size:12.5px;color:#0A7180;font-weight:600}
@media (max-width:900px){
  .rate-tools{flex-wrap:wrap;gap:6px}
  .btn-sync,.btn-ghost,.rate-tools .btn{height:30px;font-size:12px}
}

/* 让汇率页三个按钮形状统一 */
.rate-tools .btn{border-radius:17px;height:32px;padding:0 14px;font-size:12.5px;box-shadow:none}
.rate-tools .btn.btn-primary{background:linear-gradient(135deg,#08B9CE,#00A2B5);border:0}
.rate-tools .btn.btn-primary:hover{filter:brightness(1.04)}
.btn-apply .apply-txt{white-space:nowrap}
@media (max-width:900px){.rate-tools .btn{height:30px}}

.applied-tag{display:inline-flex;align-items:center;height:34px;padding:0 14px;border-radius:17px;
  background:#EAF8EF;color:#1E8E5A;font-size:12.5px;font-weight:600;border:1px solid #CFEEDC}

/* 行内操作按钮（分类管理）：图标 + 文字，默认克制，悬停才上色 */
.act-btn{display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 9px;border:1px solid var(--line);background:#fff;
  color:var(--text-2);border-radius:var(--radius);cursor:pointer;font-size:12px;line-height:1;white-space:nowrap}
.act-btn:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-weak)}
.act-btn.danger:hover{border-color:var(--red);color:var(--red);background:#FFF5F6}
.act-btn svg{display:block;flex:0 0 auto}
table.grid .ops .act-btn + .act-btn{margin-left:6px}

/* 分类面板右侧的「⋯」：默认低调，悬停显形 */
.side-acts .cat-more{color:var(--text-3);opacity:.75}
.side-acts .cat-more:hover{opacity:1;color:var(--primary)}

/* 汇率自动刷新条 */
.rate-auto{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;margin:0 0 12px;
  border:1px solid var(--line-2);border-radius:8px;background:#FAFCFE;font-size:12px;color:var(--text-2)}
.rate-auto .grow{flex:1 1 auto}
.rate-auto-tag{flex:0 0 auto;height:22px;line-height:22px;padding:0 8px;border-radius:11px;font-size:11px;
  background:var(--head);color:var(--text-3);border:1px solid var(--line)}
.rate-auto-tag.on{background:var(--primary-weak);color:var(--primary-dark);border-color:#BFE9F1}

/* 登录页：干净单卡布局 */
#loginOverlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:#F5F7FA}
#loginOverlay .lg-shell{display:block;width:100%;max-width:380px;padding:0 20px}
#loginOverlay .lg-card{background:#fff;border:1px solid #E6EAF0;border-radius:14px;padding:34px 28px 30px;box-shadow:0 8px 28px rgba(17,24,39,.06)}
#loginOverlay .lg-brand{display:flex;align-items:center;gap:10px;margin-bottom:22px}
#loginOverlay .lg-mark{width:34px;height:34px;border-radius:9px;background:#08B9CE;color:#fff;font-size:16px;font-weight:600;display:flex;align-items:center;justify-content:center}
#loginOverlay .lg-brand-name{font-size:15px;font-weight:600;color:#111827}
#loginOverlay .lg-title{font-size:20px;font-weight:600;color:#111827;margin:0 0 20px}
#loginOverlay .lg-field{margin-bottom:14px}
#loginOverlay .lg-field label{display:block;font-size:12px;color:#6B7280;margin-bottom:6px}
#loginOverlay .lg-input{position:relative;display:flex;align-items:center}
#loginOverlay .lg-input input{width:100%;height:42px;padding:0 40px 0 12px;border:1px solid #DDE3EA;border-radius:8px;background:#fff;color:#111827;font-size:14px;outline:none}
#loginOverlay .lg-input input:focus{border-color:#08B9CE;box-shadow:0 0 0 3px rgba(8,185,206,.12)}
#loginOverlay .lg-eye{position:absolute;right:6px;width:30px;height:30px;border:0;background:transparent;color:#9CA3AF;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:6px}
#loginOverlay .lg-eye.on{color:#08B9CE}
#loginOverlay .lg-caps{display:none;font-size:11px;color:#D97706;margin-top:5px}
#loginOverlay .lg-caps.on{display:block}
#loginOverlay .lg-check{display:flex;align-items:center;gap:6px;font-size:12px;color:#6B7280;margin:4px 0 12px;cursor:pointer}
#loginOverlay .lg-err{min-height:18px;font-size:12px;color:#DC2626;margin-bottom:8px}
#loginOverlay .lg-btn{position:relative;width:100%;height:42px;border:0;border-radius:8px;background:#08B9CE;color:#fff;font-size:14px;font-weight:500;cursor:pointer}
#loginOverlay .lg-btn:hover{background:#07A6B8}
#loginOverlay .lg-btn.loading .lg-btn-txt{opacity:.35}
#loginOverlay .lg-btn .lg-spin{display:none}
#loginOverlay .lg-btn.loading .lg-spin{display:block;position:absolute;left:50%;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:lgspin .8s linear infinite}
@keyframes lgspin{to{transform:rotate(360deg)}}
#loginOverlay .lg-art{display:none}

/* ================= 登录页 ================= */
#loginOverlay{
  position:fixed; inset:0; z-index:9999;
  display:flex; align-items:flex-start; justify-content:center;
  padding:24vh 20px 56px;
  background:#EEF1F4; overflow:auto; -webkit-overflow-scrolling:touch;
}
#loginOverlay .lg-shell{width:100%; max-width:404px; margin:0 auto}
#loginOverlay .lg-card{
  background:#fff; border:1px solid #E3E7EB; border-radius:10px;
  padding:40px 36px 36px; box-shadow:0 1px 3px rgba(17,24,39,.05);
}
#loginOverlay .lg-brand{display:flex; align-items:baseline; gap:8px; margin:0 0 26px}
#loginOverlay .lg-brand-name{font-size:15px; font-weight:600; color:#1B2430; letter-spacing:.6px}
#loginOverlay .lg-title{margin:0 0 28px; font-size:22px; font-weight:600; color:#1B2430; letter-spacing:.5px}
#loginOverlay .lg-field{margin-bottom:18px}
#loginOverlay .lg-field label{display:block; margin-bottom:8px; font-size:12px; color:#5B6771}
#loginOverlay .lg-input{
  display:flex; align-items:center; height:48px; padding:0 15px;
  border:1px solid #DCE1E6; border-radius:8px; background:#fff; transition:border-color .15s, box-shadow .15s;
}
#loginOverlay .lg-input:focus-within{border-color:#0E9AA7; box-shadow:0 0 0 3px rgba(14,154,167,.09)}
#loginOverlay .lg-input input{
  flex:1; min-width:0; width:100%; height:100%; margin:0; padding:0;
  border:0 !important; background:transparent; box-shadow:none !important;
  font-size:15px; color:#1B2430; outline:none; appearance:none;
}
#loginOverlay .lg-input input::placeholder{color:#A9B2BB}
#loginOverlay .lg-input input:focus{outline:none; box-shadow:none !important}
#loginOverlay .lg-caps{display:none; margin-top:7px; font-size:11px; color:#B7791F}
#loginOverlay .lg-caps.on{display:block}
#loginOverlay .lg-check{display:inline-flex; align-items:center; gap:7px; margin:2px 0 18px; font-size:12px; color:#5B6771; cursor:pointer}
#loginOverlay .lg-check input{accent-color:#0E9AA7; width:14px; height:14px}
#loginOverlay .lg-err{min-height:18px; margin-bottom:8px; font-size:12px; color:#D14343; line-height:1.5}
#loginOverlay .lg-btn{
  position:relative; width:100%; height:48px; border:0; border-radius:8px;
  background:#0E9AA7; color:#fff; font-size:15px; font-weight:500; letter-spacing:1px; cursor:pointer;
}
#loginOverlay .lg-btn:hover{background:#0C8792}
#loginOverlay .lg-btn:active{background:#0A7681}
#loginOverlay .lg-btn.loading{pointer-events:none}
#loginOverlay .lg-btn .lg-spin{display:none}
#loginOverlay .lg-btn.loading .lg-btn-txt{opacity:.3}
#loginOverlay .lg-btn.loading .lg-spin{
  display:block; position:absolute; left:50%; top:50%; width:16px; height:16px; margin:-8px 0 0 -8px;
  border:2px solid rgba(255,255,255,.45); border-top-color:#fff; border-radius:50%;
  animation:lgspin .8s linear infinite;
}
@keyframes lgspin{to{transform:rotate(360deg)}}
#loginOverlay.shake .lg-card{animation:lgshake .3s}

@media (max-height:820px){
  #loginOverlay{padding:18vh 20px 40px}
  #loginOverlay .lg-card{padding:28px 26px 24px}
  #loginOverlay .lg-brand{margin-bottom:20px}
  #loginOverlay .lg-title{margin-bottom:20px}
}
@media (max-width:480px){
  #loginOverlay{padding:14vh 16px 32px}
  #loginOverlay .lg-card{padding:26px 20px 22px; border-radius:10px}
  #loginOverlay .lg-input, #loginOverlay .lg-btn{height:48px}
  #loginOverlay .lg-input input{font-size:16px}
}

/* 分组选人：两列网格，勾选对齐 */
.pick-list{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;max-height:320px;overflow:auto;padding:2px}
.pick-list .pick-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line-2);border-radius:6px;cursor:pointer;background:#fff}
.pick-list .pick-item:hover{border-color:#BDD8DD;background:#F7FBFC}
.pick-list .pick-item input{margin:0;flex:none}
.pick-list .pick-name{font-size:13px;color:var(--text-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick-list .pick-meta{font-size:11px;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-left:auto}
@media (max-width:640px){ .pick-list{grid-template-columns:1fr} }
/* 员工表对齐 */
.grid.compact td,.grid.compact th{vertical-align:middle}
.grid.compact td .tag{display:inline-block;line-height:18px}

/* 商品选择：可输入可下拉 */
.prod-pick{position:relative;display:flex;gap:8px;align-items:center;margin-bottom:8px}
.prod-pick .input{flex:1;min-width:0}
.prod-menu{position:absolute;left:0;right:74px;top:42px;z-index:40;max-height:260px;overflow:auto;background:#fff;border:1px solid var(--line-2);border-radius:6px;box-shadow:0 6px 20px rgba(16,24,40,.12)}
.prod-menu.hide{display:none}
.prod-opt{display:flex;align-items:center;gap:8px;padding:7px 10px;cursor:pointer;font-size:13px;border-bottom:1px solid #F2F4F7}
.prod-opt:last-child{border-bottom:0}
.prod-opt:hover,.prod-opt.on{background:#F0F9FA}
.prod-opt .pn{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-1)}
.prod-opt .pm{color:var(--text-3);font-size:12px;max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prod-opt .ps{color:var(--text-3);font-size:12px;white-space:nowrap}
.prod-empty{padding:12px;color:var(--text-3);font-size:13px;text-align:center}
@media (max-width:640px){ .prod-menu{right:0;top:46px;max-height:200px} }

/* 危险操作按钮 */
.btn-danger{background:#E5484D;border-color:#E5484D;color:#fff}
.btn-danger:hover{background:#D93A40;border-color:#D93A40}
.btn-danger:active{background:#C22F35;border-color:#C22F35}