:root{color-scheme:dark;--bg:#090d14;--panel:#111824;--panel2:#182232;--line:#263246;--text:#f5f7fb;--muted:#8c9aaf;--orange:#ff6b2c;--orange2:#ff985c;--red:#ff5364;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}
#toast{position:fixed;z-index:9999;top:calc(16px + env(safe-area-inset-top));left:50%;transform:translate(-50%,-20px);background:#eef2f8;color:#12161e;padding:11px 18px;border-radius:99px;font-weight:700;opacity:0;pointer-events:none;transition:.25s;box-shadow:0 10px 30px #0008;white-space:nowrap}#toast.show{opacity:1;transform:translate(-50%,0)}
.auth-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% 20%,#542312 0,#111722 34%,#090d14 68%)}.auth-card{width:min(420px,100%);background:#101722e8;border:1px solid #293344;padding:32px;border-radius:28px;box-shadow:0 28px 80px #0009}.brand-mark{width:64px;height:64px;display:grid;place-items:center;border-radius:20px;background:linear-gradient(145deg,var(--orange),#d9410f);font-size:34px;font-weight:900;box-shadow:0 12px 36px #ff5b243c}.eyebrow{margin:18px 0 3px;color:var(--orange2);font-size:11px;letter-spacing:.22em;font-weight:800}.auth-card h1{font-size:42px;margin:0;letter-spacing:-.05em}.muted{color:var(--muted);line-height:1.5}
label{display:grid;gap:7px;color:#b7c1d0;font-size:13px;font-weight:700;margin:16px 0}input,select{width:100%;border:1px solid var(--line);border-radius:13px;padding:13px 14px;background:#0b111a;color:var(--text);outline:none}input:focus,select:focus{border-color:var(--orange);box-shadow:0 0 0 3px #ff6b2c22}button{border:1px solid var(--line);color:var(--text);background:var(--panel2);border-radius:13px;padding:12px 16px;font-weight:800}button:disabled{cursor:wait;opacity:.65}.primary{border:0;background:linear-gradient(135deg,var(--orange),#ed4516);box-shadow:0 10px 28px #ff5b2530}.auth-card .primary{width:100%;margin-top:8px}.form-card>.primary{width:100%}.text-button{width:100%;border:0;background:none;color:var(--orange2);margin-top:8px}.auth-card details{color:var(--muted);font-size:13px;margin-top:15px}
.download-link{display:block;text-align:center;color:#f7bd9f;font-size:13px;font-weight:800;text-decoration:none;padding:10px}
.app-shell{max-width:760px;margin:auto;min-height:100vh;padding-bottom:84px}.app-shell>header{height:82px;padding:calc(14px + env(safe-area-inset-top)) 18px 10px;display:flex;align-items:end;justify-content:space-between}.app-shell header .eyebrow{margin:0}.app-shell h2{margin:1px 0 0;font-size:25px}.pill{background:#172131;border:1px solid #2a374b;color:#aeb9c9;padding:7px 11px;border-radius:99px;font-size:11px;font-weight:800}.pill.live{color:#ffb08b;border-color:#95451f;background:#3d1d12}
.content{padding:0 14px}.screen{animation:fade .2s ease}@keyframes fade{from{opacity:.3;transform:translateY(4px)}}#map{height:42vh;min-height:300px;border-radius:22px;border:1px solid var(--line);overflow:hidden;background:#121922}.leaflet-control-attribution{font-size:9px!important;background:#111b!important;color:#ccc!important}.leaflet-control-attribution a{color:#ff9d72!important}
.drive-panel{position:relative;margin:-32px 10px 0;padding:17px;background:#111824f2;backdrop-filter:blur(18px);border:1px solid #334057;border-radius:24px;z-index:500;box-shadow:0 22px 50px #0008}.speed{text-align:center;display:flex;justify-content:center;align-items:baseline;gap:8px}.speed strong{font-size:56px;line-height:1;letter-spacing:-.06em}.speed span{color:var(--muted);font-weight:800}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:15px 0}.metrics>div{text-align:center;padding:9px 5px;background:#0b111a;border-radius:13px}.metrics b{display:block;font-size:17px}.metrics span{font-size:10px;color:var(--muted);text-transform:uppercase}.select-label{margin:10px 0}.ride-button{width:100%;font-size:17px;padding:15px}.ride-button.stop{background:linear-gradient(135deg,#f04b5b,#a9192d)}
.auto-card{display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid var(--line);margin-top:16px;padding-top:15px}.auto-card small{display:block;color:var(--muted);font-weight:400;margin-top:3px;line-height:1.3}.switch{display:block;margin:0}.switch input{display:none}.switch span{display:block;width:48px;height:28px;border-radius:20px;background:#354155;position:relative;transition:.2s}.switch span:after{content:"";position:absolute;width:22px;height:22px;border-radius:50%;background:white;left:3px;top:3px;transition:.2s}.switch input:checked+span{background:var(--orange)}.switch input:checked+span:after{transform:translateX(20px)}
.section-heading{display:flex;justify-content:space-between;align-items:center}.section-heading p{color:var(--muted);font-weight:700}.icon-button{padding:7px 12px}.list{display:grid;gap:10px}.list.empty{color:var(--muted);padding:50px 15px;text-align:center}.list-card{background:var(--panel);border:1px solid var(--line);padding:15px;border-radius:17px;display:flex;align-items:center;justify-content:space-between;gap:14px}.list-card h3{font-size:16px;margin:0 0 4px}.list-card p{margin:0;color:var(--muted);font-size:12px}.list-card .number{text-align:right;font-weight:900}.list-card .number small{display:block;color:var(--muted);font-size:10px}.list-actions,.form-actions{display:flex;gap:8px}.list-actions button{padding:9px 12px}.form-card{background:var(--panel);border:1px solid var(--line);padding:18px;border-radius:20px;margin:14px 0}.form-card h3{margin:0 0 8px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-actions button{flex:1}.danger{width:100%;border-color:#5b2933;color:#ff8b98;background:#26131a}
nav{position:fixed;z-index:1000;bottom:0;left:50%;transform:translateX(-50%);width:min(760px,100%);height:72px;padding:7px 12px calc(7px + env(safe-area-inset-bottom));background:#0c121ceb;border-top:1px solid #273244;backdrop-filter:blur(18px);display:grid;grid-template-columns:repeat(4,1fr)}nav button{background:none;border:0;padding:4px;color:#77869b;font-size:10px}nav button span{display:block;font-size:20px;height:27px}nav button.active{color:var(--orange2)}
.detail-sheet{position:fixed;z-index:1500;inset:0;max-width:760px;margin:auto;background:var(--bg);padding:24px 16px;overflow:auto}.detail-sheet h3{font-size:24px}.close{position:absolute;right:18px;top:18px;border-radius:50%;font-size:23px;width:42px;height:42px;padding:0}.detail-sheet #detail-map{height:55vh;border-radius:20px;overflow:hidden}
@media(min-width:700px){.app-shell{border-left:1px solid #202a39;border-right:1px solid #202a39}.drive-panel{margin-left:55px;margin-right:55px}.auth-card{padding:40px}}

/* Futuristic cockpit theme */
:root{--bg:#050b12;--panel:#0b1722;--panel2:#102331;--line:#1c4250;--text:#ecfeff;--muted:#7996a0;--orange:#23e6d3;--orange2:#72f7e8;--red:#ff6077}
body{background:radial-gradient(circle at 50% -10%,#123549 0,#07131d 34%,#050b12 70%);background-attachment:fixed}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.16;background-image:linear-gradient(#1ce3d30c 1px,transparent 1px),linear-gradient(90deg,#1ce3d30c 1px,transparent 1px);background-size:30px 30px;mask-image:linear-gradient(to bottom,#000,transparent 72%)}
.auth-shell{background:radial-gradient(circle at 50% 15%,#17495b 0,#081721 38%,#050b12 75%)}
.auth-card,.form-card,.list-card{background:linear-gradient(145deg,#0d1c28e8,#08131de8);border-color:#1a4551;box-shadow:inset 0 1px #7fffff12,0 18px 55px #0007}
.auth-card{position:relative;overflow:hidden}.auth-card:before{content:"";position:absolute;inset:0 18% auto;height:1px;background:linear-gradient(90deg,transparent,var(--orange),transparent);box-shadow:0 0 16px var(--orange)}
.brand-mark{padding:5px;background:#08131d;border:1px solid #2b7280;box-shadow:0 0 30px #23e6d33d}.brand-mark img{width:100%;height:100%;border-radius:15px}
.eyebrow{color:var(--orange);text-shadow:0 0 14px #23e6d366}.app-shell>header{border-bottom:1px solid #153541;background:#07121baa;backdrop-filter:blur(20px)}
.pill{background:#0a1c27;border-color:#245362;color:#9ab5be;text-transform:uppercase;letter-spacing:.08em}.pill.live{color:#8dfff2;border-color:#23e6d3;background:#0b302f;box-shadow:0 0 18px #23e6d329}
#map{border-color:#28606b;box-shadow:0 0 0 1px #23e6d30a,0 20px 60px #0008;filter:saturate(.8) contrast(1.06)}
.drive-panel{background:linear-gradient(145deg,#0c1c27ee,#07121bee);border-color:#28606b;box-shadow:inset 0 1px #8fffff18,0 24px 60px #000b}.drive-panel:before{content:"DRIVE TELEMETRY";display:block;color:#4f7e87;font-size:9px;font-weight:900;letter-spacing:.24em;text-align:center;margin-bottom:8px}
.speed strong{font-variant-numeric:tabular-nums;color:#efffff;text-shadow:0 0 22px #23e6d344}.metrics>div{background:#06111a;border:1px solid #163945}.metrics b{color:#cffffa}.metrics span{letter-spacing:.08em}
input,select{background:#06111a;border-color:#1b4652}input:focus,select:focus{border-color:var(--orange);box-shadow:0 0 0 3px #23e6d322,0 0 22px #23e6d31f}
button{border-color:#20505c;background:#102733}.primary{color:#031413;background:linear-gradient(135deg,#20e1cf,#25aee8);box-shadow:0 10px 32px #23e6d32d;text-shadow:0 1px #fff5}.primary:hover{filter:brightness(1.08)}
.switch input:checked+span{background:var(--orange);box-shadow:0 0 18px #23e6d355}.auto-card{border-color:#1b414c}
.ride-card{display:grid;grid-template-columns:minmax(0,1fr) auto;position:relative;padding-right:13px}.ride-card:before{content:"";position:absolute;left:-1px;top:18px;bottom:18px;width:2px;background:var(--orange);box-shadow:0 0 10px var(--orange)}.ride-card .ride-actions{grid-column:1/-1;display:flex;gap:8px;margin-top:11px}.ride-actions button{flex:1;padding:8px 12px}.delete-small{color:#ff91a0;border-color:#683244;background:#291621}
nav{background:#06111af2;border-color:#18414d;box-shadow:0 -15px 40px #0008}nav button.active{color:var(--orange);text-shadow:0 0 15px #23e6d388}nav button span{font-size:22px}
.detail-sheet{background:radial-gradient(circle at 50% 0,#102e3c,#050b12 45%)}
@media(min-width:700px){.app-shell{border-color:#173b46;box-shadow:0 0 80px #0008}}