:root{
  --bg:#ffffff;
  --ink:#111217;
  --ink-2:#1c1d22;
  --muted:#6f727c;
  --muted-2:#8f929c;
  --line:#ececf0;
  --card:#f6f6f8;
  --card-2:#f0f0f3;
  --yellow:#F5B301;
  --yellow-dark:#e0a400;
  --yellow-ink:#8a5d00;
  --yellow-soft:#fff6de;
  --green:#1fb85a;
  --danger:#e5484d;
  --shadow:0 8px 30px -12px rgba(17,18,23,0.18);
  --shadow-lg:0 18px 50px -20px rgba(17,18,23,0.30);
  --r-xl:30px; --r-lg:22px; --r-md:16px; --r-sm:12px;
  --page-bg:#e9eaee;
}
/* ===== DARK THEME (auto by time of day, or manual toggle) ===== */
html[data-theme="dark"]{
  --bg:#0c0c0e;
  --ink:#f4f5f7;
  --ink-2:#e6e7ea;
  --muted:#9a9ca5;
  --muted-2:#6c6e77;
  --line:#242529;
  --card:#17181b;
  --card-2:#1f2024;
  --yellow:#F5B301;
  --yellow-dark:#f5b301;
  --yellow-ink:#f5b301;
  --yellow-soft:#2a2410;
  --green:#28c466;
  --danger:#ff5b60;
  --shadow:0 8px 30px -12px rgba(0,0,0,0.55);
  --shadow-lg:0 18px 50px -20px rgba(0,0,0,0.7);
  --page-bg:#000000;
}
/* keep deliberately-dark surfaces dark (don't flip to light) in dark mode */
html[data-theme="dark"] .book-card{background:#141518;}
html[data-theme="dark"] .botnav{background:#141518;border:1px solid #242529;}
html[data-theme="dark"] .big-btn{background:#2a2b30;color:#fff;}
html[data-theme="dark"] .big-btn.yellow{background:var(--yellow);color:#111;}
html[data-theme="dark"] .big-btn.wa{background:var(--green);color:#fff;}
html[data-theme="dark"] .toast{background:#242529;}
html[data-theme="dark"] .pay-opt.card .pi{background:#2a2b30;}
html[data-theme="dark"] .ob-cta .go{background:#2a2b30;}
html[data-theme="dark"] .promo-code,html[data-theme="dark"] .leg-badge{background:#000;}
html[data-theme="dark"] .dfooter{background:#000;}
html[data-theme="dark"] .dtop-cta{background:var(--yellow);color:#111;}
html[data-theme="dark"] .fp.done{background:var(--muted);}
html[data-theme="dark"] .book-btn{color:#111;}
html[data-theme="dark"] .pay-opt.wa{background:#10361f;border-color:#1c5a33;}
html[data-theme="dark"] .pay-opt.wa .pm-t{color:#eafaf0;}
html[data-theme="dark"] .pay-opt.wa .pm-s.g{color:#5fe08f;}
html[data-theme="dark"] .pay-opt .pm-t,html[data-theme="dark"] .confirm .drv .dt{color:var(--ink);}
html[data-theme="dark"] .confirm .bid{color:var(--yellow);}
html[data-theme="dark"] .qr-ic,html[data-theme="dark"] .fleet-c .ph,html[data-theme="dark"] .fleet-full-c .ph,html[data-theme="dark"] .opt-veh{background:#fff;}
html[data-theme="dark"] .trust-ic{background:#242529;}
html[data-theme="dark"] .pick-ic{background:#242529;}
html[data-theme="dark"] .pick-ic.air{background:#2a2410;}
/* desktop light-glass hero card in dark mode */
html[data-theme="dark"] #bookCard{background:#141518!important;border-color:#242529!important;}
html[data-theme="dark"] .dhero-visual{background:linear-gradient(135deg,#1a1c22,#101217)!important;}
html[data-theme="dark"] .dtopnav{background:rgba(12,12,14,.85)!important;backdrop-filter:blur(10px);}
html[data-theme="dark"] .gate-btn{background:var(--card);border-color:var(--line);}
html[data-theme="dark"] .ob-car,html[data-theme="dark"] .dhero-car{filter:drop-shadow(0 20px 30px rgba(0,0,0,.6));}
/* theme toggle button */
.theme-toggle{width:42px;height:42px;border-radius:50%;background:var(--card);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none;transition:background .15s,transform .12s;}
.theme-toggle:active{transform:scale(.92);}
.theme-toggle svg{width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:1.9;}
.theme-toggle .moon{display:none;}
html[data-theme="dark"] .theme-toggle .sun{display:none;}
html[data-theme="dark"] .theme-toggle .moon{display:block;}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth;}
html,body,.app,.book-card,.gate,.loc-field,.dtopnav,.dfooter,.topbar,.flow-cta,.botnav,.dhero-visual{transition:background-color .4s ease, color .4s ease, border-color .4s ease;}
body{
  font-family:'Plus Jakarta Sans',-apple-system,sans-serif;
  background:var(--page-bg);color:var(--ink);-webkit-font-smoothing:antialiased;
  min-height:100vh;
}
img,svg{display:block;max-width:100%;}
button,input,select{font-family:inherit;}
a{text-decoration:none;color:inherit;}
::selection{background:var(--yellow);color:var(--ink);}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important;}}

/* ====== APP SHELL (phone-style, centered) ====== */
.app{
  position:relative;max-width:440px;margin:0 auto;min-height:100vh;
  background:var(--bg);overflow:hidden;
  box-shadow:0 0 60px -10px rgba(0,0,0,0.25);
}
@media(min-width:460px){
  .app{margin:24px auto;min-height:calc(100vh - 48px);border-radius:38px;}
  body{padding:0;}
}
.screen{display:none;animation:screenIn .38s cubic-bezier(.2,.9,.3,1);padding-bottom:110px;}
.screen.active{display:block;}
@keyframes screenIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
.pad{padding:0 22px;}

/* status/top bar spacer for notch */
.safetop{height:env(safe-area-inset-top,0px);}

/* ====== TOP HEADER ====== */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:20px 22px 8px;}
.brand{display:flex;align-items:center;gap:0;}
.brand img{height:34px;width:auto;}
.topbar-actions{display:flex;align-items:center;gap:10px;}
.icon-btn{
  width:42px;height:42px;border-radius:50%;background:var(--card);border:none;
  display:flex;align-items:center;justify-content:center;transition:background .15s, transform .12s;
}
.icon-btn:active{transform:scale(.92);}
.icon-btn svg{width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:1.9;}
.avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#ffd873,var(--yellow));display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--ink);font-size:15px;}

/* ====== HERO (onboarding) ====== */
#scr-onboard{padding-bottom:0;min-height:100vh;flex-direction:column;}
#scr-onboard.active{display:flex;}
.ob-top{padding:26px 26px 0;}
.ob-logo{height:38px;width:auto;margin-bottom:38px;}
.ob-head{font-size:34px;line-height:1.12;font-weight:800;letter-spacing:-0.02em;max-width:11ch;}
.ob-head .hl{color:var(--yellow);}
.ob-sub{margin-top:14px;color:var(--muted);font-size:15px;line-height:1.5;max-width:30ch;}
.ob-carwrap{flex:1;position:relative;display:flex;align-items:center;justify-content:center;min-height:300px;margin-top:-10px;}
.ob-carwrap::before{
  content:"";position:absolute;width:300px;height:300px;border-radius:50%;
  background:radial-gradient(circle,var(--yellow-soft),transparent 68%);z-index:0;
  animation:pulseGlow 3.4s ease-in-out infinite;
}
@keyframes pulseGlow{0%,100%{transform:scale(1);opacity:.9;}50%{transform:scale(1.08);opacity:1;}}
.ob-car{position:relative;z-index:1;width:100%;max-width:420px;max-height:none;animation:carIn 1s cubic-bezier(.2,.9,.3,1) both;}
@keyframes carIn{from{opacity:0;transform:translateX(40px) scale(.96);}to{opacity:1;transform:translateX(0) scale(1);}}
.ob-foot{padding:0 26px 40px;}
.ob-cta{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:var(--yellow);border-radius:100px;padding:8px 8px 8px 26px;border:none;width:100%;
  font-size:17px;font-weight:700;color:var(--ink);transition:transform .14s, box-shadow .2s;
  box-shadow:0 14px 30px -12px rgba(245,179,1,.6);
}
.ob-cta:active{transform:scale(.98);}
.ob-cta .go{
  width:46px;height:46px;border-radius:50%;background:var(--ink);color:#fff;
  display:flex;align-items:center;justify-content:center;
}
.ob-cta .go svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:2.2;}
.ob-lockdot{width:46px;height:46px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;flex:none;}
.ob-lockdot svg{width:17px;height:17px;stroke:var(--ink);fill:none;stroke-width:1.9;}

/* ====== HOME SCREEN ====== */
.greet{padding:4px 22px 0;}
.greet .hi{color:var(--muted);font-size:13.5px;font-weight:500;}
.greet .name{font-size:21px;font-weight:800;letter-spacing:-0.01em;margin-top:2px;}

/* booking card */
.book-card{
  margin:18px 22px 0;background:var(--ink);border-radius:var(--r-xl);padding:22px 20px 20px;color:#fff;
  position:relative;overflow:hidden;box-shadow:var(--shadow-lg);
}
.book-card::after{content:"";position:absolute;right:-50px;top:-50px;width:170px;height:170px;border-radius:50%;background:rgba(245,179,1,.18);}
.book-card h3{font-size:18px;font-weight:700;margin-bottom:4px;position:relative;}
.book-card .bc-sub{font-size:12.5px;color:#aeb0b8;margin-bottom:18px;position:relative;}

/* trip type toggle */
.triptype{display:flex;gap:6px;background:rgba(255,255,255,.08);padding:4px;border-radius:100px;margin-bottom:16px;position:relative;}
.triptype button{
  flex:1;border:none;background:transparent;color:#c9cbd2;font-size:13px;font-weight:700;padding:9px 0;border-radius:100px;transition:.18s;
}
.triptype button.on{background:var(--yellow);color:#111;}

/* direction (pre-destination) selector */
.dir-select{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px;}
.dir-opt{display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.06);border:1.5px solid transparent;border-radius:var(--r-md);padding:11px 12px;text-align:left;transition:.15s;cursor:pointer;position:relative;}
.dir-opt.on{border-color:var(--yellow);background:rgba(245,179,1,.12);}
.dir-radio{width:16px;height:16px;border-radius:50%;border:2px solid #6c6e77;flex:none;position:relative;transition:.15s;}
.dir-opt.on .dir-radio{border-color:var(--yellow);}
.dir-opt.on .dir-radio::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--yellow);}
.dir-ic{flex:none;}
.dir-ic svg{width:17px;height:17px;stroke:#c9cbd2;fill:none;stroke-width:1.9;}
.dir-opt.on .dir-ic svg{stroke:var(--yellow);}
.dir-txt{display:flex;flex-direction:column;line-height:1.15;min-width:0;}
.dir-txt b{font-size:12.5px;font-weight:700;color:#fff;}
.dir-txt small{font-size:10px;color:#9a9ca5;}

/* location fields */
.loc-field{
  display:flex;align-items:center;gap:12px;background:#26272e;border-radius:var(--r-md);padding:13px 14px;margin-bottom:10px;position:relative;
  border:1.5px solid transparent;transition:border-color .15s;
}
.loc-field.focus{border-color:var(--yellow);}
.loc-dot{width:26px;height:26px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;}
.loc-dot.pick{background:rgba(245,179,1,.2);}
.loc-dot.pick svg{stroke:var(--yellow);}
.loc-dot.drop{background:rgba(31,184,90,.18);}
.loc-dot.drop svg{stroke:var(--green);}
.loc-dot svg{width:15px;height:15px;fill:none;stroke-width:2;}
.loc-body{flex:1;min-width:0;}
.loc-label{font-size:10.5px;color:#8a8d96;font-weight:600;letter-spacing:.02em;text-transform:uppercase;}
.loc-val{font-size:14.5px;font-weight:600;color:#fff;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.loc-val.ph{color:#9094a0;font-weight:500;}
.loc-swap{
  position:absolute;right:14px;top:50%;transform:translateY(-50%);z-index:3;
  width:34px;height:34px;border-radius:50%;background:var(--yellow);border:3px solid var(--ink);
  display:flex;align-items:center;justify-content:center;
}
.loc-swap svg{width:15px;height:15px;stroke:var(--ink);fill:none;stroke-width:2.2;}
.loc-connector{height:10px;}

.loc-error{
  display:none;align-items:flex-start;gap:9px;background:rgba(229,72,77,.14);border:1px solid rgba(229,72,77,.4);
  border-radius:var(--r-sm);padding:11px 13px;margin-bottom:14px;font-size:12px;color:#ffb4b6;line-height:1.45;position:relative;
}
.loc-error.show{display:flex;}
.loc-error svg{width:15px;height:15px;stroke:#ffb4b6;fill:none;stroke-width:2;flex:none;margin-top:1px;}

.book-btn{
  width:100%;background:var(--yellow);color:#111;border:none;border-radius:var(--r-md);
  padding:16px;font-size:15.5px;font-weight:800;transition:transform .14s, opacity .2s;position:relative;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.book-btn:active{transform:scale(.98);}
.book-btn:disabled{opacity:.62;}
.book-btn svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:2.2;}

/* use-my-location chip */
.mylocrow{margin-top:12px;position:relative;}
.myloc-chip{
  display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.08);border:none;color:#e6e7eb;
  font-size:12px;font-weight:600;padding:8px 13px;border-radius:100px;transition:.15s;
}
.myloc-chip:active{transform:scale(.96);}
.myloc-chip svg{width:14px;height:14px;stroke:var(--yellow);fill:none;stroke-width:2;}
.myloc-chip.detecting svg{animation:spin 1s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

/* quick routes */
.section-t{display:flex;align-items:center;justify-content:space-between;padding:26px 22px 12px;}
.section-t h4{font-size:16px;font-weight:800;letter-spacing:-0.01em;}
.section-t a{font-size:12.5px;color:var(--muted);font-weight:600;}
.qr-scroll{display:flex;gap:12px;overflow-x:auto;padding:0 22px 4px;scrollbar-width:none;}
.qr-scroll::-webkit-scrollbar{display:none;}
.qr-card{
  flex:none;width:170px;background:var(--card);border-radius:var(--r-lg);padding:15px;transition:transform .14s, background .15s;
}
.qr-card:active{transform:scale(.97);background:var(--card-2);}
.qr-ic{width:38px;height:38px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:12px;box-shadow:0 4px 12px -6px rgba(0,0,0,.2);}
.qr-ic svg{width:19px;height:19px;stroke:var(--ink);fill:none;stroke-width:1.9;}
.qr-route{font-size:13.5px;font-weight:700;line-height:1.3;margin-bottom:6px;}
.qr-meta{font-size:11.5px;color:var(--muted);}
.qr-price{font-size:15px;font-weight:800;margin-top:8px;}
.qr-price span{font-size:11px;color:var(--muted);font-weight:600;}

/* fleet strip on home */
.fleet-row{display:flex;gap:12px;overflow-x:auto;padding:0 22px 4px;scrollbar-width:none;}
.fleet-row::-webkit-scrollbar{display:none;}
.fleet-c{flex:none;width:210px;background:var(--card);border-radius:var(--r-lg);overflow:hidden;transition:transform .14s;}
.fleet-c:active{transform:scale(.97);}
.fleet-c .ph{height:112px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.fleet-c .ph img{width:100%;height:100%;object-fit:cover;}
.fleet-c .info{padding:13px 15px 15px;}
.fleet-c .fn{font-size:14.5px;font-weight:800;}
.fleet-c .fm{font-size:11.5px;color:var(--yellow-ink);font-weight:700;margin-top:1px;}
.fleet-c .fmeta{display:flex;gap:12px;font-size:11px;color:var(--muted);font-weight:600;margin-top:9px;}
.fleet-c .fmeta span{display:flex;align-items:center;gap:4px;}
.fleet-c .fmeta svg{width:13px;height:13px;stroke:var(--ink);fill:none;stroke-width:2;}

/* promo banner */
.promo{
  margin:26px 22px 0;background:linear-gradient(120deg,#fff3d1,#ffe8a8);border-radius:var(--r-lg);
  padding:20px 22px;display:flex;align-items:center;gap:16px;position:relative;overflow:hidden;
}
.promo-txt{flex:1;}
.promo-txt .pt-t{font-size:15px;font-weight:800;margin-bottom:3px;}
.promo-txt .pt-s{font-size:12px;color:#7a6a2e;line-height:1.4;}
.promo-code{background:var(--ink);color:var(--yellow);font-size:12px;font-weight:800;padding:8px 13px;border-radius:9px;letter-spacing:.04em;}

/* ====== BOTTOM NAV (pill) ====== */
.botnav{
  position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:60;
  display:flex;align-items:center;gap:6px;background:var(--ink);border-radius:100px;padding:8px;
  box-shadow:0 18px 40px -14px rgba(0,0,0,.5);width:min(360px,calc(100% - 44px));justify-content:space-between;
}
.botnav.hidden{display:none;}
.nav-i{
  flex:1;height:52px;border:none;background:transparent;border-radius:100px;
  display:flex;align-items:center;justify-content:center;gap:8px;transition:.2s;position:relative;color:#8a8d96;
}
.nav-i svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.9;}
.nav-i.on{background:var(--yellow);color:#111;flex:1.5;}
.nav-i.on .nav-label{display:inline;}
.nav-label{display:none;font-size:13px;font-weight:700;}

/* ====== BOOKING FLOW (sheet screens) ====== */
.flow-head{display:flex;align-items:center;gap:14px;padding:20px 22px 6px;}
.flow-head .back{width:42px;height:42px;border-radius:50%;background:var(--card);border:none;display:flex;align-items:center;justify-content:center;flex:none;}
.flow-head .back:active{transform:scale(.92);}
.flow-head .back svg{width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:2;}
.flow-head h2{font-size:18px;font-weight:800;letter-spacing:-0.01em;}
.flow-head .step-of{font-size:12px;color:var(--muted);font-weight:600;margin-top:1px;}
.flow-progress{display:flex;gap:6px;padding:14px 22px 6px;}
.fp{flex:1;height:4px;border-radius:100px;background:var(--line);}
.fp.on{background:var(--yellow);}
.fp.done{background:var(--ink);}
.flow-body{padding:14px 22px 130px;}

/* map (SVG) */
.map-wrap{border-radius:var(--r-lg);overflow:hidden;position:relative;background:#eef0f3;height:210px;margin-bottom:8px;box-shadow:inset 0 0 0 1px var(--line);}
.map-wrap svg{width:100%;height:100%;display:block;}
.map-badge{
  position:absolute;top:12px;left:12px;background:#fff;border-radius:100px;padding:7px 13px;
  font-size:11.5px;font-weight:700;box-shadow:var(--shadow);display:flex;align-items:center;gap:6px;
}
.map-badge .dot{width:7px;height:7px;border-radius:50%;background:var(--green);}

/* list rows (pickup/drop/vehicle options) */
.opt-list{margin-top:6px;}
.opt-row{
  display:flex;align-items:center;gap:13px;background:var(--card);border-radius:var(--r-md);padding:14px;margin-bottom:10px;
  border:2px solid transparent;transition:border-color .15s, background .15s, transform .12s;
}
.opt-row:active{transform:scale(.99);}
.opt-row.sel{border-color:var(--ink);background:#fff;}
.opt-radio{width:22px;height:22px;border-radius:50%;border:2px solid var(--muted-2);flex:none;position:relative;transition:.15s;}
.opt-row.sel .opt-radio{border-color:var(--ink);}
.opt-row.sel .opt-radio::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--yellow);}
.opt-veh{width:64px;height:44px;border-radius:10px;overflow:hidden;background:#fff;flex:none;box-shadow:0 3px 10px -5px rgba(0,0,0,.25);}
.opt-veh img{width:100%;height:100%;object-fit:cover;}
.opt-main{flex:1;min-width:0;}
.opt-title{font-size:14.5px;font-weight:700;}
.opt-desc{font-size:11.5px;color:var(--muted);margin-top:2px;}
.opt-right{text-align:right;flex:none;}
.opt-price{font-size:16px;font-weight:800;}
.opt-price small{display:block;font-size:10px;color:var(--muted);font-weight:600;}

/* search input for location select */
.loc-search{
  display:flex;align-items:center;gap:11px;background:var(--card);border-radius:var(--r-md);padding:14px 15px;margin-bottom:6px;
}
.loc-search svg{width:18px;height:18px;stroke:var(--muted);fill:none;stroke-width:2;flex:none;}
.loc-search input{flex:1;border:none;background:transparent;font-size:15px;font-weight:600;outline:none;color:var(--ink);}
.loc-search input::placeholder{color:var(--muted-2);font-weight:500;}
.useloc-btn{
  display:flex;align-items:center;gap:10px;width:100%;background:var(--yellow-soft);border:1px solid #f4e3b0;color:#8a6d16;
  border-radius:var(--r-md);padding:13px 15px;font-size:13.5px;font-weight:700;margin-bottom:14px;transition:transform .14s;
}
.useloc-btn:active{transform:scale(.98);}
.useloc-btn svg{width:17px;height:17px;stroke:var(--yellow-dark);fill:none;stroke-width:2;}
.pick-group-t{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:16px 0 8px;}
.lp-clear{margin-left:8px;color:var(--muted-2);font-size:22px;line-height:1;cursor:pointer;padding:0 4px;flex:none;}
.lp-spin{display:flex;justify-content:center;padding:18px 0;}
.lp-spin .sp{width:20px;height:20px;border-radius:50%;border:2.5px solid var(--card-2);border-top-color:var(--yellow);animation:spin .8s linear infinite;}
.lp-empty{text-align:center;padding:30px 10px;color:var(--muted);}
.lp-empty .t{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:6px;}
.lp-empty .d{font-size:13px;line-height:1.5;}
.lp-hint{font-size:11.5px;color:var(--muted);margin:-2px 0 12px;display:flex;align-items:center;gap:6px;}
.lp-hint svg{width:13px;height:13px;stroke:var(--yellow-dark);fill:none;stroke-width:2;flex:none;}
.pick-item{
  display:flex;align-items:center;gap:12px;padding:13px 6px;border-bottom:1px solid var(--line);transition:.12s;
}
.pick-item:active{background:var(--card);}
.pick-ic{width:36px;height:36px;border-radius:10px;background:var(--card);display:flex;align-items:center;justify-content:center;flex:none;}
.pick-ic svg{width:17px;height:17px;stroke:var(--ink);fill:none;stroke-width:1.9;}
.pick-ic.air{background:var(--yellow-soft);}
.pick-ic.air svg{stroke:var(--yellow-dark);}
.pick-main{flex:1;min-width:0;}
.pick-name{font-size:14.5px;font-weight:700;}
.pick-sub{font-size:11.5px;color:var(--muted);margin-top:1px;}

/* date time */
.dt-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px;}
.leg-title{font-size:12px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:4px 0 10px;}
.leg-card{background:var(--card);border:1.5px solid var(--line);border-radius:var(--r-md);padding:16px;margin-top:18px;}
.leg-card-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.leg-badge{background:var(--ink);color:var(--yellow);font-size:10px;font-weight:800;letter-spacing:.06em;padding:5px 9px;border-radius:7px;flex:none;}
.leg-route{font-size:13.5px;font-weight:700;color:var(--ink);line-height:1.3;}
.leg-route span{color:var(--muted);margin:0 2px;}
.leg-note{display:flex;align-items:flex-start;gap:8px;font-size:11.5px;color:#7a6a2e;background:var(--yellow-soft);border-radius:10px;padding:10px 12px;line-height:1.45;}
.leg-note svg{width:15px;height:15px;stroke:var(--yellow-dark);fill:none;stroke-width:1.8;flex:none;margin-top:1px;}
.leg-note b{color:#6a5a1e;}
.dt-field label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;display:block;margin-bottom:7px;}
.dt-field input,.dt-field select{
  width:100%;background:var(--card);border:2px solid transparent;border-radius:var(--r-md);padding:14px;font-size:15px;font-weight:600;outline:none;color:var(--ink);
  appearance:none;-webkit-appearance:none;
}
.dt-field input:focus,.dt-field select:focus{border-color:var(--yellow);}
.dt-field select{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' stroke='%238a8d96' stroke-width='1.6' fill='none'/></svg>");background-repeat:no-repeat;background-position:right 15px center;padding-right:34px;}
.full{grid-column:1/-1;}

/* extras */
.extra-row{
  display:flex;align-items:flex-start;gap:13px;background:var(--card);border-radius:var(--r-md);padding:14px;margin-bottom:10px;
  border:2px solid transparent;transition:.15s;
}
.extra-row.sel{border-color:var(--ink);background:#fff;}
.extra-check{width:22px;height:22px;border-radius:7px;border:2px solid var(--muted-2);flex:none;display:flex;align-items:center;justify-content:center;transition:.15s;}
.extra-row.sel .extra-check{background:var(--yellow);border-color:var(--yellow);}
.extra-check svg{width:12px;height:12px;stroke:var(--ink);fill:none;stroke-width:3;opacity:0;}
.extra-row.sel .extra-check svg{opacity:1;}
.extra-main{flex:1;}
.extra-t{font-size:14px;font-weight:700;}
.extra-d{font-size:11.5px;color:var(--muted);margin-top:2px;}
.extra-p{font-size:13px;font-weight:800;color:var(--ink);flex:none;}

/* summary */
.sum-card{background:var(--card);border-radius:var(--r-lg);padding:18px;margin-bottom:16px;}
.sum-route{display:flex;align-items:center;gap:10px;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:14px;}
.sum-route .sr-col{flex:1;min-width:0;}
.sum-route .sr-l{font-size:10.5px;color:var(--muted);font-weight:600;text-transform:uppercase;}
.sum-route .sr-v{font-size:13.5px;font-weight:700;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sum-route .sr-arrow{flex:none;color:var(--muted);}
.sum-row{display:flex;justify-content:space-between;font-size:13.5px;padding:6px 0;color:var(--muted);}
.sum-row strong{color:var(--ink);font-weight:700;}
.sum-total{display:flex;justify-content:space-between;align-items:baseline;border-top:1.5px dashed var(--line);margin-top:8px;padding-top:12px;}
.sum-total .l{font-size:14px;font-weight:700;}
.sum-total .v{font-size:24px;font-weight:800;}

/* bottom action bar within flow */
.flow-cta{
  position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:min(440px,100%);
  background:linear-gradient(to top,#fff 70%,transparent);padding:16px 22px calc(20px + env(safe-area-inset-bottom));z-index:55;
}
.flow-cta-inner{display:flex;align-items:center;gap:14px;}
.flow-cta .price-preview{flex:none;}
.flow-cta .pp-l{font-size:11px;color:var(--muted);font-weight:600;}
.flow-cta .pp-v{font-size:20px;font-weight:800;line-height:1.1;}
.big-btn{
  flex:1;background:var(--ink);color:#fff;border:none;border-radius:var(--r-md);padding:17px;font-size:15.5px;font-weight:800;
  display:flex;align-items:center;justify-content:center;gap:9px;transition:transform .14s, opacity .2s;
}
.big-btn:active{transform:scale(.98);}
.big-btn:disabled{opacity:.35;}
.big-btn.yellow{background:var(--yellow);color:#111;}
.big-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.2;}
.big-btn.wa{background:var(--green);color:#fff;}
.big-btn.wa svg{fill:#fff;stroke:none;}

/* pay choice */
.pay-choice{display:flex;flex-direction:column;gap:12px;}
.pay-opt{display:flex;align-items:center;gap:14px;background:var(--card);border-radius:var(--r-md);padding:16px;border:2px solid transparent;transition:.15s;}
.pay-opt.wa{background:#eafaf0;border-color:#bfead0;}
.pay-opt .pi{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:none;}
.pay-opt.wa .pi{background:var(--green);}
.pay-opt.card .pi{background:var(--ink);}
.pay-opt .pi svg{width:22px;height:22px;}
.pay-opt .pm{flex:1;}
.pay-opt .pm-t{font-size:15px;font-weight:800;}
.pay-opt .pm-s{font-size:11.5px;color:var(--muted);margin-top:2px;}
.pay-opt .pm-s.g{color:#159a48;}
.pay-opt .chev{color:var(--muted);flex:none;}

/* confirmation */
.confirm{text-align:center;padding:40px 22px 30px;}
.confirm .tick{width:84px;height:84px;border-radius:50%;background:var(--green);display:flex;align-items:center;justify-content:center;margin:0 auto 22px;animation:pop .5s cubic-bezier(.2,1.4,.4,1);}
@keyframes pop{from{transform:scale(0);}to{transform:scale(1);}}
.confirm .tick svg{width:40px;height:40px;stroke:#fff;fill:none;stroke-width:3;}
.confirm h2{font-size:23px;font-weight:800;margin-bottom:8px;}
.confirm p{color:var(--muted);font-size:14px;line-height:1.5;max-width:30ch;margin:0 auto;}
.confirm .bid{display:inline-block;background:var(--yellow-soft);border:1.5px dashed var(--yellow);border-radius:100px;padding:9px 20px;font-weight:800;font-size:14px;margin:20px 0;}
.confirm .drv{display:flex;align-items:center;gap:12px;background:var(--card);border-radius:var(--r-md);padding:14px;text-align:left;margin-top:8px;}
.confirm .drv .sp{width:18px;height:18px;border-radius:50%;border:2.5px solid var(--yellow-soft);border-top-color:var(--yellow);animation:spin .9s linear infinite;flex:none;}
.confirm .drv .dt{font-size:13px;color:var(--ink);font-weight:600;}

/* country gate */
.gate{position:fixed;inset:0;z-index:200;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:26px;max-width:440px;margin:0 auto;}
@media(min-width:460px){.gate{margin:24px auto;border-radius:38px;top:0;bottom:0;}}
.gate-inner{width:100%;text-align:center;animation:screenIn .5s;}
.gate-inner img{height:40px;margin:0 auto 26px;}
.gate-inner h1{font-size:23px;font-weight:800;letter-spacing:-0.02em;margin-bottom:8px;}
.gate-inner p{color:var(--muted);font-size:14px;margin-bottom:26px;line-height:1.5;}
.gate-search{display:flex;align-items:center;gap:11px;background:var(--card);border-radius:var(--r-md);padding:14px 15px;margin-bottom:14px;}
.gate-search svg{width:18px;height:18px;stroke:var(--muted);fill:none;stroke-width:2;flex:none;}
.gate-search input{flex:1;border:none;background:transparent;font-size:15px;font-weight:600;outline:none;color:var(--ink);}
.gate-search input::placeholder{color:var(--muted-2);font-weight:500;}
.gate-list{display:flex;flex-direction:column;gap:8px;max-height:46vh;overflow-y:auto;text-align:left;padding-right:4px;}
.gate-list::-webkit-scrollbar{width:5px;} .gate-list::-webkit-scrollbar-thumb{background:var(--line);border-radius:10px;}
.gate-btn{display:flex;align-items:center;gap:12px;background:var(--card);border:1.5px solid transparent;border-radius:var(--r-md);padding:13px 15px;transition:.15s;cursor:pointer;width:100%;}
.gate-btn:active{transform:scale(.98);} .gate-btn:hover{border-color:var(--yellow);}
.gate-btn .fl{font-size:22px;flex:none;}
.gate-btn .nm{font-size:14px;font-weight:700;flex:1;}
.gate-btn .cc{font-size:11.5px;font-weight:700;color:var(--muted);}
.gate-custom{background:var(--yellow-soft);border:1.5px dashed var(--yellow);}
.gate-custom .nm{color:var(--yellow-dark);}
.gate-empty{text-align:center;padding:18px 10px;color:var(--muted);font-size:13px;}

/* toast */
.toast{
  position:fixed;left:50%;bottom:96px;transform:translateX(-50%) translateY(20px);z-index:300;
  background:var(--ink);color:#fff;font-size:13px;font-weight:600;padding:12px 18px;border-radius:12px;
  box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;transition:.3s;display:flex;align-items:center;gap:9px;max-width:calc(100% - 44px);
}
.toast svg{width:16px;height:16px;stroke:var(--yellow);fill:none;stroke-width:2.2;flex:none;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* generic page (fleet, activity, profile) */
.page-t{padding:22px 22px 4px;font-size:24px;font-weight:800;letter-spacing:-0.02em;}
.page-s{padding:2px 22px 18px;color:var(--muted);font-size:13.5px;}
.fleet-full{padding:0 22px;}
.fleet-full-c{background:var(--card);border-radius:var(--r-lg);overflow:hidden;margin-bottom:14px;}
.fleet-full-c .ph{height:150px;background:#fff;}
.fleet-full-c .ph img{width:100%;height:100%;object-fit:cover;}
.fleet-full-c .info{padding:16px 18px 18px;}
.fleet-full-c .fn{font-size:17px;font-weight:800;}
.fleet-full-c .fm{font-size:12.5px;color:var(--yellow-ink);font-weight:700;margin-top:2px;}
.fleet-full-c .fd{font-size:13px;color:var(--muted);margin-top:8px;line-height:1.45;}
.fleet-full-c .fmeta{display:flex;gap:16px;font-size:12px;color:var(--muted);font-weight:600;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);}
.fleet-full-c .fmeta span{display:flex;align-items:center;gap:5px;}
.fleet-full-c .fmeta svg{width:14px;height:14px;stroke:var(--ink);fill:none;stroke-width:2;}

.faq-item{border-bottom:1px solid var(--line);}
.faq-q{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:17px 0;font-size:14.5px;font-weight:700;cursor:pointer;}
.faq-q svg{width:18px;height:18px;stroke:var(--muted);fill:none;stroke-width:2;flex:none;transition:transform .25s;}
.faq-item.open .faq-q svg{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s;}
.faq-item.open .faq-a{max-height:200px;}
.faq-a p{padding:0 0 18px;font-size:13px;color:var(--muted);line-height:1.6;}

.contact-card{background:var(--card);border-radius:var(--r-lg);padding:6px 4px;margin:0 22px 14px;}
.contact-row{display:flex;align-items:center;gap:14px;padding:15px 16px;border-bottom:1px solid var(--line);}
.contact-row:last-child{border-bottom:none;}
.contact-row .ci{width:40px;height:40px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;flex:none;box-shadow:0 3px 10px -6px rgba(0,0,0,.2);}
.contact-row .ci svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:2;}
.contact-row .cm{flex:1;}
.contact-row .cm-l{font-size:11px;color:var(--muted);font-weight:600;}
.contact-row .cm-v{font-size:14.5px;font-weight:700;margin-top:1px;}
/* ====== DESKTOP-ONLY ELEMENTS: hidden on mobile by default ====== */
.dtopnav,.dfooter,.home-hero-right,.dhero-head,.dhero-sub,.trust-strip{display:none;}
/* mobile: hero + sections wrappers are transparent passthroughs */
.home-hero,.home-hero-left,.home-sections{display:block;}

/* ============================================================
   DESKTOP / LAPTOP  (≥1000px) — becomes a full website
   ============================================================ */
@media(min-width:860px){
  /* light/dark-aware card controls (desktop only — mobile card is always dark) */
  #bookCard .dir-opt{background:var(--card);}
  #bookCard .dir-opt.on{background:rgba(245,179,1,.14);}
  #bookCard .dir-ic svg{stroke:var(--muted);}
  #bookCard .dir-opt.on .dir-ic svg{stroke:var(--yellow-dark);}
  #bookCard .dir-txt b{color:var(--ink);}
  #bookCard .dir-txt small{color:var(--muted);}
  body{background:#fff;}
  .app{max-width:100%;margin:0;min-height:100vh;border-radius:0;box-shadow:none;overflow:visible;}

  /* screens: no phone padding, show as normal page flow */
  .screen{padding-bottom:0;}
  .screen.active{animation:none;}
  .safetop{display:none;}

  /* hide mobile chrome */
  .botnav{display:none!important;}
  #homeTopbar{display:none;}

  /* ---- TOP NAV ---- */
  .dtopnav{display:block;position:sticky;top:0;z-index:80;background:#fff;border-bottom:1px solid var(--line);}
  .dtop-inner{max-width:1200px;margin:0 auto;padding:16px 40px;display:flex;align-items:center;justify-content:space-between;gap:30px;}
  .dtop-left{display:flex;align-items:center;gap:36px;}
  .dtop-logo{height:38px;width:auto;cursor:pointer;}
  .dtop-links{display:flex;gap:28px;}
  .dtop-links a{font-size:15px;font-weight:600;color:var(--ink);cursor:pointer;transition:opacity .15s;}
  .dtop-links a:hover{opacity:.55;}
  .dtop-right{display:flex;align-items:center;gap:14px;}
  .dtop-country{display:flex;align-items:center;gap:6px;background:var(--card);border-radius:100px;padding:8px 14px;font-weight:700;font-size:13px;}
  .dtop-country select{border:none;background:transparent;font-family:inherit;font-weight:700;font-size:13px;outline:none;cursor:pointer;}
  .dtop-wa{display:inline-flex;align-items:center;gap:8px;background:#12853f;color:#fff;font-weight:700;font-size:14px;padding:10px 18px;border-radius:100px;}
  .dtop-wa svg{width:17px;height:17px;}
  .dtop-cta{background:var(--ink);color:#fff;border:none;font-weight:700;font-size:14px;padding:11px 22px;border-radius:100px;cursor:pointer;transition:transform .14s;}
  .dtop-cta:hover{transform:translateY(-1px);}

  /* ---- HERO SPLIT ---- */
  .home-hero-right{display:block;}
  .home-hero{max-width:1200px;margin:0 auto;padding:60px 40px 20px;display:grid;grid-template-columns:minmax(0,46%) minmax(0,54%);gap:48px;align-items:center;}
  .home-hero-left{max-width:520px;}
  .dhero-head{display:block;font-size:52px;line-height:1.08;font-weight:800;letter-spacing:-0.03em;margin-bottom:16px;}
  .dhero-head .hl{color:#b57d00;}
  html[data-theme="dark"] .dhero-head .hl{color:var(--yellow);}
  .dhero-sub{display:block;font-size:17px;color:var(--muted);line-height:1.55;margin-bottom:26px;max-width:46ch;}
  /* booking card: light, elevated, website-style */
  #bookCard{margin:0;background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:0 30px 70px -30px rgba(17,18,23,.3);}
  #bookCard::after{display:none;}
  #bookCard h3{color:var(--ink);font-size:22px;}
  #bookCard .bc-sub{color:var(--muted);}
  #bookCard .triptype{background:var(--card);}
  #bookCard .triptype button{color:var(--muted);}
  #bookCard .triptype button.on{background:var(--yellow);color:#111;}
  #bookCard .loc-field{background:var(--card);}
  #bookCard .loc-field.focus{border-color:var(--yellow);}
  #bookCard .loc-label{color:var(--muted);}
  #bookCard .loc-val{color:var(--ink);}
  #bookCard .loc-val.ph{color:var(--muted);}
  #bookCard .loc-swap{border-color:#fff;}
  #bookCard .myloc-chip{background:var(--card);color:var(--ink);}

  .dhero-visual{position:relative;border-radius:28px;overflow:hidden;background:linear-gradient(135deg,#fff7e0,#ffeec0);height:460px;box-shadow:0 30px 70px -30px rgba(17,18,23,.25);display:flex;align-items:center;justify-content:center;}
  .dhero-map{position:absolute;inset:0;opacity:.5;}
  .dhero-map svg{width:100%;height:100%;object-fit:cover;}
  .dhero-car{position:relative;z-index:2;width:86%;max-width:620px;filter:drop-shadow(0 30px 40px rgba(0,0,0,.25));}
  .dhero-badge{position:absolute;z-index:3;bottom:26px;left:26px;background:#fff;border-radius:100px;padding:11px 18px;font-size:13.5px;font-weight:700;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:9px;}
  .dhb-dot{width:9px;height:9px;border-radius:50%;background:var(--green,#1fb85a);box-shadow:0 0 0 4px rgba(31,184,90,.2);}

  /* ---- SECTIONS CONTAINER ---- */
  .home-sections{max-width:1200px;margin:0 auto;padding:30px 40px 0;}
  .section-t{padding:40px 0 20px;}
  .section-t h4{font-size:28px;}
  .section-t a{font-size:14px;cursor:pointer;}
  .section-t a:hover{color:var(--ink);}

  /* quick routes -> grid, no scroll */
  .qr-scroll{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;overflow:visible;padding:0;}
  .qr-card{width:auto;}
  .qr-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);}

  /* fleet -> grid */
  .fleet-row{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;overflow:visible;padding:0;}
  .fleet-c{width:auto;}
  .fleet-c:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
  .fleet-c .ph{height:150px;}

  /* trust strip */
  .trust-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px;padding:34px;background:var(--card);border-radius:24px;}
  .trust-c{display:flex;align-items:center;gap:14px;}
  .trust-ic{width:46px;height:46px;border-radius:13px;background:#fff;display:flex;align-items:center;justify-content:center;flex:none;box-shadow:0 4px 12px -6px rgba(0,0,0,.2);}
  .trust-ic svg{width:22px;height:22px;stroke:var(--ink);fill:none;stroke-width:1.9;}
  .trust-t{font-size:15px;font-weight:800;}
  .trust-d{font-size:12.5px;color:var(--muted);margin-top:2px;}

  .promo{max-width:1200px;margin:50px auto 0;}

  /* ---- FOOTER ---- */
  .dfooter{display:block;background:var(--ink);color:#9a9ca4;margin-top:70px;}
  .dfoot-inner{max-width:1200px;margin:0 auto;padding:56px 40px 36px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;}
  .dfoot-brand img{height:42px;width:auto;filter:brightness(0) invert(1);margin-bottom:16px;}
  .dfoot-brand p{font-size:13.5px;line-height:1.7;max-width:34ch;color:#9a9ca4;}
  .dfoot-col h5{color:#fff;font-size:13px;font-weight:700;margin-bottom:16px;letter-spacing:.02em;}
  .dfoot-col a{display:block;font-size:13.5px;color:#9a9ca4;margin-bottom:11px;cursor:pointer;transition:color .15s;}
  .dfoot-col a:hover{color:var(--yellow);}
  .dfoot-bottom{max-width:1200px;margin:0 auto;padding:22px 40px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12.5px;color:#6b6d76;}

  /* ---- OTHER PAGES (fleet/info/profile) as centered website ---- */
  #scr-fleet,#scr-activity,#scr-profile{max-width:1000px;margin:0 auto;padding:40px 40px 80px;}
  .page-t{padding:0 0 6px;font-size:34px;}
  .page-s{padding:0 0 30px;font-size:16px;}
  #fleetFull{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;padding:0;}
  .fleet-full-c{margin-bottom:0;}
  .fleet-full-c:hover{box-shadow:var(--shadow);}
  #faqList{max-width:760px;}
  .contact-card{margin:0 0 20px;max-width:560px;}
  .faq-q{font-size:16px;}

  /* ---- BOOKING FLOW centered as modal-like page ---- */
  #scr-flow{max-width:560px;margin:0 auto;}
  .flow-head{padding-top:36px;}
  .flow-cta{position:sticky;background:transparent;max-width:560px;padding:24px 22px 40px;}

  /* location picker as centered overlay card */
  #scr-locpicker{max-width:520px!important;border-radius:0;}

  .toast{bottom:40px;}
}

/* mid / tablet tweak */
@media(min-width:860px) and (max-width:1200px){
  .dhero-head{font-size:42px;}
  .home-hero{gap:32px;}
}
/* ================= v6 ================= */
/* announcement bar */
.annbar{display:flex;align-items:center;justify-content:center;gap:9px;background:#0c0c0e;color:#fff;font-size:12.5px;font-weight:600;padding:10px 38px 12px;min-height:40px;cursor:pointer;position:relative;overflow:hidden;}
html[data-theme="dark"] .annbar{background:#17181b;border-bottom:1px solid #242529;}
.annbar .ann-txt{display:inline-block;transition:opacity .3s,transform .3s;text-align:center;line-height:1.3;}
.annbar .ann-txt.out{opacity:0;transform:translateY(-8px);}
.annbar .ann-ic{display:inline-flex;color:var(--yellow);flex:none;}
.annbar .ann-ic svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.ann-dots{position:absolute;bottom:3px;left:50%;transform:translateX(-50%);display:flex;gap:4px;}
.ann-dots i{width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.28);transition:.3s;}
.ann-dots i.on{background:var(--yellow);width:12px;border-radius:4px;}
.app:has(#scr-onboard.active) .annbar{display:none;}

/* mobile top bar + auth */
.tb-logo{height:30px;width:auto;cursor:pointer;flex:none;}
.topbar{gap:8px;}
.auth-slot{display:flex;align-items:center;gap:8px;}
.btn-ghost,.btn-yel{border:none;border-radius:100px;font-family:inherit;font-size:13px;font-weight:700;padding:9px 14px;cursor:pointer;white-space:nowrap;transition:transform .12s;}
.btn-ghost{background:var(--card);color:var(--ink);}
.btn-yel{background:var(--yellow);color:#111;}
.btn-ghost:active,.btn-yel:active{transform:scale(.95);}
.avatar-btn{width:38px;height:38px;border-radius:50%;border:none;background:linear-gradient(135deg,#ffd873,var(--yellow));color:#111;font-weight:800;font-size:15px;cursor:pointer;flex:none;}
.flag-chip{width:38px;height:38px;border-radius:50%;background:var(--card);border:none;font-size:18px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none;}
.greet-block{padding-top:10px;}
.greet-block .name{font-size:24px;line-height:1.15;letter-spacing:-.02em;}

/* when / return block inside booking card */
.when-block{margin-top:12px;}
.when-ic{width:26px;height:26px;border-radius:50%;background:rgba(245,179,1,.2);display:flex;align-items:center;justify-content:center;flex:none;}
.when-ic svg{width:15px;height:15px;stroke:var(--yellow);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.when-block .loc-field{margin-bottom:0;cursor:pointer;}
.return-block{max-height:0;opacity:0;overflow:hidden;transition:max-height .5s cubic-bezier(.22,.9,.36,1),opacity .35s ease,margin .3s;margin-top:0;}
.return-block.show{max-height:260px;opacity:1;margin-top:10px;}
.ret-head{display:flex;align-items:center;gap:9px;margin:2px 2px 9px;flex-wrap:wrap;}
.ret-route{font-size:13px;font-weight:700;color:#fff;flex:1;min-width:0;line-height:1.3;}
.ret-route span{color:#ffc928;margin:0 4px;display:inline-block;animation:retSwap .6s ease;}
@keyframes retSwap{0%{transform:rotate(180deg) scale(.6);opacity:0}100%{transform:none;opacity:1}}
.ret-off{font-size:10px;font-weight:800;background:rgba(40,196,102,.18);color:#5fe08f;padding:4px 8px;border-radius:100px;white-space:nowrap;}
.ret-note{font-size:11.5px;color:#9a9ca5;margin:8px 2px 0;line-height:1.4;}
.fare-preview{display:none;align-items:baseline;gap:8px;margin-top:12px;padding:11px 14px;border-radius:var(--r-md);background:rgba(245,179,1,.12);flex-wrap:wrap;}
.fare-preview.show{display:flex;animation:screenIn .3s;}
.fare-preview span{font-size:12px;color:#c9cbd2;}
.fare-preview b{font-size:19px;font-weight:800;color:var(--yellow);}
.fare-preview small{font-size:11px;color:#9a9ca5;width:100%;}

/* explore tiles */
.xp-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 22px;}
.xp-card{background:var(--card);border-radius:var(--r-lg);padding:14px 14px 16px;display:flex;flex-direction:column;gap:6px;min-height:186px;overflow:hidden;cursor:pointer;transition:transform .14s;border:none;text-align:left;color:var(--ink);font-family:inherit;}
.xp-card:active{transform:scale(.97);}
.xp-ill{height:60px;display:flex;justify-content:flex-end;margin:-2px -2px 0 0;}
.xp-ill svg{height:60px;width:auto;}
.xp-t{font-size:15px;font-weight:800;letter-spacing:-.01em;margin-top:2px;}
.xp-d{font-size:12px;color:var(--muted);line-height:1.45;flex:1;}
.xp-btn{align-self:flex-start;background:var(--bg);border-radius:100px;font-size:11.5px;font-weight:700;padding:7px 13px;color:var(--ink);}

/* verified stops / safety */
.safe-wrap{margin:30px 22px 0;border-radius:var(--r-xl);padding:24px 18px 22px;background:#0d1f17;color:#eafaf0;position:relative;overflow:hidden;}
.safe-wrap::after{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:rgba(40,196,102,.12);pointer-events:none;}
.safe-eyebrow{display:inline-flex;align-items:center;gap:7px;background:rgba(40,196,102,.16);color:#5fe08f;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:6px 11px;border-radius:100px;}
.safe-eyebrow svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
.safe-h{font-size:25px;line-height:1.15;font-weight:800;letter-spacing:-.02em;margin:14px 0 8px;position:relative;}
.safe-p{font-size:13.5px;line-height:1.6;color:#b4d6c2;max-width:56ch;position:relative;}
.safe-sub{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#7fd9a1;margin:24px 0 10px;position:relative;}
.safe-steps{display:flex;flex-direction:column;gap:10px;position:relative;}
.safe-step{display:flex;gap:13px;align-items:flex-start;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:var(--r-md);padding:14px;}
.safe-num{font-size:11px;font-weight:800;color:#5fe08f;}
.safe-ic{width:40px;height:40px;border-radius:12px;background:rgba(40,196,102,.16);display:flex;align-items:center;justify-content:center;flex:none;}
.safe-ic svg{width:20px;height:20px;stroke:#5fe08f;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.safe-step b{display:block;font-size:14.5px;margin-bottom:3px;color:#fff;}
.safe-step span.d{font-size:12.5px;line-height:1.5;color:#b4d6c2;display:block;}
.stop-row{display:grid;grid-template-columns:1fr;gap:10px;position:relative;}
.stop-card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-lg);padding:15px;}
.stop-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px;}
.stop-top b{font-size:15px;color:#fff;display:block;}
.stop-top small{font-size:11.5px;color:#9fc4ae;}
.vbadge{display:inline-flex;align-items:center;gap:5px;background:#28c466;color:#06210f;font-size:10.5px;font-weight:800;padding:5px 9px;border-radius:100px;white-space:nowrap;}
.vbadge svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;}
.stop-ticks{display:flex;flex-wrap:wrap;gap:6px;}
.stop-ticks span{font-size:11.5px;font-weight:600;color:#d6f1e0;background:rgba(255,255,255,.08);border-radius:100px;padding:5px 10px;}
.stop-ticks span::before{content:"✓ ";color:#5fe08f;font-weight:800;}
.free-break{margin-top:14px;display:flex;align-items:center;gap:12px;background:rgba(245,179,1,.14);border:1px solid rgba(245,179,1,.3);border-radius:var(--r-md);padding:13px 14px;position:relative;}
.free-break b{color:var(--yellow);font-size:13.5px;display:block;}
.free-break span{font-size:12px;color:#e9e2c7;line-height:1.45;}
.family-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px;position:relative;}
.fam-c{background:rgba(255,255,255,.06);border-radius:var(--r-md);padding:13px;font-size:12px;color:#b4d6c2;line-height:1.45;}
.fam-c b{display:block;color:#fff;font-size:13px;margin-bottom:3px;}
.fam-c svg{width:20px;height:20px;stroke:#5fe08f;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;margin-bottom:7px;display:block;}

/* how it works */
.hiw-scroll{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 22px 6px;scrollbar-width:none;}
.hiw-scroll::-webkit-scrollbar{display:none;}
.hiw-card{flex:none;width:248px;scroll-snap-align:start;background:var(--card);border-radius:var(--r-lg);overflow:hidden;}
.hiw-ill{height:128px;background:var(--yellow-soft);display:flex;align-items:center;justify-content:center;}
.hiw-ill svg{height:104px;width:auto;}
.hiw-b{padding:14px 16px 18px;}
.hiw-n{font-size:11px;font-weight:800;color:var(--yellow-ink);letter-spacing:.06em;}
.hiw-b h5{font-size:15.5px;font-weight:800;margin:4px 0 6px;}
.hiw-b p{font-size:12.5px;color:var(--muted);line-height:1.5;}

/* surprise banner (home) */
.sp-banner{margin:26px 22px 0;border-radius:var(--r-xl);padding:20px 18px;background:linear-gradient(120deg,#fff3d1,#ffe29a);display:flex;align-items:center;gap:14px;color:#2b2411;}
html[data-theme="dark"] .sp-banner{background:linear-gradient(120deg,#2a2410,#3a3014);color:#fff2c4;}
.sp-banner .sb-ill svg{height:84px;width:auto;}
.sp-banner h4{font-size:17px;font-weight:800;margin-bottom:4px;}
.sp-banner p{font-size:12.5px;line-height:1.45;opacity:.85;margin-bottom:10px;}
.sp-banner button{border:none;background:#111;color:#fff;font-family:inherit;font-size:12.5px;font-weight:700;padding:9px 15px;border-radius:100px;cursor:pointer;}
html[data-theme="dark"] .sp-banner button{background:var(--yellow);color:#111;}

/* surprise card in booking flow */
.surprise-card{margin-top:18px;border-radius:var(--r-lg);padding:15px;background:var(--yellow-soft);border:2px solid transparent;transition:.2s;}
.surprise-card.on{border-color:var(--yellow);}
.sp-head{display:flex;align-items:flex-start;gap:12px;}
.sp-ic svg{width:46px;height:46px;}
.sp-tx{flex:1;min-width:0;}
.sp-tx b{display:block;font-size:14.5px;margin-bottom:3px;}
.sp-tx b em{font-style:normal;font-size:10px;font-weight:800;background:var(--card);color:var(--muted);padding:2px 7px;border-radius:100px;margin-left:5px;vertical-align:middle;}
.sp-tx span{font-size:12px;color:var(--muted);line-height:1.45;display:block;}
.sp-fields{margin-top:14px;display:grid;gap:12px;animation:screenIn .3s;}
.sp-fine{font-size:11.5px;color:var(--muted);line-height:1.45;}
.switch{width:46px;height:28px;border-radius:100px;background:var(--muted-2);border:none;position:relative;transition:.2s;cursor:pointer;flex:none;}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 2px 6px rgba(0,0,0,.25);}
.switch.on{background:var(--green);}
.switch.on::after{left:21px;}

/* sheets (login / calendar / edit) */
.sheet-back{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:240;opacity:0;pointer-events:none;transition:opacity .25s;}
.sheet-back.open{opacity:1;pointer-events:auto;}
.sheet{position:fixed;left:50%;bottom:0;transform:translate(-50%,105%);width:min(440px,100%);max-height:92vh;overflow-y:auto;background:var(--bg);color:var(--ink);border-radius:28px 28px 0 0;padding:10px 22px calc(26px + env(safe-area-inset-bottom));z-index:250;transition:transform .35s cubic-bezier(.22,.9,.36,1);box-shadow:0 -20px 60px -20px rgba(0,0,0,.5);}
.sheet.open{transform:translate(-50%,0);}
.sheet-grab{width:40px;height:4px;border-radius:4px;background:var(--line);margin:4px auto 14px;}
.sheet-x{position:absolute;right:16px;top:14px;width:34px;height:34px;border-radius:50%;border:none;background:var(--card);color:var(--ink);font-size:20px;line-height:1;cursor:pointer;}
.sheet-back-btn{border:none;background:var(--card);color:var(--ink);width:34px;height:34px;border-radius:50%;font-size:18px;cursor:pointer;margin-bottom:6px;}
.sheet-t{font-size:22px;font-weight:800;letter-spacing:-.02em;margin:6px 0;}
.sheet-s{font-size:13.5px;color:var(--muted);line-height:1.5;margin-bottom:16px;}
.sheet-s b{color:var(--ink);}
.sheet-fine{font-size:11px;color:var(--muted);line-height:1.5;margin-top:12px;text-align:center;}
.auth-ill{display:flex;justify-content:center;margin:2px 0 6px;}
.auth-ill svg{height:92px;width:auto;}
.phone-row{display:flex;gap:8px;margin-bottom:12px;}
.phone-row select{width:104px;flex:none;background:var(--card);border:2px solid transparent;border-radius:var(--r-md);padding:15px 8px;font-family:inherit;font-size:15px;font-weight:700;color:var(--ink);outline:none;}
.phone-row input{flex:1;min-width:0;background:var(--card);border:2px solid transparent;border-radius:var(--r-md);padding:15px 14px;font-family:inherit;font-size:16px;font-weight:600;color:var(--ink);outline:none;}
.phone-row input:focus,.phone-row select:focus,.sheet .dt-field input:focus,.sheet .dt-field select:focus{border-color:var(--yellow);}
.auth-err{min-height:18px;font-size:12.5px;font-weight:600;color:var(--danger);margin-bottom:8px;}
.big-btn.full{width:100%;flex:none;}
.otp-boxes{display:flex;gap:8px;justify-content:space-between;margin:6px 0 10px;}
.otp-boxes input{width:100%;min-width:0;height:54px;text-align:center;background:var(--card);border:2px solid transparent;border-radius:var(--r-md);font-family:inherit;font-size:22px;font-weight:800;color:var(--ink);outline:none;}
.otp-boxes input:focus{border-color:var(--yellow);}
.otp-boxes.shake{animation:shake .4s;}
@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.otp-demo{font-size:12px;color:var(--muted);background:var(--yellow-soft);border-radius:var(--r-sm);padding:9px 12px;margin-bottom:12px;}
.otp-demo b{color:var(--ink);letter-spacing:.1em;}
.resend{font-size:12.5px;color:var(--muted);text-align:center;margin-top:14px;}
.resend a{color:var(--ink);font-weight:700;text-decoration:underline;cursor:pointer;}
.btn-link{border:none;background:none;color:var(--ink);font-family:inherit;font-size:13.5px;font-weight:700;text-decoration:underline;cursor:pointer;display:block;margin:12px auto 0;}
.sheet .dt-grid{margin-bottom:10px;}
.chip-row{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 14px;}
.chip-row button{border:2px solid transparent;background:var(--card);color:var(--ink);font-family:inherit;font-size:13.5px;font-weight:700;padding:10px 16px;border-radius:100px;cursor:pointer;}
.chip-row button.on{border-color:var(--yellow);background:var(--yellow-soft);}
.radio-list{display:flex;flex-direction:column;gap:8px;margin-bottom:14px;}
.radio-list button{display:flex;align-items:center;gap:12px;border:2px solid transparent;background:var(--card);color:var(--ink);font-family:inherit;font-size:14.5px;font-weight:600;padding:14px;border-radius:var(--r-md);cursor:pointer;text-align:left;}
.radio-list button.on{border-color:var(--yellow);}
.radio-list button i{width:20px;height:20px;border-radius:50%;border:2px solid var(--muted-2);flex:none;position:relative;}
.radio-list button.on i{border-color:var(--yellow);}
.radio-list button.on i::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--yellow);}

/* calendar */
.cal-chips{display:flex;gap:8px;margin:4px 0 10px;}
.cal-chips button{flex:1;border:2px solid transparent;background:var(--card);color:var(--ink);font-family:inherit;text-align:left;padding:10px 12px;border-radius:var(--r-md);cursor:pointer;}
.cal-chips button small{display:block;font-size:10.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;}
.cal-chips button b{font-size:14px;}
.cal-chips button.on{border-color:var(--yellow);background:var(--yellow-soft);}
.cal-head{display:flex;align-items:center;justify-content:space-between;background:var(--yellow);border-radius:100px;padding:5px;margin:6px 0 10px;color:#111;font-weight:800;font-size:14px;}
.cal-head button{width:34px;height:34px;border-radius:50%;border:none;background:rgba(255,255,255,.55);font-size:17px;cursor:pointer;color:#111;}
.cal-head button:disabled{opacity:.3;cursor:default;}
.cal-dow,.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;}
.cal-dow span{font-size:11px;font-weight:700;color:var(--muted);padding:6px 0;}
.cal-day{height:42px;border:none;background:transparent;color:var(--ink);font-family:inherit;font-size:14px;font-weight:600;cursor:pointer;padding:0;}
.cal-day span{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;}
.cal-day.dis{color:var(--muted-2);opacity:.4;cursor:not-allowed;}
.cal-day.today span{box-shadow:inset 0 0 0 1.5px var(--yellow);}
.cal-day.inr{background:var(--yellow-soft);}
.cal-day.s span,.cal-day.e span{background:var(--ink);color:var(--bg);box-shadow:none;}
.cal-day.s.hasend{background:linear-gradient(to right,transparent 50%,var(--yellow-soft) 50%);}
.cal-day.e{background:linear-gradient(to left,transparent 50%,var(--yellow-soft) 50%);}
.cal-day.e.s{background:transparent;}
.cal-sum{font-size:13px;font-weight:700;text-align:center;margin:12px 0;color:var(--ink);min-height:18px;}
.cal-times{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;}
.cal-times.one{grid-template-columns:1fr;}

/* account */
.acct-tabs{display:flex;overflow-x:auto;scrollbar-width:none;border-bottom:3px solid var(--card);margin:8px 0 0;padding:0 14px;}
.acct-tabs::-webkit-scrollbar{display:none;}
.acct-tabs button{flex:none;border:none;background:none;font-family:inherit;font-size:14.5px;font-weight:600;color:var(--muted);padding:13px 12px 12px;cursor:pointer;margin-bottom:-3px;border-bottom:3px solid transparent;}
.acct-tabs button.on{color:var(--ink);border-bottom-color:var(--ink);}
.acct-body{padding:18px 22px 0;}
.acct-hero{text-align:center;padding:6px 0 18px;}
.acct-av{width:84px;height:84px;border-radius:50%;background:linear-gradient(135deg,#ffd873,var(--yellow));color:#111;font-size:34px;font-weight:800;display:flex;align-items:center;justify-content:center;margin:0 auto 10px;}
.acct-av.grey{background:var(--muted-2);color:#fff;}
.acct-name{font-size:24px;font-weight:800;letter-spacing:-.02em;}
.acct-mail{font-size:13.5px;color:var(--muted);margin-top:2px;}
.acct-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.acct-tile{background:var(--card);border-radius:var(--r-md);padding:18px 10px;display:flex;flex-direction:column;align-items:center;gap:9px;font-family:inherit;font-size:13.5px;font-weight:700;border:none;color:var(--ink);cursor:pointer;transition:transform .12s;}
.acct-tile:active{transform:scale(.96);}
.acct-tile svg{width:26px;height:26px;stroke:var(--ink);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.acct-h{font-size:24px;font-weight:800;letter-spacing:-.02em;margin:4px 0 6px;}
.acct-sub{font-size:13.5px;color:var(--muted);line-height:1.5;margin-bottom:16px;}
.acct-sec{font-size:19px;font-weight:800;margin:26px 0 12px;letter-spacing:-.01em;}
.sugg{border:1.5px solid var(--line);border-radius:var(--r-lg);padding:18px;}
.sugg h4{font-size:19px;font-weight:800;line-height:1.2;margin-bottom:6px;}
.sugg p{font-size:13.5px;color:var(--muted);line-height:1.5;margin-bottom:12px;}
.sugg button{border:none;background:var(--card);color:var(--ink);font-family:inherit;font-size:14px;font-weight:700;padding:11px 18px;border-radius:100px;cursor:pointer;}
.prog{height:6px;background:var(--card);border-radius:6px;margin:0 0 12px;overflow:hidden;}
.prog i{display:block;height:100%;background:var(--yellow);border-radius:6px;}
.set-list{border-top:1px solid var(--line);}
.set-row{display:flex;align-items:center;gap:14px;padding:16px 2px;border-bottom:1px solid var(--line);cursor:pointer;background:none;border-left:none;border-right:none;border-top:none;width:100%;font-family:inherit;color:var(--ink);text-align:left;}
.set-row .sr-main{flex:1;min-width:0;}
.set-row .sr-t{font-size:16px;font-weight:600;}
.set-row .sr-v{font-size:14px;color:var(--muted);margin-top:2px;word-break:break-word;}
.set-row .sr-v.ph{color:var(--muted-2);}
.set-row .chev{color:var(--muted-2);font-size:20px;flex:none;}
.set-row.danger .sr-t{color:var(--danger);}
.vtick{display:inline-block;width:16px;height:16px;border-radius:50%;background:var(--green);color:#fff;font-size:10px;line-height:16px;text-align:center;margin-left:6px;vertical-align:middle;}
.set-row select{border:none;background:var(--card);color:var(--ink);font-family:inherit;font-size:14px;font-weight:600;padding:9px 10px;border-radius:var(--r-sm);outline:none;max-width:160px;}
.addr-card{display:flex;gap:13px;align-items:flex-start;background:var(--card);border-radius:var(--r-md);padding:15px;margin-bottom:10px;}
.addr-ic{width:42px;height:42px;border-radius:12px;background:var(--bg);display:flex;align-items:center;justify-content:center;flex:none;}
.addr-ic svg{width:21px;height:21px;stroke:var(--ink);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.addr-main{flex:1;min-width:0;}
.addr-main b{font-size:15px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.addr-main b em{font-style:normal;font-size:10px;font-weight:800;background:var(--yellow);color:#111;padding:2px 8px;border-radius:100px;}
.addr-main p{font-size:13px;color:var(--muted);margin-top:2px;line-height:1.4;}
.addr-main small{display:block;font-size:12px;color:var(--muted);margin-top:2px;}
.addr-acts{display:flex;gap:14px;margin-top:10px;}
.addr-acts button{border:none;background:none;font-family:inherit;font-size:12.5px;font-weight:700;color:var(--ink);text-decoration:underline;cursor:pointer;padding:0;}
.addr-acts button.red{color:var(--danger);}
.empty-note{text-align:center;color:var(--muted);font-size:13.5px;line-height:1.5;padding:22px 10px;background:var(--card);border-radius:var(--r-md);margin-bottom:14px;}
.lo-card{margin:10px 22px 0;background:var(--card);border-radius:var(--r-xl);padding:26px 22px;text-align:center;}
.lo-ill{display:flex;justify-content:center;margin-bottom:8px;}
.lo-ill svg{height:110px;width:auto;}
.lo-card h3{font-size:22px;font-weight:800;letter-spacing:-.02em;margin-bottom:8px;}
.lo-card p{font-size:13.5px;color:var(--muted);line-height:1.55;margin-bottom:18px;}
.lo-card .btn-yel{width:100%;padding:15px;font-size:15px;}

/* rides */
.ride-sec{font-size:20px;font-weight:800;margin:20px 22px 10px;letter-spacing:-.01em;}
.ride-big{margin:0 22px 8px;border:1.5px solid var(--line);border-radius:var(--r-lg);padding:12px;cursor:pointer;}
.ride-big .rb-map{border-radius:var(--r-md);overflow:hidden;height:150px;margin-bottom:12px;}
.ride-big .rb-map svg{width:100%;height:100%;display:block;}
.ride-big h4{font-size:18px;font-weight:800;letter-spacing:-.01em;}
.ride-meta{font-size:13px;color:var(--muted);margin-top:3px;}
.ride-btns{display:flex;gap:8px;margin-top:12px;}
.pill-btn{border:none;background:var(--card);color:var(--ink);font-family:inherit;font-size:13.5px;font-weight:700;padding:10px 16px;border-radius:100px;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:transform .12s;}
.pill-btn:active{transform:scale(.95);}
.pill-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.ride-row{display:flex;align-items:center;gap:14px;padding:14px 22px;cursor:pointer;}
.ride-row .rr-th{width:76px;height:58px;border-radius:12px;background:#fff;overflow:hidden;flex:none;}
.ride-row .rr-th img{width:100%;height:100%;object-fit:cover;}
.ride-row .rr-main{flex:1;min-width:0;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:-14px;}
.ride-row b{font-size:15.5px;font-weight:600;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ride-row .rr-s{font-size:13px;color:var(--muted);margin-top:2px;}
.chip{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.04em;padding:2px 8px;border-radius:100px;background:var(--card);color:var(--muted);margin-left:6px;vertical-align:middle;}
.chip.g{background:rgba(40,196,102,.15);color:var(--green);}
.chip.r{background:rgba(229,72,77,.14);color:var(--danger);}
.chip.y{background:var(--yellow-soft);color:var(--yellow-ink);}
.rd-back{display:flex;align-items:center;gap:12px;padding:20px 22px 6px;}
.rd-back button{width:42px;height:42px;border-radius:50%;background:var(--card);border:none;color:var(--ink);font-size:18px;cursor:pointer;}
.rd-back h2{font-size:18px;font-weight:800;}
.rd-pad{padding:0 22px;}
.rd-map{border-radius:var(--r-lg);overflow:hidden;height:170px;margin:8px 0 14px;}
.rd-map svg{width:100%;height:100%;display:block;}
.rd-card{background:var(--card);border-radius:var(--r-lg);padding:16px;margin-bottom:12px;}
.rd-route{display:flex;gap:12px;}
.rd-dots{display:flex;flex-direction:column;align-items:center;padding-top:5px;}
.rd-dots i{width:10px;height:10px;border-radius:50%;background:var(--ink);}
.rd-dots u{width:2px;flex:1;background:var(--line);margin:3px 0;}
.rd-dots i.sq{border-radius:2px;background:var(--yellow);}
.rd-pts{flex:1;display:flex;flex-direction:column;gap:14px;}
.rd-pts small{font-size:10.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;display:block;}
.rd-pts b{font-size:15px;}
.rd-line{display:flex;justify-content:space-between;gap:10px;font-size:14px;padding:6px 0;color:var(--muted);}
.rd-line strong{color:var(--ink);font-weight:700;text-align:right;}
.rd-total{display:flex;justify-content:space-between;align-items:baseline;border-top:1.5px dashed var(--line);margin-top:8px;padding-top:12px;}
.rd-total span{font-weight:700;} .rd-total b{font-size:24px;font-weight:800;}
.rd-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px;}
.rd-btns .big-btn{flex:none;padding:15px 10px;font-size:14px;}
.rd-btns .big-btn.ghost{background:var(--card);color:var(--ink);}
.rd-driver{display:flex;align-items:center;gap:12px;}
.rd-dav{width:46px;height:46px;border-radius:50%;background:var(--yellow-soft);color:var(--yellow-ink);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:18px;}
.rd-driver b{display:block;font-size:15px;} .rd-driver small{font-size:12.5px;color:var(--muted);}

/* services page extras */
.svc-lead{padding:0 22px;}
.section-t{scroll-margin-top:90px;}
.contact-card{background:var(--card);border-radius:var(--r-lg);padding:6px 4px;margin:0 22px 14px;}
.contact-row{display:flex;align-items:center;gap:14px;padding:15px 16px;border-bottom:1px solid var(--line);color:var(--ink);}
.contact-row:last-child{border-bottom:none;}
.contact-row .ci{width:40px;height:40px;border-radius:12px;background:var(--bg);display:flex;align-items:center;justify-content:center;flex:none;}
.contact-row .ci svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:2;}
.contact-row .cm{flex:1;min-width:0;}
.contact-row .cm-l{font-size:11px;color:var(--muted);font-weight:600;}
.contact-row .cm-v{font-size:14.5px;font-weight:700;margin-top:1px;}

/* nav dots / misc */
.dtop-wa .t{display:inline;}
#receiptPrint{display:none;}
@media(max-width:380px){.btn-ghost,.btn-yel{padding:8px 11px;font-size:12.5px;}.tb-logo{height:26px;}}

/* ---- desktop (≥860) ---- */
@media(min-width:860px){
  .greet-block{display:none;}
  .annbar{font-size:13px;}
  .xp-grid{grid-template-columns:repeat(3,1fr);padding:0;gap:16px;}
  .safe-wrap{margin:44px 0 0;padding:38px 36px 34px;}
  .safe-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;}
  .safe-step{flex-direction:column;}
  .stop-row{grid-template-columns:1fr 1fr;}
  .family-row{grid-template-columns:repeat(4,1fr);}
  .hiw-scroll{display:grid;grid-template-columns:repeat(5,1fr);overflow:visible;padding:0;}
  .hiw-card{width:auto;}
  .sp-banner{margin:44px 0 0;padding:28px 34px;}
  .sp-banner .sb-ill svg{height:110px;}
  .sp-banner h4{font-size:24px;}
  .sp-banner p{font-size:14.5px;max-width:52ch;}
  .ret-route{color:var(--ink);} .ret-note{color:var(--muted);}
  .fare-preview{background:var(--yellow-soft);} .fare-preview span{color:var(--muted);} .fare-preview b{color:var(--yellow-ink);} .fare-preview small{color:var(--muted);}
  .ret-off{background:rgba(40,196,102,.14);color:#159a48;}
  .when-ic{background:rgba(245,179,1,.22);} .when-ic svg{stroke:var(--yellow-dark);}
  #scr-services,#scr-rides,#scr-ride,#scr-account{max-width:1000px;margin:0 auto;padding:40px 40px 80px;}
  #scr-services .svc-lead,#scr-services .pad{padding:0;}
  #scr-services .contact-card{margin:0 0 14px;max-width:620px;}
  #scr-services #fleetFull{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;padding:0;}
  .acct-body{padding:20px 0 0;}
  .acct-tabs{padding:0;}
  .acct-tiles{grid-template-columns:repeat(4,1fr);}
  .ride-sec{margin:26px 0 12px;}
  .ride-big{margin:0 0 8px;}
  .ride-row{padding:14px 0;}
  .rd-pad{padding:0;max-width:640px;}
  .rd-back{padding:0 0 10px;}
  .lo-card{margin:10px 0 0;max-width:560px;}
  .sheet{bottom:auto;top:50%;transform:translate(-50%,-46%) scale(.97);opacity:0;pointer-events:none;border-radius:26px;width:min(480px,92vw);transition:transform .3s,opacity .25s;padding-bottom:26px;}
  .sheet.open{transform:translate(-50%,-50%);opacity:1;pointer-events:auto;}
  .dtop-links a.on{opacity:1;box-shadow:inset 0 -2px 0 var(--yellow);}
  .dtop-auth{display:flex;align-items:center;gap:8px;}
}
@media(min-width:860px) and (max-width:1120px){
  .dtop-wa .t{display:none;}
  .dtop-wa{padding:10px 12px;}
  .dtop-inner{padding:14px 24px;gap:14px;}
  .dtop-left{gap:20px;}
  .dtop-links{gap:16px;}
}

/* printable receipt */
@media print{
  body *{visibility:hidden !important;}
  #receiptPrint,#receiptPrint *{visibility:visible !important;}
  #receiptPrint{display:block !important;position:absolute;left:0;top:0;width:100%;background:#fff;color:#111;padding:28px;font-family:'Plus Jakarta Sans',Arial,sans-serif;}
  #receiptPrint table{width:100%;border-collapse:collapse;margin-top:14px;}
  #receiptPrint td,#receiptPrint th{padding:9px 6px;border-bottom:1px solid #ddd;font-size:13px;text-align:left;}
  #receiptPrint td.r,#receiptPrint th.r{text-align:right;}
  #receiptPrint h1{font-size:22px;margin:0;} #receiptPrint .rc-top{display:flex;justify-content:space-between;align-items:center;border-bottom:3px solid #F5B301;padding-bottom:14px;}
  #receiptPrint .rc-top img{height:44px;} #receiptPrint .rc-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px;font-size:13px;}
  #receiptPrint .rc-total td{font-size:16px;font-weight:800;border-bottom:none;} #receiptPrint .rc-fine{font-size:11px;color:#666;margin-top:18px;line-height:1.5;}
}


/* v6 fixes: icon colours inside direction pills + keep card content above the decorative circle */
.dir-ic{color:#c9cbd2;} .dir-opt.on .dir-ic{color:var(--yellow);}
.book-card>*{position:relative;z-index:1;}
@media(min-width:860px){ #bookCard .dir-ic{color:var(--muted);} #bookCard .dir-opt.on .dir-ic{color:var(--yellow-dark);} }

/* v6 dark-mode contrast fixes (selected rows, bottom bar, badges, promo, chips) */
.opt-row.sel,.extra-row.sel{background:var(--bg);}
@media(max-width:859px){ .flow-cta{background:linear-gradient(to top,var(--bg) 70%,transparent);} }
.map-badge{background:var(--bg);color:var(--ink);box-shadow:0 4px 14px -6px rgba(0,0,0,.35);}
html[data-theme="dark"] .qr-ic{background:#242529;}
html[data-theme="dark"] .promo{background:linear-gradient(120deg,#2a2410,#3a3014);}
html[data-theme="dark"] .promo .pt-s{color:#d9c98a;}
@media(min-width:860px){ body{background:var(--bg);} .dhero-badge{background:var(--bg);color:var(--ink);} }

/* anchor targets clear the sticky desktop nav */
#safetyHome,#hiwHome,#xpHome,#svcFleet,#svcStops,#svcFaq,#svcContact,#bookCard{scroll-margin-top:96px;}
@media(max-width:859px){ #safetyHome,#hiwHome,#xpHome,#svcFleet,#svcStops,#svcFaq,#svcContact,#bookCard{scroll-margin-top:12px;} }