:root{--green:#006015;--green-2:#008a36;--yellow:#fbcf02;--red:#e30613;--ink:#183021;--muted:#6d7d72;--bg:#f3f6f3;--card:#fff;--line:#dfe7e1;--shadow:0 12px 32px rgba(14,51,29,.10);--radius:20px;--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink)}body{margin:0;min-height:100vh;background:linear-gradient(180deg,#edf6ef 0,#f6f8f6 32%,#f3f6f3 100%)}button,input,select,textarea{font:inherit}.is-hidden{display:none!important}.app-shell{min-height:100vh}.login-view{min-height:100vh;display:flex;flex-direction:column;justify-content:center;gap:24px;padding:28px 20px 24px;max-width:480px;margin:0 auto}.login-hero{text-align:center}.brand-logo{width:104px;height:auto;object-fit:contain;margin-bottom:18px}.product-kicker,.eyebrow{display:block;font-size:11px;font-weight:800;letter-spacing:.14em;color:var(--green);text-transform:uppercase}.login-hero h1{margin:4px 0 8px;font-size:42px;line-height:1}.login-hero p{margin:0;color:var(--muted)}.login-card{background:var(--card);padding:22px;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}.login-card label,.field-label{display:block;font-size:13px;font-weight:700;margin:0 0 8px;color:#395143}.login-card input,.text-input{width:100%;border:1px solid #cbd8ce;background:#fff;border-radius:14px;padding:14px 15px;color:var(--ink);outline:none}.login-card input{font-size:26px;text-align:center;letter-spacing:.16em;text-transform:uppercase;font-weight:800;margin-bottom:14px}.login-card input:focus,.text-input:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(0,96,21,.08)}.btn{border:0;border-radius:13px;padding:12px 16px;font-weight:800;cursor:pointer;transition:.16s transform,.16s opacity}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--green);color:#fff}.btn-secondary{background:#eef5ef;color:var(--green);border:1px solid #cfe0d2}.btn-danger{background:var(--red);color:#fff}.btn-block{width:100%}.btn-lg{padding:15px 18px;font-size:16px}.form-message{min-height:20px;margin:10px 0 0;color:var(--red);font-size:13px}.login-status{display:flex;justify-content:center;align-items:center;gap:7px;color:var(--muted);font-size:12px;margin-top:10px}.status-dot{width:8px;height:8px;border-radius:50%;background:#c1c9c3}.status-dot.online{background:#1e9a4a}.login-footer{text-align:center;color:#829086;font-size:12px}.driver-view{min-height:100vh;padding-bottom:calc(84px + var(--safe-bottom))}.app-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.header-brand{display:flex;align-items:center;gap:10px}.header-brand img{width:44px;height:36px;object-fit:contain}.header-brand strong{display:block;font-size:14px}.header-brand small{display:block;color:var(--muted);font-size:11px;margin-top:2px}.header-actions{display:flex;align-items:center;gap:8px}.icon-btn{width:38px;height:38px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:18px;display:grid;place-items:center;cursor:pointer}.sync-chip{display:flex;align-items:center;gap:6px;padding:8px 10px;border-radius:999px;background:#eef6f0;color:var(--green);font-size:11px;font-weight:800}.sync-chip i{width:7px;height:7px;border-radius:50%;background:#26a14a}.sync-chip.offline{background:#fff3e8;color:#9e5d00}.sync-chip.offline i{background:#f09a31}.app-main{max-width:760px;margin:0 auto;padding:16px}.screen{display:none}.screen.active{display:block}.route-hero-card,.panel-card,.action-card,.sync-panel,.active-stop-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 8px 24px rgba(20,57,33,.06)}.route-hero-card{padding:18px;background:linear-gradient(135deg,#fff 0,#f4faf5 100%)}.route-hero-top{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}.route-hero-top h2{margin:4px 0 4px;font-size:27px}.route-hero-top p{margin:0;color:var(--muted);font-size:13px}.status-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:7px 10px;background:#eaf4ec;color:var(--green);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.status-badge.subtle{background:#f2f5f2;color:#657468}.route-meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.route-meta-grid div{background:#fff;border:1px solid #e8eee9;border-radius:14px;padding:11px}.route-meta-grid span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;font-weight:800}.route-meta-grid strong{display:block;margin-top:3px;font-size:13px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:14px 0}.stats-grid article{background:#fff;border:1px solid var(--line);border-radius:16px;text-align:center;padding:13px 6px}.stats-grid strong{display:block;color:var(--green);font-size:23px}.stats-grid span{display:block;color:var(--muted);font-size:10px;margin-top:2px}.action-card,.sync-panel,.active-stop-card,.panel-card{padding:17px;margin-top:14px}.action-card h3,.sync-panel h3,.active-stop-card h3,.panel-card h3{margin:4px 0 4px}.action-card p,.sync-panel p,.active-stop-card p,.panel-card p{margin:0 0 13px;color:var(--muted);font-size:13px}.action-card .btn+.btn{margin-top:8px}.active-stop-row,.panel-heading,.screen-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.sync-panel{display:flex;justify-content:space-between;align-items:center;gap:15px}.sync-panel .btn{flex:0 0 auto}.screen-heading{margin-bottom:14px}.screen-heading h2{margin:3px 0;font-size:26px}.screen-heading p{margin:0;color:var(--muted);font-size:13px}.stops-list{display:flex;flex-direction:column;gap:10px}.stop-card{width:100%;text-align:left;background:#fff;border:1px solid var(--line);border-radius:17px;padding:14px;display:flex;gap:13px;align-items:center;cursor:pointer}.stop-seq{width:42px;height:42px;border-radius:14px;background:#eef5ef;color:var(--green);font-weight:900;display:grid;place-items:center;flex:0 0 auto}.stop-body{flex:1;min-width:0}.stop-body strong{display:block;font-size:14px}.stop-body small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.stop-state{font-size:10px;font-weight:900;border-radius:999px;padding:6px 8px;background:#f1f4f1;color:#6a766d;white-space:nowrap}.stop-card.current{border-color:#e8c400;background:#fffdf0}.stop-card.current .stop-seq{background:#fff1a6;color:#745d00}.stop-card.done{opacity:.78}.stop-card.done .stop-seq{background:#eaf4ec}.clock-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.clock-action{padding:12px;border:1px solid var(--line);border-radius:13px;background:#f8faf8;color:var(--ink);font-size:12px;font-weight:800;cursor:pointer}.clock-action.next{background:var(--green);color:#fff;border-color:var(--green)}.timeline{margin-top:12px}.timeline-item{display:flex;gap:10px;padding:10px 0;border-top:1px solid #edf1ee}.timeline-item:first-child{border-top:0}.timeline-dot{width:9px;height:9px;border-radius:50%;background:var(--green);margin-top:5px;flex:0 0 auto}.timeline-item strong{display:block;font-size:12px}.timeline-item small{display:block;color:var(--muted);font-size:11px;margin-top:2px}.two-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px}.chat-screen{min-height:calc(100vh - 150px)}.chat-list{display:flex;flex-direction:column;gap:9px;padding-bottom:78px}.chat-bubble{max-width:82%;border-radius:16px;padding:10px 12px;background:#fff;border:1px solid var(--line)}.chat-bubble.me{margin-left:auto;background:#e8f4eb;border-color:#cce3d1}.chat-bubble.system{margin:0 auto;background:#f5f5f5;max-width:90%;text-align:center}.chat-bubble strong{display:block;font-size:11px}.chat-bubble p{margin:4px 0 0;font-size:13px;white-space:pre-wrap}.chat-bubble time{display:block;color:var(--muted);font-size:9px;margin-top:5px;text-align:right}.chat-composer{position:fixed;left:0;right:0;bottom:calc(67px + var(--safe-bottom));z-index:10;display:flex;gap:8px;padding:10px 16px;background:rgba(255,255,255,.96);border-top:1px solid var(--line)}.chat-composer input{flex:1;min-width:0;border:1px solid var(--line);border-radius:13px;padding:12px}.bottom-nav{position:fixed;z-index:30;left:0;right:0;bottom:0;height:calc(68px + var(--safe-bottom));padding-bottom:var(--safe-bottom);display:grid;grid-template-columns:repeat(4,1fr);background:rgba(255,255,255,.97);border-top:1px solid var(--line);box-shadow:0 -8px 22px rgba(22,50,31,.06)}.nav-item{position:relative;border:0;background:transparent;color:#78867c;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer}.nav-item span{font-size:20px;line-height:1}.nav-item small{font-size:10px;font-weight:800}.nav-item.active{color:var(--green)}.nav-badge{position:absolute;top:8px;right:24%;background:var(--red);color:#fff;border-radius:999px;min-width:16px;height:16px;padding:0 4px;font-size:9px;display:grid;place-items:center;font-style:normal}.modal-dialog{border:0;padding:0;border-radius:24px;width:min(94vw,560px);max-height:90vh;background:transparent}.modal-dialog::backdrop{background:rgba(10,29,17,.55);backdrop-filter:blur(2px)}.modal-shell{background:#fff;border-radius:24px;overflow:hidden}.modal-header{display:flex;justify-content:space-between;align-items:flex-start;padding:18px 18px 12px;border-bottom:1px solid var(--line)}.modal-header h2{margin:4px 0 0}.modal-body{padding:17px;max-height:72vh;overflow:auto}.operation-block{background:#f5f9f6;border:1px solid #e0ebe3;border-radius:16px;padding:14px;margin-top:13px}.operation-block p{margin:0 0 10px;color:var(--muted);font-size:13px}.retention-card{display:flex;justify-content:space-between;align-items:center;border-radius:14px;background:#fff8d8;border:1px solid #f3df75;padding:12px;margin:12px 0}.retention-card span{font-size:12px;color:#6d5b00}.retention-card strong{font-size:21px;color:#6d5b00}.photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:13px}.photo-action,.camera-picker{position:relative;border:1px dashed #b8c8bc;border-radius:16px;padding:14px;text-align:center;background:#f9fbf9;cursor:pointer}.photo-action input,.camera-picker input{position:absolute;inset:0;opacity:0;cursor:pointer}.photo-action span,.camera-picker span{display:block;font-size:25px;color:var(--green)}.photo-action strong,.camera-picker strong{display:block;font-size:12px}.photo-action small,.camera-picker small{display:block;font-size:10px;color:var(--muted);margin-top:3px}.photo-action.ready{border-color:var(--green);background:#eef8f0}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.modal-body .field-label{margin-top:12px}.compact-dialog{width:min(92vw,430px)}.camera-picker{padding:25px 15px;margin:14px 0}.loading-overlay{position:fixed;inset:0;z-index:100;background:rgba(245,248,245,.78);backdrop-filter:blur(3px);display:grid;place-items:center}.loading-card{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:20px;padding:22px;min-width:230px;text-align:center}.loading-card strong,.loading-card span{display:block}.loading-card span{color:var(--muted);font-size:12px;margin-top:4px}.spinner{width:32px;height:32px;border-radius:50%;border:3px solid #dfe8e1;border-top-color:var(--green);animation:spin .8s linear infinite;margin:0 auto 11px}@keyframes spin{to{transform:rotate(360deg)}}.toast-region{position:fixed;z-index:120;left:14px;right:14px;top:76px;display:flex;flex-direction:column;gap:8px;pointer-events:none}.toast{max-width:560px;margin:0 auto;width:100%;background:#173423;color:#fff;padding:12px 14px;border-radius:14px;box-shadow:var(--shadow);font-size:13px;animation:toastin .18s ease}.toast.error{background:#8e141c}.toast.warn{background:#745200}@keyframes toastin{from{transform:translateY(-8px);opacity:0}to{transform:none;opacity:1}}.empty-state{padding:34px 18px;text-align:center;color:var(--muted);background:#fff;border:1px dashed #cbd6cd;border-radius:18px}.empty-state strong{display:block;color:var(--ink);margin-bottom:5px}
@media (min-width:700px){.app-header{padding-left:max(24px,calc((100vw - 760px)/2));padding-right:max(24px,calc((100vw - 760px)/2))}.bottom-nav{left:50%;right:auto;width:760px;transform:translateX(-50%);border-left:1px solid var(--line);border-right:1px solid var(--line)}.chat-composer{left:50%;right:auto;width:760px;transform:translateX(-50%)}}