:root {
    --bg:#fff; --surface:#fff; --tint:#f7f6f2; --ink:#1c1b18; --muted:#6b6862; --line:#e3e0d8;
    --accent:#1f5e4e; --accent-soft:#e7efe9; --warn:#b4690e; --warn-soft:#f8ecd9;
    --bad:#a3331f; --bad-soft:#f6e3df; --good:#1f5e4e; --radius:14px;
    --shadow:0 1px 2px rgba(28,27,24,.04),0 8px 24px rgba(28,27,24,.06);
    --font:'Albert Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  body{font-family:var(--font);background:var(--bg);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased}
  button{font-family:inherit;cursor:pointer}
  input,select,textarea{font-family:inherit;font-size:.95rem}
  a{color:var(--accent)}
  .tnum{font-variant-numeric:tabular-nums}
  h1,h2,h3{letter-spacing:-.02em}

  .topbar{display:flex;align-items:center;justify-content:space-between;padding:16px 28px;background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;gap:16px;flex-wrap:wrap}
  .brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}
  .brand .mark{width:34px;height:34px;border-radius:9px;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:700;font-size:1.05rem;flex:0 0 auto;line-height:1}
  .brand h1{font-size:1.1rem;font-weight:700;line-height:1.2}
  .brand small{display:block;color:var(--muted);font-size:.7rem;letter-spacing:.05em;margin-right:-.05em;text-transform:uppercase;line-height:1.3;margin-top:1px}
  .nav{display:flex;gap:4px;flex:1 1 auto;justify-content:center;flex-wrap:wrap}
  /* the customer has three tabs, so centring leaves them stranded mid-bar;
     sit them next to the brand instead. Dispatch keeps the centred nav. */
  [data-role="customer"] .nav{justify-content:flex-start;margin-left:16px}
  .nav button{background:none;border:none;padding:8px 14px;border-radius:8px;font-size:.9rem;font-weight:500;color:var(--muted)}
  .nav button.active{background:var(--accent-soft);color:var(--accent)}
  .nav button{transition:background .15s,color .15s}
  .nav button:hover:not(.active){color:var(--ink);background:#faf9f6}
  .topbar-right{display:flex;align-items:center;gap:14px;flex:0 0 auto}
  .who{text-align:right;font-size:.85rem;display:flex;align-items:center}
  .who b{display:block;line-height:1.25}

  .wrap{max-width:1040px;margin:0 auto;padding:30px 24px 80px}

  .btn{border:1px solid var(--accent);background:var(--accent);color:#fff;padding:9px 18px 11px;border-radius:10px;font-weight:500;font-size:.9rem;transition:transform .08s,opacity .15s}
  .btn:hover{opacity:.92}.btn:active{transform:translateY(1px)}
  /* ghost and subtle buttons are transparent, so a slight fade reads as nothing.
     Give them a soft fill on hover, the same way the remove x does. */
  .btn.ghost:hover{opacity:1;background:var(--accent-soft)}
  .btn.subtle:hover{opacity:1;background:#faf9f6;border-color:#d5d1c7}
  .btn.danger:hover{opacity:1;background:var(--bad-soft);border-color:var(--bad)}
  .btn.ghost,.btn.subtle,.btn.danger{transition:background .15s,border-color .15s,transform .08s}
  .btn.ghost{background:transparent;color:var(--accent)}
  .btn.subtle{background:transparent;color:var(--ink);border-color:var(--line)}
  .btn.danger{background:transparent;color:var(--bad);border-color:var(--bad-soft)}
  .btn.sm{padding:5px 12px 7px;font-size:.82rem}
  .btn.sm.ghost{padding:5.5px 12px 6.5px}
  .btn:disabled{opacity:.5;cursor:not-allowed}

  .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
  .card.pad{padding:24px}

  .auth-shell{min-height:100vh;display:grid;place-items:center;padding:24px}
  .auth-card{width:100%;max-width:410px}
  .auth-card .head{padding:30px 30px 0}
  .auth-card .head .mark{width:44px;height:44px;border-radius:11px;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:700;font-size:1.3rem;margin-bottom:16px}
  .auth-card h2{font-size:1.5rem;font-weight:700}
  .auth-card p.sub{color:var(--muted);font-size:.9rem;margin-top:4px}
  form.stack{padding:24px 30px 30px;display:grid;gap:14px}
  .field{display:grid;gap:6px;min-width:0}
  .field label{font-size:.8rem;font-weight:500;color:var(--muted);display:flex;align-items:baseline;justify-content:space-between;gap:8px}
  .field label .opt{font-size:.68rem;font-weight:500;color:var(--muted);opacity:.7;text-transform:none}
  .field-hint{font-size:.74rem;color:var(--muted)}
  .field input,.field select,.field textarea{width:100%;min-width:0;border:1px solid var(--line);border-radius:10px;padding:11px 13px;background:#fff;color:var(--ink);outline:none;transition:border-color .15s,box-shadow .15s}
  .field input.locked-email:disabled{background:#f4f1ea;color:#57544f;border-color:#d5d1c7;cursor:not-allowed;opacity:1}
  .field select{appearance:none;-webkit-appearance:none;-moz-appearance:none;padding:11px 34px 11px 13px;cursor:pointer;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b6862' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
  .field select:hover{border-color:var(--accent)}
  .field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
  .field.invalid input,.field.invalid select,.field.invalid textarea,.field input.invalid,.field textarea.invalid{border-color:var(--bad);background:var(--bad-soft)}
  .field.invalid input:focus,.field.invalid select:focus,.field.invalid textarea:focus,.field input.invalid:focus{border-color:var(--bad);box-shadow:0 0 0 3px var(--bad-soft)}
  .field-error{font-size:.76rem;color:var(--bad);display:none}
  .field.invalid .field-error{display:block}
  .field.invalid label{color:var(--bad)}
  .row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
  .row3{display:grid;grid-template-columns:minmax(0,1fr) minmax(72px,.35fr) minmax(90px,.5fr);gap:14px;align-items:start}
  .head-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  .btn-select{height:31px;border:1px solid var(--accent);border-radius:10px;background:#fff;color:var(--accent);font-weight:600;font-size:.82rem;padding:5px 28px 7px 12px;outline:none}
  .btn-select:focus{box-shadow:0 0 0 3px var(--accent-soft)}
  .switch-line{text-align:center;font-size:.85rem;color:var(--muted);margin-top:4px}
  .switch-line a{cursor:pointer;font-weight:500}
  .demo-hint{font-size:.76rem;color:var(--muted);background:var(--accent-soft);border-radius:8px;padding:8px 10px;line-height:1.5}
  .err{color:var(--bad);font-size:.85rem;min-height:1em}

  .page-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:22px;flex-wrap:wrap;gap:12px}
  .page-head h2{font-size:1.7rem;font-weight:700}
  .page-head .lead{color:var(--muted);font-size:.92rem}
  .searchbar{position:relative;margin-bottom:16px}
  .searchbar input{width:100%;min-width:0;border:1px solid var(--line);border-radius:10px;padding:11px 13px 11px 38px;background:#fff;color:var(--ink);outline:none;transition:border-color .15s,box-shadow .15s;font-size:.9rem}
  .searchbar input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
  .searchbar .si{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none;font-size:.95rem}
  .search-empty{text-align:center;padding:40px 20px;color:var(--muted);font-size:.9rem}

  table.orders{width:100%;border-collapse:collapse}
  table.orders th{text-align:left;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:12px 14px;border-bottom:1px solid var(--line)}
  table.orders td{padding:14px;border-bottom:1px solid var(--line);font-size:.9rem;vertical-align:middle}
  table.orders tr:last-child td{border-bottom:none}
  table.orders tbody tr{cursor:pointer;transition:background .12s}
  table.orders tbody tr:hover{background:#faf9f6}
  .ref{font-weight:600}
  .veh{color:var(--muted);font-size:.82rem}
  table.orders td.num-cell,table.orders th.num-cell{text-align:center}
  table.orders td .li-main{font-weight:500;font-size:.92rem;display:flex;align-items:center;gap:8px}
  .badge-soft{font-size:.68rem;font-weight:600;color:var(--accent);background:var(--accent-soft);border-radius:20px;padding:2px 8px}
  /* waitlist: grouped by the window they asked for */
  .wl-group{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:10px;background:#fff}
  .wl-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 18px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
  .wl-group.full .wl-head{background:#f8ecd9;border-bottom-color:#eeddba;color:#8a5008}
  .wl-group.open .wl-head{background:#e7efe9;border-bottom-color:#d5e4da;color:#1f5e4e}
  .wl-head-left{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;min-width:0}
  .wl-window{font-size:1.05rem;font-weight:700;letter-spacing:-.01em;line-height:1.25}
  .wl-sub{font-size:.78rem;line-height:1.3}
  .wl-count{font-size:.74rem;font-weight:600;white-space:nowrap;flex:0 0 auto}
  .wl-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 18px;flex-wrap:wrap;cursor:pointer;transition:background .12s}
  .wl-row:hover{background:#faf9f6}
  .wl-row+.wl-row{border-top:1px solid #f0eee9}
  .wl-who{flex:1 1 220px;min-width:0}
  .wl-name{font-size:.92rem;font-weight:700;line-height:1.25}
  .wl-ref{font-size:.74rem;font-weight:400;color:#8a867e;margin-left:4px}
  .wl-meta{font-size:.78rem;color:#57544f;margin-top:2px;line-height:1.35}
  .wl-note{font-size:.78rem;color:#8a867e;margin-top:3px;line-height:1.35}
  .wl-row .btn{flex:0 0 auto}
  /* approvals: one card per request, route visible */
  .req-list{display:grid;gap:10px}
  .req-card{overflow:hidden;cursor:pointer;transition:border-color .12s}
  .req-card:hover{border-color:#d5d1c7}
  .req-body{padding:14px 18px}
  .req-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
  .req-who{min-width:0}
  .req-veh{font-size:1.05rem;font-weight:700;line-height:1.25}
  .req-cust{font-size:.8rem;color:#57544f;margin-top:2px;line-height:1.35}
  .req-when{text-align:right;flex:0 0 auto}
  .req-k{font-size:.66rem;color:#57544f;letter-spacing:.05em;margin-right:-.05em;font-weight:600;line-height:1.2}
  .req-window{font-size:.95rem;font-weight:700;margin-top:2px;line-height:1.25}
  .req-dir{font-size:.74rem;color:#8a867e;line-height:1.3;margin-top:1px}
  .req-route{margin-top:11px;padding-top:11px;border-top:1px solid #f0eee9;display:grid;gap:5px}
  .req-leg{display:flex;gap:9px;align-items:baseline;font-size:.84rem;line-height:1.4}
  .req-leg-k{color:#8a867e;font-size:.74rem;min-width:38px;flex:0 0 auto}
  .req-note{color:#57544f}
  .req-actions{display:flex;gap:8px;margin-top:13px;flex-wrap:wrap}
  .req-view{margin-left:auto}
  /* bookings list: flat rows with a status-coloured left edge */
  .bk-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:13px 18px;
          border-top:1px solid #f0eee9;border-left:3px solid var(--line);cursor:pointer;
          transition:background .12s;flex-wrap:wrap}
  .bk-row:hover{background:#faf9f6}
  .bk-row.pending{border-left-color:#b4690e}
  .bk-row.scheduled{border-left-color:#2f6fb0}
  .bk-row.picked_up{border-left-color:#7a5aa8}
  .bk-row.syracuse_terminal,.bk-row.rochester_terminal{border-left-color:#6554d9}
  .bk-row.in_transit{border-left-color:#16796d}
  .bk-row.delivered{border-left-color:#1f5e4e}
  .bk-row.declined{border-left-color:#8c3a32}
  .bk-row.cancelled{border-left-color:#a3331f}
  .bk-row.delivered,.bk-row.cancelled,.bk-row.declined{opacity:.72}
  .bk-who{flex:1 1 190px;min-width:0}
  .bk-veh{font-size:.95rem;font-weight:700;line-height:1.25}
  .bk-meta{font-size:.8rem;color:#57544f;margin-top:2px;line-height:1.3}
  .bk-when{flex:0 0 auto;text-align:right}
  .bk-window{font-size:.84rem;font-weight:600;line-height:1.25}
  .bk-dir{font-size:.74rem;color:#8a867e;margin-top:2px;line-height:1.3}
  .bk-row .pill{flex:0 0 auto;min-width:96px;justify-content:flex-start}
  /* updates: same progress track as the booking page */
  .upd-card{overflow:hidden;margin-bottom:10px;transition:border-color .12s}
  .upd-card:hover{border-color:#d5d1c7}
  /* the header is a button so it can be tabbed to, but should read as a row */
  .upd-head{display:flex;justify-content:space-between;align-items:center;gap:12px;
            width:100%;padding:14px 20px;background:none;border:none;text-align:left;
            font-family:inherit;cursor:pointer;flex-wrap:wrap;transition:background .12s}
  .upd-head:hover{background:#faf9f6}
  .upd-card.is-open .upd-head{border-bottom:1px solid #f0eee9}
  .upd-veh{font-size:1rem;font-weight:700;line-height:1.25;display:flex;align-items:center;gap:9px;flex-wrap:wrap;color:var(--ink)}
  .upd-new{background:var(--accent-soft);color:var(--accent);border-radius:999px;
           display:inline-flex;align-items:center;justify-content:center;
           height:20px;padding:0 9px;font-size:.7rem;font-weight:600;line-height:1;
           white-space:nowrap;flex:0 0 auto}
  .upd-right{display:flex;align-items:center;gap:10px;flex:0 0 auto}
  .upd-latest{font-size:.8rem;color:#57544f;line-height:1.3}
  .upd-chev{color:#a8a49c;font-size:1.1rem;line-height:1;display:inline-block;
            transform:rotate(90deg);transition:transform .15s}
  .upd-card.is-open .upd-chev{transform:rotate(-90deg)}
  .upd-ref{font-size:.78rem;color:#8a867e;white-space:nowrap}
  .upd-body{padding:16px 20px}
  .upd-foot{display:flex;justify-content:flex-end;margin-top:14px}
  .upd-open{white-space:nowrap}
  /* profile: your details - name leads, contact strip below */
  .pd-view{overflow:hidden}
  .pd-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;flex-wrap:wrap}
  .pd-name{font-size:1.2rem;font-weight:700;letter-spacing:-.01em;line-height:1.25}
  .pd-company{font-size:.78rem;color:#57544f;margin-top:3px;line-height:1.35}
  .pd-contact{border-top:1px solid #f0eee9;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:16px 20px}
  .pd-primary,.pd-backup{display:flex;flex-direction:column;justify-content:center}
  .pd-backup{text-align:right;border-left:1px solid #f0eee9;padding-left:16px}
  .pd-k{font-size:.66rem;color:#57544f;letter-spacing:.05em;margin-right:-.05em;font-weight:600;line-height:1.2}
  .pd-num{font-size:1.4rem;font-weight:700;letter-spacing:-.01em;margin-top:2px;line-height:1.15}
  .pd-bnum{font-size:.95rem;font-weight:600;margin-top:3px;line-height:1.25}
  .pd-none{font-size:.95rem;font-weight:600;margin-top:3px;line-height:1.25;color:#a8a49c}
  .pd-who{font-size:.8rem;color:#57544f;margin-top:2px;line-height:1.3;word-break:break-all}
  @media (max-width:520px){.pd-backup{text-align:left;border-left:none;padding-left:0;border-top:1px solid #f0eee9;padding-top:12px;width:100%}}
  /* customers list: split by activity, booking-detail rules */
  .cust-search{padding:14px 18px;border-bottom:1px solid #f0eee9}
  .cust-sec{padding:11px 18px 7px;font-size:.66rem;color:#57544f;letter-spacing:.05em;margin-right:-.05em;font-weight:600;line-height:1.2;background:#faf9f6;border-top:1px solid #f0eee9}
  .cust-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 18px;border-top:1px solid #f0eee9;cursor:pointer;transition:background .12s}
  .cust-row:hover{background:#faf9f6}
  .cust-row.has-active{border-left:3px solid var(--accent)}
  .cust-who{min-width:0}
  .cust-name{font-size:.95rem;font-weight:700;line-height:1.25}
  .cust-meta{font-size:.8rem;color:#57544f;margin-top:2px;line-height:1.3}
  .cust-badge{background:var(--accent-soft);color:var(--accent);border-radius:999px;
              display:inline-flex;align-items:center;justify-content:center;
              height:22px;padding:0 10px;font-size:.72rem;font-weight:600;line-height:1;
              white-space:nowrap;flex:0 0 auto}
  .cust-last{font-size:.78rem;color:#8a867e;white-space:nowrap;flex:0 0 auto}
  .legacy-import{display:grid;gap:12px}
  .legacy-import-actions{display:flex;justify-content:flex-end}
  .legacy-table{border:1px solid var(--line);border-radius:10px;overflow:hidden}
  .legacy-row{display:grid;grid-template-columns:auto 1fr;gap:10px;padding:11px 12px;border-top:1px solid var(--line);background:#fff}
  .legacy-row:first-child{border-top:0}
  .legacy-row.warn{background:#fff8e1}
  .legacy-row.done{background:#f2f1ed;color:var(--muted)}
  .legacy-main{font-weight:700;line-height:1.25}
  .legacy-main span{font-weight:600;color:var(--muted);margin-left:6px}
  .legacy-sub{font-size:.8rem;color:var(--muted);margin-top:3px;line-height:1.35}
  .legacy-warn{font-size:.78rem;color:#9c5b00;margin-top:5px;font-weight:700}
  /* booking: the route decides the direction, so we show what we worked out */
  .route-summary{display:flex;flex-direction:column;gap:2px;margin-top:12px;padding:11px 14px;border-radius:10px;border:1px solid}
  .route-summary.northbound{background:#e7efe9;border-color:#d5e4da;color:#1f5e4e}
  .route-summary.southbound{background:#e4eef8;border-color:#cbe0f2;color:#255a8f}
  .route-summary.unknown{background:#f8ecd9;border-color:#eeddba;color:#8a5008}
  .route-summary.mismatch{background:var(--bad-soft);border-color:#f2b8b5;color:var(--bad)}
  .route-summary.hidden{display:none}
  .rs-dir{font-size:.92rem;font-weight:700;line-height:1.25}
  .rs-sub{font-size:.78rem;line-height:1.35;opacity:.9}
  .drv-lanes{font-size:.78rem;color:#57544f;white-space:nowrap;flex:0 0 auto}
  /* terminals: one card per terminal, booking-detail rules */
  .term-list{display:grid;gap:10px}
  .term-card{overflow:hidden}
  .term-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;flex-wrap:wrap}
  .term-who{min-width:0;flex:1 1 240px}
  .term-name{font-size:1.05rem;font-weight:700;line-height:1.25}
  .term-addr{font-size:.82rem;color:#57544f;margin-top:3px;line-height:1.35}
  .term-actions{display:flex;gap:7px;flex:0 0 auto}
  .term-edit{padding:14px 18px;display:grid;gap:12px}
  /* customer record: reuses the booking detail rules (bar, header, contact strip) */
  .cust-detail{overflow:hidden;box-shadow:none}
  /* small inline copy control - borderless so it reads as an affordance, not a button */
  .cp{border:none;background:none;color:#c4c0b8;border-radius:4px;
      width:16px;height:16px;line-height:1;font-size:.66rem;cursor:pointer;font-family:inherit;
      margin-left:6px;vertical-align:baseline;padding:0;flex:0 0 auto;
      transition:color .15s,background .15s}
  .cp:hover{color:var(--accent);background:var(--accent-soft)}
  .cp.copied{color:var(--accent);background:var(--accent-soft)}
  .cd-lists{display:grid;gap:16px;padding:16px 20px;border-top:1px solid #f0eee9}
  .cd-block{min-width:0}
  .cd-item{font-size:.92rem;font-weight:600;margin-top:4px;line-height:1.45;word-break:break-word}
  .cd-dim{color:#8a867e;font-weight:400;font-size:.8rem}
  .cd-subline{font-size:.8rem;color:#57544f;font-weight:500;line-height:1.35;margin-top:2px}
  .cd-location{font-size:.93rem;color:var(--ink);font-weight:800;line-height:1.25;margin-bottom:3px}
  .route-label-actions{display:flex;align-items:center;justify-content:space-between;gap:8px}
  .editable-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
  .row-mini-actions{display:flex;align-items:center;gap:6px;flex:0 0 auto}
  .edit-list-block{border-top:1px solid #f0eee9;padding-top:12px;display:grid;gap:8px}
  .edit-list-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:8px;padding:9px 10px;background:#fff}
  .cd-empty{font-size:.86rem;color:#8a867e;margin-top:4px}
  @media (min-width:620px){.cd-lists{grid-template-columns:1fr 1fr;gap:20px}}
  .cust-contact{display:grid;gap:8px;font-size:.9rem}
  /* --- booking detail: route-first layout --- */
  .detail-card{overflow:hidden}
  /* header: status colour bar across the top */
  .detail-bar{height:3px;background:var(--line)}
  .detail-bar.waitlisted{background:#8a867e}
  .detail-bar.pending{background:#b4690e}
  .detail-bar.scheduled{background:#2f6fb0}
  .detail-bar.picked_up{background:#7a5aa8}
  .detail-bar.syracuse_terminal,.detail-bar.rochester_terminal{background:#6554d9}
  .detail-bar.in_transit{background:#16796d}
  .detail-bar.delivered{background:#1f5e4e}
  .detail-bar.quote{background:#6b6862}
  .detail-bar.declined{background:#8c3a32}
  .detail-bar.cancelled{background:#a3331f}
  .detail-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px}
  .detail-veh{font-size:1.2rem;font-weight:700;line-height:1.25;letter-spacing:-.01em}
  .detail-sub{font-size:.78rem;color:#57544f;margin-top:3px;line-height:1.35}
  .detail-headright{display:flex;align-items:center;gap:14px;flex:0 0 auto;align-self:center}
  .head-price{text-align:right;display:flex;flex-direction:column;justify-content:center}
  .head-price-k{font-size:.63rem;color:#57544f;letter-spacing:.06em;margin-right:-.06em;font-weight:600;line-height:1.2}
  .head-price-v{font-size:1.1rem;font-weight:700;margin-top:0;white-space:nowrap;line-height:1.25;min-height:1.25em}
  .head-price-dim{color:#a8a49c;font-size:1.1rem;font-weight:600}
  .detail-badge{flex:0 0 auto;border-radius:999px;padding:8px 16px 6px;font-size:.82rem;font-weight:600;white-space:nowrap;color:#fff;background:var(--muted);align-self:center}
  /* one colour per status, running amber -> blue -> teal -> green as the job progresses */
  /* non-status badges use the brand colours, not a borrowed status */
  .detail-badge.accent{background:var(--accent)}
  .detail-badge.muted{background:#8a867e}
  .detail-badge.waitlisted{background:#8a867e}
  .detail-badge.pending{background:#b4690e}
  .detail-badge.scheduled{background:#2f6fb0}
  .detail-badge.picked_up{background:#7a5aa8}
  .detail-badge.syracuse_terminal,.detail-badge.rochester_terminal{background:#6554d9}
  .detail-badge.in_transit{background:#16796d}
  .detail-badge.delivered{background:#1f5e4e}
  .detail-badge.quote{background:#6b6862}
  .detail-badge.declined{background:#8c3a32}
  .detail-badge.cancelled{background:#a3331f}
  /* route */
  .detail-route{display:grid;grid-template-columns:auto 1fr;gap:0 14px;padding:4px 20px 18px}
  .route-rail{display:grid;justify-items:center;padding-top:5px;align-content:start}
  .route-dot{width:9px;height:9px;border-radius:50%;display:block}
  .route-dot.open{border:2px solid var(--accent);background:#fff}
  .route-dot.filled{background:var(--accent)}
  .route-line{width:2px;flex:1;background:var(--line);display:block;min-height:34px}
  .route-stops{display:grid;gap:22px}
  .route-label{font-size:.72rem;color:#57544f;letter-spacing:.03em;margin-right:-.03em;margin-top:-2px;font-weight:600;text-transform:uppercase;line-height:1.3}
  .route-addr{font-size:.92rem;font-weight:600;margin-top:3px;line-height:1.4}
  .detail-meta{display:flex;gap:24px;flex-wrap:wrap;padding:0 20px 16px}
  .meta-k{font-size:.7rem;color:var(--muted);display:block}
  .meta-v{font-size:.88rem;margin-top:2px;display:block}
  .meta-dim{color:var(--muted)}
  .detail-note{margin:0 20px 16px;padding:10px 12px;background:#faf9f6;border:1px solid #f0eee9;border-radius:8px;font-size:.82rem;color:var(--muted)}
  .sd-link-box{margin:0 20px 16px;padding:10px 12px;background:#f4f8fb;border:1px solid #cfe0ec;border-radius:8px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#17445f}
  .sd-link-k{font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:#4f7186;line-height:1.2}
  .sd-link-v{font-size:.84rem;font-weight:600;margin-top:3px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
  .sd-link-v span{color:#607d8e;font-weight:600}
  .sd-link-v b{font-weight:800;color:#123a53}
  .sd-lock{flex:0 0 auto;border:1px solid #bdd4e3;background:#fff;border-radius:999px;padding:5px 9px;font-size:.7rem;font-weight:700;color:#42677c}
  /* contact: header strip + rows */
  .detail-contact{border-top:1px solid #f0eee9;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:16px 20px}
  .call-primary,.call-backup{display:flex;flex-direction:column;justify-content:center}
  .call-k{font-size:.66rem;color:#57544f;letter-spacing:.05em;margin-right:-.05em;margin-top:-2px;font-weight:600;line-height:1.2}
  .call-num{font-size:1.4rem;font-weight:700;letter-spacing:-.01em;margin-top:2px;line-height:1.15}
  .call-bnum{font-size:.95rem;font-weight:600;margin-top:3px;line-height:1.25}
  .call-who{font-size:.8rem;color:#57544f;margin-top:2px;line-height:1.3}
  .call-backup{text-align:right;border-left:1px solid #f0eee9;padding-left:16px}
  @media (max-width:520px){.call-backup{text-align:left;border-left:none;padding-left:0;border-top:1px solid #f0eee9;padding-top:12px;width:100%}}
  /* dispatch tools: next-step banner + status chips */
  .tools-wrap{padding-top:16px}
  .next-step{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;border-radius:10px;padding:13px 15px;margin:4px 0 16px;border:1px solid}
  .next-step>div:first-child{display:flex;flex-direction:column;justify-content:center}
  .next-step .btn{align-self:center}
  .next-step.scheduled{background:#e4eef8;border-color:#cbe0f2;color:#255a8f}
  .next-step.picked_up{background:#efe9f7;border-color:#ddd0ee;color:#5c4384}
  .next-step.syracuse_terminal,.next-step.rochester_terminal{background:#eceafd;border-color:#d9d4fb;color:#4c3bb8}
  .next-step.in_transit{background:#dff0ec;border-color:#bcded6;color:#125c50}
  .next-k{font-size:.68rem;letter-spacing:.05em;margin-right:-.05em;margin-top:0;opacity:.9;font-weight:600;line-height:1.2}
  .next-v{font-size:.9rem;font-weight:600;margin-top:3px;line-height:1.3}
  .btn.sm.next-btn,.next-btn{border:none;color:#fff;white-space:nowrap;padding:8px 18px 10px;border-radius:8px;font-size:.85rem;font-weight:600}
  .next-btn.picked_up{background:#7a5aa8}
  .next-btn.syracuse_terminal,.next-btn.rochester_terminal{background:#6554d9}
  .next-btn.in_transit{background:#16796d}
  .next-btn.delivered{background:#1f5e4e}
  .stat-chip-k{font-size:.68rem;color:#57544f;letter-spacing:.05em;margin-right:-.05em;margin-top:-2px;font-weight:600;line-height:1.2;margin-bottom:8px}
  .stat-chips{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px}
  .stat-chip{border:1px solid var(--line);background:#fff;color:#57544f;border-radius:8px;padding:6px 13px 8px;font-size:.8rem;font-weight:600;cursor:pointer;font-family:inherit;transition:border-color .15s,color .15s}
  .stat-chip:hover:not(:disabled){border-color:var(--ink);color:var(--ink)}
  .stat-chip:disabled{cursor:default}
  .stat-chip.current.scheduled{border-color:#2f6fb0;background:#e4eef8;color:#255a8f}
  .stat-chip.current.picked_up{border-color:#7a5aa8;background:#efe9f7;color:#5c4384}
  .stat-chip.current.syracuse_terminal,.stat-chip.current.rochester_terminal{border-color:#6554d9;background:#eceafd;color:#4c3bb8}
  .stat-chip.current.in_transit{border-color:#16796d;background:#dff0ec;color:#125c50}
  .stat-chip.current.delivered{border-color:#1f5e4e;background:#e7efe9;color:#1f5e4e}
  .stat-chip.current.cancelled{border-color:#a3331f;background:#f6e3df;color:#8c2c1a}
  .tools-note{width:100%;box-sizing:border-box;margin-bottom:16px}
  .tools-split{display:flex;gap:20px;flex-wrap:wrap;padding-top:14px;border-top:1px solid #f0eee9}
  .tools-col{flex:1 1 160px;min-width:0}
  .tools-k{font-size:.68rem;color:#57544f;letter-spacing:.05em;margin-right:-.05em;margin-top:-2px;font-weight:600;line-height:1.2;margin-bottom:6px}
  .detail-tools{padding:0 20px 20px;border-top:1px solid #f0eee9;margin-top:0}
  .detail-tools>div:first-child{margin-top:0!important;border-top:none!important;padding-top:16px!important}
  @media (max-width:520px){.detail-meta{gap:14px}}
  .cust-contact .ck{display:inline-block;min-width:74px;color:var(--muted);font-size:.78rem}
  .ec-block{border:1px solid var(--line);border-radius:10px;padding:14px;background:#faf9f6}
  .ec-title{font-weight:600;font-size:.9rem}
  .ec-note{font-size:.78rem;color:var(--muted);margin:2px 0 10px}
  .details-view{display:grid;gap:8px;font-size:.92rem;margin-top:6px}
  .details-view .dk{display:inline-block;min-width:120px;color:var(--muted);font-size:.78rem}

  .pill{display:inline-flex;align-items:center;gap:6px;font-size:.76rem;font-weight:500;padding:4px 10px;border-radius:999px;white-space:nowrap}
  .pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
  /* list pills use the same per-status hues, as soft tints */
  .pill.waitlisted{color:#57544f;background:#f0efec}
  .pill.pending{color:#8a5008;background:#f8ecd9}
  .pill.scheduled{color:#255a8f;background:#e4eef8}
  .pill.picked_up{color:#5c4384;background:#efe9f7}
  .pill.syracuse_terminal,.pill.rochester_terminal{color:#4c3bb8;background:#eceafd}
  .pill.in_transit{color:#125c50;background:#dff0ec}
  .pill.delivered{color:#1f5e4e;background:#e7efe9}
  .pill.quote{color:#57544f;background:#f0efec}
  .pill.declined{color:#7a3129;background:#f7e6e3}
  .pill.cancelled{color:#8c2c1a;background:#f6e3df}

  .empty{text-align:center;padding:60px 20px;color:var(--muted)}
  .empty .big{font-size:1.2rem;color:var(--ink);margin-bottom:6px;font-weight:600}
  .welcome-banner{background:var(--accent-soft);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;margin-bottom:22px}
  .welcome-banner .wb-title{font-size:1.1rem;font-weight:700;color:var(--ink)}
  .welcome-banner .wb-sub{color:var(--muted);font-size:.9rem;margin:4px 0 12px}
  .welcome-banner .wb-steps{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}
  .welcome-banner .wb-step{font-size:.85rem;font-weight:600;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:6px 12px;color:var(--ink)}
  .welcome-banner .wb-step.done{background:var(--accent);color:#fff;border-color:var(--accent)}

  .back{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:.85rem;background:none;border:none;margin-bottom:16px}
  .back:hover{color:var(--ink)}
  .detail-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:22px;align-items:start}
  .kv{display:grid;grid-template-columns:130px 1fr;gap:8px 14px;font-size:.9rem}
  .kv dt{color:var(--muted)}.kv dd{font-weight:500}
  .section-title{font-size:1.05rem;font-weight:600;margin-bottom:14px}

  /* progress track: every step of the journey, done / current / upcoming */
  .progress-track{display:grid}
  .pt-row{display:grid;grid-template-columns:auto 1fr;gap:0 12px}
  .pt-rail{display:grid;justify-items:center;grid-template-rows:auto 1fr}
  .pt-dot{width:11px;height:11px;border-radius:50%;margin-top:4px;background:#fff;border:2px solid var(--line);box-sizing:border-box}
  .pt-line{width:2px;background:var(--line);min-height:22px;align-self:stretch}
  .pt-body{padding-bottom:16px;min-width:0}
  .pt-row:last-child .pt-body{padding-bottom:0}
  .pt-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  .pt-name{font-size:.9rem;font-weight:600;color:var(--ink);line-height:1.3}
  .pt-note{font-size:.84rem;color:#57544f;margin-top:3px;line-height:1.4}
  .pt-time{font-size:.75rem;color:#8a867e;margin-top:3px;line-height:1.3}
  /* done: filled in the accent, line continues solid */
  .pt-row.done .pt-dot{background:var(--accent);border-color:var(--accent)}
  .pt-row.done .pt-line{background:var(--accent)}
  /* current: status colour with a soft ring */
  .pt-row.current .pt-name{font-weight:700}
  .pt-row.current.pending .pt-dot{background:#b4690e;border-color:#b4690e;box-shadow:0 0 0 3px #f8ecd9}
  .pt-row.current.scheduled .pt-dot{background:#2f6fb0;border-color:#2f6fb0;box-shadow:0 0 0 3px #e4eef8}
  .pt-row.current.picked_up .pt-dot{background:#7a5aa8;border-color:#7a5aa8;box-shadow:0 0 0 3px #efe9f7}
  .pt-row.current.syracuse_terminal .pt-dot,.pt-row.current.rochester_terminal .pt-dot{background:#6554d9;border-color:#6554d9;box-shadow:0 0 0 3px #eceafd}
  .pt-row.current.in_transit .pt-dot{background:#16796d;border-color:#16796d;box-shadow:0 0 0 3px #dff0ec}
  .pt-row.current.delivered .pt-dot{background:#1f5e4e;border-color:#1f5e4e;box-shadow:0 0 0 3px #e7efe9}
  .pt-row.current.pending .pt-name{color:#8a5008}
  .pt-row.current.scheduled .pt-name{color:#255a8f}
  .pt-row.current.picked_up .pt-name{color:#5c4384}
  .pt-row.current.syracuse_terminal .pt-name,.pt-row.current.rochester_terminal .pt-name{color:#4c3bb8}
  .pt-row.current.in_transit .pt-name{color:#125c50}
  .pt-row.current.delivered .pt-name{color:#1f5e4e}
  /* not reached yet */
  .pt-row.todo .pt-name{color:#a8a49c;font-weight:500}
  .progress-track.is-cancelled .pt-row.todo .pt-name{text-decoration:line-through}
  /* events outside the main flow */
  .pt-extra-k{font-size:.66rem;color:#8a867e;letter-spacing:.05em;margin:14px 0 8px;font-weight:600}
  .pt-extra{display:flex;gap:11px;align-items:flex-start;padding-bottom:10px}
  .pt-extra-dot{width:7px;height:7px;border-radius:50%;background:var(--muted);margin-top:6px;flex:0 0 auto}
  .pt-extra-dot.quote{background:#6b6862}
  .pt-extra-dot.cancelled,.pt-extra-dot.declined{background:#a3331f}
  .pt-extra-name{font-size:.86rem;font-weight:600;line-height:1.3}
  .timeline{list-style:none;position:relative;padding-left:22px}
  .timeline::before{content:"";position:absolute;left:5px;top:4px;bottom:4px;width:2px;background:var(--line)}
  .timeline li{position:relative;padding-bottom:18px}
  .timeline li:last-child{padding-bottom:0}
  .timeline li::before{content:"";position:absolute;left:-22px;top:3px;width:12px;height:12px;border-radius:50%;background:var(--surface);border:2px solid var(--accent)}
  .timeline .t-status{font-weight:600;font-size:.9rem;text-transform:capitalize}
  .timeline .t-note{font-size:.85rem;color:var(--muted)}
  .timeline .t-time{font-size:.74rem;color:var(--muted)}

  .thread{display:grid;gap:10px;max-height:320px;overflow-y:auto;padding-right:4px;margin-bottom:14px}
  .msg{padding:10px 13px;border-radius:12px;font-size:.88rem;max-width:85%}
  .msg.them{background:#f0eee8;align-self:flex-start;border-bottom-left-radius:4px}
  .msg.me{background:var(--accent);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
  .msg .meta{font-size:.7rem;opacity:.7;margin-bottom:2px}
  .composer{display:flex;gap:8px}
  .composer textarea{flex:1;resize:none;border:1px solid var(--line);border-radius:10px;padding:10px;min-height:44px}

  .inv{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);font-size:.9rem}
  .inv:last-child{border-bottom:none}

  .staff-tools{display:grid;gap:12px}
  .field-inline{display:flex;gap:8px;align-items:center}
  .field-inline select,.field-inline input{flex:1;min-width:0}
  /* inputs outside .field were falling back to browser defaults - give them the same treatment */
  .field-inline input,.field-inline select,.field-inline textarea,.tools-note,input.inv-edit{
    width:100%;min-width:0;border:1px solid var(--line);border-radius:10px;padding:10px 13px;
    background:#fff;color:var(--ink);outline:none;font-family:inherit;font-size:.9rem;
    transition:border-color .15s,box-shadow .15s}
  .field-inline input:focus,.field-inline select:focus,.field-inline textarea:focus,.tools-note:focus,input.inv-edit:focus{
    border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
  .field-inline input::placeholder,.tools-note::placeholder{color:#a8a49c}
  .field-inline input[type=number]{-moz-appearance:textfield}
  .field-inline input[type=number]::-webkit-outer-spin-button,
  .field-inline input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
  .field-inline .btn{flex:0 0 auto}
  .vehicle-note{color:var(--muted);font-size:.72rem;line-height:1.3;margin-top:-2px}
  .accept-row{display:flex;gap:8px;margin-top:6px}

  /* profile */
  .prof-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
  /* profile lists: same row rules as the bookings/customers lists */
  .list-item{display:flex;justify-content:space-between;align-items:center;gap:12px;
             padding:12px 18px;margin:0 -18px;border-bottom:1px solid #f0eee9;
             border-left:3px solid transparent;transition:background .12s,border-color .12s}
  .list-item:last-of-type{border-bottom:none}
  .list-item:hover{background:#faf9f6;border-left-color:var(--accent)}
  .list-item:last-of-type{border-bottom:none}
  .list-item .li-main{font-weight:700;font-size:.95rem;line-height:1.25}
  .list-item .li-sub{color:#57544f;font-size:.8rem;margin-top:2px;line-height:1.35}
  /* remove as a quiet x rather than a full button */
  /* the remove x is a .btn.sm.ghost in the danger colour - same frame, same
     height, just square and with an icon instead of a word */
  .row-x{border:1px solid var(--bad);background:transparent;color:var(--bad);
         border-radius:10px;font-family:inherit;font-size:.82rem;font-weight:500;
         cursor:pointer;flex:0 0 auto;line-height:normal;
         padding:6px 0;width:32px;text-align:center;
         transition:background .15s}
  .row-x:hover{background:var(--bad-soft)}
  .row-x:focus-visible{outline:2px solid var(--bad);outline-offset:1px}
  /* actions stay quiet until you're on the row */
  .list-item .accept-row{flex:0 0 auto;opacity:.55;transition:opacity .12s}
  .list-item:hover .accept-row,.list-item:focus-within .accept-row{opacity:1}
  .prof-grid .card{padding:18px 20px}
  .prof-grid .section-title{margin-bottom:6px}
  .prof-grid .add-form{border-top:1px solid #f0eee9;margin-top:14px;padding-top:14px}
  .prof-grid .btn.sm.ghost[id^="add"],.prof-grid .add-btn{margin-top:14px}
  .add-form{display:grid;gap:10px;margin-top:16px;border-top:1px solid var(--line);padding-top:16px}

  /* calendar */
  .cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
  .cal-head .mon{font-size:1.1rem;font-weight:600}
  .cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
  .cal-dow{text-align:center;font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:4px 0}
  .cal-day{border:1px solid var(--line);border-radius:10px;min-height:64px;padding:6px;display:flex;flex-direction:column;gap:4px;background:#fff;cursor:pointer;transition:border-color .12s,background .12s}
  .cal-day .dnum{font-size:.82rem;font-weight:600;color:var(--ink)}
  .cal-day.muted{opacity:.35;cursor:default}
  .cal-day.closed{background:#faf8f4;cursor:default}
  #scalMount .cal-day.closed{cursor:pointer}
  #scalMount .cal-day.closed:hover{border-color:var(--accent)}
  .cal-day.closed .dnum{color:var(--muted)}
  .cal-day.has-open:hover{border-color:var(--accent);background:var(--accent-soft)}
  .cal-day.waitlistable{background:#fbf6ee;cursor:pointer}
  .cal-day.waitlistable:hover{border-color:var(--warn)}
  .cal-day.waitlistable .none{color:var(--warn)}
  .cal-day.overbooked{border-color:var(--bad)}
  .cal-count.over{background:var(--bad)}
  .cap-panel{margin-bottom:4px}
  .cap-warn{background:var(--bad-soft);color:var(--bad);font-size:.84rem;border-radius:8px;padding:8px 10px;margin-bottom:12px}
  .cap-row{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap}
  .cap-actions{display:flex;gap:10px;align-items:center;margin-top:14px;flex-wrap:wrap}
  .cap-note{font-size:.78rem;color:var(--muted);margin-top:10px}
  .cal-day.selected{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 2px var(--accent-soft)}
  .cal-day.window-hover{border-color:var(--accent);background:var(--accent-soft)}
  .cal-day.window-selected{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 0 0 2px var(--accent)}
  .cal-day .dots{display:flex;gap:3px;margin-top:auto}
  .cal-day .dot{width:6px;height:6px;border-radius:50%;background:var(--accent)}
  .cal-day .dot.off{background:var(--line)}
  .cal-day .none{font-size:.66rem;color:var(--muted)}
  .cal-booked{font-size:.66rem;font-weight:600;color:#fff;background:var(--accent);border-radius:6px;padding:2px 6px;align-self:flex-start}
  .direction-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .direction-btn{border:1px solid var(--line);background:#fff;border-radius:10px;padding:12px 14px;text-align:left;font-weight:600;color:var(--ink)}
  .direction-btn span{display:block;color:var(--muted);font-size:.78rem;font-weight:500;margin-top:2px}
  .direction-btn.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
  .planner-dir-btn{color:var(--ink);border-color:var(--line);text-align:center;background:#fff}
  .planner-dir-btn span{display:none}
  .planner-dir-btn.north.active{background:#5b2a72;color:#fff;border-color:#5b2a72;box-shadow:0 0 0 3px #f3ecf8}
  .planner-dir-btn.south.active{background:#14567c;color:#fff;border-color:#14567c;box-shadow:0 0 0 3px #eaf3fa}
  .calendar-locked{opacity:.48;pointer-events:none;filter:grayscale(.25)}
  .calendar-prompt{margin-top:12px;color:var(--warn);background:var(--warn-soft);border-radius:10px;padding:10px 12px;font-size:.86rem}
  .window-summary{margin-top:14px;border:1px solid var(--accent-soft);background:var(--accent-soft);border-radius:10px;padding:12px 14px;font-size:.9rem}
  .pay-choice{display:flex;gap:10px;margin-top:6px;width:100%}
  .pay-opt{flex:1;padding:20px 8px;border:1px solid var(--line);border-radius:12px;background:var(--surface);font:600 .9rem inherit;color:var(--ink);cursor:pointer;transition:all .12s}
  .pay-opt:hover{border-color:var(--accent)}
  .pay-opt.on{border-color:var(--accent);border-width:2px;padding:19px 7px;font-weight:700}
  .window-summary b{color:var(--accent)}
  .capacity-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
  .capacity-stat{border:1px solid var(--line);border-radius:10px;background:#fff;padding:12px}
  .capacity-stat .num{font-size:1.35rem;font-weight:700;line-height:1;color:var(--ink)}
  .capacity-stat .lbl{font-size:.74rem;color:var(--muted);margin-top:5px}
  .booking-mini{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:.88rem;cursor:pointer}
  .booking-mini:hover{background:#faf9f6}
  .booking-mini:first-of-type{border-top:none}
  .staff-window-day{border-top:1px solid var(--line);padding-top:12px;margin-top:12px}
  .slot-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
  .slot-btn{border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 16px;font-weight:500;font-size:.9rem}
  .slot-btn:disabled{opacity:.4;cursor:not-allowed;text-decoration:line-through}
  .slot-btn.active{border-color:var(--accent);background:var(--accent);color:#fff}
  .blockbtn{font-size:.7rem;border:none;background:none;color:var(--bad);cursor:pointer;padding:2px 4px}
  .legend{display:flex;gap:16px;font-size:.76rem;color:var(--muted);margin-top:12px;flex-wrap:wrap}
  .legend span{display:inline-flex;align-items:center;gap:5px}
  .legend i{width:9px;height:9px;border-radius:50%;display:inline-block}

  /* planner */
  .planner-wrap{max-width:1280px}
  .planner-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
  .planner-week{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  /* week nav sits beside the Planner heading, so keep it off the text baseline */
  .page-head .planner-week{align-self:center}
  .planner-week .mon{font-weight:700;font-size:1rem;min-width:210px;text-align:center}
  .planner-board{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;align-items:start}
  .planner-lane{background:var(--surface);border:1px solid var(--line);border-radius:12px;min-height:260px;height:fit-content;align-self:flex-start;box-shadow:var(--shadow);overflow:hidden}
  .planner-lane.over{border-color:var(--bad);box-shadow:0 0 0 2px var(--bad-soft)}
  .planner-lane.drag-over{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
  .planner-lane.load-dragging{opacity:1}
  .planner-lane.load-drop-before{box-shadow:-5px 0 0 var(--accent),var(--shadow)}
  .planner-lane.load-drop-after{box-shadow:5px 0 0 var(--accent),var(--shadow)}
  .planner-lane-head{background:#efe7f6;color:#4a2560;padding:11px 12px;display:flex;align-items:flex-start;justify-content:space-between;gap:8px;border-bottom:1px solid #e0d3ec}
  .planner-lane-head[draggable="true"]{cursor:grab}
  .planner-lane-head[draggable="true"]:active{cursor:grabbing}
  .planner-lane.northbound .planner-lane-head{background:#efe7f6;color:#4a2560;border-bottom-color:#e0d3ec}
  .planner-lane.southbound .planner-lane-head{background:#e4f1fa;color:#124a6c;border-bottom-color:#cbe3f2}
  .planner-lane.unassigned .planner-lane-head{background:#f0efec;color:#4a4843;border-bottom-color:#e3e0d8}
  .planner-lane.unassigned{border-style:dashed;border-color:#cfcbc2;background:#fcfbf9}
  .planner-lane.unassigned .planner-drop{background:#f7f6f2}
  .planner-board .planner-lane.unassigned{margin-right:10px;box-shadow:none}
  .planner-lane-title{font-size:.86rem;font-weight:600;line-height:1.2}
  .planner-lane-meta{font-size:.72rem;font-weight:500;opacity:.72;margin-top:2px}
  .planner-head-actions{display:flex;align-items:center;gap:6px}
  .planner-edit,.planner-remove{border:1px solid rgba(28,27,24,.15);background:rgba(255,255,255,.55);color:inherit;border-radius:6px;width:26px;height:26px;line-height:1;font-size:.82rem}
  .planner-count{font-size:.72rem;font-weight:600;background:rgba(255,255,255,.6);border-radius:999px;padding:2px 8px;white-space:nowrap}
  .planner-drop{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(9,56px);grid-auto-rows:56px;gap:6px;height:568px;min-height:0;padding:8px;background:var(--tint);box-sizing:border-box;overflow:hidden}
  .planner-card{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:8px;padding:6px 10px;min-height:56px;cursor:grab;box-shadow:0 1px 0 rgba(28,27,24,.03);overflow:hidden;display:grid;align-content:center}
  .planner-card.drop-insert-before{box-shadow:inset 0 4px 0 var(--accent),0 0 0 2px var(--accent-soft)}
  .planner-card.drop-insert-after{box-shadow:inset 0 -4px 0 var(--accent),0 0 0 2px var(--accent-soft)}
  .planner-drop>.planner-card,.planner-drop>.planner-empty-slot,.planner-drop>.planner-blocked-slot,.planner-drop>.planner-drag-placeholder,.planner-drop>.planner-group-drop-preview,.same-drop-outline{grid-column:1}
  .same-drop-outline{border:2px dashed rgba(28,27,24,.78);border-radius:10px;pointer-events:none;z-index:2;box-shadow:0 0 0 2px rgba(255,255,255,.82)}
  .planner-group-drop-preview{border:3px solid rgba(27,94,68,.86);border-radius:10px;pointer-events:none;z-index:4;box-shadow:0 0 0 2px rgba(255,255,255,.9),0 8px 18px rgba(27,94,68,.12);background:rgba(27,94,68,.08)}
  .planner-group-drop-preview.drop-blocked{border-color:rgba(181,52,43,.9);background:rgba(181,52,43,.10);box-shadow:0 0 0 2px rgba(255,255,255,.9),0 8px 18px rgba(181,52,43,.12)}
  .planner-card:active{cursor:grabbing}
  body.planner-is-dragging,body.planner-is-dragging *{user-select:none!important;-webkit-user-select:none!important;cursor:grabbing!important}
  .planner-card.dragging{opacity:1!important;box-shadow:0 6px 16px rgba(28,27,24,.16)}
  .planner-card.dragging-live{position:fixed;z-index:10000;pointer-events:none;opacity:1!important;cursor:grabbing;box-shadow:0 14px 30px rgba(28,27,24,.24);transform:rotate(.4deg)}
  .planner-drag-placeholder{border:2px dashed rgba(28,27,24,.72);background:rgba(255,255,255,.72);border-radius:8px;min-height:56px}
  .planner-drag-ghost{position:fixed;top:-1000px;left:-1000px;z-index:9999;pointer-events:none;opacity:1!important;box-shadow:0 12px 28px rgba(28,27,24,.22);background:#fff}
  .planner-card.tag-none{background:#fff;border-color:var(--line);color:var(--ink)}
  .planner-card.pending{background:#fbf0dc;border-color:#eeddba;color:#7a5310}
  .planner-card.picked_up,.planner-card.in_transit{background:#dff0ec;border-color:#bcded6;color:#125c50}
  .planner-card.tag-booked{background:#35b779;border-color:#2ea66d;color:#fff}
  .planner-card.tag-assigned{background:#d9efea;border-color:#b2ddd2;color:#125c50}
  .planner-card.tag-confirmed{background:#0f8b45;border-color:#0b7a3b;color:#fff}
  .planner-card.tag-in_transit{background:#159bd3;border-color:#108ac0;color:#fff}
  .planner-card.tag-issue{background:#ffc52c;border-color:#e7aa10;color:#3f3104}
  .planner-card.tag-cancelled{background:#e97770;border-color:#d7655f;color:#fff}
  .planner-card.tag-texted{background:#35b779;border-color:#2ea66d;color:#fff}
  .planner-card.tag-note{background:#f0efec;border-color:#ddd9d2;color:#4a4843}
  .planner-card.status-syracuse_terminal,.planner-card.status-rochester_terminal{background:#159bd3;border-color:#108ac0;color:#fff}
  .planner-card.status-in_transit{background:#159bd3;border-color:#108ac0;color:#fff}
  .planner-card.status-delivered{background:#0f8b45;border-color:#0b7a3b;color:#fff}
  .planner-card.status-cancelled{background:#e97770;border-color:#d7655f;color:#fff}
  .planner-card .pc-main{font-size:.77rem;font-weight:600;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .planner-card .pc-sub{font-size:.7rem;font-weight:400;line-height:1.15;margin-top:3px;opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .planner-card .pc-veh{height:56px;min-height:56px;display:grid;align-content:center;border-top:1px solid rgba(28,27,24,.10)}
  .planner-card .pc-veh:first-child{border-top:none}
  .planner-card .pc-top{display:flex;align-items:center;gap:7px;min-width:0}
  .planner-card .pc-route{font-size:.78rem;font-weight:800;line-height:1.2;flex:0 0 auto;white-space:nowrap}
  .planner-card .pc-vehicle{font-size:.8rem;font-weight:700;line-height:1.2;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .planner-card .pc-veh-sub{font-size:.71rem;font-weight:400;line-height:1.25;margin-top:3px;opacity:.7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .planner-card .pc-veh-sub.has-status-bubble{display:flex;align-items:center;gap:4px;opacity:1;min-width:0}
  .planner-card .pc-veh-sub-base{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.7}
  .pc-status-tag{display:inline-flex;align-items:center;flex:0 0 auto;width:max-content;max-width:52%;border-radius:4px;padding:2px 5px;background:#6554d9;color:#fff;font-size:.68rem;font-weight:800;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .planner-card .pc-foot{display:none}
  .planner-card .pc-tag{flex:0 0 auto;border:1px solid rgba(28,27,24,.15);background:rgba(255,255,255,.6);color:inherit;border-radius:5px;width:22px;height:20px;line-height:1;font-size:.7rem;cursor:pointer;font-family:inherit;opacity:.55;transition:opacity .12s}
  .planner-card:hover .pc-tag{opacity:1}
  .planner-empty-slot{height:56px;min-height:56px;border:1px dashed #d5d1c7;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 10px;color:var(--muted);font-size:.72rem;font-weight:500}
  .planner-empty-slot.drop-target{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 0 0 2px var(--accent)}
  .planner-empty-slot.drop-blocked{border-color:var(--bad);background:var(--bad-soft);box-shadow:inset 0 0 0 2px var(--bad)}
  .planner-empty-slot span:last-child{font-weight:600;opacity:.72}
  .planner-blocked-slot{height:56px;min-height:56px;border:1px solid #c9c9c9;border-radius:8px;background:repeating-linear-gradient(135deg,#f1f1f1 0,#f1f1f1 9px,#e1e1e1 9px,#e1e1e1 18px);display:flex;align-items:center;justify-content:space-between;padding:0 10px;color:#555;font-size:.72rem;font-weight:600}
  .planner-blocked-slot.reserved{border-color:#cbdcf5;background:#edf5ff;color:#1e4f7a}
  .planner-blocked-slot.drop-blocked{border-color:var(--bad);box-shadow:inset 0 0 0 2px var(--bad)}
  .planner-slot-action{border:1px solid #d9d2c7;background:#fff;color:var(--muted);border-radius:6px;min-height:24px;max-width:62%;padding:0 8px;font:700 .68rem/1.1 inherit;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .planner-blocked-slot .planner-slot-action{border-color:#c7c7c7;color:#555}
  .planner-blocked-slot.reserved .planner-slot-action{border-color:#bfd5ef;color:#1e4f7a;background:#fff}
  .planner-slot-action:hover{border-color:var(--accent);color:var(--accent)}
  .planner-spot-menu{position:absolute;right:8px;top:42px;z-index:15;width:210px;padding:7px;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 12px 28px rgba(28,27,24,.18);display:grid;gap:5px}
  .planner-spot-menu.open-up{top:auto;bottom:42px}
  .planner-empty-slot,.planner-blocked-slot{position:relative}
  .planner-spot-menu button{border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);height:28px;padding:0 8px;text-align:left;font:700 .72rem/1 inherit;cursor:pointer}
  .planner-spot-menu button:hover,.planner-spot-menu button.active{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
  .planner-spot-menu .blocked-choice{color:#555}
  .planner-spot-menu input{height:30px;border:1px solid var(--line);border-radius:6px;padding:0 8px;font:600 .72rem/1 inherit}
  .planner-add{display:flex;gap:8px;align-items:center}
  .planner-add input{border:1px solid var(--line);border-radius:10px;padding:9px 11px;min-width:190px}
  .planner-hint{font-size:.78rem;color:var(--muted);margin-top:10px}

  .badge-count{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--bad);color:#fff;font-size:.68rem;font-weight:600;margin-left:6px}
  /* an update the customer hasn't seen yet - green, not red: it's news, not an error */
  .pt-row.is-new .pt-name{font-weight:700}
  .pt-new{background:var(--accent-soft);color:var(--accent);border-radius:999px;
          display:inline-flex;align-items:center;justify-content:center;
          height:18px;padding:0 8px;font-size:.66rem;font-weight:600;line-height:1;
          margin-left:8px;vertical-align:middle;white-space:nowrap}

  .toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:12px 20px;border-radius:10px;font-size:.88rem;opacity:0;pointer-events:none;transition:all .25s;z-index:50;max-width:90vw;text-align:center}
  .toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
  .cal-count{position:absolute;top:5px;right:6px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--accent);color:#fff;font-size:.64rem;font-weight:700;line-height:16px;text-align:center}
  .cal-day{position:relative}
  .modal-backdrop{position:fixed;inset:0;background:rgba(15,20,30,.42);display:flex;align-items:center;justify-content:center;z-index:60;padding:20px;opacity:0;transition:opacity .15s}
  .modal-backdrop.show{opacity:1}
  .modal{background:var(--surface);border-radius:14px;max-width:440px;width:100%;box-shadow:0 18px 50px rgba(0,0,0,.28);max-height:85vh;overflow:auto}
  .modal-wide{max-width:780px}
  .modal-head{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line)}
  .modal-head h3{margin:0;font-size:1.05rem}
  .modal-x{border:none;background:none;font-size:1.3rem;cursor:pointer;color:var(--muted);line-height:1}
  .modal-body{padding:18px 20px}
  .modal-foot{padding:14px 20px;border-top:1px solid var(--line);display:flex;gap:10px;justify-content:flex-end}
  .modal-order{border:1px solid var(--line);border-radius:10px;padding:12px;margin-bottom:10px}
  .modal-order:last-child{margin-bottom:0}
  .modal-order .mo-ref{font-weight:700;display:flex;justify-content:space-between;align-items:center;gap:8px}
  .modal-order .mo-sub{font-size:.84rem;color:var(--muted);margin-top:2px}
  .hidden{display:none!important}
  @media (max-width:760px){.detail-grid,.prof-grid{grid-template-columns:1fr}.veh-cell{display:none}.cal-day{min-height:54px}}

  /* filter dropdowns (bookings + customers toolbars) */
  .cust-search select{appearance:none;-webkit-appearance:none;border:1px solid var(--line);border-radius:10px;padding:11px 34px 11px 13px;background:#fff url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b6862' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;color:var(--ink);font-weight:500;outline:none;cursor:pointer;transition:border-color .15s,box-shadow .15s}
  .cust-search select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
  .cust-search select:hover{border-color:var(--accent)}

  /* keep search + filters on one aligned row */
  .cust-search .searchbar{flex:1 1 auto;min-width:0;margin-bottom:0}
  .cust-search select{align-self:stretch}

  /* custom filter dropdown */
  .fdrop{position:relative}
  .fdrop-btn{appearance:none;border:1px solid var(--line);border-radius:10px;padding:11px 34px 11px 13px;background:#fff url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b6862' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;color:var(--ink);font:500 .9rem inherit;outline:none;cursor:pointer;white-space:nowrap;transition:border-color .15s,box-shadow .15s}
  .fdrop-btn:hover{border-color:var(--accent)}
  .fdrop-btn:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
  .fdrop-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:100%;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 28px rgba(28,27,24,.12);padding:6px;z-index:60;max-height:300px;overflow:auto}
  .fdrop-item{padding:9px 12px;border-radius:8px;font-size:.9rem;color:var(--ink);cursor:pointer;white-space:nowrap}
  .fdrop-item:hover{background:var(--accent-soft)}
  .fdrop-item.sel{color:var(--accent);font-weight:600}

  /* trailer-fit advisory on a planner lane */

  /* size-covered planner spot — large vehicle needs the room; dispatcher can Accept */
  .lane-size-warn{margin-top:4px;display:inline-block;color:#a4262c;font:600 .7rem inherit;line-height:1.3;cursor:default}

  .planner-empty-slot.size-ok{border-color:#cbe3d5;background:#f2f9f5}
  .planner-empty-slot.size-ok .planner-slot-action{border-color:#bcd9c8;color:#2f7a57}
  .planner-empty-slot.size-ok .planner-slot-action:hover{background:#2f7a57;color:#fff}

  .fsel{position:relative;width:100%}
  .fsel .fdrop-btn{width:100%;text-align:left;font-weight:400}
  .fsel .fdrop-menu{left:0;right:auto;width:100%}

  /* size-covered planner spot — note on top, then the dispatcher's choice */
  .planner-size-slot{min-height:56px;border:1px solid var(--bad,#a3331f);border-radius:8px;background:repeating-linear-gradient(135deg,#fdecea 0,#fdecea 9px,#f7d4d0 9px,#f7d4d0 18px);display:flex;flex-direction:column;justify-content:center;gap:5px;padding:8px 10px}
  .size-slot-note{font:700 .68rem inherit;color:#a4262c;letter-spacing:.01em;line-height:1.2}
  .size-slot-actions{display:flex;gap:6px}
  .planner-size-slot .planner-slot-action{flex:1;border:1px solid var(--bad,#a3331f);color:#a4262c;background:#fff;border-radius:6px;font:600 .68rem inherit;padding:4px 6px;cursor:pointer}
  .planner-size-slot .planner-slot-action.size-accept:hover{background:#2f7a57;border-color:#2f7a57;color:#fff}
  .planner-size-slot .planner-slot-action.size-keep.on{background:var(--bad,#a3331f);border-color:var(--bad,#a3331f);color:#fff}

  /* booking pickup / drop-off two-column block */
  .pickup-dropoff{gap:16px;align-items:start}
  .pd-col{display:grid;gap:12px;padding:14px;border:1px solid var(--line);border-radius:12px;background:#fbfaf7}
  .pd-head{font:700 .82rem var(--font);color:var(--accent);text-transform:uppercase;letter-spacing:.04em}
  @media(max-width:640px){.pickup-dropoff{grid-template-columns:1fr}}

  .btn.xs{font-size:.72rem;padding:5px 10px;height:auto}
  .home-btn{margin-top:7px;align-self:start}

  /* SuperDispatch send states */
  .sd-sent{display:inline-flex;align-items:center;gap:7px;font:600 .82rem var(--font);color:#2f7a57;background:#f2f9f5;border:1px solid #cbe3d5;border-radius:8px;padding:8px 13px}
  .sd-err{display:inline-flex;align-items:center;gap:7px;font:600 .82rem var(--font);color:#a4262c;background:var(--bad-soft);border:1px solid #f2b8b5;border-radius:8px;padding:8px 13px}
  .sd-error-details{margin-top:10px;border:1px solid var(--line);border-radius:8px;background:#fbfaf7}
  .sd-error-details summary{cursor:pointer;padding:9px 12px;font-size:.82rem;font-weight:700;color:var(--ink)}
  .sd-error-details pre{margin:0;padding:0 12px 12px;max-height:220px;overflow:auto;white-space:pre-wrap;font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#4d4840}
