:root{--app-bg:#eef2f7;--ink:#131f36;--muted:#6a768b;--surface:#fbfdff;--line:#d3dce9;--side:#131f36;--side-ink:#fff;--side-active:#61d5ff18;--accent:#61d5ff;--accent-ink:#131f36;--soft:#dfe7f1;--radius:15px}.hub-mini{border:1px solid #ffffff24;border-radius:12px;padding:13px;display:grid}.hub-mini small{opacity:.55}.hub-mini>span{display:flex;gap:7px;align-items:center;font-size:.65rem;color:#9eea90}.hub-mini i{width:7px;aspect-ratio:1;border-radius:50%;background:#9eea90}.alert{border-color:#ff9d8e}.dispatch-grid{display:grid;grid-template-columns:1fr 340px;gap:16px}.map-card{min-height:580px;border:1px solid #d3dce9;border-radius:20px;background:#dbe6ec;position:relative;overflow:hidden}.map-card::before{content:"";position:absolute;inset:0;background:linear-gradient(35deg,transparent 42%,#ccd9d7 42% 58%,transparent 58%),linear-gradient(-25deg,transparent 46%,#e8eee8 46% 56%,transparent 56%)}.road{position:absolute;background:#fff;border:1px solid #c4d1d7;border-radius:99px;z-index:1}.r1{width:120%;height:45px;top:38%;left:-10%;transform:rotate(-15deg)}.r2{width:90%;height:38px;top:62%;left:10%;transform:rotate(28deg)}.r3{width:55%;height:30px;top:20%;left:36%;transform:rotate(75deg)}.district{position:absolute;color:#71838a;font-size:.72rem;z-index:2}.d1{top:18%;left:18%}.d2{top:48%;left:60%}.d3{top:76%;left:27%}.map-tools{position:absolute;top:14px;inset-inline-start:14px;background:#fff;border-radius:10px;padding:5px;display:flex;z-index:4}.map-tools button{border:0;background:transparent;padding:7px}.map-tools .is-active{background:#131f36;color:#fff;border-radius:7px}.driver-pin{position:absolute;z-index:4;border:0;background:#131f36;color:#fff;border-radius:50%;width:46px;aspect-ratio:1;display:grid;place-items:center}.driver-pin b{position:absolute;top:-5px;inset-inline-end:-4px;background:#61d5ff;color:#131f36;border-radius:20px;padding:2px 5px;font-size:.55rem}.driver-pin.warning{background:#ff7b68}.p1{top:30%;left:34%}.p2{top:58%;left:65%}.p3{top:72%;left:25%}.hub-pin{position:absolute;z-index:3;top:48%;left:44%;width:55px;aspect-ratio:1;border-radius:14px;background:#61d5ff;display:grid;place-items:center;font-size:1.5rem}.live-panel{background:#fbfdff;border:1px solid #d3dce9;border-radius:20px;padding:18px}.delivery{border:1px solid #d3dce9;border-radius:13px;padding:14px;margin-bottom:10px}.delivery.urgent{border-inline-start:5px solid #ff7b68}.delivery header,.delivery footer{display:flex;justify-content:space-between;align-items:center}.delivery h3,.delivery p{margin:.4em 0}.delivery footer{justify-content:flex-start;gap:8px;border-top:1px solid #d3dce9;padding-top:10px}.avatar.blue{background:#8fc5f2}.avatar.lime{background:#b8dd8e}.avatar.large{width:65px;font-size:1.2rem}.route-board{display:grid;gap:14px}.route-board>article{background:#fbfdff;border:1px solid #d3dce9;border-radius:18px;padding:22px}.route-board header,.route-board footer{display:flex;align-items:center;gap:16px}.route-board header>div{flex:1}.route-board h3,.route-board p{margin:.2em 0}.route-code{width:58px;aspect-ratio:1;border-radius:14px;background:#61d5ff;display:grid;place-items:center;font-weight:800}.route-code.orange{background:#ff9f78}.route-progress{height:50px;position:relative;margin:20px 0}.route-progress>i{position:absolute;top:23px;inset-inline:0;height:4px;background:linear-gradient(90deg,#61d5ff var(--progress),#dfe7f1 var(--progress))}.stop{position:absolute;top:9px;width:32px;aspect-ratio:1;border-radius:50%;background:#dfe7f1;display:grid;place-items:center;font-size:.65rem}.s1{inset-inline-start:0}.s2{inset-inline-start:33%}.s3{inset-inline-start:66%}.s4{inset-inline-end:0}.driver-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.driver-stats{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #d3dce9;padding-top:15px}.driver-stats span{display:grid}.driver-stats small{color:#6a768b}.delivery-chart>div:last-child{height:300px;display:flex;align-items:flex-end;gap:16px}.delivery-chart i{height:var(--h);flex:1;background:#61d5ff;border-radius:8px 8px 2px 2px}@media(max-width:1000px){.dispatch-grid{grid-template-columns:1fr}.map-card{min-height:430px}.driver-grid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.driver-grid{grid-template-columns:1fr}}