@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#23352f;background:#f3f6f4;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #21a97b;outline-offset:3px}.rail{position:fixed;inset:0 auto 0 0;width:82px;background:#112e26;color:#b2c7be;display:flex;align-items:center;flex-direction:column;padding:25px 0;z-index:500}.brand{text-decoration:none;color:white;font:bold 34px Manrope;position:relative}.brand span{color:#5de3a5;font-size:16px;margin-left:-3px}.rail-label{font-size:8px;letter-spacing:1.7px;margin-top:8px}.nav{margin-top:55px;border:0;border-radius:13px;width:46px;height:46px;background:#275244;color:#92f3c3;font-size:25px}.rail-bottom{margin-top:auto;border:1px solid #4a685c;border-radius:50%;padding:10px;font-size:12px}main{margin-left:82px;padding:30px 38px 20px;max-width:1900px}header,.header-right,.intro,.panel-title,.map-toolbar,.map-footer,.detail-top,.history-head,footer{display:flex;align-items:center;justify-content:space-between;gap:16px}.eyebrow{font-size:10px;letter-spacing:2px;color:#7b8b83;font-weight:700}h1,h2,h3,p{margin:0}h1{font:800 29px Manrope;margin-top:5px}.dot{display:inline-block;background:#2aaf78;border-radius:50%;width:7px;height:7px;margin:0 0 5px 10px}.badge{font-size:10px;letter-spacing:1px;font-weight:700;color:#997323;background:#f8edd2;border:1px solid #e9d9ad;padding:7px 10px;border-radius:7px}.avatar{border-radius:50%;padding:11px 15px;background:#dce9e1;font-weight:700}.intro{margin:32px 0 18px}.intro h2{font:700 21px Manrope}.intro p,.detail p{font-size:12px;color:#7a8981;margin-top:7px}.button{background:white;border:1px solid #dce4de;color:#40574b;padding:9px 13px;border-radius:8px;font-size:12px}#notice{background:#e6eee8;border:1px solid #d6e2d9;padding:10px 14px;border-radius:8px;font-size:12px;color:#50695b}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin:21px 0}.stats article{padding:19px 22px;background:white;border:1px solid #e0e7e1;border-radius:12px}.stats article>span{font-size:12px;color:#75857c}.stats strong{display:block;font:800 33px Manrope;margin:8px 0}.stats small{font-size:10px;color:#8c9b92}i{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:5px}.green{background:#2cba7d}.blue{background:#5a8fcb}.gray{background:#95a19a}.workspace{display:grid;grid-template-columns:320px 1fr;min-height:490px;border:1px solid #dce5de;background:white;border-radius:13px;overflow:hidden}.vehicles{padding:20px 16px;border-right:1px solid #e3e9e4}.panel-title h3,.history-head h3{font-size:14px}.panel-title span{font-size:11px;background:#edf2ee;padding:4px 8px;border-radius:6px}.search{display:flex;align-items:center;gap:8px;background:#f4f7f5;padding:10px;border:1px solid #e6ece7;border-radius:7px;margin-top:18px}.search input{width:100%;background:none;border:0;outline:none;font-size:11px}.filters{display:flex;gap:5px;margin:15px 0}.filters button{border:0;background:none;color:#77867d;font-size:10px;padding:6px 7px;border-radius:5px}.filters .selected{background:#e1f2e9;color:#1b845b}.vehicle{width:100%;text-align:left;border:1px solid transparent;background:white;border-radius:9px;padding:13px 11px;margin-bottom:7px;display:flex;gap:12px}.vehicle.selected{background:#edf7f1;border-color:#b9ddc7}.car{background:#e4ece6;border-radius:8px;width:36px;height:36px;display:grid;place-items:center;color:#5a7564;font-size:21px;flex-shrink:0}.vehicle strong{font-size:12px;display:block}.vehicle small{display:block;font-size:10px;color:#819087;margin-top:4px}.vehicle .state{margin-left:auto;font-size:9px;white-space:nowrap;color:#648371}.map-panel{position:relative;display:flex;flex-direction:column;min-width:0}.map-toolbar{padding:12px 16px;font-size:12px;position:relative;z-index:400;background:white}#map{height:400px;flex:1;background:#e6ece3;min-height:360px}.map-footer{font-size:9px;color:#7c8b80;padding:10px 14px}.vehicle-marker{width:30px;height:30px;background:#173f30;color:white;border:3px solid white;border-radius:50%;box-shadow:0 3px 12px #1c432f44;text-align:center;line-height:24px;font-size:15px}.vehicle-marker.offline{background:#7a867e}.vehicle-marker.parked{background:#5181ab}.detail{margin-top:20px;background:white;border:1px solid #dce5de;border-radius:12px;padding:22px}.detail h2{font:800 20px Manrope;margin-top:7px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);margin:22px 0;padding:18px 0;border-top:1px solid #edf0ed;border-bottom:1px solid #edf0ed;gap:15px}.metrics small{display:block;color:#8b978e;font-size:10px}.metrics strong{display:block;font-size:16px;margin-top:7px}.history-head label{font-size:11px;color:#718176}.trip{display:flex;gap:24px;padding:13px 0;border-bottom:1px solid #edf0ed;font-size:12px}.trip span:last-child{margin-left:auto;color:#64806b}.footnote{font-size:10px!important;line-height:1.7}footer{font-size:10px;letter-spacing:1px;color:#769080;margin-top:23px}footer span{font-size:9px;letter-spacing:0}footer span:last-child{margin-left:auto}.empty{font-size:12px;color:#809086;padding:20px 5px}.error{color:#a33!important;background:#fff0eb!important}.leaflet-control-attribution{font-size:9px!important}@media(min-width:1500px){#map{min-height:510px}.workspace{grid-template-columns:360px 1fr}}@media(max-width:1000px){main{padding:22px}.workspace{grid-template-columns:270px 1fr}.stats{gap:10px}.stats article{padding:15px}.metrics{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.rail{width:55px}.brand{font-size:26px}.rail-label{font-size:6px}.nav{width:36px}main{margin-left:55px;padding:18px 12px}.intro{align-items:flex-start}.intro h2{font-size:17px}.intro p{line-height:1.6}.intro>.button{display:none}.stats{grid-template-columns:repeat(2,1fr)}.stats strong{font-size:27px}.workspace{display:flex;flex-direction:column}.vehicles{border-right:0;order:2}#list{max-height:260px;overflow:auto}.map-panel{min-height:350px}#map{min-height:300px}.detail{padding:16px}.detail-top{align-items:flex-start}.detail-top .button{max-width:110px}.history-head{align-items:flex-start}.history-head h3{font-size:12px}.trip{gap:10px;font-size:10px}footer span:nth-child(2){display:none}h1{font-size:25px}.badge{font-size:8px}.header-right{gap:8px}.avatar{display:none}}