@charset "UTF-8";
:root{font-family:Inter,"Segoe UI",Arial,sans-serif;color:#163744;background:#f4f7f8;font-synthesis:none;--blue:#00a6e0;--navy:#073c54;--muted:#71838b;--line:#e3eaed;--green:#067c65}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer;border:0}button:disabled{opacity:.46;cursor:not-allowed}button:focus-visible,a:focus-visible{outline:3px solid #00a6e0;outline-offset:4px}[hidden]{display:none!important}h1,h2,p{margin-top:0}h1{font-size:32px;line-height:1.2;letter-spacing:-1.2px;margin-bottom:10px}h2{font-size:20px;letter-spacing:-.4px;margin-bottom:12px}p{line-height:1.55}a{color:#0078a5;text-decoration:none}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:800;color:#74868d;margin-bottom:9px}.muted,.fine{color:var(--muted)}.fine{font-size:12px;line-height:1.6}.optional{font-size:11px;color:#8a999f;font-weight:400}.card{padding:23px;background:white;border:1px solid var(--line);border-radius:21px;margin:20px 0;box-shadow:0 8px 20px #153c4903}label{display:block;font-size:12px;font-weight:650;margin-bottom:18px}input,select{display:block;margin-top:9px;width:100%;height:53px;border:1px solid #d8e3e7;border-radius:11px;background:#f9fbfc;color:#183d4c;padding:12px 13px;outline:none;font-size:16px}input:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 3px #00a6e01a}.primary,.quiet,.button{width:100%;min-height:52px;border-radius:12px;display:flex;justify-content:space-between;align-items:center;padding:15px 18px;font-size:14px;font-weight:700}.primary{background:var(--navy);color:#fff;box-shadow:0 5px 12px #073c5414}.quiet{background:#eef4f6;color:#225469;margin-top:12px;justify-content:center}.login-wrap{max-width:420px;margin:auto;padding:40px 24px}.brand{width:164px;height:auto;display:block;margin-bottom:38px}.login-hero{position:relative;padding-top:15px;overflow:hidden}.login-hero h1{font-size:37px}.login-hero .eyebrow{color:#007a9e}.login-hero p{max-width:230px;color:#667e89;font-size:14px}.lane-art{position:absolute;right:-38px;top:12px;width:130px;height:164px;transform:rotate(-20deg);z-index:-1;opacity:.65}.lane-art i{display:block;height:44px;border-top:2px solid #c8e7f0;border-bottom:2px solid #c8e7f0;margin-top:7px}.lane-art span{position:absolute;top:36px;left:31px;font-size:63px;font-weight:800;color:#b0ddea}.password-field{position:relative}.password-field input{padding-right:68px}.text-button{position:absolute;right:6px;top:7px;background:none;color:#007aa4;height:39px;padding:0 12px;font-size:12px}.text-link{font-size:12px}.topbar{max-width:780px;margin:auto;display:flex;align-items:center;padding:23px 25px 18px;gap:12px}.topbar img{width:132px}.workspace-label{border-left:1px solid #cfdce0;padding-left:12px;font-size:8px;letter-spacing:1.3px;color:#7f949e;font-weight:750}.avatar{margin-left:auto;background:#e1edf2;color:#0c536e;border:1px solid #d2e5ed;font-size:11px;font-weight:800;width:37px;height:37px;border-radius:50%}.app-shell{max-width:780px;margin:auto;padding:11px 25px 114px}.greeting{display:flex;justify-content:space-between;align-items:center}.greeting h1{font-size:30px;margin-bottom:0}.blue-dot{color:var(--blue)}.icon-button{width:40px;height:40px;border:1px solid #dae5e9;border-radius:12px;background:white;color:#1e627c;font-size:24px}.parking-label{color:#7b8c94;font-size:12px;margin:9px 0 24px}.parking-label>span:first-child{color:#0095ca;margin-right:4px;font-size:18px}.collection-card{position:relative;overflow:hidden;border-radius:22px;padding:24px;background:linear-gradient(112deg,#06384e,#0a5067);color:white;min-height:181px;box-shadow:0 12px 25px #093f5421}.collection-head{display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:1.4px;color:#a7cbd9;position:relative;z-index:1}.pill{font-size:6px;letter-spacing:.8px;border:1px solid #ffffff28;background:#ffffff0d;padding:6px;border-radius:15px;color:#bfdee7}.collection-card>strong{display:block;font-size:44px;letter-spacing:-1.4px;line-height:1.5;position:relative;z-index:1;font-weight:600}.collection-breakdown{display:flex;gap:25px;margin-top:8px;font-size:10px;color:#b0cfda;position:relative;z-index:1}.collection-breakdown b{margin-left:7px;font-weight:600;color:#fff;font-size:12px}.collection-pattern{width:180px;height:180px;position:absolute;border:26px solid #ffffff04;border-radius:40px;right:-46px;top:48px;transform:rotate(-30deg);box-shadow:0 0 0 22px #ffffff02}.kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:16px}.kpi{position:relative;padding:21px 19px 18px;background:white;border:1px solid var(--line);border-radius:19px}.stat-icon{position:absolute;top:17px;right:15px;display:grid;place-items:center;width:29px;height:29px;border-radius:9px;font-size:18px}.mint{color:#078f6b;background:#e7f6ef}.sky{color:#088fb9;background:#e8f5fc}.kpi strong{font-size:32px;font-weight:650;display:block;letter-spacing:-1px;margin:2px 0 5px}.kpi>span:not(.stat-icon){display:block;font-size:12px;font-weight:700}.kpi small{display:block;font-size:9px;color:#85969d;margin-top:7px}.parked-strip{display:flex;align-items:center;gap:13px;padding:17px 3px 20px;border-bottom:1px solid #e2eaed}.tiny-parking{display:grid;place-items:center;background:#e5eff4;color:#488499;width:31px;height:31px;border-radius:9px;font-size:17px;font-weight:750}.parked-strip strong{font-size:12px}.parked-strip p{font-size:9px;color:#8b9ba2;margin:3px 0 0}.live-dot{width:6px;height:6px;background:#4aa885;border-radius:50%;margin-left:auto;margin-right:5px;box-shadow:0 0 0 4px #e5f3ec}.section-title{display:flex;align-items:center;justify-content:space-between;margin:24px 0 14px}.section-title h2{font-size:15px;margin:0}.section-title>span{font-size:8px;letter-spacing:1.2px;color:#94a4ab}.action-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.action-card{text-align:left;position:relative;border:1px solid #c6e6e2;border-radius:18px;padding:18px 17px;background:#eaf7f3;color:#126e5b}.action-card.exit{background:#eaf4fa;border-color:#d0e5f0;color:#226485}.action-icon{font-size:23px;display:block;margin-bottom:14px}.action-card strong{font-size:14px;display:block}.action-card small{font-size:9px;color:#75948b;display:block;margin-top:5px}.action-card.exit small{color:#7a96a5}.corner-arrow{position:absolute;right:16px;top:20px;font-size:12px;opacity:.55}.history-link{display:flex;align-items:center;gap:12px;text-align:left;width:100%;padding:18px 17px;border-radius:16px;background:white;border:1px solid var(--line);margin-top:16px;color:#294f60}.history-glyph{font-size:25px;color:#92a6af}.history-link strong{font-size:12px;display:block}.history-link small{font-size:9px;display:block;color:#92a2a9;margin-top:5px}.history-link>span:last-child{margin-left:auto}.scope-note{font-size:9px;color:#96a6ae;text-align:center;margin-top:22px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;margin:auto;max-width:780px;display:flex;background:#ffffffed;backdrop-filter:blur(16px);border-top:1px solid #e4ecef;padding:11px 8px calc(12px + env(safe-area-inset-bottom));z-index:20}.bottom-nav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;background:transparent;color:#94a6ae;font-size:9px;font-weight:600}.bottom-nav button span{font-size:22px;line-height:25px;width:45px;border-radius:9px}.bottom-nav button.active{color:#047ca8}.bottom-nav button.active span{background:#eaf6fb}.plate-input{text-transform:uppercase;letter-spacing:1px;font-weight:650}.amount-line{display:flex;justify-content:space-between;align-items:center;border-top:1px dashed #d5e1e5;border-bottom:1px dashed #d5e1e5;padding:21px 0;margin:22px 0;font-size:12px;color:#768c96}.amount-line strong{font-size:30px;color:#103e52;letter-spacing:-1px}.payment-note{font-size:11px;color:#7c929d}.status-line{font-size:12px;line-height:1.5;color:#006f92}.badge{font-size:9px;font-weight:800;background:#e9f7ef;color:#078562;border-radius:5px;padding:5px 10px}.row-between{display:flex;justify-content:space-between;align-items:center}.detail-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:13px 12px;font-size:11px;margin:20px 0}.detail-grid dt{color:#82949d}.detail-grid dd{margin:0;text-align:right;color:#234f63;overflow-wrap:anywhere}.segmented{display:flex;background:#e8eff2;padding:5px;border-radius:12px;margin:24px 0 19px}.segmented button{flex:1;padding:11px;background:none;color:#7a909a;border-radius:9px;font-size:12px;font-weight:650}.segmented .selected{background:white;color:#155771;box-shadow:0 2px 5px #1b435208}.date-filter{display:flex;gap:9px;align-items:center}.date-filter label{flex:1;min-width:0;font-size:10px}.date-filter input{font-size:11px;height:44px;padding:7px;width:100%}.date-filter button{margin-top:9px}.record{padding:18px;background:#fff;border:1px solid var(--line);border-radius:15px;margin:10px 0}.record strong{font-size:14px}.record p{font-size:10px;color:#80949e;margin:7px 0 0}.record .record-right{font-size:12px;font-weight:650;color:#297992}.empty{padding:48px 15px;text-align:center;color:#8a9da5;font-size:13px;background:#ffffff88;border:1px dashed #d4e2e7;border-radius:17px}.profile-row{display:flex;align-items:center;gap:14px}.profile-avatar{border-radius:16px;background:#e5f3f9;color:#26738f;width:52px;height:52px;display:grid;place-items:center;font-size:17px;font-weight:700}.profile-row h2{font-size:17px;margin:0}.profile-row p{font-size:11px;margin:5px 0 0}.logout{width:100%;padding:18px;text-align:left;display:flex;justify-content:space-between;border:1px solid #efdddc;border-radius:13px;background:#fff6f5;color:#a45049;font-size:13px}.loading-screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f4f7f8;z-index:50}.loading-screen img{width:180px}.loading-screen p{margin-top:24px;font-size:12px;color:#8397a0}#notice{position:fixed;top:12px;left:18px;right:18px;max-width:700px;margin:auto;background:#123e51;color:#fff;padding:16px 19px;border-radius:13px;box-shadow:0 8px 35px #001c3940;z-index:100;font-size:13px;line-height:1.5}#notice.error{background:#9b4238}@media(min-width:650px){.app-shell{padding-left:50px;padding-right:50px}.topbar{padding-left:50px;padding-right:50px}.collection-card{min-height:195px}.kpi{padding:24px}.action-card{padding:23px}.login-wrap{padding-top:70px}}@media(prefers-reduced-motion:no-preference){.screen{animation:reveal .22s ease-out}@keyframes reveal{from{opacity:.3;transform:translateY(5px)}to{opacity:1;transform:none}}}

.pill{font-size:9px}.kpi small,.scope-note,.bottom-nav button,.history-link small,.action-card small{font-size:10px}.parked-strip p{font-size:10px}.collection-head{font-size:10px}.card li{font-size:13px;line-height:1.8;margin-bottom:7px}
input[type="checkbox"]{width:auto;display:inline-block;margin-right:8px}

/* VehiclePe white/light theme — 2026-10-08. Screen only; print layouts preserved. */
@media screen {
:root{color-scheme:light;background:#fff;--navy:#087eaa;--muted:#607686;--line:#e1e9ef}
body,.loading-screen{background:#fff;color:#243f50}
.collection-card{background:#f4f9fc;color:#25495d;border:1px solid #dceaf2;box-shadow:0 4px 15px #23465905}
.collection-head,.collection-breakdown{color:#5b7889}
.collection-breakdown b{color:#234d65}
.collection-card .pill{background:#fff;color:#547586;border-color:#d3e4ed}
.collection-pattern{border-color:#d8eaf33d;box-shadow:0 0 0 22px #e8f3f94d}
.card,.kpi,.history-link,.record{box-shadow:0 3px 14px #24455c04;background:#fff}
.topbar,.bottom-nav{background:#fff}
input,select{background:#fff}
.scope-note,.history-link small,.parked-strip p,.section-title>span{color:#647d8b}
#notice:not(.error){background:#eef8fd;color:#215b74;border:1px solid #cde7f2;box-shadow:0 6px 25px #1b415a14}

}
