*{margin:0;padding:0;box-sizing:border-box}
:root{--p:#7C3AED;--pl:#EDE9FE;--pd:#5B21B6;--g:#10B981;--gl:#D1FAE5;--gd:#065F46;--a:#F59E0B;--al:#FEF3C7;--ad:#92400E;--r:#EF4444;--rl:#FEE2E2;--rd:#991B1B;--b:#3B82F6;--bl:#DBEAFE;--bd:#1E40AF;--o:#F97316;--ol:#FEF0E1;--od:#9A3412;--tl:#E1F5EE;--td:#085041;--bg:#F9FAFB;--w:#FFF;--g50:#F9FAFB;--g100:#F3F4F6;--g200:#E5E7EB;--g300:#D1D5DB;--g400:#9CA3AF;--g500:#6B7280;--g600:#4B5563;--g700:#374151;--g800:#1F2937;--g900:#111827}
html,body{height:100%}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--g800);height:100vh;overflow:hidden;display:flex;flex-direction:column}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit}
.api-bar{background:var(--g800);color:var(--g300);padding:8px 20px;font-size:12px;display:flex;align-items:center;gap:12px;flex-shrink:0}
.api-bar input{background:var(--g700);border:1px solid var(--g600);color:#fff;padding:4px 10px;border-radius:6px;font-size:12px;width:300px;font-family:monospace}
.api-bar .dot{width:8px;height:8px;border-radius:4px;background:var(--r)}
.api-bar .dot.on{background:var(--g)}
.login-overlay{position:fixed;inset:0;background:var(--bg);display:flex;align-items:center;justify-content:center;z-index:100}
.login-card{background:var(--w);border-radius:16px;padding:40px;width:380px;border:1px solid var(--g200);text-align:center}
.login-card h1{font-size:24px;margin-bottom:4px}
.login-card p{font-size:13px;color:var(--g500);margin-bottom:24px}
.login-card .field{text-align:left;margin-bottom:14px}
.login-card label{display:block;font-size:12px;font-weight:600;color:var(--g600);margin-bottom:4px}
.login-card input{width:100%;padding:10px 14px;border-radius:10px;border:1px solid var(--g300);font-size:14px;outline:none}
.login-card input:focus{border-color:var(--p)}
.login-card .error{background:var(--rl);color:var(--rd);padding:8px 12px;border-radius:8px;font-size:13px;margin-bottom:14px}
.layout{display:flex;flex:1;min-height:0;overflow:hidden}
.sidebar{width:200px;background:var(--w);border-right:1px solid var(--g200);padding:16px 0;flex-shrink:0;display:flex;flex-direction:column}
.sidebar .logo{padding:0 16px 16px;font-size:17px;font-weight:700;color:var(--p);display:flex;align-items:center;gap:8px}
.sidebar .logo svg{width:20px;height:20px}
.sidebar nav{flex:1}
.sidebar nav a{display:flex;align-items:center;gap:8px;padding:9px 16px;font-size:13px;font-weight:500;color:var(--g500);text-decoration:none;border-left:3px solid transparent;transition:all .15s}
.sidebar nav a:hover{background:var(--g50);color:var(--g700)}
.sidebar nav a.on{background:var(--pl);color:var(--p);border-left-color:var(--p);font-weight:600}
.sidebar nav a svg{width:16px;height:16px;flex-shrink:0}
.sidebar .user-info{padding:12px 16px;border-top:1px solid var(--g200);font-size:11px;color:var(--g500)}
.sidebar .user-info .name{font-weight:600;color:var(--g800);font-size:12px}
.main{flex:1;padding:20px 28px;overflow-y:auto;max-height:100vh;min-height:0}
.page-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:10px}
.page-hdr h2{font-size:20px;font-weight:700}
.page-hdr p{font-size:12px;color:var(--g500);margin-top:2px}
.btn{padding:8px 16px;border-radius:8px;font-size:12px;font-weight:600;border:none;display:inline-flex;align-items:center;gap:5px;transition:all .15s}
.btn-p{background:var(--p);color:#fff}
.btn-p:hover{opacity:.9}
.btn-s{background:transparent;color:var(--g600);border:1px solid var(--g300)}
.btn-s:hover{border-color:var(--p);color:var(--p)}
.btn-d{background:transparent;color:var(--r);border:1px solid #FCA5A5}
.btn-g{background:var(--g);color:#fff}
.btn-sm{padding:6px 10px;font-size:11px}
.stats{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.stat{flex:1;min-width:100px;background:var(--w);border-radius:12px;padding:14px 16px;border:1px solid var(--g200)}
.stat .label{font-size:10px;color:var(--g500);font-weight:600;text-transform:uppercase;letter-spacing:.8px}
.stat .val{font-size:22px;font-weight:700;margin-top:2px}
.card{background:var(--w);border-radius:12px;border:1px solid var(--g200);padding:16px;margin-bottom:12px}
.card h3{font-size:14px;font-weight:600;margin-bottom:12px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form-grid.cols3{grid-template-columns:1fr 1fr 1fr}
.form-grid .full{grid-column:1/-1}
.field label{display:block;font-size:11px;font-weight:600;color:var(--g600);margin-bottom:3px}
.field input,.field select,.field textarea{width:100%;padding:8px 12px;border-radius:8px;border:1px solid var(--g300);font-size:13px;outline:none;background:var(--w)}
.field input:focus,.field select:focus{border-color:var(--p)}
.form-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:16px;font-size:10px;font-weight:600}
.badge .dot{width:5px;height:5px;border-radius:3px}
.filters{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap;align-items:center}
.filters .search{flex:1;min-width:180px;position:relative}
.filters .search input{width:100%;padding:8px 12px 8px 32px;border-radius:8px;border:1px solid var(--g300);font-size:13px;outline:none}
.filters .search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%)}
.filter-tabs{display:flex;gap:2px;background:var(--w);border-radius:8px;padding:2px;border:1px solid var(--g200)}
.filter-tabs button{padding:5px 10px;border-radius:6px;border:none;font-size:11px;font-weight:600;background:transparent;color:var(--g500)}
.filter-tabs button.on{background:var(--p);color:#fff}
.order-list{display:flex;flex-direction:column;gap:6px}
.order-card{background:var(--w);border-radius:12px;border:1px solid var(--g200);overflow:hidden;transition:box-shadow .15s;cursor:pointer}
.order-card:hover{box-shadow:0 2px 8px rgba(0,0,0,.05)}
.order-row{display:flex;align-items:center;padding:12px 14px;gap:10px;flex-wrap:wrap}
.order-row .code{font-size:12px;font-weight:700;color:var(--p);font-family:monospace;min-width:65px}
.type-badge{font-size:9px;font-weight:600;padding:2px 6px;border-radius:4px}
.type-coleta{background:var(--tl);color:var(--td)}
.type-entrega{background:var(--pl);color:var(--pd)}
.order-row .info{flex:1;min-width:120px}
.order-row .info .name{font-size:13px;font-weight:600}
.order-row .info .addr{font-size:11px;color:var(--g500);margin-top:1px}
.order-row .money{min-width:70px;text-align:right}
.order-row .money .val{font-size:13px;font-weight:600}
.order-row .money .vol{font-size:10px;color:var(--g500)}
.order-row .date{font-size:10px;color:var(--g500);min-width:60px;text-align:right}
.order-detail{padding:0 14px 14px;border-top:1px solid var(--g200);padding-top:12px}
.detail-grid{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:10px;font-size:12px;margin-bottom:12px}
.detail-grid .lbl{font-size:10px;font-weight:600;color:var(--g400);text-transform:uppercase;letter-spacing:.4px}
.detail-grid .val{margin-top:1px}
.detail-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
table{width:100%;border-collapse:collapse;font-size:11px}
table th{padding:6px 8px;text-align:left;font-weight:600;color:var(--g600);border-bottom:1px solid var(--g200);background:var(--g50)}
table td{padding:6px 8px;border-bottom:1px solid var(--g100)}
.toast{position:fixed;top:16px;right:16px;background:var(--g800);color:#fff;padding:10px 20px;border-radius:10px;font-size:13px;font-weight:500;z-index:200;transform:translateY(-80px);opacity:0;transition:all .3s}
.toast.show{transform:translateY(0);opacity:1}
.toast.error{background:var(--r)}
.loading{text-align:center;padding:40px;color:var(--g400)}
.loading .spinner{width:20px;height:20px;border:3px solid var(--g200);border-top-color:var(--p);border-radius:50%;animation:spin .6s linear infinite;margin:0 auto 6px}
@keyframes spin{to{transform:rotate(360deg)}}
.empty{text-align:center;padding:40px;color:var(--g400);font-size:13px}
.hidden{display:none!important}
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:50;display:flex;align-items:center;justify-content:center}
.modal{background:var(--w);border-radius:16px;padding:24px;width:420px;max-width:90vw}
.modal h3{font-size:16px;font-weight:600;margin-bottom:16px}
.driver-card{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--g100)}
.driver-card:last-child{border-bottom:none}
.driver-avatar{width:42px;height:42px;border-radius:21px;background:var(--pl);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--p);font-size:14px;flex-shrink:0}
.driver-info{flex:1}
.driver-info .dname{font-weight:600;font-size:14px}
.driver-info .dmeta{font-size:11px;color:var(--g500);margin-top:1px}
.gps-dot{width:10px;height:10px;border-radius:5px;background:var(--g400)}
.gps-dot.live{background:var(--g);animation:pulse 2s infinite}
.gps-dot.off{background:var(--a)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}

/* Quadro da alocação automática: uma coluna por slot, mais a fila */
.qd-board{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;align-items:flex-start}
.qd-col{flex:0 0 240px;background:var(--g50);border:1px solid var(--g200);border-radius:10px;display:flex;flex-direction:column;transition:border-color .15s,background .15s}
.qd-col.qd-sobre{border-color:var(--p);background:var(--pl)}
.qd-col.qd-fora{opacity:.65}
.qd-hdr{padding:8px 10px;border-bottom:1px solid var(--g200);font-size:12px}
.qd-body{padding:6px;display:flex;flex-direction:column;gap:6px;min-height:70px;max-height:420px;overflow-y:auto}
.qd-card{background:var(--w);border:1px solid var(--g200);border-radius:8px;padding:6px 8px;cursor:grab;font-size:12px;user-select:none}
.qd-card:active{cursor:grabbing}
.qd-card.qd-sel{border-color:var(--p);box-shadow:0 0 0 2px var(--pl)}
.qd-end{font-size:10px;color:var(--g500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qd-vazio{font-size:11px;color:var(--g400);text-align:center;padding:14px 6px}