:root{
  --red:#E60012; --red-h:#C9000F; --red-bg:#FFECEE; --red-line:#F7B4BA;
  --bg:#F2F3F5; --card:#FFFFFF; --ink:#1F2329; --ink2:#41464F; --muted:#646A73; --faint:#8F959E;
  --line:#E4E6EA; --line2:#EEF0F2; --head:#F7F8FA;
  --blue:#1A56C8; --blue-bg:#E8F0FE; --green:#2E7D4F; --green-bg:#E9F5EE;
  --amber:#9A5C00; --amber-bg:#FFF4E0; --plate:#0A3EA6;
  --r:8px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--ink);font:14px/1.5 "PingFang SC","Microsoft YaHei","Noto Sans SC","Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--blue);text-decoration:none}
a:hover{color:#0F3F99}
[v-cloak]{display:none}
h1{font-size:20px;margin:0;font-weight:700}
h2{font-size:15px;margin:0;font-weight:600}
.muted{color:var(--muted)} .faint{color:var(--faint)} .red{color:var(--red)} .green{color:var(--green)} .amber{color:var(--amber)}
.small{font-size:12px} .b{font-weight:600} .r{text-align:right} .nowrap{white-space:nowrap}
.row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sp{flex:1}
.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}

/* layout */
.top{height:56px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 20px;position:sticky;top:0;z-index:30}
.logo{width:32px;height:32px;border-radius:6px;background:var(--red);color:#fff;display:grid;place-items:center;font-weight:700;font-size:15px;flex:none}
.brand{font-size:16px;font-weight:700;white-space:nowrap}
.me{display:flex;align-items:center;gap:8px;color:var(--muted);cursor:pointer;position:relative}
.avatar{width:30px;height:30px;border-radius:50%;background:#DDE1E6;display:grid;place-items:center;color:var(--ink);font-size:13px}
.menu-pop{position:absolute;right:0;top:40px;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:0 6px 24px rgba(0,0,0,.08);min-width:140px;padding:4px;z-index:40}
.menu-pop button{display:block;width:100%;text-align:left;border:0;background:none;padding:8px 12px;border-radius:6px;cursor:pointer}
.menu-pop button:hover{background:var(--bg)}
.burger{display:none;border:0;background:none;padding:6px;cursor:pointer}
.shell{display:flex;align-items:flex-start;min-height:calc(100vh - 56px)}
.side{width:200px;flex:none;background:#fff;border-right:1px solid var(--line);align-self:stretch;padding:12px 8px;position:sticky;top:56px;height:calc(100vh - 56px);overflow:auto}
.side a{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:6px;color:var(--ink);margin-bottom:2px}
.side a:hover{background:var(--bg)}
.side a.on{background:var(--red-bg);color:var(--red);font-weight:600}
.side a svg{width:18px;height:18px;flex:none}
.side .badge{margin-left:auto}
.main{flex:1;min-width:0;padding:20px 24px 40px}
.page-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px;min-height:36px}

/* card */
.card{background:var(--card);border-radius:var(--r);border:1px solid var(--line2)}
.card-h{padding:14px 16px;border-bottom:1px solid var(--line2);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.card-b{padding:16px}
.grid{display:grid;gap:12px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpi{background:#fff;border-radius:var(--r);border:1px solid var(--line2);padding:14px 16px}
.kpi .l{color:var(--muted);font-size:13px}
.kpi .v{font-size:24px;font-weight:700;line-height:1.35}
.kpi .s{font-size:12px;color:var(--faint)}
.kpi.hl .v{color:var(--red)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:34px;padding:0 14px;border-radius:6px;border:1px solid #DEE0E3;background:#fff;cursor:pointer;white-space:nowrap;font-weight:500}
.btn:hover{border-color:#C9CDD4;background:#FAFAFB}
a.btn{color:var(--ink)}
a.btn.primary{color:#fff}
.btn.primary{background:var(--red);border-color:var(--red);color:#fff}
.btn.primary:hover{background:var(--red-h);border-color:var(--red-h)}
.btn.danger{color:var(--red);border-color:var(--red-line)}
.btn.text{border-color:transparent;background:none;color:var(--blue);padding:0 6px;height:28px}
.btn.text:hover{background:var(--blue-bg)}
.btn.sm{height:28px;padding:0 10px;font-size:13px}
.btn.lg{height:40px;padding:0 22px;font-size:15px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.seg{display:inline-flex;background:#fff;border:1px solid var(--line);border-radius:6px;padding:2px;gap:2px}
.seg button{border:0;background:none;height:28px;padding:0 12px;border-radius:4px;cursor:pointer;white-space:nowrap}
.seg button.on{background:var(--ink);color:#fff}

/* forms */
.f{display:flex;flex-direction:column;gap:5px;min-width:0}
.f>span{font-size:13px;color:var(--muted)}
.f>span .req{color:var(--red);margin-left:2px}
.in,.f input,.f select,.f textarea{height:36px;border:1px solid #DEE0E3;border-radius:6px;padding:0 10px;background:#fff;width:100%;outline:none;transition:border-color .15s}
.f textarea,textarea.in{height:auto;min-height:72px;padding:8px 10px;resize:vertical}
.in:focus,.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--red)}
.f .hint{font-size:12px;color:var(--faint)}
.f .warn{font-size:12px;color:var(--amber)}
.chk{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.chk input{width:16px;height:16px;accent-color:var(--red)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{height:34px;padding:0 14px;border-radius:6px;border:1px solid #DEE0E3;background:#fff;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.chip.on{border-color:var(--red);background:var(--red-bg);color:var(--red);font-weight:600}
.chip small{color:var(--faint);font-weight:400}
.chip .busy{color:var(--amber)}
.chip:disabled{opacity:.45;cursor:not-allowed}
.search{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #DEE0E3;border-radius:6px;padding:0 10px;height:34px}
.search input{border:0;outline:0;background:none;width:220px;max-width:100%}

/* tables */
.tw{overflow-x:auto}
table.t{width:100%;border-collapse:collapse}
.t th{background:var(--head);color:var(--muted);font-size:13px;font-weight:500;text-align:left;padding:10px 12px;white-space:nowrap;border-bottom:1px solid var(--line2)}
.t td{padding:11px 12px;border-bottom:1px solid var(--line2);vertical-align:top}
.t tr.click{cursor:pointer}
.t tr.click:hover td{background:#FAFAFB}
.t tr.sum td{font-weight:600;background:#FAFAFB}
.t .r{text-align:right}
.empty{text-align:center;padding:40px 16px;color:var(--faint)}
.empty b{display:block;color:var(--ink2);margin-bottom:4px;font-size:15px}

/* tags */
.tag{display:inline-block;font-size:12px;line-height:20px;padding:0 7px;border-radius:4px;background:var(--bg);color:var(--muted);white-space:nowrap;font-weight:500}
.st-pending{background:var(--red-bg);color:var(--red)}
.st-assigned{background:var(--blue-bg);color:var(--blue)}
.st-working{background:var(--amber-bg);color:var(--amber)}
.st-done{background:var(--green-bg);color:var(--green)}
.st-cancelled{background:var(--bg);color:var(--faint);text-decoration:line-through}
.tag.ch{background:#FFF1E8;color:#C24E00}
.tag.ch.direct{background:var(--blue-bg);color:var(--blue)}
.plate{display:inline-block;background:var(--plate);color:#fff;font-weight:700;font-size:12px;line-height:20px;padding:0 6px;border-radius:3px;letter-spacing:1px;white-space:nowrap}
.plate.green{background:linear-gradient(#fff,#BDE8C9);color:#111;box-shadow:inset 0 0 0 1px #24A148}
.badge{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--red);color:#fff;font-size:11px;font-weight:600;display:inline-grid;place-items:center}
.alert{border-radius:var(--r);padding:10px 14px;font-size:13px}
.alert.warn{background:var(--amber-bg);color:#8A5300;border:1px solid #F2D49B}
.alert.danger{background:var(--red-bg);color:var(--red);border:1px solid var(--red-line)}
.alert.info{background:var(--blue-bg);color:var(--blue)}

/* order card (dispatch) */
.oc{padding:12px 14px;border-bottom:1px solid var(--line2);display:flex;flex-direction:column;gap:4px}
.oc:last-child{border-bottom:0}
.oc .t1{display:flex;align-items:center;gap:8px}
.oc .t1 b{font-size:16px}
.oc .t1 .muted{white-space:nowrap}
.oc .addr{color:var(--muted);font-size:13px}

/* timeline */
.tl{min-width:760px}
.tl-h,.tl-r{display:flex}
.tl-h{background:var(--head);font-size:12px;color:var(--muted);border-bottom:1px solid var(--line2)}
.tl-lab{width:170px;flex:none;padding:10px 14px}
.tl-hours{flex:1;display:grid;grid-template-columns:repeat(12,1fr)}
.tl-hours div{border-left:1px solid var(--line2);padding:8px 4px}
.tl-r{border-bottom:1px solid var(--line2);min-height:64px}
.tl-track{flex:1;position:relative;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(100%/12 - 1px),var(--line2) calc(100%/12 - 1px),var(--line2) calc(100%/12))}
.tl-blk{position:absolute;top:10px;bottom:10px;border-radius:4px;padding:3px 8px;font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;border:1px solid}
.tl-blk.assigned{background:var(--blue-bg);border-color:var(--blue)}
.tl-blk.working{background:var(--amber-bg);border-color:#C77700}
.tl-blk.done{background:var(--green-bg);border-color:var(--green)}
.tl-blk.pending{background:var(--red-bg);border-color:var(--red)}
.tl-off{display:flex;align-items:center;padding-left:14px;color:var(--red);font-size:13px}

/* modal & drawer */
.mask{position:fixed;inset:0;background:rgba(15,17,20,.45);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px}
.modal{background:#fff;border-radius:10px;width:100%;max-width:560px;max-height:calc(100vh - 40px);display:flex;flex-direction:column;box-shadow:0 12px 40px rgba(0,0,0,.18)}
.modal.wide{max-width:860px}
.modal-h{padding:16px 20px;border-bottom:1px solid var(--line2);display:flex;align-items:center;gap:10px}
.modal-h h2{font-size:16px;flex:1}
.modal-b{padding:18px 20px;overflow:auto}
.modal-f{padding:12px 20px;border-top:1px solid var(--line2);display:flex;justify-content:flex-end;gap:10px}
.x{border:0;background:none;cursor:pointer;width:32px;height:32px;border-radius:6px;font-size:20px;color:var(--muted);line-height:1}
.x:hover{background:var(--bg)}
.drawer-mask{position:fixed;inset:0;background:rgba(15,17,20,.35);z-index:90}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(720px,100vw);background:#fff;z-index:91;display:flex;flex-direction:column;box-shadow:-8px 0 30px rgba(0,0,0,.12)}
.drawer .modal-b{flex:1}
.kv{display:grid;grid-template-columns:90px 1fr;gap:8px 12px;font-size:14px}
.kv dt{color:var(--muted)}
.kv dd{margin:0;min-width:0;word-break:break-all}
.sec-t{font-weight:600;margin:20px 0 10px;padding-left:8px;border-left:3px solid var(--red);line-height:1.2}
.sec-t:first-child{margin-top:0}
.fee{background:var(--head);border-radius:var(--r);padding:12px 14px;font-size:13px}
.fee div{display:flex;justify-content:space-between;gap:10px;padding:2px 0}
.fee .tot{border-top:1px dashed #DEE0E3;margin-top:6px;padding-top:6px;font-weight:600;font-size:14px}
.photos{display:flex;gap:8px;flex-wrap:wrap}
.photos img{width:96px;height:96px;object-fit:cover;border-radius:6px;border:1px solid var(--line)}
.logs{font-size:13px}
.logs div{padding:5px 0;border-bottom:1px dashed var(--line2);display:flex;gap:10px}
.logs time{color:var(--faint);white-space:nowrap}

.toast{position:fixed;left:50%;top:72px;transform:translateX(-50%);z-index:200;background:var(--ink);color:#fff;padding:10px 18px;border-radius:8px;font-size:14px;box-shadow:0 6px 20px rgba(0,0,0,.2);max-width:90vw}
.toast.err{background:var(--red)}

/* bars */
.bars{display:flex;align-items:flex-end;gap:3px;height:160px;padding:6px 4px 22px;position:relative}
.bar{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;min-width:0}
.bar i{display:block;width:100%;max-width:28px;background:var(--red);border-radius:3px 3px 0 0;min-height:1px}
.bar i.z{background:var(--line)}
.bar span{position:absolute;bottom:-18px;font-size:10px;color:var(--faint);white-space:nowrap}
.meter{height:8px;background:var(--bg);border-radius:4px;overflow:hidden;min-width:80px}
.meter i{display:block;height:100%;background:var(--red);border-radius:4px}

/* login */
.login{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(160deg,#fff 0%,var(--bg) 100%)}
.login-box{width:100%;max-width:380px;background:#fff;border-radius:12px;border:1px solid var(--line);padding:32px 28px;box-shadow:0 8px 30px rgba(0,0,0,.05)}
.login-box .logo{width:48px;height:48px;font-size:22px;border-radius:10px}

/* entry page */
.entry{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.entry-l{flex:1 1 320px;max-width:400px;display:flex;flex-direction:column;gap:16px}
.entry-r{flex:999 1 560px;min-width:0}
.parsed div{display:flex;justify-content:space-between;gap:10px;padding:3px 0;font-size:13px}
.parsed div span:first-child{color:var(--muted);white-space:nowrap}

@media (max-width:1100px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){
  .burger{display:block}
  .side{position:fixed;left:0;top:56px;bottom:0;height:auto;z-index:50;transform:translateX(-100%);transition:transform .2s;box-shadow:4px 0 20px rgba(0,0,0,.08)}
  .side.open{transform:none}
  .main{padding:14px 12px 40px}
  .g3,.g2{grid-template-columns:1fr}
  .top{padding:0 12px}
  .brand small{display:none}
  .me span{display:none}
  .seg{max-width:100%;overflow-x:auto;flex-wrap:nowrap}
  .seg button{flex:none}
  .only-pc{display:none!important}
}
@media (min-width:861px){.only-m{display:none!important}}
.grid>*{min-width:0}
@media (max-width:520px){.g4{grid-template-columns:1fr 1fr}.kpi .v{font-size:20px}}
@media print{.top,.side,.no-print{display:none!important}.main{padding:0}}
/* 录单表单 */
textarea.paste{min-height:330px;background:#FAFAFB;line-height:1.7;font-size:13px}
.chip.sm{height:30px;padding:0 12px;font-size:13px}
.tpl-list{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.tpl-list>span{width:100%}
.tpl{max-width:100%;text-align:left;border:1px dashed #DEE0E3;background:#FAFAFB;border-radius:6px;padding:6px 10px;font-size:13px;color:var(--muted);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tpl:hover{border-color:var(--red);color:var(--ink)}
.tpl.on{border-style:solid;border-color:var(--red);background:var(--red-bg);color:var(--red)}
.f .static{min-height:36px;display:flex;align-items:center;gap:6px}
.dtext{background:#FAFAFB;border:1px solid var(--line2);border-radius:6px;padding:12px 14px;margin:0;font-family:inherit;font-size:13px;line-height:1.8;white-space:pre-wrap;word-break:break-all}
.kv dd.pre{white-space:pre-wrap}
.form-foot{border-top:1px solid var(--line2);padding-top:14px;flex-wrap:wrap}
.fee .tot:first-child{border-top:0;margin-top:0;padding-top:0}
.oc .t1{flex-wrap:wrap;row-gap:4px}