:root{--ink:#2b211b;--muted:#806f65;--cream:#faf7f3;--paper:#fff;--forest:#d8641f;--mint:#ffb566;--line:#eadfd6;--amber:#f3aa49;--blue:#6e9ef5;--red:#ef776f;--shadow:0 18px 60px rgba(61,35,21,.13)}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',sans-serif}button,input,select{font:inherit}button{cursor:pointer}.icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.app-shell{min-height:100vh;display:grid;grid-template-columns:232px 1fr}.sidebar{background:#27160e;color:#fff;padding:28px 20px;display:flex;flex-direction:column;gap:32px}.brand{font:700 21px Manrope;display:flex;align-items:center;gap:10px;padding:0 9px}.brand-mark{width:31px;height:31px;border-radius:10px;background:var(--mint);display:grid;place-items:center;color:#27160e;transform:rotate(-5deg)}.nav{display:grid;gap:7px}.nav-item{border:0;background:transparent;color:#c7aa99;padding:12px 13px;border-radius:12px;display:flex;gap:12px;align-items:center;text-align:left;font-weight:600}.nav-item.active,.nav-item:hover{background:#4a2615;color:#fff}.sidebar-foot{margin-top:auto}.profile{border-top:1px solid #5b321e;padding:20px 6px 0;display:flex;gap:10px;align-items:center}.avatar{width:38px;height:38px;border-radius:50%;background:#ffe0c2;color:#4a2615;display:grid;place-items:center;font-weight:700}.profile small{color:#bd9b88;display:block;margin-top:2px}.main{padding:30px 34px;min-width:0}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:var(--forest);font-size:11px;font-weight:700}.title{font:700 28px Manrope;margin:5px 0}.top-actions{display:flex;gap:10px}.icon-btn,.ghost,.primary{border:1px solid var(--line);background:#fff;border-radius:12px;min-height:42px;padding:0 14px;display:inline-flex;gap:8px;align-items:center;justify-content:center;font-weight:600;color:var(--ink)}.icon-btn{width:42px;padding:0}.primary{background:var(--forest);color:#fff;border-color:var(--forest)}.primary:hover{background:#b94f13}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}.metric{background:#fff;border:1px solid var(--line);border-radius:17px;padding:18px}.metric-top{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:13px}.metric-icon{width:36px;height:36px;border-radius:11px;background:#fff0e4;color:var(--forest);display:grid;place-items:center}.metric strong{display:block;font:700 27px Manrope;margin-top:14px}.metric small{color:var(--muted)}.delta{color:var(--forest)!important}.workspace{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.8fr);gap:16px}.card{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden}.card-head{padding:18px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.card-head h2{font:700 16px Manrope;margin:0}.card-head span{font-size:12px;color:var(--muted)}.live-pill{font-size:11px!important;color:var(--forest)!important;background:#ffead9;padding:6px 9px;border-radius:99px;font-weight:700}.live-pill:before{content:'';display:inline-block;width:6px;height:6px;background:#dc6c27;border-radius:50%;margin-right:6px}.map{height:410px;position:relative;overflow:hidden;background-color:#f1e8df;background-image:linear-gradient(32deg,transparent 46%,rgba(255,255,255,.8) 47%,rgba(255,255,255,.8) 51%,transparent 52%),linear-gradient(145deg,transparent 40%,rgba(255,255,255,.75) 41%,rgba(255,255,255,.75) 45%,transparent 46%),linear-gradient(90deg,rgba(188,120,74,.12) 1px,transparent 1px),linear-gradient(rgba(188,120,74,.1) 1px,transparent 1px);background-size:180px 150px,230px 180px,55px 55px,55px 55px}.map:after{content:'DELHI · NCR';position:absolute;right:18px;bottom:15px;color:#9d8576;font-size:10px;letter-spacing:.16em}.road{position:absolute;height:9px;background:#fff;border:1px solid #e7dbd1;border-radius:20px;transform-origin:left center}.r1{width:72%;top:65%;left:4%;transform:rotate(-18deg)}.r2{width:64%;top:18%;left:34%;transform:rotate(68deg)}.r3{width:48%;top:42%;left:3%;transform:rotate(12deg)}.map-label{position:absolute;color:#8e796d;font-size:11px}.marker{position:absolute;width:36px;height:36px;border-radius:13px 13px 13px 3px;transform:rotate(-45deg);background:var(--forest);border:3px solid #fff;box-shadow:0 7px 18px #8c4a2766;display:grid;place-items:center;color:white}.marker .icon{transform:rotate(45deg);width:16px}.m1{left:25%;top:27%}.m2{left:59%;top:17%;background:#e19d40}.m3{left:72%;top:60%;background:#5b82c9}.m4{left:39%;top:68%;background:#64736c}.route{position:absolute;left:27%;top:35%;width:45%;height:35%;border-right:3px dashed #db925f;border-bottom:3px dashed #db925f;border-radius:0 0 60px 0;transform:rotate(-8deg)}.map-card{position:absolute;left:20px;bottom:18px;background:#fff;border-radius:13px;padding:12px 14px;box-shadow:var(--shadow);display:flex;gap:10px;align-items:center}.map-card strong{font-size:13px;display:block}.map-card small{color:var(--muted)}.courier-list{padding:6px 14px}.courier{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:10px;padding:14px 4px;border-bottom:1px solid var(--line);cursor:pointer}.courier:last-child{border:0}.courier:hover{background:#fafbf8}.courier .avatar{width:40px;height:40px;font-size:12px}.courier b{font-size:13px}.courier small{display:block;color:var(--muted);margin-top:3px}.status{width:9px;height:9px;border-radius:50%;background:#54aa6e}.status.busy{background:var(--amber)}.status.off{background:#aab3ae}.progress{height:3px;background:#e9ece7;margin-top:8px;border-radius:5px;overflow:hidden}.progress i{display:block;height:100%;background:var(--forest)}.section{margin-top:16px}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:700px}.data-table th{text-align:left;padding:12px 18px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;background:#fafbf8}.data-table td{padding:15px 18px;border-top:1px solid var(--line);font-size:13px}.tag{display:inline-flex;align-items:center;border-radius:99px;padding:6px 9px;font-size:11px;font-weight:700;background:#eef0ed;color:#64716b}.tag.transit{background:#e9f1fd;color:#4070bd}.tag.delivered{background:#e6f4dc;color:#347243}.tag.pending{background:#fff0da;color:#a56718}.mobile-shell{min-height:100vh;background:#eee4dc;padding:26px;display:grid;place-items:center}.phone{width:390px;min-height:790px;background:#f8f8f4;border-radius:38px;border:8px solid #2c1d16;box-shadow:0 30px 80px #6b351c38;overflow:hidden;position:relative}.phone-head{background:#27160e;color:#fff;padding:26px 21px 25px}.phone-head-top{display:flex;justify-content:space-between;align-items:center}.phone-head h1{font:700 23px Manrope;margin:26px 0 5px}.phone-head p{color:#d1b6a7;margin:0;font-size:13px}.tracking-toggle{margin:17px 16px 0;background:#fff;border-radius:17px;box-shadow:var(--shadow);padding:15px;display:flex;align-items:center;gap:12px;position:relative;z-index:2}.signal{width:40px;height:40px;border-radius:12px;background:#ffead7;color:var(--forest);display:grid;place-items:center}.tracking-toggle strong{display:block;font-size:13px}.tracking-toggle small{color:var(--muted)}.switch{margin-left:auto;width:44px;height:25px;background:#cbd2cd;border-radius:20px;padding:3px;border:0;transition:.2s}.switch i{display:block;width:19px;height:19px;background:white;border-radius:50%;transition:.2s}.switch.on{background:var(--forest)}.switch.on i{transform:translateX(19px)}.phone-body{padding:22px 16px 90px}.phone-label{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:700;margin:8px 4px 11px}.job{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden}.job-map{height:135px;background:#f0e6de;position:relative;background-image:linear-gradient(25deg,transparent 48%,#fff 49%,#fff 54%,transparent 55%),linear-gradient(100deg,transparent 45%,#fff 46%,#fff 51%,transparent 52%)}.pin{position:absolute;width:22px;height:22px;border-radius:50% 50% 50% 3px;transform:rotate(-45deg);background:var(--forest);border:3px solid white}.pin.a{left:20%;top:30%}.pin.b{right:17%;bottom:24%;background:var(--amber)}.job-info{padding:16px}.job-top{display:flex;justify-content:space-between}.job h3{font:700 15px Manrope;margin:0 0 6px}.job p{font-size:12px;color:var(--muted);margin:0;line-height:1.5}.otp-note{background:#f4f6ee;border-radius:10px;padding:10px;margin-top:13px;font-size:11px;color:#5b665f}.job-actions{display:grid;grid-template-columns:1fr 1.5fr;gap:8px;margin-top:14px}.job-actions button{min-height:43px}.phone-nav{position:absolute;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--line);height:72px;display:flex;justify-content:space-around;padding-top:11px}.phone-nav button{border:0;background:transparent;color:#8b9691;font-size:10px;display:grid;gap:3px;justify-items:center}.phone-nav button.active{color:var(--forest)}.phone-nav .icon{width:21px}.mode-switcher{position:fixed;right:22px;bottom:22px;background:#32190d;color:#fff;border:0;border-radius:14px;padding:13px 17px;box-shadow:var(--shadow);z-index:10;font-weight:700}.modal-backdrop{position:fixed;inset:0;background:#21110baa;display:grid;place-items:center;padding:20px;z-index:30}.modal{width:min(460px,100%);background:#fff;border-radius:22px;padding:24px;box-shadow:var(--shadow)}.modal h2{font:700 21px Manrope;margin:0 0 5px}.modal>p{color:var(--muted);font-size:13px;margin:0 0 20px}.field{display:grid;gap:7px;margin:14px 0}.field label{font-size:12px;font-weight:700}.field input,.field select{border:1px solid var(--line);border-radius:11px;padding:12px;outline:none;background:#fff}.field input:focus,.field select:focus{border-color:var(--forest)}.modal-actions{display:flex;gap:9px;justify-content:flex-end;margin-top:20px}.otp-inputs{display:flex;gap:8px}.otp-inputs input{width:50px;text-align:center;font-size:20px}.photo-drop{border:1px dashed #aebbb4;border-radius:14px;padding:22px;text-align:center;color:var(--muted);font-size:12px;background:#fafbf8}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,30px);background:#32190d;color:#fff;padding:12px 18px;border-radius:12px;opacity:0;pointer-events:none;transition:.25s;z-index:50;font-size:13px}.toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:950px){.metric-grid{grid-template-columns:repeat(2,1fr)}.workspace{grid-template-columns:1fr}.app-shell{grid-template-columns:76px 1fr}.sidebar{padding:28px 12px}.brand span,.nav-item span,.profile>div:last-child{display:none}.brand{padding:0;justify-content:center}.nav-item{justify-content:center}.main{padding:24px 18px}}@media(max-width:650px){.app-shell{display:block}.sidebar{display:none}.metric-grid{grid-template-columns:1fr 1fr}.main{padding:19px 13px}.top-actions .ghost{display:none}.title{font-size:22px}.workspace{display:block}.workspace>.card+ .card{margin-top:14px}.metric{padding:14px}.metric strong{font-size:22px}.mobile-shell{padding:0}.phone{width:100%;min-height:100vh;border:0;border-radius:0}.mode-switcher{right:12px;bottom:84px}}