:root{
  --ink:#172338;--muted:#687584;--line:#dbe3e6;--paper:#fff;--canvas:#f4f6f5;
  --navy:#103a47;--navy-2:#0b2c35;--teal:#087f72;--teal-soft:#dcefeb;
  --orange:#ef7f1a;--orange-soft:#fff0df;--purple:#7252a4;--purple-soft:#eee8f7;
  --red:#c84841;--red-soft:#fbe7e5;--green:#19865c;--shadow:0 8px 28px rgba(16,58,71,.09);
}
*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--canvas)}
body{margin:0;min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit}.hidden{display:none!important}
.boot{min-height:100vh;display:grid;place-content:center;justify-items:center;text-align:center;color:var(--muted)}.boot-logo{width:68px;height:68px;border-radius:15px;box-shadow:var(--shadow)}
.mode-page{min-height:100vh;display:grid;place-content:center;justify-items:start;gap:16px;padding:28px;max-width:760px;margin:auto}.mode-page .brand{margin-bottom:34px}.mode-page h1{font-size:clamp(34px,6vw,58px);margin:0;letter-spacing:-.045em}.mode-page>p{margin:0;color:var(--muted)}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%;margin:10px 0}.mode-card{display:grid;gap:7px;text-align:left;text-decoration:none;border:1px solid var(--line);border-radius:12px;background:#fff;padding:22px;color:var(--ink)}.mode-card:hover{border-color:var(--teal);box-shadow:var(--shadow)}.mode-card b{font-size:17px}.mode-card span{font-size:12px;line-height:1.5;color:var(--muted)}.portal-home{max-width:850px}
.login-page{min-height:100vh;display:grid;grid-template-columns:minmax(320px,540px) 1fr;background:var(--paper)}
.login-panel{padding:clamp(28px,6vw,80px);display:flex;flex-direction:column;justify-content:center}.login-visual{background:var(--navy);color:#fff;padding:72px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden}
.login-visual:before,.login-visual:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.13);border-radius:50%}.login-visual:before{width:520px;height:520px;right:-160px;top:-160px}.login-visual:after{width:300px;height:300px;right:80px;top:60px}
.brand{display:flex;gap:12px;align-items:center}.brand-logo{display:block;width:142px;height:auto;object-fit:contain}.brand-symbol{display:none;width:42px;height:42px;border-radius:10px}.product-name{padding-left:12px;border-left:1px solid #cbd6da;color:var(--navy);font-size:13px;font-weight:850;letter-spacing:.12em}.brand-dark .product-name{color:#fff;border-left-color:rgba(255,255,255,.28)}.eyebrow{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--teal)}
.login-panel h1{font-size:clamp(34px,5vw,58px);line-height:.98;letter-spacing:-.045em;margin:22px 0 14px}.login-panel>p{color:var(--muted);max-width:480px;line-height:1.6}.login-form{display:grid;gap:14px;margin-top:28px;max-width:430px}
.login-help{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px}.login-help button,.login-help a{border:0;background:none;padding:0;color:var(--teal);font-size:12px;font-weight:800}.access-note{font-size:11px;max-width:430px!important;margin:10px 0 0;line-height:1.45!important}
.field{display:grid;gap:7px}.field label{font-size:12px;font-weight:800;color:#4b5a68}.field input,.field select,.field textarea,.toolbar input,.toolbar select{width:100%;border:1px solid var(--line);border-radius:10px;background:#fff;padding:12px 13px;color:var(--ink);outline:none}.field input:focus,.field select:focus,.field textarea:focus,.toolbar input:focus,.toolbar select:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(8,127,114,.12)}
.btn{border:0;border-radius:10px;padding:12px 16px;background:var(--navy);color:#fff;font-weight:750;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px}.btn:hover{filter:brightness(1.07)}.btn.primary{background:var(--orange)}.btn.secondary{background:var(--teal)}.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}.btn.danger{background:var(--red)}.btn.small{padding:8px 11px;min-height:34px;font-size:12px}.btn:disabled{opacity:.5;cursor:not-allowed}
.demo-box{margin-top:30px;padding:16px;border:1px dashed #b9c9cd;border-radius:12px;background:#f8fbfa}.demo-box p{font-size:12px;color:var(--muted);margin:0 0 10px}.demo-actions{display:flex;gap:8px;flex-wrap:wrap}.login-visual h2{font-size:44px;line-height:1.05;max-width:600px;margin:18px 0}.login-visual p{max-width:600px;color:#c7d7dc;line-height:1.65}.flow-line{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}.flow-line span{padding:8px 10px;border-radius:7px;border:1px solid rgba(255,255,255,.2);font-size:12px}
.admin-shell{display:grid;grid-template-columns:248px 1fr;min-height:100vh}.sidebar{background:var(--navy-2);color:#fff;padding:24px 18px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.sidebar .brand{padding:0 10px 24px}.nav{display:grid;gap:6px}.nav button{border:0;background:transparent;color:#b9ccd1;padding:11px 12px;border-radius:9px;text-align:left;font-weight:650;display:flex;gap:10px;align-items:center}.nav button:hover,.nav button.active{background:rgba(255,255,255,.1);color:#fff}.nav button.active{box-shadow:inset 3px 0 var(--orange)}.nav .count{margin-left:auto;background:var(--orange);color:white;padding:1px 7px;border-radius:99px;font-size:11px}.sidebar-foot{margin-top:auto;border-top:1px solid rgba(255,255,255,.12);padding:16px 8px 0}.sidebar-foot strong,.sidebar-foot span{display:block}.sidebar-foot span{font-size:12px;color:#9cb2b9;margin-top:3px}.sidebar-foot button{margin-top:12px;width:100%}
.admin-shell.sidebar-collapsed{grid-template-columns:76px 1fr}.admin-shell.sidebar-collapsed .sidebar{padding-left:10px;padding-right:10px}.admin-shell.sidebar-collapsed .sidebar .brand{padding-left:7px}.admin-shell.sidebar-collapsed .sidebar .product-name,.admin-shell.sidebar-collapsed .sidebar .brand-logo,.admin-shell.sidebar-collapsed .nav button span:not(.count),.admin-shell.sidebar-collapsed .sidebar-foot strong,.admin-shell.sidebar-collapsed .sidebar-foot span,.admin-shell.sidebar-collapsed .sidebar-foot .btn{display:none}.admin-shell.sidebar-collapsed .sidebar .brand-symbol{display:block}.admin-shell.sidebar-collapsed .nav button{justify-content:center}.admin-shell.sidebar-collapsed .nav .count{position:absolute;margin:0 0 24px 25px}
.admin-main{min-width:0}.topbar{height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:5}.topbar-title{display:flex;align-items:center;gap:12px}.topbar h1{font-size:20px;margin:0}.panel-toggle{width:36px;height:36px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--navy);font-weight:900}.panel-toggle:hover{background:var(--canvas)}.topbar-actions{display:flex;gap:9px;align-items:center}.sync-state{font-size:12px;color:var(--muted);display:flex;gap:7px;align-items:center}.sync-state:before{content:"";width:8px;height:8px;background:var(--green);border-radius:2px}
.content{padding:28px;max-width:1550px;margin:auto}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:22px}.page-head>div{min-width:0}.page-head .btn{flex:0 0 auto;white-space:nowrap}.page-head h2{font-size:30px;letter-spacing:-.03em;margin:4px 0}.page-head p{color:var(--muted);margin:0}.date-chip{padding:9px 12px;background:#fff;border:1px solid var(--line);border-radius:9px;font-size:12px;font-weight:700}
.kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:14px}.kpi{background:#fff;border:1px solid var(--line);border-radius:13px;padding:18px;min-width:0}.kpi .kpi-top{display:flex;justify-content:space-between;align-items:center}.kpi .icon{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:var(--teal-soft);color:var(--teal);font-weight:900}.kpi.warn .icon{background:var(--orange-soft);color:var(--orange)}.kpi.purple .icon{background:var(--purple-soft);color:var(--purple)}.kpi strong{display:block;font-size:30px;letter-spacing:-.04em;margin:16px 0 2px}.kpi small{color:var(--muted)}.kpi .sub{font-size:11px;margin-top:8px;color:var(--muted)}
.dashboard-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:14px;margin-top:14px}.card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:20px;min-width:0}.card-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}.card h3{font-size:15px;margin:0}.card-head span{font-size:11px;color:var(--muted)}
.bar-list{display:grid;gap:15px}.bar-label{display:flex;justify-content:space-between;font-size:12px;margin-bottom:6px}.bar-track{height:8px;border-radius:99px;background:#e8eeef;overflow:hidden}.bar-fill{height:100%;border-radius:99px;background:var(--teal)}.bar-row:nth-child(2) .bar-fill{background:var(--orange)}.bar-row:nth-child(3) .bar-fill{background:var(--purple)}
.donut-wrap{display:grid;grid-template-columns:132px 1fr;gap:12px;align-items:center}.donut{width:126px;height:126px;border-radius:50%;position:relative;display:grid;place-items:center;background:conic-gradient(var(--teal) var(--donut),#e8eeef 0)}.donut:after{content:"";width:78px;height:78px;background:#fff;border-radius:50%;position:absolute}.donut b{z-index:1;font-size:22px}.legend{display:grid;gap:10px}.legend div{font-size:12px;color:var(--muted)}.legend b{color:var(--ink);display:block;font-size:17px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;background:var(--teal)}.dot.gray{background:#d5dfe1}.alert-card{border-left:4px solid var(--orange)}.alert-list{display:grid;gap:12px}.alert-item{display:flex;gap:10px;align-items:flex-start}.alert-item .badge{margin-top:1px}.alert-item p{margin:0;font-size:12px;line-height:1.45}.alert-item small{color:var(--muted)}
.section{margin-top:14px}.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:13px}.toolbar .search{min-width:260px;flex:1}.toolbar select{width:auto;min-width:160px}.table-card{background:#fff;border:1px solid var(--line);border-radius:13px;overflow:hidden}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:12px}.data-table th{background:#edf2f2;color:#455563;text-transform:uppercase;letter-spacing:.045em;font-size:10px;text-align:left;padding:12px;border-bottom:1px solid var(--line);position:sticky;top:0}.data-table td{padding:12px;border-bottom:1px solid #edf1f2}.data-table tr:hover td{background:#fafcfc}.data-table .client{max-width:260px;overflow:hidden;text-overflow:ellipsis}.empty{padding:50px;text-align:center;color:var(--muted)}
.badge{display:inline-flex;align-self:flex-start;line-height:1;padding:5px 7px;border-radius:6px;background:#e9eef0;color:#51616e;font-size:10px;font-weight:850;letter-spacing:.03em}.badge.ok{background:#dff2e9;color:#16704e}.badge.warn{background:var(--orange-soft);color:#a4510b}.badge.info{background:var(--teal-soft);color:#08695f}.badge.danger{background:var(--red-soft);color:#a93630}.badge.purple{background:var(--purple-soft);color:#62428f}
.split{display:grid;grid-template-columns:1fr 360px;gap:14px}.assign-panel{position:sticky;top:92px;height:max-content}.selection-total{display:flex;justify-content:space-between;align-items:baseline;padding:13px;background:var(--canvas);border-radius:10px;margin:12px 0 16px}.selection-total strong{font-size:24px}.hint{font-size:11px;line-height:1.5;color:var(--muted)}.capacity-result{padding:12px;border-radius:9px;margin-top:12px;font-size:12px;background:var(--teal-soft);color:#075e56}.capacity-result.warn{background:var(--orange-soft);color:#924806}.capacity-result.danger{background:var(--red-soft);color:#9d332e}
.sheet-mode{display:grid;gap:3px;padding:12px;border-left:3px solid var(--orange);background:var(--orange-soft);margin:-3px 0 18px}.sheet-mode b{font-size:12px}.sheet-mode span{font-size:11px;color:#8a5829}
.onboarding-card{display:grid;gap:7px;margin-bottom:14px;border-left:4px solid var(--teal)}.onboarding-card b{font-size:14px}.onboarding-card span{font-size:12px;color:var(--muted)}.guide-grid{display:grid;gap:10px}.guide-step{display:grid;gap:5px;padding:13px;background:var(--canvas);border-left:3px solid var(--teal)}.guide-step b{font-size:13px}.guide-step span{font-size:12px;line-height:1.5;color:var(--muted)}.install-card{margin-top:12px;display:flex;justify-content:space-between;align-items:center;gap:12px}.install-card p{margin:5px 0 0}
.fleet-grid,.people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}.vehicle-card,.person-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px}.vehicle-card h3,.person-card h3{margin:0 0 4px;font-size:17px}.meta{font-size:12px;color:var(--muted);display:grid;gap:5px;margin-top:14px}.meta div{display:flex;justify-content:space-between;gap:12px}.meta b{color:var(--ink);text-align:right}
.catalog-tabs{display:flex;gap:4px;margin-bottom:12px;padding:4px;width:max-content;max-width:100%;overflow:auto;background:#e5ecec;border-radius:10px}.catalog-tab{border:0;background:transparent;color:#53636e;border-radius:7px;padding:9px 13px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;white-space:nowrap}.catalog-tab b{display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:5px;background:rgba(16,58,71,.08);font-size:10px}.catalog-tab.active{background:#fff;color:var(--navy);box-shadow:0 1px 4px rgba(16,58,71,.12)}.catalog-tab.active b{background:var(--teal-soft);color:var(--teal)}
.catalog-panel{background:#fff;border:1px solid var(--line);border-radius:13px;padding:14px}.catalog-toolbar{display:grid;grid-template-columns:minmax(220px,1.5fr) repeat(3,minmax(155px,.7fr));gap:9px}.catalog-toolbar input,.catalog-toolbar select{width:100%;min-width:0;border:1px solid var(--line);border-radius:9px;background:#fff;padding:10px 11px;color:var(--ink);outline:none}.catalog-toolbar input:focus,.catalog-toolbar select:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(8,127,114,.12)}.catalog-help{margin:12px 0 0;padding:10px 12px;border-left:3px solid var(--teal);background:#f3f8f7;color:var(--muted);font-size:11px}.catalog-help b{color:var(--ink)}.catalog-result{margin-top:12px}.catalog-count{margin:0 2px 8px;color:var(--muted);font-size:11px}.catalog-table .carrier-row td{padding:9px 12px;background:#f2f6f5;color:var(--teal);font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.055em}.carrier-row td span{margin-right:8px}.carrier-row td b{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:5px;background:#dbeae7;color:#176a61;font-size:10px}.catalog-table .row-main{display:grid;gap:3px;min-width:190px}.catalog-table .row-main b{font-size:12px;color:var(--ink)}.catalog-table .row-main span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.catalog-table .number-cell{text-align:right}.catalog-table .missing{color:#a4510b;font-weight:750}.catalog-empty{display:grid;justify-items:center;gap:5px;padding:48px;color:var(--muted);text-align:center}.catalog-empty b{color:var(--ink)}.catalog-empty span{font-size:12px}
.mobile-shell{min-height:100vh;background:#e9efee;padding:18px}.phone{max-width:480px;margin:auto;min-height:calc(100vh - 36px);background:#fff;border-radius:24px;box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column}.mobile-head{background:var(--navy);color:#fff;padding:22px 20px 26px;position:relative;overflow:hidden}.mobile-head:before{content:"";position:absolute;width:220px;height:1px;background:rgba(255,255,255,.12);right:-35px;top:28px;box-shadow:0 24px rgba(255,255,255,.1),0 48px rgba(255,255,255,.08),0 72px rgba(255,255,255,.06);transform:skewY(-12deg)}.mobile-head:after{content:"TRANSIT / LIVE";position:absolute;right:18px;bottom:18px;font:700 9px/1 monospace;letter-spacing:.12em;color:rgba(255,255,255,.35)}.mobile-head>*{position:relative;z-index:1}.mobile-head-top{display:flex;justify-content:space-between;align-items:center}.mobile-head h1{font-size:22px;margin:20px 0 4px}.mobile-head p{margin:0;color:#bdd0d5;font-size:13px}.profile-dot{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:var(--orange);font-weight:850}.demo-ribbon{background:#fff0df;color:#9f4f0c;font-size:11px;font-weight:800;padding:7px 20px;text-align:center}.mobile-body{padding:18px 18px 96px;flex:1}.mobile-section-title{display:flex;justify-content:space-between;align-items:center;margin:2px 0 12px}.mobile-section-title h2{font-size:14px;margin:0}.dispatch-card{border:1px solid var(--line);border-radius:12px;padding:17px;box-shadow:0 5px 18px rgba(16,58,71,.06)}.dispatch-card+.dispatch-card{margin-top:12px}.dispatch-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.dispatch-card h3{font-size:21px;margin:4px 0}.dispatch-card .destination{font-weight:700;margin-top:12px}.route-line{height:auto;background:transparent;margin:14px 0;display:flex;align-items:center;gap:8px;color:#7b8994;font:800 9px/1 monospace;letter-spacing:.08em}.route-line:before,.route-line:after{content:"";height:2px;background:#cfdadc;flex:1}.route-line i{font-style:normal;color:var(--orange);font-size:15px}.dispatch-facts{display:grid;grid-template-columns:1fr 1fr;gap:10px}.fact{background:var(--canvas);padding:10px;border-radius:7px}.fact-wide{grid-column:1/-1}.fact span{display:block;font-size:10px;text-transform:uppercase;color:var(--muted);font-weight:800}.fact b{display:block;font-size:13px;margin-top:3px}.materials{margin-top:14px}.materials summary{font-size:12px;font-weight:800;cursor:pointer}.materials ul{padding-left:18px;color:var(--muted);font-size:12px}.movement-tech{border-top:1px solid var(--line);margin-top:15px;padding-top:13px}.movement-tech-head{display:flex;justify-content:space-between;font:800 9px/1 monospace;letter-spacing:.08em;color:var(--muted)}.movement-track{display:grid;grid-template-columns:repeat(6,1fr);margin-top:12px;position:relative}.movement-track:before{content:"";position:absolute;left:7%;right:7%;top:10px;height:2px;background:#dce5e7}.movement-node{position:relative;z-index:1;text-align:center;color:#8b989f}.movement-node i{display:grid;place-items:center;width:21px;height:21px;margin:auto;background:#edf2f2;border:2px solid #dce5e7;border-radius:5px;font:800 9px/1 monospace;font-style:normal}.movement-node span{display:block;font-size:8px;margin-top:5px}.movement-node.done i{background:var(--teal);border-color:var(--teal);color:#fff}.movement-node.active i{background:var(--orange);border-color:var(--orange);color:#fff;box-shadow:0 0 0 3px var(--orange-soft)}.next-action{margin-top:15px;background:var(--teal-soft);padding:13px;border-radius:9px}.next-action small{display:block;color:#39766f;margin-bottom:8px}.next-action .btn{width:100%;background:var(--teal);font-size:15px;min-height:50px}.incident-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:11px}.incident-row .btn{font-size:12px}.mobile-nav{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);width:min(calc(100% - 36px),480px);background:#fff;border-top:1px solid var(--line);border-radius:0 0 18px 18px;display:grid;grid-template-columns:repeat(4,1fr);padding:9px 8px 12px;box-shadow:0 -6px 18px rgba(16,58,71,.05)}.mobile-nav button{border:0;background:none;color:var(--muted);font-size:10px;font-weight:750;padding:7px}.mobile-nav button.active{color:var(--teal)}.mobile-nav button b{display:block;font-size:18px;margin-bottom:2px}
.modal-backdrop{position:fixed;inset:0;background:rgba(8,22,28,.58);z-index:30;display:grid;place-items:center;padding:18px}.modal{background:#fff;border-radius:16px;padding:22px;width:min(540px,100%);max-height:90vh;overflow:auto}.modal h2{margin:0 0 5px}.modal>p{margin:0 0 18px;color:var(--muted);font-size:13px}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px}.toast{position:fixed;right:20px;bottom:20px;z-index:60;background:var(--navy-2);color:#fff;padding:13px 16px;border-radius:10px;box-shadow:var(--shadow);font-size:13px;max-width:380px;transform:translateY(120px);opacity:0;transition:.25s}.toast.show{transform:none;opacity:1}.toast.error{background:var(--red)}
.device-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:4px;background:#e8eeee;border-radius:10px;margin-bottom:14px}.device-tabs button{border:0;border-radius:7px;background:transparent;padding:9px;font-size:12px;font-weight:800;color:var(--muted)}.device-tabs button.active{background:#fff;color:var(--teal);box-shadow:0 1px 4px rgba(16,58,71,.12)}.device-detected{font-size:11px;font-weight:850;color:var(--teal);text-transform:uppercase;letter-spacing:.08em;margin-bottom:9px}.install-direct,.install-copy{width:100%;margin:4px 0 10px}.install-ready{display:grid;gap:5px;padding:18px;background:var(--teal-soft);border-radius:10px;color:var(--teal)}.install-ready span{font-size:12px}
.load-detail{border:1px solid var(--line);border-radius:9px;background:#fbfcfc;padding:11px}.load-lines{display:grid;gap:8px;margin-top:11px}.load-lines div{display:grid;gap:3px;padding-bottom:8px;border-bottom:1px solid #e8eeee}.load-lines span{font-size:11px;color:var(--muted)}.load-lines b{font-size:12px}.load-check{display:flex;gap:9px;align-items:flex-start;margin-top:11px;padding:11px;background:var(--orange-soft);border-radius:8px;font-size:12px;font-weight:750}.load-check input{width:18px;height:18px;accent-color:var(--teal)}.load-confirmed{display:flex;justify-content:space-between;gap:8px;margin-top:11px;padding:10px;background:var(--teal-soft);border-radius:8px;color:var(--teal);font-size:11px}.load-pending{margin-top:10px;color:#9a571b;font-size:11px}.incident-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.incident-row .btn{font-size:11px;padding:9px}.report-modal input[type=file]{padding:10px;background:#f8faf9}.photo-help{font-size:10px;color:var(--muted)}.location-notice{margin-top:12px;padding:10px;border-radius:8px;background:var(--teal-soft);color:#176a61;font-size:11px;font-weight:750}
.tracking-kpis{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:12px;margin-bottom:14px}.tracking-toolbar{grid-template-columns:170px minmax(240px,1fr) 180px 180px}.tracking-table td{vertical-align:top}.tracking-table small{display:block;margin-top:3px;color:var(--muted);font-size:10px}.tracking-table .row-main{display:grid;gap:3px;min-width:205px}.tracking-table .row-main span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.tracking-table .row-main small{max-width:250px;text-transform:none;letter-spacing:0;white-space:normal}.evidence-strip{display:flex;gap:5px;min-width:54px}.evidence-strip a{display:block}.evidence-strip img{width:42px;height:42px;border-radius:7px;object-fit:cover;border:1px solid var(--line);background:#edf2f2}.map-link{display:inline-flex;padding:6px 8px;border-radius:7px;background:var(--teal-soft);color:var(--teal);font-size:10px;font-weight:850;text-decoration:none}
.offline{background:var(--orange-soft);color:#8d480f;padding:8px 18px;text-align:center;font-size:11px;font-weight:750}.skeleton{background:#e9eeee;min-height:20px;border-radius:7px;animation:pulse 1.2s infinite alternate}@keyframes pulse{to{opacity:.45}}
@media(max-width:1100px){.kpi-grid{grid-template-columns:repeat(3,1fr)}.dashboard-grid{grid-template-columns:1fr 1fr}.dashboard-grid>.card:first-child{grid-column:1/-1}.split{grid-template-columns:1fr}.assign-panel{position:static}.catalog-toolbar{grid-template-columns:1fr 1fr}.tracking-kpis{grid-template-columns:1fr 1fr}}
@media(max-width:820px){.login-page{grid-template-columns:1fr}.login-visual{display:none}.admin-shell{grid-template-columns:76px 1fr}.sidebar{padding:18px 10px}.sidebar .product-name,.sidebar .brand-logo,.nav button span:not(.count),.sidebar-foot strong,.sidebar-foot span,.sidebar-foot .btn{display:none}.sidebar .brand-symbol{display:block}.sidebar .brand{padding:0 7px 22px}.nav button{justify-content:center}.content{padding:18px}.topbar{padding:0 18px}.kpi-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.dashboard-grid>.card:first-child{grid-column:auto}}
@media(max-width:560px){.admin-shell{display:block}.sidebar{display:none}.topbar{height:62px}.content{padding:14px}.kpi-grid{grid-template-columns:1fr 1fr;gap:9px}.kpi{padding:14px}.kpi strong{font-size:25px}.page-head{align-items:flex-start;flex-direction:column}.page-head .btn{width:100%}.page-head h2{font-size:25px}.dashboard-grid{gap:9px}.catalog-toolbar{grid-template-columns:1fr}.catalog-panel{padding:10px}.tracking-kpis{grid-template-columns:1fr 1fr;gap:8px}.tracking-kpis .kpi{padding:12px}.device-tabs{grid-template-columns:1fr}.mobile-shell{padding:0}.phone{min-height:100vh;border-radius:0}.mobile-nav{bottom:0;width:100%;border-radius:0}.login-panel{padding:26px}.login-panel h1{font-size:38px}.demo-actions{display:grid}.demo-actions .btn{width:100%}}
@media(max-width:560px){.mode-grid{grid-template-columns:1fr}.install-card{align-items:flex-start;flex-direction:column}.install-card .btn{width:100%}}

/* Holcim Motion System ---------------------------------------------------- */
:root{
  --holcim-green:#94c12e;--holcim-blue:#04bbf1;--holcim-deep:#123f56;
  --route-gradient:linear-gradient(110deg,var(--holcim-green) 0%,var(--holcim-blue) 58%,#2676a6 100%);
  --shadow:0 18px 48px rgba(10,48,60,.1);--shadow-hover:0 24px 54px rgba(10,48,60,.15);
}
html{font-synthesis:none;scroll-behavior:smooth}
body{background-color:#f2f5f3;background-image:linear-gradient(rgba(16,58,71,.027) 1px,transparent 1px),linear-gradient(90deg,rgba(16,58,71,.027) 1px,transparent 1px);background-size:32px 32px}
::selection{background:#bfeef5;color:var(--navy-2)}
.eyebrow{position:relative;padding-left:30px;color:#08766d}.eyebrow:before{content:"";position:absolute;left:0;top:50%;width:19px;height:2px;background:var(--route-gradient);transform:translateY(-50%)}
.btn{border-radius:6px;position:relative;overflow:hidden;transition:transform .24s ease,box-shadow .24s ease,filter .24s ease}.btn:hover{transform:translateY(-2px);box-shadow:0 9px 24px rgba(10,48,60,.15)}.btn:active{transform:translateY(0)}.btn.primary,.btn.secondary,.next-action .btn{background:var(--route-gradient);color:#071f28}.btn.primary:after,.btn.secondary:after,.next-action .btn:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.34) 49%,transparent 63%);transform:translateX(-120%);transition:transform .7s ease}.btn.primary:hover:after,.btn.secondary:hover:after,.next-action .btn:hover:after{transform:translateX(120%)}
.badge{border-radius:3px;border-left:2px solid currentColor}.date-chip{border-radius:3px;border-top:2px solid var(--holcim-green)}

.mode-page{position:relative}.mode-page:before{content:"TMS / MOVILIDAD / CONTROL";position:absolute;right:28px;top:28px;color:#9aa8ae;font:750 9px/1 ui-monospace,monospace;letter-spacing:.17em}.mode-page:after{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(115deg,transparent 0 61%,rgba(4,187,241,.055) 61% 61.2%,transparent 61.2%),radial-gradient(circle at 78% 22%,rgba(148,193,46,.12),transparent 18%)}
.mode-page>*{animation:rise-in .62s both}.mode-page>*:nth-child(2){animation-delay:.06s}.mode-page>*:nth-child(3){animation-delay:.12s}.mode-page>*:nth-child(4){animation-delay:.18s}.mode-grid{gap:2px;background:var(--line);border:1px solid var(--line)}.mode-card{border:0;border-radius:0;padding:26px;position:relative;overflow:hidden;transition:color .28s ease,background .28s ease}.mode-card:after{content:"→";position:absolute;right:22px;top:20px;color:var(--teal);font-size:20px;transition:transform .28s ease}.mode-card:hover{background:var(--navy);color:#fff;box-shadow:none}.mode-card:hover:after{transform:translateX(5px);color:var(--holcim-green)}.mode-card:hover span{color:#c3d5d9}

.login-page{grid-template-columns:minmax(370px,42%) 1fr}.login-panel{position:relative;background:linear-gradient(125deg,#fff 0 84%,#f6f9f7 84%)}.login-panel:before{content:"";position:absolute;left:0;top:12%;width:4px;height:76%;background:var(--route-gradient)}.login-panel>*{animation:rise-in .58s both}.login-panel>*:nth-child(2){animation-delay:.06s}.login-panel>*:nth-child(3){animation-delay:.11s}.login-panel>*:nth-child(4){animation-delay:.16s}.login-panel>*:nth-child(5){animation-delay:.21s}.login-panel>*:nth-child(6){animation-delay:.26s}
.login-visual{padding:clamp(42px,5.5vw,86px);justify-content:space-between;background:linear-gradient(145deg,#082b35 0%,#103f4d 68%,#0a3440 100%)}.login-visual:before{inset:0;width:auto;height:auto;right:auto;top:auto;border:0;border-radius:0;background-image:linear-gradient(rgba(255,255,255,.042) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.042) 1px,transparent 1px);background-size:52px 52px;animation:grid-drift 22s linear infinite}.login-visual:after{content:"TMS / CONTROL DE TRANSPORTE";width:auto;height:auto;right:36px;top:30px;border:0;border-radius:0;color:rgba(255,255,255,.42);font:750 9px/1 ui-monospace,monospace;letter-spacing:.18em}.route-stage,.login-visual-copy{position:relative;z-index:1}.route-stage{min-height:330px;border:1px solid rgba(255,255,255,.13);background:rgba(3,25,32,.18);overflow:hidden}.route-stage:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 42%,rgba(4,187,241,.075) 50%,transparent 58%);animation:route-scan 5.8s ease-in-out infinite}.route-stage-head{position:absolute;z-index:2;left:18px;right:18px;top:16px;display:flex;justify-content:space-between;color:#a9bfc5;font:750 9px/1 ui-monospace,monospace;letter-spacing:.14em}.route-stage-head span i,.mobile-signal span i{display:inline-block;width:6px;height:6px;background:var(--holcim-green);box-shadow:0 0 0 4px rgba(148,193,46,.13);margin-right:7px;animation:signal-pulse 1.8s ease-in-out infinite}.route-network{position:absolute;inset:33px 0 0;width:100%;height:calc(100% - 33px)}.route-grid-path{fill:none;stroke:rgba(255,255,255,.055);stroke-width:1}.route-shadow{fill:none;stroke:rgba(255,255,255,.15);stroke-width:2}.route-flow{fill:none;stroke:url(#routeGradient);stroke:var(--holcim-blue);stroke-width:3;stroke-linecap:square;stroke-dasharray:60 22;animation:route-forward 2.8s linear infinite}.route-nodes circle{fill:#0d3d49;stroke:var(--holcim-green);stroke-width:3}.route-code{position:absolute;z-index:2;display:grid;gap:3px;padding:8px 10px;border-left:2px solid var(--holcim-blue);background:rgba(4,25,31,.74)}.route-code small{color:#8eabb2;font:700 8px/1 ui-monospace,monospace;letter-spacing:.13em}.route-code strong{font-size:11px;letter-spacing:.06em}.route-code-a{left:20px;bottom:24px}.route-code-b{right:18px;top:70px}.route-metric{position:absolute;right:24px;bottom:24px;z-index:2;display:flex;align-items:center;gap:9px}.route-metric strong{font-size:42px;line-height:.8;color:#fff}.route-metric span{color:#9eb5bb;font:700 8px/1.35 ui-monospace,monospace;letter-spacing:.12em}.login-visual-copy{max-width:690px;margin-top:42px}.login-visual .eyebrow{color:var(--holcim-green)}.login-visual h2{font-size:clamp(34px,4vw,58px);letter-spacing:-.045em}.flow-line{gap:0;border-top:1px solid rgba(255,255,255,.18);padding-top:14px}.flow-line span{border:0;border-radius:0;padding:5px 14px;color:#b9ccd1;font:700 10px/1 ui-monospace,monospace;letter-spacing:.08em;border-right:1px solid rgba(255,255,255,.17)}.flow-line span:first-child{padding-left:0}

.sidebar{background:linear-gradient(180deg,#082b35 0%,#0c3a46 100%);border-right:1px solid rgba(4,187,241,.22)}.sidebar:after{content:"";position:absolute;right:-1px;top:0;width:1px;height:34%;background:var(--route-gradient);animation:sidebar-travel 8s ease-in-out infinite}.sidebar .brand{padding-bottom:30px}.nav{gap:3px}.nav button{border-radius:3px;position:relative;transition:background .22s ease,color .22s ease,transform .22s ease}.nav button:hover{transform:translateX(3px)}.nav button.active{background:linear-gradient(90deg,rgba(4,187,241,.18),rgba(148,193,46,.06));box-shadow:inset 2px 0 var(--holcim-green)}.nav button.active:after{content:"";position:absolute;right:10px;width:5px;height:5px;background:var(--holcim-green);box-shadow:0 0 10px var(--holcim-green)}
.topbar{background:rgba(255,255,255,.9);backdrop-filter:blur(16px);border-bottom:1px solid rgba(16,58,71,.12)}.panel-toggle{border-radius:3px;transition:transform .2s ease,background .2s ease}.panel-toggle:hover{transform:translateX(-2px)}.topbar-route{display:flex;align-items:center;gap:9px;color:#87979e;font:750 8px/1 ui-monospace,monospace;letter-spacing:.13em}.topbar-route i{width:100px;height:1px;background:#d5e0e2;position:relative;overflow:hidden}.topbar-route i:after{content:"";position:absolute;top:0;width:32px;height:1px;background:var(--route-gradient);animation:topbar-flow 2.6s ease-in-out infinite}.sync-state:before{border-radius:0;background:var(--holcim-green);box-shadow:0 0 0 4px rgba(148,193,46,.12);animation:signal-pulse 1.8s ease-in-out infinite}
.admin-main{background:radial-gradient(circle at 92% 2%,rgba(4,187,241,.075),transparent 18%),transparent}.content>*{animation:rise-in .48s both}.content>section{animation-delay:.05s}.content>.dashboard-grid,.content>.table-card,.content>.split,.content>.catalog-panel{animation-delay:.1s}.page-head{position:relative;padding-bottom:18px;border-bottom:1px solid #d7e1e2}.page-head:after{content:"";position:absolute;left:0;bottom:-1px;width:88px;height:2px;background:var(--route-gradient)}.page-head h2{font-size:34px}
.kpi,.card,.table-card,.catalog-panel,.vehicle-card,.person-card{border-radius:7px;position:relative}.kpi,.card,.vehicle-card,.person-card{transition:transform .27s ease,box-shadow .27s ease,border-color .27s ease}.kpi:hover,.card:hover,.vehicle-card:hover,.person-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);border-color:#bfd0d4}.kpi{overflow:hidden}.kpi:before{content:"";position:absolute;left:0;top:0;width:100%;height:2px;background:var(--route-gradient);transform:scaleX(0);transform-origin:left;animation:grow-line .75s .15s ease forwards}.kpi:nth-child(2):before{animation-delay:.23s}.kpi:nth-child(3):before{animation-delay:.31s}.kpi:nth-child(4):before{animation-delay:.39s}.kpi:nth-child(5):before{animation-delay:.47s}.kpi .icon{border-radius:3px}.kpi strong{font-variant-numeric:tabular-nums}.bar-track{height:6px;border-radius:0}.bar-fill{border-radius:0;transform-origin:left;animation:bar-grow 1s .25s cubic-bezier(.2,.75,.2,1) both}.bar-row:first-child .bar-fill{background:var(--route-gradient)}.donut{border-radius:50%;animation:donut-in .75s .2s cubic-bezier(.2,.75,.2,1) both}.data-table th{background:#eef3f2}.data-table tbody tr{transition:transform .18s ease,background .18s ease}.data-table tbody tr:hover{transform:translateX(2px)}

.mobile-shell{background:linear-gradient(150deg,#082b35,#154653);position:relative}.phone{border-radius:18px;box-shadow:0 32px 90px rgba(1,20,26,.34)}.mobile-head{min-height:225px;padding:21px 20px 29px;background:linear-gradient(145deg,#082b35 0%,#104654 100%);border-bottom:3px solid transparent;border-image:var(--route-gradient) 1}.mobile-head:before{inset:-25%;width:auto;height:auto;right:-25%;top:-25%;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:34px 34px;box-shadow:none;transform:rotate(-7deg);animation:grid-drift-mobile 15s linear infinite}.mobile-head:after{content:"13 OCT 2026 / LIMA";right:18px;bottom:16px}.mobile-head-top .brand-logo{width:125px}.mobile-signal{display:flex;justify-content:space-between;align-items:center;margin-top:24px;color:#9fb9c0;font:750 8px/1 ui-monospace,monospace;letter-spacing:.12em}.mobile-head h1{font-size:28px;letter-spacing:-.035em;margin:15px 0 4px}.mobile-head p{max-width:320px;line-height:1.5}.demo-ribbon{border-bottom:1px solid #f4d2a8}.mobile-body>*{animation:rise-in .45s both}.dispatch-card{position:relative;border:0;border-radius:7px;padding:19px;box-shadow:0 13px 34px rgba(16,58,71,.12);overflow:hidden}.dispatch-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--route-gradient)}.dispatch-card:after{content:"";position:absolute;right:-22px;top:-22px;width:58px;height:58px;border:1px solid rgba(4,187,241,.16);transform:rotate(45deg)}.dispatch-card+.dispatch-card{margin-top:15px}.dispatch-card h3{letter-spacing:-.04em}.route-line:before{background:linear-gradient(90deg,#d4dddf 0%,var(--holcim-green) 45%,var(--holcim-blue) 55%,#d4dddf 100%);background-size:220% 100%;animation:route-shimmer 3.2s linear infinite}.route-line:after{background:#d4dddf}.route-line i{color:var(--holcim-blue)}.fact{border-radius:3px;border-bottom:2px solid #dbe5e5}.materials summary{padding:3px 0}.movement-track:before{background:linear-gradient(90deg,var(--holcim-green),var(--holcim-blue),#dce5e7)}.movement-node i{border-radius:2px}.movement-node.done i{background:#178274}.movement-node.active i{background:var(--holcim-blue);border-color:var(--holcim-blue);color:#072b35;box-shadow:0 0 0 4px rgba(4,187,241,.14);animation:active-node 1.7s ease-in-out infinite}.next-action{border-radius:4px;border-left:2px solid var(--holcim-blue);background:linear-gradient(110deg,rgba(148,193,46,.12),rgba(4,187,241,.12))}.mobile-nav{border-radius:0 0 14px 14px;background:rgba(255,255,255,.94);backdrop-filter:blur(18px)}.mobile-nav button{position:relative;transition:color .2s ease,transform .2s ease}.mobile-nav button.active{color:#08766d;transform:translateY(-2px)}.mobile-nav button.active:after{content:"";position:absolute;left:35%;right:35%;bottom:1px;height:2px;background:var(--route-gradient)}

@keyframes rise-in{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:none}}
@keyframes route-forward{to{stroke-dashoffset:-164}}
@keyframes route-scan{0%,100%{transform:translateX(-75%)}50%{transform:translateX(75%)}}
@keyframes signal-pulse{0%,100%{opacity:.48;box-shadow:0 0 0 2px rgba(148,193,46,.1)}50%{opacity:1;box-shadow:0 0 0 6px rgba(148,193,46,.13)}}
@keyframes grid-drift{to{background-position:52px 52px}}
@keyframes grid-drift-mobile{to{background-position:34px 34px}}
@keyframes sidebar-travel{0%,100%{transform:translateY(-110%)}50%{transform:translateY(295%)}}
@keyframes topbar-flow{0%{transform:translateX(-36px)}100%{transform:translateX(110px)}}
@keyframes grow-line{to{transform:scaleX(1)}}
@keyframes bar-grow{from{transform:scaleX(0)}}
@keyframes donut-in{from{opacity:0;transform:rotate(-35deg) scale(.88)}to{opacity:1;transform:none}}
@keyframes route-shimmer{to{background-position:-220% 0}}
@keyframes active-node{0%,100%{transform:scale(.92)}50%{transform:scale(1.08)}}

@media(max-width:1100px){.topbar-route{display:none}.login-visual{padding:44px}.route-stage{min-height:280px}}
@media(max-width:820px){.login-page{grid-template-columns:1fr}.login-visual{display:none}.mode-page:before{display:none}}
@media(max-width:560px){body{background:#fff}.mobile-shell{background:#fff}.phone{border-radius:0;box-shadow:none}.mobile-head{min-height:215px}.login-panel{background:#fff}.login-panel:before{width:3px}.login-panel>*{animation-duration:.42s}.page-head h2{font-size:27px}.kpi:hover,.card:hover,.vehicle-card:hover,.person-card:hover{transform:none}.mobile-nav{border-radius:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Commercial access ------------------------------------------------------ */
.portal-home{max-width:1060px}.portal-home .mode-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.commercial-shell .sidebar{background:linear-gradient(180deg,#0b3542 0%,#103f4d 100%)}
.access-tabs{margin:16px 0 14px}.access-view-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 12px;padding:15px 18px;border:1px solid var(--line);border-left:3px solid var(--teal);background:#f8fbfa}.access-view-head h3{margin:0 0 4px}.access-view-head p{margin:0;color:var(--muted);font-size:12px}
.user-access-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(220px,.7fr);gap:14px;margin-bottom:14px}.user-create{padding:20px}.user-create-fields{display:grid;grid-template-columns:150px minmax(220px,1fr) 170px auto;gap:10px;align-items:end;margin-top:18px}.commercial-user-fields{grid-template-columns:125px minmax(190px,1fr) minmax(130px,.7fr) 145px 145px auto}.user-create-fields .btn{min-height:40px}.access-summary{display:grid;align-content:start;gap:3px;padding:21px;background:linear-gradient(145deg,#082b35,#104654);color:#fff}.access-summary .eyebrow{color:var(--holcim-green)}.access-summary strong{font-size:46px;line-height:1;margin-top:12px}.access-summary span{color:#bed1d6;font-size:12px}.access-summary p{margin:18px 0 0;color:#9eb7bd;font-size:11px;line-height:1.5}.users-toolbar,.request-toolbar{grid-template-columns:minmax(240px,1fr) 190px}.request-table td{vertical-align:middle}.row-actions{display:flex;flex-wrap:wrap;gap:7px}.row-actions .btn[disabled]{opacity:.4;pointer-events:none}
.request-form-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:13px;margin-top:18px}.request-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;opacity:0!important}.request-success{display:grid;justify-items:start;gap:9px}.request-success>span{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--teal-soft);color:var(--teal);font-size:24px;font-weight:900}.request-success h2,.request-success p{margin:0}.request-success .btn{margin-top:12px;width:100%}
@media(max-width:1000px){.portal-home .mode-grid{grid-template-columns:1fr 1fr}.user-access-grid{grid-template-columns:1fr}.user-create-fields,.commercial-user-fields{grid-template-columns:1fr 1fr}.access-summary{min-height:180px}}
@media(max-width:620px){.portal-home .mode-grid,.user-create-fields,.commercial-user-fields,.users-toolbar,.request-toolbar,.request-form-grid{grid-template-columns:1fr}.user-create{padding:14px}.row-actions{min-width:170px}.access-view-head{align-items:flex-start;flex-direction:column}.access-view-head .btn{width:100%}}

/* Operational contrast and type hierarchy ------------------------------- */
:root{--canvas:#e7eeeb;--paper:#f7faf8;--line:#cad8d5;--ink:#102a34;--muted:#5f7178;--surface:#f7faf8;--surface-alt:#edf4f1;--surface-warm:#f7f3ea}
.admin-shell{background:#e7eeeb}.admin-main{background:radial-gradient(circle at 92% 0,rgba(4,187,241,.12),transparent 23%),linear-gradient(180deg,#dce7e3 0,#e9efec 210px,#e5ece9 100%)}
.topbar{height:76px;background:rgba(235,242,239,.94);border-bottom:1px solid #bdceca;box-shadow:0 5px 18px rgba(8,43,53,.055)}
.topbar-title{gap:14px}.topbar-context{display:grid;gap:3px}.topbar-context small{color:#778b91;font:800 8px/1 ui-monospace,monospace;letter-spacing:.16em;text-transform:uppercase}.topbar h1{font-size:14px;line-height:1.1;letter-spacing:.015em;color:#173b47}.panel-toggle{background:#f7faf8;border-color:#bdceca}
.content{padding:32px}.page-head{align-items:center;margin-bottom:18px;padding:24px 28px;border:1px solid #174a57;border-left:4px solid var(--holcim-green);border-radius:8px;background:linear-gradient(118deg,#0b3340 0%,#124b59 72%,#176074 100%);box-shadow:0 18px 38px rgba(8,43,53,.16);overflow:hidden}.page-head:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(90deg,transparent 36%,#000)}.page-head:after{left:0;bottom:0;width:100%;height:3px;background:var(--route-gradient)}.page-head>*{position:relative;z-index:1}.page-head .eyebrow{padding-left:24px;color:#b7da5d;font-size:10px;letter-spacing:.16em}.page-head .eyebrow:before{width:14px;background:#b7da5d}.page-head h2{margin:7px 0 5px;color:#fff;font-size:clamp(30px,3vw,40px);line-height:1;letter-spacing:-.045em}.page-head p{color:#bdd0d5;font-size:13px;line-height:1.5}.date-chip{background:rgba(3,27,34,.3);border:1px solid rgba(255,255,255,.18);border-top:2px solid var(--holcim-green);color:#fff}.page-head .btn.ghost{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.24);color:#fff}
.kpi-grid{gap:11px}.kpi{background:linear-gradient(145deg,var(--surface) 0%,#f0f6f3 100%);border-color:#c6d5d2;box-shadow:0 7px 20px rgba(12,51,61,.055);padding:19px 20px}.kpi:nth-child(even){background:linear-gradient(145deg,#f3f8f6 0%,#eaf2ef 100%)}.kpi .kpi-top small{text-transform:uppercase;letter-spacing:.075em;font-size:9px;font-weight:850;color:#61777e}.kpi strong{margin:13px 0 2px;color:#0a3542;font-size:34px;line-height:1}.kpi .sub{color:#687d82;font-size:10px}.kpi .icon{background:#d5eae5}
.card,.catalog-panel,.table-card,.vehicle-card,.person-card{background:var(--surface);border-color:#c5d4d1;box-shadow:0 7px 22px rgba(11,48,58,.055)}.dashboard-grid>.card:nth-child(2){background:var(--surface-alt)}.dashboard-grid>.card:nth-child(3){background:var(--surface-warm)}.card-head{gap:16px}.card h3,.card-head h3,.access-view-head h3{font-size:17px;line-height:1.2;letter-spacing:-.018em;color:#123744}.card-head span{display:block;margin-top:4px;color:#718289;font-size:9px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.section>.card-head{align-items:flex-end;padding:8px 4px 1px}.section>.card-head h3{font-size:20px}.section>.card-head span{text-transform:none;letter-spacing:0;font-size:11px}.bar-label{color:#46616a}.bar-label b{color:#123744}.bar-track{background:#d8e3e0}.donut:after{background:var(--surface-alt)}
.table-card{overflow:hidden}.data-table th{background:#dce7e3;color:#38545e;font-size:9px;letter-spacing:.085em;padding:13px 12px}.data-table td{border-bottom-color:#dce6e3;background:rgba(247,250,248,.68)}.data-table tbody tr:nth-child(even) td{background:rgba(236,244,241,.72)}.data-table tr:hover td{background:#e3efeb}.catalog-panel{padding:16px}.catalog-toolbar{padding:10px;background:#e4ece9;border:1px solid #cedbd8;border-radius:6px}.catalog-toolbar input,.catalog-toolbar select{background:#f9fbfa;border-color:#c1d0cd}.catalog-tabs{background:#cedbd7;border:1px solid #c1d0cd}.catalog-tab{color:#405c65}.catalog-tab.active{background:#f7faf8}.catalog-count{color:#5f747b;font-weight:700}.catalog-table .carrier-row td{background:#dce9e5}.access-view-head{padding:18px 20px;background:linear-gradient(90deg,#dceae6,#edf4f1);border-color:#c3d4d0;border-left-color:var(--teal)}.access-view-head h3{font-size:19px}.access-view-head p{font-size:12px;line-height:1.5}.selection-total,.guide-step,.fact{background:#e8f0ed}.field label{color:#405862}.field input,.field select,.field textarea,.toolbar input,.toolbar select{background:#fbfcfb;border-color:#c4d2cf}
@media(max-width:820px){.content{padding:22px}.page-head{padding:22px}.topbar{height:70px}}
@media(max-width:560px){body{background:#e7eeeb}.content{padding:12px}.topbar{height:66px;padding:0 14px}.topbar-context small{display:none}.topbar h1{font-size:13px}.page-head{padding:20px 18px;border-left-width:3px}.page-head h2{font-size:29px}.page-head p{font-size:12px}.kpi{padding:15px}.kpi strong{font-size:27px}.card,.catalog-panel{padding:15px}}

/* Driver viewport: stable screen, horizontal dispatches ------------------ */
.mobile-shell{height:100dvh;min-height:0;padding:12px;overflow:hidden}.phone{height:calc(100dvh - 24px);min-height:0}.mobile-head{min-height:0;padding:16px 18px 18px;flex:0 0 auto}.mobile-head-top .brand-logo{width:112px}.mobile-signal{margin-top:12px}.mobile-head h1{font-size:24px;margin:10px 0 3px}.mobile-head p{font-size:12px;line-height:1.35}.mobile-head:after{bottom:12px}.mobile-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;padding:13px 14px 78px}.mobile-body::-webkit-scrollbar,.dispatch-deck::-webkit-scrollbar{display:none}.mobile-section-title{margin:0 1px 9px}.driver-count{display:flex;align-items:center;gap:8px}.driver-count small{color:var(--muted);font:750 9px/1 ui-monospace,monospace;letter-spacing:.06em}.dispatch-deck{display:grid;grid-auto-flow:column;grid-auto-columns:100%;gap:12px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none}.dispatch-deck>.dispatch-card{scroll-snap-align:start;margin:0}.dispatch-card{padding:15px}.dispatch-card h3{font-size:19px;margin:2px 0}.dispatch-card .destination{margin-top:8px}.route-line{margin:10px 0}.dispatch-facts{gap:7px}.fact{padding:8px}.movement-tech{margin-top:11px;padding-top:10px}.movement-track{margin-top:8px}.movement-node span{font-size:7px}.next-action{margin-top:11px;padding:10px}.next-action small{margin-bottom:6px;font-size:10px}.next-action .btn{min-height:44px}.dispatch-more{margin-top:10px;border:1px solid #d3dfdc;background:#f3f7f5}.dispatch-more>summary{list-style:none;padding:11px 12px;color:#24505b;font-size:11px;font-weight:850;cursor:pointer;display:flex;justify-content:space-between;align-items:center}.dispatch-more>summary::-webkit-details-marker{display:none}.dispatch-more>summary:after{content:"+";font-size:16px;color:var(--teal)}.dispatch-more[open]>summary:after{content:"−"}.dispatch-more[open]>summary{border-bottom:1px solid #d3dfdc}.dispatch-more .load-detail{margin:10px;border-radius:4px}.detail-label{font-size:12px;font-weight:850}.dispatch-more .incident-row{margin:0 10px 10px}.mobile-nav{bottom:12px;width:min(calc(100% - 24px),480px);padding:7px 8px 9px}
@media(max-width:560px){.mobile-shell{height:100dvh;padding:0}.phone{height:100dvh;min-height:0}.mobile-head{min-height:0;padding:14px 16px 16px}.mobile-head h1{font-size:23px}.mobile-body{padding:12px 13px 70px}.mobile-nav{bottom:0;width:100%}}

/* Driver polish: solid actions and a stable mobile header ---------------- */
.btn.primary{background:#e87522;color:#fff;box-shadow:0 7px 18px rgba(175,78,13,.18)}
.btn.secondary{background:#3e652f;color:#fff;box-shadow:0 7px 18px rgba(43,82,34,.18)}
.next-action{background:#eef4ea;border-left:3px solid #94c12e}
.next-action small{color:#4f665e}
.next-action .btn{background:#315a2b;color:#fff;box-shadow:inset 4px 0 #b7d64c,0 8px 18px rgba(38,76,31,.2)}
.btn.primary:after,.btn.secondary:after,.next-action .btn:after{content:none}

html.driver-portal,body.driver-portal{height:100%;min-height:0;overflow:hidden;overscroll-behavior:none;background:#edf2ef}
body.driver-portal #app{height:100%}
.driver-portal .mobile-shell{height:100%;min-height:0;overflow:hidden;background:#edf2ef}
.driver-portal .phone{height:100%;min-height:0}
.driver-portal .mobile-head{padding:16px 18px 17px;background:#0d3e47;border-bottom:3px solid #a2c744;border-image:none;isolation:isolate}
.driver-portal .mobile-head:before{inset:0;width:auto;height:auto;right:auto;top:auto;border:0;border-radius:0;box-shadow:none;transform:none;background:linear-gradient(118deg,transparent 0 66%,rgba(255,255,255,.055) 66% 66.35%,transparent 66.35% 78%,rgba(162,199,68,.07) 78% 78.35%,transparent 78.35%);animation:header-route 10s ease-in-out infinite;z-index:0}
.driver-portal .mobile-head:after{content:none}
.driver-portal .mobile-head-top{min-height:34px;gap:12px}
.driver-portal .mobile-head-top .brand{gap:9px;min-width:0}
.driver-portal .mobile-head-top .brand-logo{width:108px}
.driver-portal .mobile-head-top .product-name{padding-left:9px;font-size:10px;letter-spacing:.15em}
.driver-portal .mobile-head-top .btn.ghost{width:auto;min-height:32px;padding:6px 11px;background:transparent;border:1px solid rgba(255,255,255,.34);color:#fff;box-shadow:none}
.driver-portal .mobile-signal{margin-top:11px;padding-top:10px;border-top:1px solid rgba(255,255,255,.11)}
.driver-portal .mobile-head h1{margin:10px 0 3px}
.driver-portal .mobile-head p{padding-right:0;max-width:none}
.driver-portal .mobile-nav button.active{color:#315a2b}
.driver-portal .mobile-nav button.active:after{background:#94c12e}
.install-manual{display:grid;gap:7px;padding:16px;border:1px solid #cddbc8;border-left:4px solid #94c12e;background:#f3f7ef;color:#29462a}
.install-manual b{font-size:14px}.install-manual span{font-size:12px;line-height:1.55;color:#536654}

@keyframes header-route{0%,100%{background-position:0 0}50%{background-position:34px 0}}
@media(max-width:560px){
  .driver-portal .mobile-head{padding-top:max(14px,env(safe-area-inset-top));padding-right:16px;padding-bottom:15px;padding-left:16px}
  .driver-portal .mobile-nav{padding-bottom:max(9px,env(safe-area-inset-bottom))}
  .install-modal .device-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .install-modal .device-tabs button{padding:9px 5px;font-size:11px}
}
@media(hover:none){.btn:hover{transform:none;filter:none}.btn.primary:hover,.btn.secondary:hover,.next-action .btn:hover{box-shadow:inherit}}