:root{--ink:#15241f;--green:#087f69;--mint:#def3eb;--cream:#fffdf8;--muted:#718078;--line:#e0e6e1;--yellow:#ffc244}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',sans-serif}.sidebar{position:fixed;inset:0 auto 0 0;width:238px;background:#10241e;color:#e8f2ed;padding:31px 21px;display:flex;flex-direction:column}.brand{color:#63d2b2;text-decoration:none;font:800 27px 'Outfit';letter-spacing:-1.5px}.brand span{color:#fff}.brand i{font-style:normal}.sidebar>p{font-size:10px;font-weight:700;letter-spacing:1.3px;color:#82a99b;margin:44px 10px 13px}.sidebar nav{display:grid;gap:5px}.sidebar nav a{color:#b9cbc3;text-decoration:none;font:600 14px inherit;padding:11px 12px;border-radius:9px}.sidebar nav a.active,.sidebar nav a:hover{color:#fff;background:#1a4035}.rider-profile{margin-top:auto;border-top:1px solid #315449;padding:18px 7px 0;display:flex;align-items:center;gap:9px}.rider-profile>span{height:34px;width:34px;border-radius:10px;background:var(--yellow);color:#382d10;display:grid;place-items:center;font:700 11px 'Outfit'}.rider-profile strong{font-size:12px;display:block}.rider-profile small{font-size:10px;color:#9db9ad}.rider-app{margin-left:238px;max-width:1300px;padding:41px min(5vw,76px) 64px}.rider-app header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:27px}.eyebrow{font-size:10px;letter-spacing:1.3px;font-weight:700;color:var(--green);margin:0 0 8px}h1{font:700 32px 'Outfit';letter-spacing:-1px;margin:0}.subtitle{margin:7px 0;color:var(--muted);font-size:14px}.availability{border:0;border-radius:24px;background:var(--mint);color:var(--green);padding:11px 15px;font:700 13px inherit;cursor:pointer}.availability i{display:inline-block;height:8px;width:8px;border-radius:50%;background:var(--green);margin-right:7px}.availability.offline{background:#eee;color:#6f7c75}.availability.offline i{background:#89948e}.map-shell{border:1px solid #cce4d9;border-radius:19px;overflow:hidden;position:relative;box-shadow:0 13px 29px #0d3b2c12}.map{height:270px;position:relative;overflow:hidden;background-color:#dceee5;background-image:linear-gradient(40deg,transparent 0 25%,#fffdf8 25% 31%,transparent 31% 100%),linear-gradient(153deg,transparent 0 44%,#fffdf8 44% 50%,transparent 50% 100%),linear-gradient(4deg,transparent 0 67%,#fffdf8 67% 73%,transparent 73% 100%)}.map:before,.map:after{content:'';position:absolute;border-radius:50%;border:25px solid #c7e7d9;opacity:.7}.map:before{height:190px;width:190px;left:-90px;top:-69px}.map:after{height:135px;width:135px;right:-54px;bottom:-49px}.map-chip{position:absolute;z-index:2;background:#fff;border-radius:8px;padding:7px 10px;box-shadow:0 6px 13px #0b493323;font-size:11px;font-weight:700}.pickup{left:24%;top:24%}.dropoff{right:19%;bottom:22%}.route{position:absolute;z-index:1;left:28%;top:36%;height:94px;width:46%;border-left:4px dashed var(--green);border-bottom:4px dashed var(--green);border-radius:0 0 0 53px;transform:rotate(-5deg)}.rider-marker{position:absolute;z-index:3;left:47%;top:46%;height:39px;width:39px;border:3px solid #fff;border-radius:50%;background:var(--green);color:#fff;box-shadow:0 5px 15px #087f6966;display:grid;place-items:center;font-size:9px;font-weight:700;animation:rider-breathe 2.3s ease-in-out infinite}.map-location{position:absolute;bottom:17px;left:21px;color:#628074;font-size:11px;font-weight:700}.map-controls{position:absolute;z-index:4;right:14px;top:14px;display:grid;gap:5px}.map-controls button{border:0;background:#fff;height:31px;width:31px;border-radius:8px;font-size:20px;box-shadow:0 4px 10px #0b493322;cursor:pointer}.job-panel{margin-top:-1px;background:#fff;border:1px solid var(--line);border-radius:0 0 19px 19px;padding:22px 24px;display:grid;grid-template-columns:1fr auto;gap:20px}.job-kicker{font-size:10px;font-weight:700;letter-spacing:1.2px;color:var(--green);margin:0 0 7px}.job-panel h2{font:700 22px 'Outfit';margin:0}.job-details{display:flex;gap:17px;margin:13px 0 0}.job-details div{font-size:12px;color:var(--muted)}.job-details strong{display:block;color:var(--ink);font-size:13px;margin-bottom:3px}.job-actions{text-align:right}.job-actions strong{display:block;font:700 21px 'Outfit';margin:2px 0 10px}.job-actions button{border:0;background:var(--green);color:#fff;border-radius:10px;padding:12px 18px;font:700 13px inherit;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}.job-actions button:hover{transform:translateY(-2px);box-shadow:0 9px 16px #087f6940}.job-actions .secondary{background:#e8f3ee;color:var(--green);margin-right:7px}.progress{display:flex;gap:5px;margin-top:16px}.progress i{height:5px;flex:1;border-radius:4px;background:#e1eee8}.progress i.done{background:var(--green)}.summary{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:24px}.summary article{border:1px solid var(--line);border-radius:13px;background:#fff;padding:18px}.summary p{color:var(--muted);font-size:12px;margin:0 0 10px}.summary strong{font:700 25px 'Outfit';letter-spacing:-1px}.summary small{display:block;color:#278167;font-size:11px;margin-top:9px}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,80px);opacity:0;background:#15241f;color:#fff;border-radius:9px;padding:11px 16px;font-size:13px;transition:.2s}.toast.show{transform:translate(-50%,0);opacity:1}@keyframes rider-breathe{0%,100%{box-shadow:0 5px 15px #087f6966}50%{box-shadow:0 0 0 12px #087f6900}}@media(max-width:760px){.sidebar{position:static;width:100%;padding:18px;display:block}.sidebar>p,.sidebar nav,.rider-profile{display:none}.rider-app{margin:0;padding:26px 16px}.rider-app header{display:block}.availability{margin-top:15px}.job-panel{grid-template-columns:1fr}.job-actions{text-align:left}.summary{grid-template-columns:1fr}.map{height:235px}.job-details{gap:10px;flex-wrap:wrap}}
