@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap');
:root{--navy:#101e30;--ink:#1b2b40;--muted:#788594;--line:#e6ebef;--green:#008976;--mint:#49dec3;--bg:#f5f7fa;--white:#fff;--red:#e56a6a;--orange:#df9b3c;--blue:#5188e5}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px 'DM Sans',Arial,sans-serif}button,input,select{font:inherit}button,a,input,select{outline-offset:4px}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}a{color:inherit;text-decoration:none}.sidebar{position:fixed;width:234px;inset:0 auto 0 0;background:var(--navy);color:#b2bdcb;padding:31px 20px;z-index:1100}.brand{display:flex;gap:11px;align-items:center;color:#fff;font:800 27px Manrope,sans-serif;letter-spacing:-1px}.brand-icon{background:var(--mint);color:#102b31;border-radius:10px;font:700 42px Arial;width:40px;height:40px;text-align:center;line-height:32px}.brand-sub{display:block;color:#8495aa;font:600 8px 'DM Sans',sans-serif;letter-spacing:2.1px;margin-top:6px}.workspace{display:flex;align-items:center;gap:10px;border:1px solid #2d3a4c;border-radius:8px;margin:35px 0 32px;padding:12px 10px;color:#e4eaf0;font-size:13px}.workspace-icon{background:#26374c;border-radius:6px;padding:8px;color:#b7c9dd}.workspace div span{display:block;font-size:12px;color:#8495aa;margin-top:5px}.chev{margin-left:auto}.nav-label{font-size:10px;font-weight:700;letter-spacing:1.7px;color:#687b91;margin:0 12px 14px}nav a{display:flex;gap:13px;padding:13px 14px;margin:5px 0;border-radius:7px;align-items:center;color:#96a7bb;font-weight:500}nav a.active{background:#1d3a43;color:#63e1c9}nav a:hover{background:#1c3045;color:#fff}svg.icon{width:19px;height:19px;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.nav-count{margin-left:auto;font-size:11px;background:#513437;color:#f7a9a0;border-radius:4px;padding:2px 6px}.sidebar-bottom{position:absolute;bottom:22px;left:20px;right:20px}.network-status{border-bottom:1px solid #2b3849;padding:0 7px 22px;font-size:12px;color:#c3d0dc}.network-status small{display:block;margin:8px 0 0 13px;color:#71869c;font-size:11px}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#40c9a2;margin-right:6px}.profile{display:flex;gap:10px;align-items:center;margin:20px 6px 0;color:#d9e0e8;font-size:12px}.profile small{display:block;color:#7890a6;font-size:10px;margin-top:4px}.avatar{border:1px solid #446076;color:#a9c7d7;border-radius:50%;padding:9px;font-size:11px}.shell{margin-left:234px}.topbar{height:76px;background:#fff;border-bottom:1px solid var(--line);padding:0 34px;display:flex;align-items:center;justify-content:space-between}.breadcrumb{font-size:12px;color:#929ca8}.breadcrumb span{padding:0 12px;color:#c1c7cf}.breadcrumb strong{color:#435164;font-weight:500}.topbar-right{display:flex;align-items:center;gap:21px;color:#7a8592;font-size:12px}.demo-pill{font-size:9px;font-weight:700;letter-spacing:1px;background:#edf8f5;color:#198d77;padding:6px 9px;border:1px solid #d4ece5;border-radius:4px}.icon-button{border:0;background:none;color:#627184;display:grid;place-items:center;padding:7px}.icon-button:hover{background:#f1f5f8;border-radius:5px}main{padding:31px 34px 18px;max-width:1850px;margin:auto}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;gap:16px}.eyebrow{font-size:10px;letter-spacing:1.8px;color:#8a98a7;font-weight:700;margin:0 0 7px}h1{font:750 28px Manrope,Arial,sans-serif;margin:0;letter-spacing:-1px}h2{font:750 15px Manrope,Arial,sans-serif;margin:0;letter-spacing:-.25px}h3{font-size:15px;margin:0 0 10px}.page-heading p{margin:8px 0 0;color:var(--muted);font-size:13px}.actions{display:flex;gap:9px;align-items:center}.button{border:1px solid transparent;border-radius:6px;background:var(--green);color:white;padding:10px 14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:600;white-space:nowrap}.button:hover{filter:brightness(.96)}.button.secondary{background:#fff;border-color:#dfe5eb;color:#4d5f72}.button .icon{width:15px;height:15px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin-bottom:23px}.metric{padding:20px 21px;background:#fff;border:1px solid var(--line);border-radius:9px}.metric-head{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#768392}.metric-icon{padding:6px;border-radius:6px;background:#eef7f5;color:#269b87;display:flex}.metric-icon.blue{background:#f0f5fc;color:#6190d3}.metric-icon.orange{background:#fff6e9;color:#d69a40}.metric-icon.purple{background:#f3f0fc;color:#9580c5}.metric-value{font:750 30px Manrope,sans-serif;letter-spacing:-1px;margin:10px 0 8px}.metric-value small{font:500 14px 'DM Sans',sans-serif;color:#91a0af;letter-spacing:0}.metric-foot{color:#8995a3;font-size:11px}.metric-foot b{color:#26937b;font-weight:500;margin-right:6px}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 307px;gap:20px}.panel{background:#fff;border:1px solid var(--line);border-radius:9px;overflow:hidden}.panel-head{padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}.panel-head p{font-size:11px;color:#8994a0;margin:5px 0 0}.segmented{display:flex;padding:3px;background:#f2f5f7;border-radius:6px;gap:2px}.segmented button{border:0;background:none;color:#84909e;font-size:11px;padding:6px 11px;border-radius:4px}.segmented button.active{background:white;color:#314456;box-shadow:0 1px 4px #13283c12}.map-wrap{height:369px;position:relative;background:#edf1f3}.map{height:100%;z-index:1}.map-caption{position:absolute;bottom:24px;left:16px;z-index:500;display:flex;gap:13px;align-items:center;padding:10px 12px;background:#fffffff0;border:1px solid #e6e9ec;border-radius:6px;font-size:10px;color:#6c7987;box-shadow:0 2px 12px #15223b09}.legend-dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:5px}.map-overlay{position:absolute;top:15px;left:16px;z-index:500;background:white;padding:9px 12px;border:1px solid #dfe6eb;border-radius:6px;font-size:11px;box-shadow:0 2px 9px #15223b0d}.map-footer{padding:13px 19px;display:flex;justify-content:space-between;font-size:10px;color:#8b96a2;border-top:1px solid var(--line)}.map-footer strong{font-weight:500;color:#647c8c}.camera-pin{width:28px;height:28px;border-radius:7px;background:#008b78;border:3px solid #fff;box-shadow:0 2px 6px #23483f50;display:grid;place-items:center;color:#fff}.camera-pin.warn{background:#e6a54d}.camera-pin.off{background:#96a2af}.camera-pin .icon{width:13px;height:13px}.leaflet-container{font-family:'DM Sans',sans-serif}.leaflet-control-attribution{font-size:9px!important}.leaflet-popup-content{font-size:12px;line-height:1.7}.map-notice{position:absolute;z-index:600;top:60px;left:15px;background:white;padding:8px;font-size:11px;max-width:260px}.status-badge{display:inline-block;border-radius:4px;padding:4px 7px;background:#e8f6f0;color:#2a947a;font-size:10px;font-weight:500;white-space:nowrap}.status-badge.amber{background:#fff4e4;color:#c88d36}.status-badge.red{background:#fff0ee;color:#d47569}.status-badge.gray{background:#f1f3f6;color:#8692a0}.plain-link{border:0;background:none;color:#179582;display:inline-flex;gap:6px;align-items:center;padding:0;font-size:11px;cursor:pointer}.plain-link .icon{width:13px;height:13px}.alert-list{padding:0 18px}.alert-item{padding:17px 0;border-top:1px solid var(--line);display:flex;align-items:flex-start;gap:11px}.alert-icon{background:#fff0ec;color:#df8475;padding:7px;border-radius:6px;display:flex}.alert-icon.amber{color:#d8a04c;background:#fff7eb}.alert-icon .icon{width:15px;height:15px}.alert-copy{flex:1}.alert-copy h3{font-size:12px;margin:0 0 6px;font-weight:600}.alert-copy p{font-size:11px;line-height:1.7;color:#8b96a3;margin:0}.alert-copy time{font-size:10px;color:#a3aab3;display:block;margin-top:7px}.plate{font-family:ui-monospace,Consolas,monospace;letter-spacing:.8px;color:#3e5168;font-weight:600}.alert-action{margin-top:8px}.alert-bottom{padding:15px 18px;border-top:1px solid var(--line);font-size:11px;color:#7c8b99}.lower-grid{display:grid;grid-template-columns:minmax(0,1.38fr) minmax(0,1fr);gap:20px;margin-top:20px}.chart-area{padding:0 20px 15px}.chart-svg{width:100%;height:180px;overflow:visible}.chart-label{fill:#8e9ca8;font-size:10px}.chart-grid{stroke:#edf1f4;stroke-dasharray:4 5}.chart-key{display:flex;gap:15px;font-size:10px;color:#8a99a7}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}th{font-size:10px;color:#96a1ad;font-weight:500;padding:11px 20px;background:#fbfcfd;border-block:1px solid var(--line)}td{font-size:11px;padding:12px 20px;border-bottom:1px solid #f0f3f6;color:#768698}tbody tr:last-child td{border:0}tbody tr:hover{background:#fbfdfd}td .plate{font-size:11px}td .plain-link{font-size:11px}.confidence{color:#168d77;font-size:11px}.section-space{margin-top:22px}footer{padding:15px 34px 24px;font-size:10px;color:#8e9baa}footer>span:first-child{margin-left:9px;color:#a3acb6}.footer-right{float:right}.filters{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:20px}.field{background:white;border:1px solid #dce4e9;color:#30445b;border-radius:6px;padding:10px 12px;font-size:13px;min-width:0}label{font-size:12px;color:#6f8294}.search-input{min-width:260px}.empty{padding:48px 24px;text-align:center;color:#7e8c9b;line-height:1.8}.empty h3{color:#334b60}.tracker-grid{display:grid;grid-template-columns:320px minmax(0,1fr);gap:22px}.track-map{height:540px}.journey-summary{padding:20px;border-bottom:1px solid var(--line)}.journey-summary .plate{font-size:20px}.journey-summary p{font-size:12px;color:#8b96a3;line-height:1.7}.timeline{padding:8px 22px}.timeline-item{padding:15px 0 15px 24px;position:relative;border-left:1px solid #dbe8e4;margin-left:7px}.timeline-item:before{content:'';position:absolute;left:-5px;top:21px;width:8px;height:8px;background:#03967f;border:2px solid white;border-radius:50%;box-shadow:0 0 0 1px #72c8b9}.timeline-item h3{font-size:12px;margin:0 0 6px}.timeline-item p{margin:0;font-size:11px;color:#8a99a8;line-height:1.8}.timeline-item.active{background:#eefaf6}.notice{background:#eff7fb;color:#638298;border:1px solid #dcebf2;padding:13px 16px;border-radius:7px;font-size:12px;line-height:1.7;margin-bottom:20px}.cameras-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.camera-card{padding:20px}.camera-card .camera-top{display:flex;justify-content:space-between;margin-bottom:20px}.camera-card h3{margin-bottom:5px}.camera-card p{font-size:12px;color:#8393a3;line-height:1.7}.camera-stats{display:flex;gap:28px;margin-top:18px}.camera-stats strong{display:block;color:#344f65;font-size:20px}.camera-stats small{font-size:11px;color:#94a0ad}.camera-card .button{margin-top:20px;width:100%}.analytics-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:20px}.bar-row{display:grid;grid-template-columns:105px 1fr 35px;gap:12px;align-items:center;margin:22px 20px;font-size:11px;color:#748699}.bar-track{height:8px;background:#f0f5f6;border-radius:4px;overflow:hidden}.bar-fill{height:100%;background:#30b6a0;border-radius:4px}.alert-full{display:grid;grid-template-columns:38px 1fr auto;gap:15px;padding:22px;align-items:start;border-top:1px solid var(--line)}.alert-full:first-child{border-top:0}.alert-full h3{margin:0 0 8px}.alert-full p{color:#7e8e9e;font-size:12px;line-height:1.7;margin:0}.data-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.padded{padding:24px}.padded p{color:#7e8f9e;line-height:1.8;font-size:13px}.upload-zone{padding:28px;border:1px dashed #a9c5ca;background:#f7fbfb;border-radius:7px;display:block;text-align:center;line-height:1.8;margin:20px 0;cursor:pointer}.upload-zone input{display:block;margin:15px auto 0;max-width:100%;font-size:12px}.upload-zone .icon{width:27px;height:27px;color:#209b87}.code{font:12px ui-monospace,monospace;background:#f3f6f8;border-radius:5px;padding:12px;white-space:pre-wrap;line-height:1.8;overflow-wrap:anywhere}.ocr-preview{max-width:100%;max-height:220px;display:block;margin:15px auto;border-radius:5px}.big-result{font:600 26px ui-monospace,monospace;margin:20px 0}.progress{height:6px;border-radius:3px;background:#e8f1f3;overflow:hidden}.progress>div{background:var(--green);height:100%;transition:width .2s}.hint{font-size:11px;color:#92a0ad;line-height:1.7}.tag-list{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.watch-tag{background:#f2f6f8;padding:7px 10px;border-radius:5px;display:flex;align-items:center;gap:9px;font-size:12px}.watch-tag button{background:none;border:0;color:#c4736b;font-size:16px}#toast{position:fixed;bottom:25px;left:calc(50% + 117px);transform:translate(-50%,20px);padding:13px 21px;background:#183647;color:white;border-radius:7px;box-shadow:0 6px 24px #0c293025;z-index:2000;font-size:13px;opacity:0;pointer-events:none;transition:.2s;max-width:80vw}#toast.visible{opacity:1;transform:translate(-50%,0)}dialog{border:1px solid var(--line);border-radius:12px;padding:27px;max-width:560px;width:calc(100% - 32px);color:var(--ink);box-shadow:0 15px 80px #10283c30}dialog::backdrop{background:#11223366;backdrop-filter:blur(3px)}dialog p{line-height:1.8;color:#7e8d9c;font-size:13px}.dialog-close{margin-top:20px}dialog table{white-space:normal}.mobile-only{display:none}.sim-running .dot{animation:pulse 1.3s infinite}@keyframes pulse{50%{opacity:.3}}.map-route-pin{background:#0c937d;color:white;border:3px solid white;border-radius:50%;width:27px;height:27px;display:grid;place-items:center;box-shadow:0 2px 10px #004d3830;font-size:11px;font-weight:bold}.upload-status{white-space:pre-line;font-size:12px;line-height:1.8;margin:12px 0}.map-fallback{padding:30px;line-height:1.8;color:#758b9b}.metric-note{font-size:11px;color:#8d9ba8;margin:10px 0 0}.button.danger{background:#fff0ed;color:#bd6155;border:1px solid #f4d7d1}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media(min-width:1600px){.map-wrap{height:440px}.chart-svg{height:210px}.alert-item{padding:25px 0}}@media(max-width:1200px){.sidebar{width:200px;padding:28px 15px}.shell{margin-left:200px}.brand{font-size:24px}.brand-sub{font-size:7px}.sidebar-bottom{left:15px;right:15px}main{padding:25px 23px}.topbar{padding:0 23px}.dashboard-grid{grid-template-columns:minmax(0,1fr) 275px}.metric{padding:16px}.metric-value{font-size:27px}.lower-grid{grid-template-columns:1fr}.cameras-grid{grid-template-columns:repeat(2,1fr)}.tracker-grid{grid-template-columns:280px minmax(0,1fr)}.topbar-right{gap:12px}#clock{display:none}}
@media(max-width:950px){.sidebar{width:78px;padding:24px 12px}.brand{justify-content:center}.brand>span:last-child,.workspace,.nav-label,nav a span,.sidebar-bottom{display:none}nav{margin-top:40px}nav a{padding:15px;justify-content:center}.shell{margin-left:78px}.dashboard-grid{grid-template-columns:1fr}.alert-panel .alert-list{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.alert-panel .alert-item{border-top:1px solid var(--line)}.alert-panel .alert-icon{display:none}.metrics{gap:10px}.metric-head{font-size:11px}.metric-icon{display:none}.metric-foot{font-size:10px}.data-grid,.analytics-grid{grid-template-columns:1fr}#toast{left:calc(50% + 39px)}.map-wrap{height:400px}.tracker-grid{grid-template-columns:1fr}.track-map{height:420px}.timeline{display:grid;grid-template-columns:repeat(3,1fr)}.timeline-item{margin-bottom:10px}.topbar-right{gap:7px}}
@media(max-width:600px){.sidebar{width:60px;padding:22px 8px}.brand-icon{width:33px;height:33px;font-size:35px;line-height:28px}nav a{padding:12px 10px}.shell{margin-left:60px}main{padding:22px 15px}.topbar{height:62px;padding:0 15px}.breadcrumb{font-size:10px}.breadcrumb span{padding:0 5px}.demo-pill{font-size:7px;padding:5px}.topbar-right .icon-button{display:none}.page-heading{align-items:flex-start;flex-direction:column;gap:16px}h1{font-size:25px}.page-heading p{font-size:12px;line-height:1.7}.metrics{grid-template-columns:repeat(2,1fr);gap:10px}.metric{padding:15px}.metric-value{font-size:27px}.metric-head{font-size:11px}.dashboard-grid{gap:15px}.panel-head{padding:16px 14px}.panel-head h2{font-size:13px}.segmented button{padding:5px 8px;font-size:10px}.map-wrap{height:340px}.map-caption{font-size:9px;gap:9px;left:8px;bottom:25px;padding:8px}.map-footer{font-size:9px;padding:11px}.alert-panel .alert-list{display:block}.alert-item{padding:14px 0}.alert-panel .alert-icon{display:flex}.chart-svg{height:150px}.lower-grid{gap:15px}.cameras-grid{grid-template-columns:1fr}.filters{align-items:stretch}.search-input{min-width:0;width:100%}.filters .field{max-width:100%}.timeline{grid-template-columns:1fr 1fr}.alert-full{grid-template-columns:28px 1fr;gap:12px;padding:18px 14px}.alert-full>.button{grid-column:2;justify-self:start}.data-grid{gap:15px}.padded{padding:19px}.footer-right{display:none}footer{padding:12px 15px;font-size:9px}footer>span:first-child{display:block;margin:5px 0}#toast{left:calc(50% + 30px)}.chart-key{font-size:9px;gap:6px}.actions{flex-wrap:wrap}.map-caption span{white-space:nowrap}}
/* Readable dashboard labels and compact metadata. */
body{font-size:16px}.page-heading p,.field,.button,nav a{font-size:14px}.metric-head,.plain-link,.alert-copy h3,.timeline-item h3{font-size:14px}.metric-foot,.panel-head p,.alert-copy p,.alert-copy time,.alert-bottom,.map-caption,.map-overlay,.map-footer,.chart-key,.bar-row,.status-badge,.confidence,.hint,.timeline-item p,.padded p,.camera-card p,.camera-stats small,.upload-status,.breadcrumb,th,td,td .plate,td .plain-link,.segmented button{font-size:12px}.bar-row{grid-template-columns:110px 1fr 35px}.chart-svg .chart-label{font-size:11px}.alert-item{padding:18px 0}.metric-foot{line-height:1.6}.map-caption .icon{width:15px;height:15px}.topbar-right{font-size:12px}.timeline-item.active{background:#eff8f5!important}.nav-label{font-size:11px}.brand-sub{font-size:9px}.padded p{font-size:14px}.status-badge{padding:4px 6px}.map-wrap .leaflet-tile{filter:saturate(.45)}
@media(max-width:600px){.metric-head{font-size:12px}.metric-foot{font-size:11px}.button{font-size:12px}.bar-row{grid-template-columns:95px 1fr 30px}.map-caption,.map-footer{font-size:10px}.panel-head{flex-wrap:wrap}.page-heading p{font-size:13px}.timeline{grid-template-columns:1fr}.brand-sub{display:none}}