*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
  :root{
    --bg:#F1F5FA; --panel:#FFFFFF; --line:#DFE8F2; --line-2:#ECF2F8;
    --ink:#0A1626; --ink2:#33495F; --ink3:#5C7288;
    --brand:#1462D6; --brand-soft:#EDF4FF; --brand-line:#CFE2FC;
    --ok:#0C8A5F; --ok-soft:#E7F7F0;
    --warn:#B45309; --warn-soft:#FEF3E2;
    --bad:#C22323; --bad-soft:#FDECEC;
    --purple:#6B46C1; --purple-soft:#F1ECFD;
    --teal:#0E7490; --teal-soft:#E4F6FA;
  }
  html,body{height:100%}
  body{
    margin:0;background:var(--bg);color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
    font-size:15px;line-height:1.55;
  }
  .app{display:flex;height:100vh;overflow:hidden}

  /* ---------------- 侧边栏 ---------------- */
  .side{
    width:214px;flex:0 0 214px;background:var(--panel);border-right:1px solid var(--line);
    display:flex;flex-direction:column;
  }
  .brand{height:58px;display:flex;align-items:center;gap:9px;padding:0 18px;border-bottom:1px solid var(--line-2)}
  .brand .logo{
    width:28px;height:28px;border-radius:9px;background:linear-gradient(140deg,#1462D6,#2E9BE8);
    display:flex;align-items:center;justify-content:center;flex:0 0 auto;
    box-shadow:0 4px 10px -2px rgba(20,98,214,.45);
  }
  .brand b{font-size:15px;font-weight:800;letter-spacing:-.2px;display:block}
  .brand span{font-size:12px;color:var(--ink3);display:block;margin-top:-1px}

  .nav{padding:10px 10px;flex:1;overflow:auto}
  .nav-t{font-size:12px;color:var(--ink3);font-weight:700;letter-spacing:.6px;padding:10px 10px 6px}
  /* 侧边栏配色：白底黑字，选中为参考蓝 #1881FF */
  .nav a{
    display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:9px;
    color:#101418;text-decoration:none;font-weight:600;font-size:14px;cursor:pointer;
    background:transparent;transition:background .12s,color .12s,font-weight .12s;margin-bottom:2px;
  }
  .nav a:hover{background:#F3F5F9;color:#101418;font-weight:700}
  .nav a:active{background:#E8EBF1}
  .nav a.on{
    background:#E8F2FF;color:#1881FF;font-weight:800;
    box-shadow:inset 3px 0 0 #1881FF;
  }
  .nav a.on svg{stroke-width:2.4}
  .nav a svg{width:16px;height:16px;flex:0 0 auto;color:inherit}

  /* ---------------- 主区 ---------------- */
  .main{flex:1;display:flex;flex-direction:column;min-width:0}
  .top{
    height:58px;flex:0 0 58px;background:rgba(255,255,255,.86);backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 22px;gap:14px;
  }
  .top h1{font-size:17px;font-weight:800;margin:0;letter-spacing:-.2px}
  .top .crumb{font-size:12.5px;color:var(--ink3);margin-left:2px}
  .top-r{margin-left:auto;display:flex;align-items:center;gap:10px}
  .top-r .who .urole{display:block}
  .avatar{width:26px;height:26px;border-radius:50%;background:linear-gradient(140deg,#D6E9FF,#E2F6F1);
    display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:800;color:var(--brand)}
  .content{flex:1;overflow:auto;padding:20px 22px 44px}

  /* ---------------- 通用 ---------------- */
  .card{background:var(--panel);border:1px solid var(--line);border-radius:13px}
  .card-h{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line-2)}
  .card-h h3{margin:0;font-size:16px;font-weight:800;letter-spacing:-.1px}
  .card-h .sub{font-size:12.5px;color:var(--ink2);font-weight:600;margin-left:8px}
  .card-b{padding:16px}
  .btn{
    border:1px solid var(--line);background:#fff;color:var(--ink2);font-weight:700;font-size:13.5px;
    padding:7px 13px;border-radius:8px;cursor:pointer;font-family:inherit;transition:.13s;white-space:nowrap;
  }
  .btn:hover{background:#F7FAFD;border-color:#D6E2EE}
  .btn.primary{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 4px 12px -4px rgba(20,98,214,.55)}
  .btn.primary:hover{background:#0F55C0}
  .btn.sm{padding:5px 10px;font-size:13px;border-radius:7px}
  .btn:disabled{opacity:.45;cursor:not-allowed}
  .btn.danger{color:var(--bad);border-color:#F3D3D3}
  .badge{display:inline-flex;align-items:center;font-size:12.5px;font-weight:700;padding:2px 8px;border-radius:99px;line-height:1.6;white-space:nowrap}
  .b-blue{background:var(--brand-soft);color:var(--brand)}
  .b-ok{background:var(--ok-soft);color:var(--ok)}
  .b-warn{background:var(--warn-soft);color:var(--warn)}
  .b-bad{background:var(--bad-soft);color:var(--bad)}
  .b-purple{background:var(--purple-soft);color:var(--purple)}
  .b-teal{background:var(--teal-soft);color:var(--teal)}
  .b-grey{background:#F1F5F9;color:var(--ink2)}
  .num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}

  /* ---------------- 表格 ---------------- */
  table.tbl{width:100%;border-collapse:collapse}
  .tbl th{
    text-align:left;font-size:12.5px;font-weight:800;color:var(--ink2);
    padding:10px 12px;background:#F6F9FD;border-bottom:1px solid var(--line);white-space:nowrap;
    letter-spacing:.2px;
  }
  .tbl td{padding:12px;border-bottom:1px solid var(--line-2);vertical-align:middle;font-size:14px}
  .tbl tr:last-child td{border-bottom:0}
  .tbl tbody tr:hover{background:#FBFDFF}
  .tbl .r{text-align:right}
  .tbl .muted{color:var(--ink2);font-size:12.5px;font-weight:500}

  /* ---------------- 表格列宽拖拽 ---------------- */
  .tbl th{position:relative}
  .tbl.fixed{table-layout:fixed}
  .tbl.fixed td{overflow:hidden}
  .tbl .rz{
    position:absolute;right:-5px;top:0;width:10px;height:100%;cursor:col-resize;z-index:3;
    border-radius:3px;transition:background .12s;
  }
  .tbl .rz::after{
    content:"";position:absolute;left:4px;top:7px;bottom:7px;width:2px;border-radius:2px;
    background:#D9E3EF;transition:background .12s;
  }
  .tbl .rz:hover{background:rgba(20,98,214,.08)}
  .tbl .rz:hover::after{background:rgba(20,98,214,.6)}
  .tbl .rz.dragging{background:rgba(20,98,214,.16)}
  .tbl .rz.dragging::after{background:rgba(20,98,214,.85)}
  body.resizing,body.resizing *{user-select:none!important;cursor:col-resize!important}
  .rz-tip{position:fixed;z-index:999;background:#0E1B2B;color:#fff;font-size:12px;font-weight:700;
    padding:4px 9px;border-radius:6px;pointer-events:none;white-space:nowrap;
    box-shadow:0 6px 18px -6px rgba(14,27,43,.55)}
  .tbl td b{font-weight:800;color:var(--ink)}
  .tbl .nowrap{white-space:nowrap}

  /* ---------------- KPI ---------------- */
  .kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
  .kpi{background:#fff;border:1px solid var(--line);border-radius:13px;padding:14px 15px;position:relative;overflow:hidden}
  .kpi .lab{font-size:12.5px;color:var(--ink2);font-weight:700;display:flex;align-items:center;gap:5px}
  .kpi .val{font-size:27px;font-weight:800;letter-spacing:-.9px;margin-top:7px;line-height:1.1}
  .kpi .val small{font-size:13px;font-weight:700;color:var(--ink2);letter-spacing:0;margin-left:2px}
  .kpi .foot{font-size:12.5px;color:var(--ink2);margin-top:6px}
  .kpi .foot b{color:var(--ok);font-weight:700}
  .kpi .foot b.down{color:var(--bad)}
  .kpi .ic{position:absolute;right:12px;top:12px;width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:15px}

  /* ---------------- 开单 ---------------- */
  .order-grid{display:grid;grid-template-columns:1fr 320px;gap:14px;align-items:start}
  .cust-pick{position:relative}
  .search{
    width:100%;border:1px solid var(--line);border-radius:9px;padding:9px 12px;font-size:14px;
    font-family:inherit;outline:none;color:var(--ink);background:#fff;
  }
  .search:focus{border-color:var(--brand-line);box-shadow:0 0 0 3px rgba(20,98,214,.08)}
  .search::placeholder{color:#B9C6D4}
  .dropdown{
    position:absolute;left:0;right:0;top:calc(100% + 6px);background:#fff;border:1px solid var(--line);
    border-radius:10px;box-shadow:0 14px 32px -10px rgba(16,42,76,.24);z-index:30;overflow:hidden;max-height:260px;overflow-y:auto;
  }
  .dropdown div{padding:9px 12px;cursor:pointer;font-size:13.5px;border-bottom:1px solid var(--line-2)}
  .dropdown div:last-child{border-bottom:0}
  .dropdown div:hover{background:var(--brand-soft)}
  .dropdown div b{font-weight:700}
  .dropdown div span{color:var(--ink3);font-size:12.5px;margin-left:6px}

  .cust-card{display:flex;gap:14px;align-items:flex-start;background:linear-gradient(120deg,#F7FBFF,#F5FBF8);
    border:1px solid #DCEBF9;border-radius:11px;padding:13px 14px}
  .cust-ava{width:38px;height:38px;border-radius:10px;background:#fff;border:1px solid #DCEBF9;
    display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--brand);flex:0 0 auto}
  .mini{display:flex;gap:16px;margin-top:7px;font-size:12.5px;color:var(--ink2);flex-wrap:wrap}
  .mini b{font-weight:800;color:var(--ink)}

  .qtybox{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:8px;overflow:hidden}
  .qtybox button{width:28px;height:30px;border:0;background:#F7FAFD;color:var(--brand);font-size:17px;
    font-weight:700;cursor:pointer;font-family:inherit;line-height:1}
  .qtybox button:hover{background:#EDF4FF}
  .qtybox input{width:44px;height:30px;border:0;text-align:center;font-size:15px;font-weight:800;
    font-family:inherit;outline:none;color:var(--ink);border-left:1px solid var(--line-2);border-right:1px solid var(--line-2)}

  .pays{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .pay{
    border:1px solid var(--line);background:#fff;border-radius:9px;padding:9px 10px;cursor:pointer;
    font-family:inherit;text-align:left;font-size:13.5px;font-weight:700;color:var(--ink2);transition:.13s;
  }
  .pay small{display:block;font-weight:500;font-size:12px;color:var(--ink3);margin-top:2px}
  .pay.on{border-color:var(--brand);background:var(--brand-soft);color:var(--brand);box-shadow:0 0 0 3px rgba(20,98,214,.07)}
  .pay.on small{color:#5B7DB0}

  /* 售票弹窗 */
  .pk-t{font-size:13px;color:var(--ink2);font-weight:800;margin:0 0 7px}
  .pk-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
  .pk{
    border:1px solid var(--line);background:#fff;border-radius:9px;padding:9px 10px;cursor:pointer;
    font-family:inherit;text-align:left;color:var(--ink2);transition:.13s;position:relative;
  }
  .pk b{display:block;font-size:13.5px;font-weight:800;color:var(--ink)}
  .pk small{display:block;font-size:12px;color:var(--ink2);margin-top:3px;font-weight:600}
  .pk.on{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 3px rgba(20,98,214,.07)}
  .pk.on b{color:var(--brand)}
  .pk .hot{
    position:absolute;top:-7px;right:6px;background:#F59E0B;color:#fff;font-size:11px;font-weight:800;
    padding:1px 5px;border-radius:5px;letter-spacing:.2px;
  }
  .b-gold{background:#FFF7E6;color:#96600A}

  .sumrow{display:flex;justify-content:space-between;align-items:baseline;font-size:14px;color:var(--ink2);padding:6px 0}  .sumrow b{color:var(--ink);font-weight:800;font-size:14.5px}
  .sumtotal{border-top:1px dashed var(--line);margin-top:8px;padding-top:10px;display:flex;
    justify-content:space-between;align-items:baseline}
  .sumtotal .v{font-size:25.5px;font-weight:800;letter-spacing:-1px}

  /* ---------------- 押桶结算 ---------------- */
  .dep-box{margin-top:12px;background:linear-gradient(180deg,#F7FBFF,#FFFFFF);border:1px solid var(--brand-line);
    border-radius:11px;padding:12px 13px}
  .dep-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
  .dep-h span:first-child{font-size:13px;font-weight:800;color:var(--ink);letter-spacing:.2px}
  .dep-row{display:flex;align-items:center;justify-content:space-between;margin-top:11px;
    border-top:1px dashed #D9E6F7;padding-top:10px;gap:10px}
  .dep-amt{display:flex;flex-direction:column;line-height:1.35}
  .dep-amt{font-size:20.5px;font-weight:800;color:var(--brand);letter-spacing:-.4px}
  .dep-amt small{font-size:12px;color:var(--ink3);font-weight:600;letter-spacing:0;margin-top:2px}
  .dep-toggle{display:flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;
    border-radius:99px;padding:5px 10px 5px 7px;font-size:12.5px;font-weight:700;color:var(--ink3);cursor:pointer}
  .dep-toggle .sw{width:26px;height:15px;border-radius:99px;background:#DCE4EE;position:relative;transition:.16s}
  .dep-toggle .sw::after{content:"";position:absolute;top:2px;left:2px;width:11px;height:11px;border-radius:50%;
    background:#fff;transition:.16s;box-shadow:0 1px 2px rgba(0,0,0,.15)}
  .dep-toggle.on{border-color:#F0C4C4;color:var(--bad);background:#FFFBFB}
  .dep-toggle.on .sw{background:var(--bad)}
  .dep-toggle.on .sw::after{left:13px}

  /* ---------------- 空桶 ---------------- */
  .barrels{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  .barrel{background:#fff;border:1px solid var(--line);border-radius:13px;padding:15px}
  .barrel .t{font-size:12.5px;color:var(--ink3);font-weight:700}
  .barrel .n{font-size:29px;font-weight:800;letter-spacing:-1px;margin-top:6px}
  .barrel .n small{font-size:13px;color:var(--ink3);font-weight:700;letter-spacing:0;margin-left:3px}
  .barrel .d{font-size:12.5px;color:var(--ink3);margin-top:5px}
  .trackbar{height:6px;border-radius:99px;background:#EEF3F9;margin-top:11px;overflow:hidden;display:flex}
  .trackbar i{display:block;height:100%}

  /* ---------------- 图表 ---------------- */
  .chart{display:flex;align-items:flex-end;gap:10px;height:172px;padding-top:14px}
  .col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:6px}
  .col .v{font-size:12px;font-weight:700;color:var(--ink2)}
  .col .bar{width:100%;max-width:38px;border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,#3E8EF0,#1462D6);
    min-height:4px;transition:height .3s ease}
  .col .bar.dim{background:#DCE7F4}
  .col .x{font-size:12px;color:var(--ink3);font-weight:600}
  .hbar{margin-bottom:11px}
  .hbar .l{display:flex;justify-content:space-between;font-size:12.5px;margin-bottom:5px;color:var(--ink2)}
  .hbar .l b{color:var(--ink);font-weight:700}
  .hbar .t{height:7px;background:#EEF3F9;border-radius:99px;overflow:hidden}
  .hbar .t i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#3E8EF0,#1462D6)}

  /* ---------------- 弹窗 ---------------- */
  /* 入场动画只在「打开弹窗那一刻」播放一次：切换收款方式等局部刷新时不再重播，避免闪屏 */
  .mask{position:fixed;inset:0;background:rgba(14,27,43,.34);z-index:80;display:flex;align-items:center;
    justify-content:center;padding:24px;cursor:default;transition:background .15s}
  .mask:hover{background:rgba(14,27,43,.42)}
  /* 悬停时提示：点空白处可以关闭 */
  .mask::after{content:"点击空白处关闭 · Esc 关闭";position:absolute;left:50%;bottom:14px;transform:translateX(-50%);
    color:rgba(255,255,255,.85);font-size:12.5px;font-weight:600;opacity:0;transition:opacity .15s;pointer-events:none;
    text-shadow:0 1px 3px rgba(0,0,0,.4)}
  .mask:hover::after{opacity:1}
  .mask.anim{animation:fade .16s ease}
  @keyframes fade{from{opacity:0}to{opacity:1}}
  .modal{background:#fff;border-radius:15px;width:100%;max-width:560px;max-height:88vh;overflow:auto;
    box-shadow:0 30px 70px -20px rgba(14,27,43,.45)}
  .modal.anim{animation:pop .2s cubic-bezier(.2,.9,.3,1)}
  @keyframes pop{from{transform:translateY(10px) scale(.985);opacity:0}to{transform:none;opacity:1}}
  .modal.wide{max-width:680px}
  .m-h{display:flex;align-items:center;padding:15px 18px;border-bottom:1px solid var(--line-2)}
  .m-h h3{margin:0;font-size:15.5px;font-weight:800}
  .m-h .x{margin-left:auto;cursor:pointer;color:#8FA0B4;font-size:20px;line-height:1;width:30px;height:30px;
    display:flex;align-items:center;justify-content:center;border-radius:8px;transition:background .12s,color .12s}
  .m-h .x:hover{background:#EDF1F6;color:#0A1626}
  .m-b{padding:16px 18px}
  .m-f{padding:13px 18px;border-top:1px solid var(--line-2);display:flex;gap:8px;justify-content:flex-end;background:#FBFDFF;
    border-radius:0 0 15px 15px}
  .toast{position:fixed;left:50%;top:22px;transform:translateX(-50%);background:var(--ink);color:#fff;
    font-size:13.5px;font-weight:600;padding:10px 16px;border-radius:10px;z-index:99;
    box-shadow:0 12px 30px -10px rgba(14,27,43,.5);animation:tin .2s ease;max-width:70vw}
  @keyframes tin{from{opacity:0;transform:translate(-50%,-6px)}to{opacity:1;transform:translate(-50%,0)}}
  #toastBox{position:fixed;inset:0;pointer-events:none;z-index:99}
  #toastBox .toast{pointer-events:auto}

  /* 小票 */
  .receipt{border:1px dashed #CBD8E6;border-radius:10px;padding:14px;background:#FCFDFF;font-size:13px;
    font-family:"SFMono-Regular",Consolas,Menlo,monospace;line-height:1.9;color:var(--ink2)}
  .receipt .rh{text-align:center;font-family:inherit;font-weight:800;font-size:14.5px;color:var(--ink);letter-spacing:1px}
  .receipt .sep{border-top:1px dashed #DCE5EF;margin:8px 0}
  .receipt .li{display:flex;justify-content:space-between}

  /* ===== 热敏小票：58mm 纸 / 48mm 打印区，全黑白，无灰阶 ===== */
  .paper-wrap{display:flex;gap:16px;align-items:flex-start}
  .paper-col{flex:0 0 auto}
  .paper-lab{font-size:10px;color:var(--ink3);font-weight:700;margin-bottom:6px;letter-spacing:.2px}
  .paper{background:#E9EEF5;border:1px solid #DCE4EE;border-radius:9px;padding:10px 10px 0;
    display:block;width:max-content;max-height:64vh;overflow-y:auto;overflow-x:hidden}
  /* 纸卷本身：宽度 = 纸宽，左右 padding = 打印边距 */
  .rp{width:58mm;box-sizing:border-box;padding:3mm 5mm 7mm;background:#fff;color:#000;
    font-family:"SFMono-Regular",Consolas,"Courier New",monospace;font-size:10px;line-height:1.5;
    letter-spacing:0;box-shadow:0 14px 32px -18px rgba(14,27,43,.55)}
  .rp.w80{width:80mm;padding:4mm 4mm 7mm;font-size:11px}
  .rp.fsS{font-size:9px}
  .rp.fsL{font-size:11px}
  .rp *{box-sizing:border-box}
  .rp-name{font-size:1.55em;font-weight:700;text-align:center;letter-spacing:.18em;line-height:1.35;margin-left:.18em}
  .rp-sub{font-size:.82em;text-align:center;margin-top:.15em}
  .rp-type{font-size:1.15em;font-weight:700;text-align:center;margin:.1em 0 .15em}
  .rp-no{font-size:1.02em;font-weight:700;text-align:center;letter-spacing:.04em}
  .rp-sep{border:0;border-top:1px dashed #000;height:0;margin:.55em 0}
  .rp-li{display:flex;justify-content:space-between;gap:.8em}
  .rp-li>span{min-width:0;overflow-wrap:anywhere}
  .rp-li .v{flex:0 0 auto;text-align:right;font-variant-numeric:tabular-nums}
  .rp-kv{display:flex;gap:.5em}
  .rp-kv .k{flex:0 0 2.6em;font-weight:700;white-space:nowrap}
  .rp-kv .w{min-width:0;overflow-wrap:anywhere}
  .rp-tot{font-size:1.2em;font-weight:700}
  .rp-tot .v{font-size:1.1em}
  .rp-box{border:1px solid #000;padding:.3em .35em;text-align:center;margin:.35em 0}
  .rp-box .k{font-size:.85em;font-weight:700;letter-spacing:.1em}
  .rp-box .c{font-size:1.3em;font-weight:700;letter-spacing:.08em;line-height:1.35}
  .rp-note{font-size:.85em;line-height:1.55}
  .rp-hint{font-size:.85em;font-weight:700;text-align:center}
  .rp-code{display:block;width:46mm;height:9mm;margin:.35em auto .15em;fill:#000}
  .rp.w80 .rp-code{width:64mm}
  .rp-cut{border-top:1px dashed #000;margin-top:.7em;position:relative;text-align:center}
  .rp-cut span{position:relative;top:-.62em;background:#fff;padding:0 .4em;font-size:.78em}
  .rp-blank{height:4mm}
  .rp .rp-foot{text-align:center;font-size:.82em;line-height:1.6}

  /* 打印设置面板 */
  .pcfg{flex:1;min-width:0}
  .pcfg .row{display:flex;align-items:center;justify-content:space-between;gap:10px;
    padding:9px 0;border-bottom:1px solid var(--line-2)}
  .pcfg .row:last-child{border-bottom:0}
  .pcfg .lb{font-size:11.5px;color:var(--ink3);font-weight:700}
  .seg{display:inline-flex;background:#F1F5F9;border-radius:8px;padding:2px;gap:2px}
  .seg button{border:0;background:transparent;font-family:inherit;font-size:11.5px;font-weight:700;
    color:var(--ink3);padding:5px 10px;border-radius:6px;cursor:pointer;white-space:nowrap}
  .seg button.on{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(14,27,43,.14)}
  .ptip{margin-top:11px;background:#F7FBFF;border:1px solid #DCEBF9;border-radius:9px;
    padding:10px 12px;font-size:11px;color:var(--ink2);line-height:1.75}
  .ptip b{color:var(--ink)}

  .empty{padding:44px 0;text-align:center;color:var(--ink3);font-size:12.5px}
  .empty .ic{font-size:26px;display:block;margin-bottom:8px;opacity:.5}

  /* 客户表：地址列与操作按钮 —— 按钮随列宽自动重排（auto-fit），列拉宽就多排几个 */
  .tbl .addr{min-width:142px;max-width:210px;line-height:1.45}
  .opgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(54px,1fr));gap:4px;width:100%;min-width:150px}
  .opgrid .btn.sm{padding:5px 2px;text-align:center;white-space:nowrap;font-size:12.5px}
  .opgrid .btn.sec{color:var(--ink2);border-style:dashed}
  .opgrid .btn.sec:hover{border-style:solid}
  .opgrid .btn.danger{color:var(--bad);border-color:#F0C4C4;background:#fff}
  .opgrid .btn.danger:hover{background:#FFF6F6}
  /* 资料管理按钮：按内容宽度靠右排，不平分整行 */
  .opgrid.mgmt{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}
  /* 客户表操作列固定在右侧：表格横向滚动时按钮不会跑出屏幕 */
  .tbl-cust th:last-child,.tbl-cust td:last-child{
    position:sticky;right:0;background:#fff;box-shadow:-7px 0 9px -7px rgba(14,27,43,.16)}
  .tbl-cust thead th:last-child{background:#F8FAFD;z-index:2}
  @media(max-width:1340px){
    .tbl .addr{min-width:118px}
    .opgrid{min-width:120px}
    /* 窄屏让出「最近送水」列，保证操作按钮不被挤出屏幕 */
    .tbl-cust th:nth-child(9), .tbl-cust td:nth-child(9){display:none}
  }

  @media(max-width:1180px){
    .kpis{grid-template-columns:repeat(2,1fr)}
  }
  @media(max-width:1040px){
    .order-grid{grid-template-columns:1fr}
    .side{width:64px;flex:0 0 64px}
    .brand b,.brand span,.nav a span{display:none}
    .brand{justify-content:center;padding:0}
    .nav a{justify-content:center}
    /* 折叠态分组标题不能竖排 */
    .nav-t{font-size:11px;letter-spacing:0;text-align:center;padding:9px 0 5px;white-space:nowrap}
  }

  /* 账号菜单 / 权限勾选 */
  .um-item{
    width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
    padding:10px 12px;border:1px solid var(--line-2);border-radius:9px;background:#fff;
    font-size:13.5px;color:var(--ink);cursor:pointer;margin-bottom:7px;transition:border-color .12s,background .12s;
  }
  .um-item:hover{border-color:var(--brand-line);background:#F7FBFF}
  .um-item.danger{color:var(--bad)}
  .um-item.danger:hover{border-color:#F0C4C4;background:#FFF7F7}
  .perm-item{
    display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--line-2);
    border-radius:8px;font-size:12.5px;color:var(--ink2);cursor:pointer;user-select:none;
    transition:border-color .12s,background .12s,color .12s;
  }
  .perm-item:hover{border-color:var(--brand-line)}
  .perm-item.on{border-color:var(--brand-line);background:#F2F7FF;color:var(--ink);font-weight:600}
  .perm-item input{width:15px;height:15px;accent-color:var(--brand);cursor:pointer;flex:0 0 auto}

  /* ==================== 系统重置选择面板 ==================== */
  .rp-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .rp-item{
    display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;
    gap:2px 9px;align-items:center;padding:10px 12px;border:1px solid var(--line);
    border-radius:10px;cursor:pointer;background:#fff;transition:border-color .13s,background .13s;
  }
  .rp-item:hover{border-color:var(--brand-line);background:#FAFCFF}
  .rp-item.on{border-color:var(--brand);background:#F4F8FF}
  .rp-item.danger.on{border-color:#E8A0A0;background:#FFF7F7}
  .rp-item input{
    grid-row:1 / span 2;width:16px;height:16px;accent-color:var(--brand);
    cursor:pointer;margin:0;align-self:center;
  }
  .rp-item.danger input{accent-color:var(--bad)}
  .rp-t{font-size:13.5px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:6px}
  .rp-d{font-size:11.5px;color:var(--ink3);line-height:1.5}
  .rp-badge{
    font-style:normal;font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:99px;
    background:#EAF2FF;color:#1E5FCB;
  }
  .rp-badge.warn{background:#FFF4E0;color:#9A6206}
  .rp-item.danger .rp-badge{background:#FFE9E9;color:#C0392B}
  @media(max-width:760px){ .rp-list{grid-template-columns:1fr} }

  /* ==================== 列表查询栏 ==================== */
  .qbar{
    display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px;
    background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:10px 12px;
  }
  .qbar .search{
    width:250px;height:34px;border:1px solid var(--line);border-radius:8px;padding:0 11px;
    font-size:13.5px;color:var(--ink);background:#FBFDFF;outline:none;transition:border-color .13s,box-shadow .13s;
  }
  .qbar .search:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(20,98,214,.10);background:#fff}
  .qbar .search::placeholder{color:#B9C6D4}
  .qbar select{
    height:34px;border:1px solid var(--line);border-radius:8px;padding:0 26px 0 10px;font-size:13px;
    color:var(--ink2);background:#FBFDFF;outline:none;cursor:pointer;appearance:none;
    background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%238A94A6' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 9px center;
  }
  .qbar select:focus{border-color:var(--brand)}
  .qbar label.qf{
    display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink3);font-weight:600;white-space:nowrap;
  }
  .qbar input[type="date"]{
    height:34px;border:1px solid var(--line);border-radius:8px;padding:0 9px;font-size:12.5px;
    color:var(--ink2);background:#FBFDFF;outline:none;
  }
  .qbar input[type="date"]:focus{border-color:var(--brand)}
  .qbar .qhint{
    font-size:12.5px;color:var(--ink3);margin-left:auto;white-space:nowrap;
  }
  .qbar .qhint b{color:var(--ink);font-weight:800}
  .qtag{
    display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600;
    background:#EEF4FF;color:#1E5FCB;border-radius:99px;padding:2px 8px;
  }
  .qtag button{
    border:0;background:transparent;color:inherit;cursor:pointer;font-size:13px;line-height:1;
    padding:0;opacity:.7;
  }
  .qtag button:hover{opacity:1}
  @media(max-width:900px){
    .qbar .search{width:100%}
    .qbar .qhint{margin-left:0;width:100%}
  }
  /* ==================== 登录页 ==================== */
  #loginScreen{
    position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;
    background:radial-gradient(1100px 560px at 50% -8%,#E8F1FF 0%,#F1F5FB 48%,#EDF1F7 100%);
    padding:20px;
  }
  #loginScreen.on{display:flex}
  .lg-card{
    width:404px;max-width:94vw;background:#fff;border-radius:18px;padding:34px 34px 24px;
    box-shadow:0 26px 64px -24px rgba(20,35,60,.30),0 0 0 1px rgba(20,35,60,.05);
  }
  .lg-card h1{
    margin:0;text-align:center;font-size:26px;font-weight:800;letter-spacing:6px;
    color:#141A22;line-height:1.2;
  }
  .lg-sub{
    margin:10px 0 26px;text-align:center;font-size:13px;color:#8A94A6;line-height:1.6;
  }
  .lg-field{position:relative;margin-bottom:13px}
  .lg-inp{
    width:100%;height:46px;border:1px solid #E1E6EE;border-radius:10px;padding:0 14px 0 40px;
    font-size:14.5px;color:#141A22;background:#fff;outline:none;
    transition:border-color .15s,box-shadow .15s;
  }
  .lg-inp::placeholder{color:#A9B3C2}
  .lg-inp:focus{border-color:#2B6BF3;box-shadow:0 0 0 3px rgba(43,107,243,.13)}
  .lg-ico{
    position:absolute;left:13px;top:50%;transform:translateY(-50%);
    width:17px;height:17px;color:#9AA5B6;pointer-events:none;
  }
  .lg-inp:focus ~ .lg-ico{color:#2B6BF3}
  .lg-eye{
    position:absolute;right:5px;top:50%;transform:translateY(-50%);
    width:32px;height:32px;border:0;background:transparent;cursor:pointer;color:#9AA5B6;
    display:flex;align-items:center;justify-content:center;border-radius:8px;
  }
  .lg-eye:hover{background:#F2F5FA;color:#5A6678}
  .lg-eye svg{width:17px;height:17px}
  .lg-row{
    display:flex;align-items:center;justify-content:space-between;margin:4px 0 20px;
  }
  .lg-keep{display:flex;align-items:center;gap:7px;font-size:13px;color:#5A6678;cursor:pointer;user-select:none}
  .lg-keep input{width:15px;height:15px;accent-color:#2B6BF3;cursor:pointer;margin:0}
  .lg-link{
    border:0;background:transparent;color:#2B6BF3;font-size:13px;font-weight:600;
    cursor:pointer;padding:2px 4px;border-radius:6px;
  }
  .lg-link:hover{background:#EEF4FF}
  .lg-err{min-height:17px;font-size:12.5px;color:#E04B4B;font-weight:600;margin:-4px 0 8px}
  .lg-btn{
    width:100%;height:46px;border:0;border-radius:10px;background:#2B6BF3;color:#fff;
    font-size:16px;font-weight:800;letter-spacing:4px;cursor:pointer;
    transition:background .14s,box-shadow .14s,transform .08s;
    box-shadow:0 10px 22px -10px rgba(43,107,243,.7);
  }
  .lg-btn:hover{background:#2159DB;box-shadow:0 12px 26px -10px rgba(43,107,243,.8)}
  .lg-btn:active{transform:translateY(1px)}
  .lg-btn:disabled{opacity:.6;cursor:default}
  .lg-tip{
    margin-top:20px;text-align:center;font-size:13px;color:#2B6BF3;font-weight:600;
    background:#EEF4FF;border-radius:10px;padding:11px 12px;
  }
  .lg-tip b{font-weight:800;letter-spacing:.3px}
  .lg-ver{
    margin-top:14px;text-align:center;font-size:12px;color:#A0AABA;line-height:1.7;
  }
  /* ==================== 顶栏账号浮层 ==================== */
  .who{
    display:flex;align-items:center;gap:8px;padding:4px 10px 4px 4px;border-radius:99px;
    border:1px solid #E4E9F0;background:#E8F0FF;cursor:pointer;user-select:none;
    transition:background .14s,border-color .14s,box-shadow .14s;
  }
  .who:hover{background:#DFEAFF;border-color:#C9D9F7}
  .who.on{background:#E8F0FF;border-color:#2563EB;box-shadow:0 0 0 3px rgba(37,99,235,.12)}
  .who .avatar{
    width:30px;height:30px;border-radius:50%;background:#2563EB;
    color:#fff;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;
    flex:0 0 auto;
  }
  .who .wtxt{display:flex;flex-direction:column;align-items:flex-start;gap:0}
  .who .wname{display:block;font-size:13px;font-weight:700;color:#0F172A;line-height:1.3}
  .who .urole{display:block;font-size:11px;color:#0F172A;opacity:.62;font-weight:500;line-height:1.3;white-space:nowrap}
  .who .wchev{width:13px;height:13px;color:#8494A8;flex:0 0 auto;transition:transform .18s;transform:rotate(180deg)}
  .who.on .wchev{transform:none}

  .upop{
    position:fixed;z-index:120;width:248px;background:#fff;border-radius:12px;
    box-shadow:0 18px 44px -14px rgba(20,35,60,.28),0 0 0 1px rgba(20,35,60,.05);
    padding:6px;display:none;
  }
  .upop.on{display:block;animation:upop .16s ease}
  @keyframes upop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  .upop-hd{display:flex;align-items:center;gap:11px;padding:12px 10px 13px}
  .upop-hd .avatar{
    width:38px;height:38px;border-radius:50%;background:#2563EB;
    color:#fff;font-size:15px;font-weight:800;display:flex;align-items:center;justify-content:center;
    flex:0 0 auto;
  }
  .upop-hd .n{display:block;font-size:14.5px;font-weight:800;color:#0F172A;line-height:1.3}
  .upop-hd .r{display:block;font-size:12px;color:#64748B;margin-top:2px}
  .upop-sep{height:1px;background:#E4E9F0;margin:0 4px}
  .upop-it{
    display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;
    padding:10px 11px;border-radius:9px;font-size:13.5px;color:#0F172A;cursor:pointer;
    text-align:left;font-weight:600;
  }
  .upop-it:hover{background:#F5F8FC}
  .upop-it svg{width:16px;height:16px;color:#8494A8;flex:0 0 auto}
  /* 退出登录：淡红底 + 红字（常驻高亮，不用等鼠标悬停） */
  .upop-it.danger{color:#DC2626;background:#FDEAEA}
  .upop-it.danger svg{color:#DC2626}
  .upop-it.danger:hover{background:#FBDCDC}

  @media(max-width:680px){
    .who .wname,.who .urole{display:none}
    .who{padding:4px}
  }

/* ==================== 多页签 ==================== */
  .tabsbar{
    display:flex;gap:5px;align-items:flex-end;padding:7px 20px 0;overflow-x:auto;
    background:var(--panel);border-bottom:1px solid var(--line);min-height:37px;flex:0 0 auto;
  }
  .tabsbar:empty{display:none}
  .tb{
    display:flex;align-items:center;gap:7px;padding:6px 9px 6px 12px;border-radius:9px 9px 0 0;
    font-size:13px;color:var(--ink2);cursor:pointer;white-space:nowrap;position:relative;
    border:1px solid transparent;border-bottom:none;transition:background .12s,color .12s;
  }
  .tb:hover{background:#F4F8FD;color:var(--ink)}
  .tb.on{background:var(--bg);color:var(--brand);font-weight:700;border-color:var(--line)}
  .tb .tx{font-size:15px;line-height:1;width:17px;height:17px;border-radius:5px;color:var(--ink3);
    display:flex;align-items:center;justify-content:center;transition:background .12s,color .12s}
  .tb .tx::before{content:"×";opacity:.45;font-size:14px}
  .tb .tx:hover{background:#E4EBF3;color:var(--bad)}
  .tb .tx:hover::before{opacity:1}

  /* ===== 打印：只输出小票，其余全部隐藏 ===== */
  #printRoot{display:none}
  @media print{
    html,body{background:#fff!important;margin:0!important;padding:0!important;height:auto!important}
    body>*{display:none!important}
    #printRoot{display:block!important;margin:0!important;padding:0!important}
    /* 固定 48mm 宽：即使驱动无视 @page，票面也不会被拉成 A4 宽 */
    #printRoot .rp{width:48mm!important;max-width:none!important;margin:0 auto!important;
      box-shadow:none!important;padding:2mm 0 8mm!important;font-size:10px;line-height:1.45}
    #printRoot .rp.w80{width:72mm!important;font-size:11px}
    #printRoot .rp.fsS{font-size:9px}
    #printRoot .rp.fsL{font-size:11px}
    /* 热敏纸只有黑白：强制纯黑，避免灰阶被网点化后发虚 */
    #printRoot .rp,#printRoot .rp *{color:#000!important;background:transparent!important;
      box-shadow:none!important;text-shadow:none!important}
    #printRoot .rp-sep,#printRoot .rp-cut,#printRoot .rp-box{border-color:#000!important}
    #printRoot .rp-code{width:100%!important;height:9mm}
    #printRoot .rp-cut span{background:#fff!important}
    #printRoot .rp-next{margin-top:6mm!important;border-top:1px dashed #000;padding-top:3mm}
    @page{size:58mm auto;margin:2mm 0 0}
  }

  /* ==================== 服务器版新增 ==================== */
  #bootMask{position:fixed;inset:0;z-index:400;display:flex;align-items:center;justify-content:center;background:#F1F5FB}
  #bootMask.off{display:none}
  .bm-card{display:flex;flex-direction:column;align-items:center;gap:12px;color:#5C7288;font-size:13.5px;font-weight:600}
  .bm-spin{width:26px;height:26px;border-radius:50%;border:2.5px solid #CFE2FC;border-top-color:#1462D6;animation:bms .8s linear infinite}
  @keyframes bms{to{transform:rotate(360deg)}}

  #setupScreen{
    position:fixed;inset:0;z-index:300;display:none;align-items:center;justify-content:center;padding:20px;
    background:radial-gradient(1100px 560px at 50% -8%,#E8F1FF 0%,#F1F5FB 48%,#EDF1F7 100%);
  }
  #setupScreen.on{display:flex}
  #setupScreen .lg-inp{padding-left:14px}

  .sync-chip{
    display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:99px;
    font-size:12px;font-weight:700;color:#5C7288;background:#F1F5F9;border:1px solid #E4E9F0;
    cursor:pointer;user-select:none;white-space:nowrap;
  }
  .sync-chip i{width:7px;height:7px;border-radius:50%;background:#94A3B8;display:block;flex:0 0 auto}
  .sync-chip[data-s="saved"]{background:#E7F7F0;border-color:#CDEBDF;color:#0C8A5F}
  .sync-chip[data-s="saved"] i{background:#0C8A5F}
  .sync-chip[data-s="saving"]{background:#EDF4FF;border-color:#CFE2FC;color:#1462D6}
  .sync-chip[data-s="saving"] i{background:#1462D6;animation:scpulse 1s ease-in-out infinite}
  .sync-chip[data-s="fail"]{background:#FDECEC;border-color:#F7D2D2;color:#C22323}
  .sync-chip[data-s="fail"] i{background:#C22323}
  .sync-chip[data-s="off"]{background:#FFF7E6;border-color:#F5E3BE;color:#B45309}
  .sync-chip[data-s="off"] i{background:#B45309}
  @keyframes scpulse{50%{opacity:.3}}