:root{--bg:#f4f6f9;--panel:#fff;--text:#172033;--muted:#697386;--line:#e3e7ee;--accent:#E87524;--navy:#101d35;--shadow:0 12px 32px #14213b12}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;line-height:1.55}body.dark{--bg:#0b1220;--panel:#131e30;--text:#f3f6fb;--muted:#a6b2c5;--line:#29364b;--shadow:0 12px 32px #0004}header{display:flex;justify-content:space-between;align-items:center;padding:16px max(16px,calc((100% - 780px)/2));background:var(--navy);color:white;position:sticky;top:0;z-index:3}.brand{display:flex;align-items:center;gap:12px}.brand strong,.brand small{display:block}.brand small{font-size:12px;color:#cbd4e4}.logo{display:grid;place-items:center;background:var(--accent);width:42px;height:42px;border-radius:14px;font-weight:900;font-size:23px}.iconbtn{background:transparent;color:white;border:1px solid #ffffff44;border-radius:12px;padding:9px 13px;font-size:18px}main{max-width:780px;margin:auto;padding:20px 14px 32px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:20px;margin:0 0 16px;box-shadow:var(--shadow)}h1{font-size:25px;margin:0 0 8px}h2{font-size:20px;margin:0 0 14px}p{margin:8px 0 14px}.muted,small{color:var(--muted)}label{display:block;margin:14px 0;font-size:14px;font-weight:650}input{display:block;width:100%;margin-top:7px;padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--text);font:inherit;outline-color:var(--accent)}button{font:inherit;cursor:pointer;border:0;border-radius:12px;padding:12px 16px}.primary{background:var(--accent);color:white;font-weight:750}.secondary{background:var(--bg);border:1px solid var(--line);color:var(--text)}.roles,.actions,.tabs{display:flex;gap:10px;flex-wrap:wrap}.role{flex:1;background:var(--bg);border:1px solid var(--line);color:var(--text)}.role.selected{border:2px solid var(--accent);color:var(--accent);font-weight:800}.actions>*{flex:1}.hidden{display:none!important}.notice{padding:12px 14px;background:#fff4d5;color:#704d00;border-radius:12px;margin-bottom:14px}.welcome{display:flex;justify-content:space-between;align-items:center}.welcome h2{margin:2px 0}.tabs{margin-bottom:14px}.tab{flex:1;background:var(--panel);color:var(--muted);border:1px solid var(--line);padding:10px 4px}.tab.active{background:var(--navy);color:#fff}.subtle{background:var(--bg);box-shadow:none}.listitem{border-bottom:1px solid var(--line);padding:12px 0}.listitem:last-child{border:0}.walletmsg{min-height:26px;color:#d49b00;font-weight:700}.balance{font-size:28px;font-weight:850;color:var(--accent);margin-top:10px}.notice.error{background:#ffeded;color:#9a2424}footer{text-align:center;color:var(--muted);font-size:12px;padding:12px}.status{font-size:12px;border-radius:20px;padding:4px 8px;background:#e5f7ed;color:#13713b} @media(min-width:600px){main{padding-top:28px}.panel{padding:24px}}

.brand-logo{width:42px;height:42px;object-fit:contain;border-radius:12px;flex:0 0 auto;display:block}.brand{min-width:0}.brand strong{letter-spacing:.2px}
@media(max-width:360px){header{padding-inline:10px}.brand-logo{width:36px;height:36px}.brand{gap:8px}}

/* Navigation shortcut: curved arrow, consistent in day/night themes */
.map-arrow{display:inline-flex;align-items:center;gap:.3rem;text-decoration:none;border:1px solid var(--border,#ddd);border-radius:999px;padding:.42rem .68rem;color:var(--accent,#e87524);font-weight:700;background:var(--card,#fff);white-space:nowrap}.map-arrow:hover,.map-arrow:focus{filter:brightness(.95);outline:2px solid var(--accent,#e87524);outline-offset:2px}.map-arrow:first-letter{font-size:1.2em}


/* TRIP 2026 interface refresh */
.brand-logo{width:50px;height:50px;border-radius:15px}
.iconbtn.theme-switch{min-width:62px;min-height:58px;padding:7px 12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;border-radius:17px;border:1px solid #ffffff55}
.theme-symbol{font-size:29px;line-height:1.05}.theme-label{font-size:10px;line-height:1.2}
.trip-splash{position:fixed;inset:0;z-index:10000;background:#101d35;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;gap:10px;animation:splashFade .8s ease 2.2s forwards;pointer-events:none}
.trip-splash img{width:116px;height:116px;filter:drop-shadow(0 12px 28px #0007);animation:splashPop .7s ease both}
.trip-splash strong{font-size:34px;letter-spacing:4px;color:#ff9142}.trip-splash span{font-size:13px;color:#cbd4e4}
@keyframes splashPop{from{opacity:0;transform:scale(.75)}to{opacity:1;transform:scale(1)}}@keyframes splashFade{to{opacity:0;visibility:hidden}}
.map-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.map-heading h2{margin:0 0 10px}.map-provider{font-size:11px;color:var(--muted)}
.trip-map{width:100%;height:300px;border-radius:18px;overflow:hidden;border:1px solid var(--line);z-index:1}
.home-map-panel{padding:14px}.service-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0 18px}
.service-choice{display:flex;align-items:center;gap:10px;justify-content:flex-start;background:var(--bg);color:var(--text);border:1px solid var(--line);padding:12px;border-radius:15px}
.service-choice span{font-size:27px}.service-choice.selected{border:2px solid var(--accent);background:color-mix(in srgb,var(--accent) 9%,var(--panel));color:var(--accent)}
#authPanel{border-radius:24px}.role{min-height:52px;border-radius:15px}
.leaflet-container{font:inherit}.leaflet-control-attribution{font-size:9px!important}
@media(max-width:480px){.trip-map{height:260px}.brand-logo{width:46px;height:46px}}

.vehicle-icon{width:100%;height:56px;max-width:150px;display:block;margin:auto}.service-choice{flex-direction:column;align-items:center;justify-content:center;min-height:100px}.service-choice b{font-size:14px}

.admin-vehicle{display:inline-block;width:86px;height:42px;vertical-align:middle;margin-inline:6px}