*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f4f7fb;color:#182230}button,input,select{font:inherit}button{cursor:pointer}.app{display:flex;min-height:100vh}.sidebar{width:252px;background:#0b1726;color:#d8e1ec;position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column;padding:22px 14px;z-index:20}.brand{display:flex;align-items:center;gap:11px;padding:4px 12px 27px}.brandmark{width:40px;height:40px;border-radius:11px;background:linear-gradient(135deg,#14b86e,#0b8f57);display:grid;place-items:center;font-weight:900;font-size:22px;color:white;box-shadow:0 8px 20px #063d2855}.brand b{display:block;color:white;font-size:18px}.brand span{font-size:11px;color:#91a3b7}.nav{display:flex;align-items:center;gap:13px;color:#aebdcd;padding:12px 13px;border-radius:10px;margin:3px 0;font-size:13px;font-weight:600;text-decoration:none;cursor:pointer}.nav:hover{background:#15263a;color:white}.nav.active{background:#123b31;color:#fff;box-shadow:inset 3px 0 #16b66c}.sidebar-bottom{margin-top:auto}.sync{display:flex;gap:10px;padding:13px;background:#102237;border:1px solid #1b324b;border-radius:11px;margin:10px 2px 12px}.sync i{width:9px;height:9px;background:#1ec978;border-radius:50%;margin-top:5px;box-shadow:0 0 0 4px #1ec97822}.sync b,.sync small{display:block}.sync b{font-size:11px;color:#dce9f5}.sync small{font-size:10px;color:#8296aa;margin-top:3px}main{margin-left:252px;width:calc(100% - 252px);min-width:0}header{height:74px;background:white;border-bottom:1px solid #e7edf3;display:flex;align-items:center;justify-content:space-between;padding:0 34px;position:sticky;top:0;z-index:10}.crumb span{display:block;font-size:19px;font-weight:800}.crumb small{color:#8a98a8;font-size:11px}.header-actions{display:flex;align-items:center;gap:20px}.icon-btn{border:0;background:#f5f7fa;width:38px;height:38px;border-radius:10px;position:relative}.icon-btn em{position:absolute;right:3px;top:2px;background:#e84b4b;color:white;border-radius:8px;font-size:8px;padding:2px 5px;font-style:normal}.profile{display:flex;gap:10px;align-items:center}.profile b,.profile small{display:block}.profile b{font-size:12px}.profile small{font-size:10px;color:#8a98a8}.avatar{width:34px;height:34px;border-radius:50%;background:#dff5ea;color:#087b4b;display:grid;place-items:center;font-size:11px;font-weight:800}.mobile-menu{display:none}#content{padding:30px 34px 45px}.welcome{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.welcome h1{margin:0;font-size:25px}.welcome p{margin:6px 0 0;color:#8492a2;font-size:12px}.btn{border:0;border-radius:9px;padding:11px 16px;font-size:12px;font-weight:700}.btn.primary{background:#0c9b5b;color:white;box-shadow:0 5px 13px #0c9b5b25}.btn.secondary{background:#eef3f7;color:#425466}.btn.danger{background:#fff0f0;color:#c53b3b}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stat{background:white;border:1px solid #e6edf3;border-radius:13px;padding:18px;box-shadow:0 3px 12px #10233a08}.stat-top{display:flex;justify-content:space-between}.stat label{font-size:11px;color:#8492a2;font-weight:600}.stat h2{font-size:24px;margin:10px 0 4px}.trend{font-size:10px;color:#0a9a5a;font-weight:700}.trend.down{color:#df5656}.stat-icon{width:35px;height:35px;border-radius:9px;background:#eaf8f1;display:grid;place-items:center;color:#0b9b5c}.grid2{display:grid;grid-template-columns:1.5fr 1fr;gap:17px;margin-top:18px}.panel{background:white;border:1px solid #e6edf3;border-radius:13px;padding:19px;box-shadow:0 3px 12px #10233a08}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.panel-head h3{margin:0;font-size:14px}.panel-head span{font-size:10px;color:#8b98a7}.chartbox{height:260px}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse;font-size:11px}.table th{text-align:left;color:#8b98a7;font-weight:600;background:#fafcfd;padding:11px;border-bottom:1px solid #edf1f5;white-space:nowrap}.table td{padding:13px 11px;border-bottom:1px solid #edf1f5;white-space:nowrap}.badge{display:inline-flex;padding:5px 8px;border-radius:20px;font-size:9px;font-weight:800}.badge.green{background:#e8f8f0;color:#098c53}.badge.orange{background:#fff4df;color:#b87406}.badge.red{background:#ffeaea;color:#c33f3f}.badge.blue{background:#e9f1ff;color:#386bb2}.section-title{font-size:21px;margin:0}.toolbar{display:flex;justify-content:space-between;gap:12px;margin:20px 0}.search{background:white;border:1px solid #dfe7ee;border-radius:9px;padding:10px 12px;width:270px;font-size:11px;outline:none}.filters{display:flex;gap:8px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.field label{font-size:10px;color:#718092;font-weight:700;display:block;margin-bottom:6px}.field input,.field select{width:100%;border:1px solid #dfe7ee;background:#fbfcfd;padding:10px;border-radius:8px;outline:none;font-size:12px}.field input:focus,.field select:focus{border-color:#0c9b5b}.full{grid-column:1/-1}.calc-box{background:#f1faf5;border:1px solid #cceede;border-radius:10px;padding:15px;margin-top:5px}.calc-row{display:flex;justify-content:space-between;font-size:11px;padding:5px 0}.total{border-top:1px solid #cceede;margin-top:8px;padding-top:10px;font-weight:900;font-size:17px}.modal{position:fixed;inset:0;background:#06101a99;display:grid;place-items:center;z-index:50;padding:20px}.modal.hidden{display:none}.modal-card{background:white;width:min(720px,100%);max-height:90vh;overflow:auto;border-radius:16px;padding:23px;box-shadow:0 25px 70px #0004}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.modal-head h2{font-size:18px;margin:0}.close{border:0;background:#eef2f5;border-radius:8px;width:30px;height:30px}.actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.route-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.route{background:white;border:1px solid #e5ecf2;border-radius:12px;padding:16px}.route b{font-size:13px}.route small{display:block;color:#8a98a8;margin:5px 0 13px}.route strong{font-size:18px}.device-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.device{background:white;border:1px solid #e5ecf2;border-radius:12px;padding:17px}.device-top{display:flex;justify-content:space-between}.device .serial{font-size:10px;color:#8392a2}.device .weight{font-size:27px;font-weight:800;margin:18px 0 3px}.progress{height:5px;background:#edf2f5;border-radius:10px;overflow:hidden}.progress i{display:block;height:100%;background:#10a463}.empty{padding:40px;text-align:center;color:#8b98a7;font-size:12px}.report-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.mini-list{display:grid;gap:11px}.mini{display:flex;justify-content:space-between;align-items:center;padding:11px;background:#fafcfd;border-radius:8px}.mini b{font-size:11px}.mini small{color:#8a98a8}.toast{position:fixed;right:25px;bottom:25px;background:#0d1d2e;color:white;padding:12px 16px;border-radius:9px;font-size:11px;opacity:0;transform:translateY(10px);transition:.25s;z-index:100}.toast.show{opacity:1;transform:none}.receipt{font-family:monospace;border:1px dashed #bbc7d1;padding:20px;background:#fff}.receipt h2{text-align:center;margin:0 0 5px}.receipt .rline{display:flex;justify-content:space-between;padding:5px 0;font-size:11px}.receipt .rtotal{font-weight:900;border-top:1px dashed #999;margin-top:8px;padding-top:8px;font-size:16px}.mobile-menu{border:0;background:transparent;font-size:22px}@media(max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}.grid2,.report-grid{grid-template-columns:1fr}.route-cards,.device-grid{grid-template-columns:1fr 1fr}}@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.25s}.sidebar.open{transform:none}main{margin-left:0;width:100%}header{padding:0 15px}.mobile-menu{display:block}.profile div:not(.avatar),.profile>span{display:none}#content{padding:22px 15px}.cards{grid-template-columns:1fr 1fr}.welcome{align-items:flex-start;gap:12px}.toolbar{flex-direction:column}.search{width:100%}.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.route-cards,.device-grid{grid-template-columns:1fr}.header-actions{gap:8px}}@media(max-width:450px){.cards{grid-template-columns:1fr}.welcome{flex-direction:column}.btn.primary{width:100%}}