/* Worcar's shared visual system. Loaded after the feature styles. */


:root{
  --ink:var(--tone-202522);--muted:var(--tone-555b57);--green:var(--tone-202522);--green-hover:var(--tone-202522);
  --mint:var(--tone-e9ebe8);--accent:var(--tone-d5d8d5);--canvas:var(--tone-f5f5f3);--surface:var(--tone-ffffff);
  --line:var(--tone-e9ebe8);--soft:var(--tone-f5f5f3);--cream:var(--tone-f5f5f3);
  --radius:20px;--shadow:0 4px 24px #20252206;
}
html{color-scheme:light;scroll-padding-bottom:110px}
body{background:var(--canvas);color:var(--ink);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea{font-family:inherit}
button,a{touch-action:manipulation}
button:disabled{cursor:default;opacity:.45}
button,a,input,select,textarea,summary{outline-color:var(--green)}
:focus-visible{outline:3px solid var(--line-555b57);outline-offset:4px}
input,select,textarea{accent-color:var(--green)}
input::placeholder,textarea::placeholder{color:var(--ink-7c827e);opacity:1}
input[type=checkbox],input[type=radio]{accent-color:var(--green)}
h1,h2,h3{font-weight:700;color:var(--ink)}
h1{font-size:36px;line-height:1.12;letter-spacing:-.045em;margin:0 0 12px}
h2{font-size:22px;line-height:1.3;letter-spacing:-.035em;margin-bottom:16px}
h3{font-size:17px;line-height:1.4;letter-spacing:-.025em}
p{margin:8px 0;line-height:1.6}
.muted{color:var(--muted);font-size:14px}
.muted.large{font-size:16px}
.eyebrow{color:var(--muted);font-size:11px;font-weight:600;letter-spacing:.11em;margin-bottom:12px}
.icon{stroke-width:1.8}
.topbar{height:88px;max-width:1120px;padding:0 32px;border-bottom:1px solid var(--line);gap:16px}
.topbar>a{display:flex;align-items:center;min-height:44px}
.wordmark{width:148px;height:34px}
.top-actions{gap:12px}
.link{color:var(--green);min-height:44px;font-size:14px;padding:10px 2px}
.top-actions .role-switch{display:flex;align-items:center;gap:7px;padding:8px 12px;background:var(--surface);border:1px solid var(--line);border-radius:30px;font-size:12px;color:var(--ink)}
.role-switch .icon{width:16px;height:16px}
.notification-bell{width:44px;height:44px;border:1px solid var(--line);background:var(--surface);color:var(--ink)}
.notification-bell .icon{width:21px;height:21px}
.notification-bell .unread-dot{background:var(--green);border:2px solid var(--surface);font-size:10px;height:20px;min-width:20px;top:-4px;right:-4px}
.main{max-width:760px;margin:36px auto 128px;padding:0 32px}
.main.narrow{max-width:720px}
.main.page-home.role-passenger{max-width:1120px}
.page-heading{margin-bottom:28px;align-items:center;gap:16px}
.page-heading p{margin:0 0 8px}
.page-heading h1{margin:0}
.btn{border-radius:12px;background:var(--green);color:var(--ink-ffffff);min-height:54px;padding:15px 22px;font-size:15px;font-weight:600;line-height:1.4;transition:background .15s,box-shadow .15s,transform .15s;box-shadow:none}
.btn.secondary{background:var(--soft);color:var(--ink)}
.btn.ghost{background:var(--surface);color:var(--ink);border:1px solid var(--line)}
.btn.danger{background:var(--surface-fcede9);color:#9B3223}
.btn.small{min-height:44px;border-radius:10px;padding:10px 14px;font-size:13px}
.btn.full+.btn.full{margin-top:10px}
.card{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);padding:24px;margin-bottom:20px;box-shadow:var(--shadow)}
.card .card{box-shadow:none}
.row{gap:12px;min-width:0}
.row>*{min-width:0}
.stack{gap:18px}
.field{font-size:13px;gap:8px;color:var(--ink);min-width:0}
.field input,.field select,.field textarea,input.input,select.input,textarea.input{border:1px solid var(--line);background:var(--soft);border-radius:12px;color:var(--ink);min-height:54px;padding:14px 15px;font-size:16px;line-height:1.5}
.field input:focus,.field select:focus,.field textarea:focus{background:var(--surface-ffffff);border-color:var(--green);outline:2px solid var(--green);outline-offset:1px}
.fields{gap:16px}
.check{font-size:14px;min-height:44px}
.check input{width:20px;height:20px;flex-shrink:0}
.pill{font-size:11px;letter-spacing:0;font-weight:600;padding:6px 10px;border:0;border-radius:30px;background:var(--soft);color:var(--muted)}
.badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;line-height:1.5;border-radius:7px;padding:6px 10px;background:var(--soft);color:var(--ink-555b57)}
.badge .icon{width:15px;height:15px}
.badge.success{color:var(--ink-202522);background:var(--surface-e9ebe8)}
.badge.warning{color:#80530A;background:#FFF2D8}
.badge.error{color:#9C3327;background:var(--surface-fceae6)}
.notice{background:var(--soft);color:var(--ink-555b57);border:1px solid var(--line);border-radius:12px;font-size:13px;padding:15px 16px;line-height:1.65}
.notice.error{background:var(--surface-fcede9);border-color:#F3D3CB;color:#932F23}
.empty{border:1px solid var(--line);background:var(--surface);border-radius:var(--radius);color:var(--muted);font-size:14px;padding:36px 24px}
.empty-symbol{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 18px;background:var(--soft);border-radius:20px;color:var(--green)}
.empty-symbol .icon{margin:0;width:30px;height:30px}
.empty h3{margin-bottom:8px}
.empty p{max-width:350px;margin:0 auto;font-size:14px}
.divider{background:var(--line)}

/* Passenger home: destination first, regular travel close at hand. */
.home-heading{margin:0 0 28px}
.home-heading h1{font-size:46px;letter-spacing:-.055em}
.home-heading .muted{font-size:14px;margin-bottom:8px}
.home-greeting-mark{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--mint);color:var(--green)}
.home-greeting-mark .icon{width:27px;height:27px}
.passenger-home-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px;align-items:start}
.booking-launch.unified-booking{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:24px;padding:28px;margin:0;box-shadow:0 8px 32px #20252207}
.unified-booking .booking-mode{display:grid;grid-template-columns:1fr 1fr;gap:12px;border:0;background:none;padding:0;margin:0 0 24px;border-radius:0}
.unified-booking .booking-mode button{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:14px;background:var(--soft);border:1px solid transparent;min-height:142px;padding:18px;text-align:left;border-radius:16px;color:var(--ink);box-shadow:none}
.unified-booking .booking-mode button[aria-pressed=true]{background:var(--mint);border-color:var(--green);box-shadow:inset 0 0 0 .5px var(--green)}
.mode-icon{width:38px;height:32px;display:flex;align-items:center;color:var(--green)}
.unified-booking .mode-icon .icon{width:29px;height:29px;stroke-width:1.7}
.mode-copy{display:grid;gap:3px}
.mode-copy strong{font-size:17px;font-weight:600;letter-spacing:-.02em}
.mode-copy small{font-size:12px;font-weight:400;color:var(--muted);line-height:1.4}
.mode-check{position:absolute;right:14px;top:15px;display:grid;place-items:center;width:20px;height:20px;border:1px solid var(--line-d5d8d5);border-radius:50%;color:transparent;font-size:12px}
[aria-pressed=true]>.mode-check{color:var(--ink-ffffff);border-color:var(--green);background:var(--green)}
.unified-booking .destination-launch{min-height:86px;border:1px solid var(--line);border-radius:14px;padding:17px 15px;gap:12px;background:var(--soft);color:var(--ink)}
.destination-launch>span{min-width:0;display:grid;gap:4px}
.destination-launch strong{font-size:17px;line-height:1.3;font-weight:600;letter-spacing:-.025em}
.destination-launch small{font-size:12px;line-height:1.4;color:var(--muted);font-weight:400}
.destination-launch>.icon{width:22px;height:22px}
.destination-launch>.icon:last-child{width:19px}
.unified-booking .launch-meta{font-size:12px;color:var(--muted);padding:20px 0;gap:8px;line-height:1.5}
.launch-meta .icon{width:16px;height:16px}
.booking-launch.unified-booking>.btn{background:var(--green);color:var(--ink-ffffff);justify-content:space-between;padding:17px 20px;min-height:56px}
.unified-booking button:focus-visible{outline:3px solid var(--line-555b57);outline-offset:4px}
.home-secondary{display:grid;gap:24px;min-width:0}
.home-trips{margin:0}
.home-trips h2{font-size:18px}
.home-trips>.row{margin-bottom:10px}
.home-trip-list{border-color:var(--line);border-radius:18px}
.home-trip{padding:18px;gap:14px;min-height:102px;color:var(--ink);background:var(--surface)}
.home-trip+.home-trip{border-color:var(--line)}
.home-trip-icon{width:44px;height:44px;border-radius:14px;background:var(--soft);color:var(--green)}
.home-trip-icon .icon{width:23px;height:23px}
.home-trip-copy{gap:4px}
.home-trip-copy strong{font-size:14px;font-weight:600}
.home-trip-copy small,.home-trip-route{font-size:12px;color:var(--muted)}
.home-trip-arrow{color:var(--ink);font-size:25px}
.routine-banner{position:relative;isolation:isolate;display:flex;align-items:center;width:100%;min-height:245px;background:var(--surface-e9ebe8);border:1px solid var(--line-e9ebe8);color:var(--ink);border-radius:22px;padding:26px;text-align:left;overflow:hidden}
.routine-copy{position:relative;z-index:1;display:grid;gap:12px;max-width:68%}
.routine-copy>small{font-size:9px;font-weight:600;letter-spacing:.1em;color:var(--ink-555b57);max-width:160px}
.routine-copy>strong{font-size:34px;letter-spacing:-.045em;line-height:1.07;font-weight:700}
.routine-copy>span{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:600;line-height:1.5;margin-top:7px}
.routine-copy .icon{width:17px;height:17px}
.routine-banner>img{position:absolute;z-index:0;width:57%;height:auto;right:-10%;bottom:28px;transform:rotate(-7deg);pointer-events:none}
.sandbox-controls{margin-top:28px;box-shadow:none;border-color:var(--line);background:transparent;padding:16px 20px;color:var(--muted);font-size:13px}
.sandbox-controls>summary{min-height:28px;cursor:pointer;font-weight:600}
.sandbox-controls[open]>summary{margin-bottom:18px}

/* Booking and trip detail. */
.booking-heading h1{font-size:36px;letter-spacing:-.045em}
.booking-heading .eyebrow{font-size:10px;margin:0 0 12px}
.booking-heading p{font-size:14px;line-height:1.5;margin:10px 0 0}
.booking-heading .link{margin:0}
.booking-form{border-radius:22px;gap:24px;box-shadow:var(--shadow)}
.booking-mode{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:5px;background:var(--soft);border:1px solid var(--line);border-radius:13px}
.booking-mode button{color:var(--muted);min-height:44px;font-size:14px;font-weight:600;border-radius:9px;background:transparent;box-shadow:none}
.booking-mode button[aria-pressed=true]{color:var(--ink);background:var(--surface-ffffff);box-shadow:0 2px 6px #20252210}
.booking-form>.booking-mode{margin:0}
.booking-form>.booking-mode+.booking-mode{padding:0;background:transparent;border:0;gap:16px;margin-top:-6px}
.booking-form>.booking-mode+.booking-mode button{background:transparent;border-bottom:2px solid transparent;border-radius:0;font-size:13px;box-shadow:none}
.booking-form>.booking-mode+.booking-mode button[aria-pressed=true]{border-bottom-color:var(--green);color:var(--green)}
.booking-route{gap:16px}
.booking-route .field>span{font-size:13px;gap:8px}
.booking-form input{background:var(--soft);font-size:16px;min-height:56px}
.location-shortcut{min-height:44px;padding:8px 0;margin-top:-8px;font-size:13px;color:var(--green)}
.booking-form>.booking-options{margin:0;padding-top:22px;border-top:1px solid var(--line);grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:14px}
.booking-options>.field>span{color:var(--ink);font-size:13px}
.booking-options .arrival-control,.booking-options .passenger-stepper{height:88px;min-height:88px;border-color:var(--line);background:var(--soft);border-radius:12px}
.arrival-control{color:var(--ink);padding:12px;gap:9px}
.arrival-control strong{font-size:12px;font-weight:600;white-space:normal;line-height:1.4}
.arrival-control small{font-size:21px;font-weight:600;margin-top:3px}
.passenger-stepper{padding:8px;gap:2px}
.passenger-stepper button{width:36px;min-width:36px;height:44px;background:var(--surface-ffffff);border:1px solid var(--line);border-radius:9px;color:var(--ink);font-size:24px}
.passenger-stepper strong{font-size:24px;font-weight:600}
.passenger-stepper small{color:var(--muted);font-size:10px}
.passenger-range{font-size:11px;color:var(--muted)}
.promo-disclosure{border-color:var(--line);padding-top:14px}
.promo-disclosure summary{font-size:13px;color:var(--muted);cursor:pointer;min-height:36px;align-content:center}
.promo-disclosure summary span{font-size:11px;color:var(--muted)}
.date-input-control{background:var(--soft);border-color:var(--line);font-size:15px;color:var(--ink);min-height:54px}
.path{padding-left:29px;margin:26px 0}
.path:before{left:5px;top:8px;bottom:25px;border-left:1px solid var(--line-d5d8d5)}
.path p{font-size:16px;font-weight:600;line-height:1.5;margin-bottom:24px}
.path p:last-child{margin-bottom:0}
.path p:before{width:10px;height:10px;left:-29px;top:7px;background:var(--green);border:2px solid white;box-shadow:0 0 0 1px var(--green)}
.path p:last-child:before{border-radius:2px}
.path small{color:var(--muted);font-size:12px;font-weight:400;margin-top:4px}
.fare{font-size:42px;font-weight:700;letter-spacing:-.05em;line-height:1.2;margin:24px 0}
.fare small{font-size:13px;color:var(--muted);font-weight:400;letter-spacing:0}
.reservation-reference{font-size:11px;letter-spacing:.045em;padding-bottom:16px;border-bottom:1px solid var(--line);margin:0}
.passenger-journey{padding:24px 0 12px}
.passenger-journey h2{font-size:28px;font-weight:700;letter-spacing:-.04em;line-height:1.2;margin:8px 0 12px}
.passenger-journey .muted{font-size:14px;line-height:1.65}
.passenger-journey .eyebrow{color:var(--green);font-size:10px;font-weight:600}
.passenger-journey.compact h2{font-size:22px}
details.booking-options{display:block;margin:24px 0 18px;padding-top:8px;border-top:1px solid var(--line)}
details.booking-options summary{font-size:13px;min-height:44px;color:var(--muted)}
.ride-timeline{gap:3px;margin:28px 0 20px}
.ride-timeline li{color:var(--muted)}
.ride-timeline li:before{top:15px;background:var(--line)}
.ride-timeline li span{width:32px;height:32px;background:var(--soft);font-size:12px}
.ride-timeline li.current span{background:var(--green);color:var(--ink-ffffff);box-shadow:0 0 0 4px var(--tone-e9ebe8)}
.ride-timeline li.done span{background:var(--mint);color:var(--green)}
.ride-timeline small{font-size:9px;line-height:1.4;display:block}
.ride-timeline li.current small{color:var(--green)}
.live-map-panel{border-color:var(--line);border-radius:18px}
.map-meta small,.next-map-stop small{color:var(--muted)}
.home-info,.ride-status{background:var(--soft);border-radius:14px;color:var(--ink)}
.home-info{padding:20px;margin:20px 0}
.linked-trips{border-color:var(--line)}

/* Schedule and driver workspace. */
.schedule-actions{gap:10px;margin-bottom:24px}
.schedule-actions .btn{flex:1;font-size:14px;min-height:52px}
.schedule-tabs{margin-bottom:24px}
.schedule-trip{padding:22px}
.schedule-trip>.row:first-child>strong{font-size:14px;font-weight:600}
.schedule-trip h3{font-size:18px;line-height:1.5;margin:20px 0 8px;letter-spacing:-.025em}
.schedule-trip .muted{font-size:13px;margin-bottom:18px}
.schedule-trip .pill{background:var(--mint);color:var(--green);font-size:10px}
.schedule-empty{padding:44px 24px;border-style:solid}
.schedule-empty>.icon{width:48px;height:48px;padding:10px;box-sizing:content-box;background:var(--soft);border-radius:20px;color:var(--green);margin-bottom:20px}
.schedule-empty h2{font-size:22px;margin-bottom:12px}
.schedule-empty p{margin:0 0 24px}
.travel-plan>.row{flex-wrap:wrap;gap:12px}
.travel-plan h2{margin-bottom:0;font-size:22px}
.travel-plan .schedule-trip{background:var(--canvas);border-color:var(--line)}
.main.role-driver.page-home{max-width:760px}
.driver-status-card,.driver-status-card.compact-availability{background:var(--surface-202522);color:var(--ink-ffffff);border:1px solid var(--line-202522);border-radius:22px;padding:8px 24px;margin-bottom:16px;box-shadow:0 8px 24px #20252210}
.compact-availability .driver-availability-row{min-height:98px;gap:16px;padding:22px 0}
.driver-service-icon{width:44px;height:44px;display:grid;place-items:center;background:#FFFFFF10;color:var(--accent);border-radius:13px}
.driver-service-icon .icon{width:23px;height:23px}
.driver-service-copy{gap:5px}
.driver-service-copy strong{color:var(--ink-ffffff);font-weight:600;font-size:18px;letter-spacing:-.025em}
.driver-service-copy>span{color:var(--ink-d5d8d5);font-size:12px}
.ride-now-switch{width:52px;height:48px;padding:10px 0}
.ride-now-switch:before{inset:10px 0;background:var(--surface-555b57)}
.ride-now-switch[aria-checked=true]:before{background:var(--accent)}
.ride-now-switch[aria-checked=true]>span{background:var(--surface-202522)}
.instant-plan-current{background:#FFFFFF0B;border:1px solid #FFFFFF1F;border-radius:12px;padding:14px;font-size:13px;color:var(--ink-e9ebe8);margin-top:0;min-height:52px;gap:16px}
.instant-plan-current strong{color:var(--accent);font-size:12px;flex-shrink:0}
.offer-mode-block{padding-bottom:16px}
.offer-mode-block+.offer-mode-block{border-color:#FFFFFF20;padding-top:2px;padding-bottom:16px}
.offer-actions{margin:0 0 0 60px;gap:8px}
.driver-status-card .btn.secondary{background:var(--accent);color:var(--ink-202522)}
.driver-status-card .btn.ghost{background:transparent;border-color:var(--line-7c827e);color:var(--ink-ffffff)}
.scheduled-status-row{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;min-height:64px;color:var(--ink);margin-bottom:28px;font-size:13px}
.scheduled-status{color:var(--muted)}
.scheduled-status-row strong{font-size:12px;color:var(--green)}
.active-rides{margin:28px 0}
.active-rides>h2{font-size:20px}
.active-ride-card,.passenger-active .card{border:1px solid var(--line-d5d8d5);border-left:3px solid var(--green);background:var(--surface-f5f5f3);box-shadow:none}
.active-ride-card .row.between{align-items:flex-start;flex-wrap:wrap;gap:8px}
.active-ride-card h3{font-size:19px}
.active-ride-card>.btn{margin-top:16px}
.offer-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.offer-fare{text-align:right;display:grid;gap:2px}
.offer-fare strong{font-size:26px;line-height:1.1;letter-spacing:-.04em;font-weight:700}
.offer-fare small{font-size:10px;color:var(--muted)}
.offer-route{margin:26px 0}
.offer-route p{font-size:18px}
.offer-details{display:flex;flex-wrap:wrap;gap:10px 20px;border-top:1px solid var(--line);padding-top:18px;font-size:12px;color:var(--muted)}
.offer-details>span{display:flex;align-items:center;gap:7px}
.offer-details .icon{width:16px;height:16px}
.offer-expiry{font-size:11px;margin:12px 0 18px}
.offer-actions-row{display:grid;grid-template-columns:1.6fr 1fr;gap:10px}
.offers-empty{margin-top:8px;padding:40px 24px}
.earnings-hero{border-radius:24px;background:var(--surface-202522);padding:30px;color:var(--ink-ffffff);margin-top:24px}
.earnings-hero .row p{font-size:13px;color:var(--ink-d5d8d5);margin:0}
.earnings-hero .row .icon{width:28px;height:28px;color:var(--accent)}
.earnings-hero h2{font-size:56px;letter-spacing:-.06em;color:var(--ink-ffffff);font-weight:700;margin:20px 0 30px;max-width:none}
.earnings-pending{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:20px;border-top:1px solid #FFFFFF26;font-size:13px;color:var(--ink-d5d8d5)}
.earnings-pending strong{color:var(--accent);font-size:20px;font-weight:600}
.coverage-intro h2{font-size:25px;letter-spacing:-.035em}
.local-coverage{background:var(--surface);border-color:var(--line)}
.coverage-symbol{background:var(--mint);color:var(--green);border-radius:12px}
.coverage-location{font-size:19px}
.coverage-summary,.coverage-form,.coverage-route-choice,.coverage-return{border-color:var(--line)}
.coverage-summary span,.mode-choice small,.coverage-hours summary small,.availability-summary,.route-option small{color:var(--muted);font-size:13px}
.coverage-empty{border-color:var(--line);background:var(--soft);color:var(--muted);font-size:13px}
.mode-choice,.coverage-hours,.driving-area-choice{border-color:var(--line);border-radius:12px;background:var(--surface)}
.mode-choice:has(input:checked),.driving-area-choice:has(input:checked){background:var(--mint);border-color:var(--green)}
.driving-area-choice{font-size:14px}
.route-multiselect.card,.instant-intercity-section{border:1px solid var(--line-d5d8d5);background:var(--surface-f5f5f3)}
.flexible-intercity{background:var(--soft);border-color:var(--line)}
.availability-editor .weekday-picks label,.weekday-picks label{background:var(--soft);color:var(--ink);min-height:44px;display:flex;align-items:center;gap:5px;font-size:12px}
.instant-plan-option{border-color:var(--line);border-radius:12px;padding:18px}
.instant-plan-option.selected{background:var(--mint);border-color:var(--green)}
.instant-plan-option span{color:var(--muted)}
.ride-heading{margin-top:24px;gap:12px}
.ride-heading h1{font-size:30px;line-height:1.2}
.ride-status h2{font-size:23px}
.pickup-card h3{font-size:20px}

/* Account, updates and supporting screens. */
.account-hub{padding-top:4px}
.account-eyebrow{font-size:11px;color:var(--muted);letter-spacing:.1em}
.account-person h1{font-size:36px;color:var(--ink);font-weight:700;letter-spacing:-.045em;line-height:1.15}
.account-avatar{background:var(--mint);color:var(--green);border:0;width:76px;height:76px;font-size:24px;font-weight:600;box-shadow:none}
button.account-profile-link{font-size:13px;min-height:44px;color:var(--muted)}
.account-status{margin:12px 0 28px;color:var(--muted)}
.account-status>span{font-size:11px;background:var(--soft);color:var(--muted)}
.account-grid{gap:12px}
.account-tile{min-height:120px;border-radius:16px;background:var(--surface);border:1px solid var(--line);padding:20px;color:var(--ink)}
.account-tile strong{font-size:15px;font-weight:600}
.account-tile small{font-size:11px;color:var(--muted)}
.account-tile .icon{color:var(--green);width:24px;height:24px}
.account-tile-wallet{background:var(--green);color:var(--ink-ffffff);border-color:var(--green)}
.account-tile-wallet small{color:var(--ink-e9ebe8)}
.account-tile-wallet .icon,.account-tile-wallet .account-chevron{color:var(--accent)}
.account-feature{border-radius:18px;background:var(--mint);color:var(--ink);padding:24px;margin:24px 0;border:1px solid var(--line-e9ebe8)}
.account-feature strong{font-size:22px;font-weight:700;letter-spacing:-.035em}
.account-feature small{color:var(--green);font-size:9px;letter-spacing:.09em}
.account-feature>span>span{color:var(--muted);font-size:12px}
.account-feature-art{background:var(--surface-e9ebe8);color:var(--green);border-radius:15px;width:52px;height:52px}
.account-settings,.account-info-list,.account-faq,.account-safety-guide{border-color:var(--line);border-radius:18px;background:var(--surface);overflow:hidden}
.account-row{padding:19px 20px;min-height:72px;background:var(--surface);color:var(--ink)}
.account-row+.account-row{border-color:var(--line)}
.account-row-icon{background:var(--soft);color:var(--green);border-radius:11px;width:38px;height:38px}
.account-row-copy strong{font-size:14px;font-weight:600}
.account-row-copy small,.account-row-tail{font-size:12px;color:var(--muted)}
.account-chevron{color:var(--ink-555b57)}
.account-signout{min-height:52px;color:var(--muted);font-size:14px;padding:16px 12px}
.account-subheading{margin-bottom:28px}
.account-subheading h1{font-size:32px;line-height:1.2;letter-spacing:-.04em}
.account-subheading>.btn{margin-bottom:22px}
.account-info-list strong{font-size:15px;overflow-wrap:anywhere;color:var(--ink)}
.account-info-list small,.account-small-note{font-size:12px;color:var(--muted)}
.account-faq summary{font-size:14px;font-weight:600;min-height:32px}
.account-faq p,.account-safety-guide p{font-size:13px;color:var(--muted)}
.account-safety-guide h2{font-size:16px;font-weight:600}
.account-emergency{border-radius:14px;background:var(--surface-fbede7);color:#843F2F}
.account-emergency span{font-size:12px;color:#805444}
.updates-heading{margin-bottom:28px}
.updates-heading h1{font-size:36px}
.updates-heading p{color:var(--muted);font-size:14px}
.updates-feed,.alert-preferences{border-color:var(--line);background:var(--surface);border-radius:18px;overflow:hidden}
.update-item{border-color:var(--line);padding:22px}
.update-item.is-unread{background:var(--surface-f5f5f3)}
.update-symbol,.alert-summary-icon{background:var(--mint);color:var(--green);border-radius:13px}
.update-meta h2{font-size:15px;font-weight:600}
.update-content p{font-size:13px;color:var(--muted);line-height:1.65}
.update-meta time{font-size:11px;color:var(--muted)}
.update-read{min-height:40px;font-size:12px;color:var(--green)}
.update-unread{background:var(--green)}
.updates-empty{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:44px 24px}
.updates-empty h2{font-size:22px}
.updates-empty p{color:var(--muted);font-size:14px}
.alert-preferences summary{min-height:80px}
.alert-preferences summary strong{font-size:14px}
.alert-preferences summary small,.alert-option p{font-size:12px;color:var(--muted)}
.alert-option strong{font-size:13px}
.rating-feedback legend{font-size:20px}
.rating-reason{border-color:var(--line);min-height:46px;font-size:13px;color:var(--ink)}
.rating-reason.selected{background:var(--mint);border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}
.rating-star.selected{color:var(--green)}
.rating-star.selected svg{stroke:var(--green)}

/* Fixed navigation and focused dialogs. */
.bottom-nav{left:50%;right:auto;bottom:18px;transform:translateX(-50%);width:calc(100% - 40px);max-width:520px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;background:var(--surface-overlay-f5);border:1px solid var(--line);border-radius:22px;padding:8px;box-shadow:0 8px 32px #20252212;backdrop-filter:blur(20px)}
.nav-item{position:relative;min-width:0;width:100%;min-height:62px;gap:5px;padding:8px 4px;border-radius:15px;font-size:11px;line-height:1.4;color:var(--muted);font-weight:400}
.nav-item .icon{width:23px;height:23px}
.nav-item.active{background:var(--mint);color:var(--green);font-weight:600}
.modal-backdrop{background:#2025227A;backdrop-filter:blur(5px);padding:24px}
.modal{background:var(--surface);border-radius:24px;padding:28px;max-width:480px;max-height:calc(100dvh - 48px);box-shadow:0 24px 100px #20252233}
.modal h2{font-size:24px;color:var(--ink);letter-spacing:-.035em}
.modal .row.between{gap:16px}
.close{width:44px;height:44px;min-width:44px;border-radius:50%;background:var(--soft);color:var(--ink);padding:0;font-size:26px}
.datetime-backdrop{background:#2025227A;backdrop-filter:blur(5px)}
.datetime-dialog{background:var(--surface);border-radius:22px;color:var(--ink);padding:24px}
.datetime-heading{border-color:var(--line)}
.datetime-heading h2{font-size:20px;color:var(--ink);border-color:var(--green)}
.wheel-option{color:var(--ink-7c827e)}
.wheel-option.selected{color:var(--ink);font-weight:600}
.wheel-selection span{border-color:var(--line-d5d8d5);background:#E9EBE860;border-width:1px;border-radius:9px}
.wheel-labels{color:var(--muted)}
.calendar-dialog{padding:0}
.calendar-selected{background:var(--green);padding:26px;color:var(--ink-ffffff)}
.calendar-selected h2{color:var(--ink-ffffff)}
.calendar-selected span,.calendar-year{color:var(--ink-e9ebe8);background:var(--green)}
.calendar-grid button{color:var(--ink);min-height:36px;font-size:14px}
.calendar-grid button.selected{background:var(--green);color:var(--ink-ffffff)}
.calendar-weekday{color:var(--muted)}
.datetime-actions .btn{border-radius:11px;min-height:50px}
.datetime-day,.calendar-month{border-color:var(--line)}
.reset-time{color:var(--green);min-height:44px}
#toast{background:var(--ink);border-radius:13px;padding:15px 20px;font-size:13px;line-height:1.5;box-shadow:0 8px 32px #20252226}

/* Welcome and operations use the same brand, at their own scale. */
.welcome{max-width:1120px;grid-template-columns:1fr 1fr;gap:64px;padding:28px 32px 64px;margin:28px auto;min-height:calc(100dvh - 160px)}
.welcome .eyebrow{display:flex;align-items:center;gap:9px;font-size:10px;color:var(--green);letter-spacing:.08em}
.brand-dot{width:7px;height:7px;border-radius:50%;background:var(--green)}
.welcome h1{font-size:clamp(42px,5.4vw,66px);line-height:1.06;font-weight:700;letter-spacing:-.06em;margin:20px 0 24px}
.welcome h1>span{color:var(--ink-555b57)}
.welcome .lead{font-size:16px;line-height:1.75;color:var(--muted);max-width:380px}
.welcome-actions{margin-top:32px;gap:12px;max-width:340px}
.welcome-actions>.btn:first-child{justify-content:space-between}
.welcome-art{min-height:520px;border-radius:28px;background:var(--surface-202522);color:var(--ink-ffffff);padding:34px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.welcome-art:before,.welcome-art:after{display:none}
.welcome-art-heading{position:relative;z-index:1}
.art-kicker{font-size:11px;color:var(--ink-d5d8d5);letter-spacing:.02em}
.welcome-art .art-text{font-size:42px;letter-spacing:-.04em;line-height:1.08;color:var(--ink-ffffff);margin-top:16px;font-weight:600;max-width:none}
.welcome-car{position:absolute;width:112%;height:auto;left:-6%;top:34%;transform:rotate(-8deg)}
.art-footer{position:relative;display:flex;justify-content:space-between;gap:12px;border-top:1px solid #FFFFFF26;padding-top:20px;color:var(--ink-e9ebe8);font-size:11px}
.art-footer>span{display:flex;align-items:center;gap:8px}
.art-footer .icon{width:17px;height:17px;color:var(--accent)}
.admin{background:var(--canvas)}
.sidebar{background:var(--surface-202522);color:var(--ink-e9ebe8);padding-top:32px}
.sidebar nav{gap:7px}
.sidebar button{color:var(--ink-d5d8d5);min-height:44px;border-radius:10px;font-size:13px}
.sidebar button.active{background:var(--accent);color:var(--ink-202522);font-weight:600}
.sidebar p{color:var(--ink-d5d8d5);font-size:10px}
.admin-content{padding-top:32px}
.admin-header{color:var(--muted);margin-bottom:32px}
.admin .card{border-radius:18px}
.metric{background:var(--surface);border-color:var(--line);border-radius:16px;padding:22px;box-shadow:var(--shadow)}
.metric strong{font-size:36px;font-weight:700;letter-spacing:-.045em;color:var(--ink)}
.metric small{color:var(--muted);font-size:12px}
.table-wrap{border-color:var(--line);border-radius:14px}
table{font-size:13px}
td,th{padding:16px 18px;border-color:var(--line)}
th{background:var(--soft);font-size:10px;font-weight:600;color:var(--muted);letter-spacing:.065em}
.stat-bar{background:var(--surface-d5d8d5);border-radius:6px 6px 0 0}
.exception-row{border-color:var(--line)}
.exception-row p{color:var(--muted);font-size:13px}
.route-stop{background:var(--soft);border-color:var(--line);border-radius:14px}

@media(hover:hover){
  .btn:not(:disabled):hover{background:var(--green-hover);color:var(--ink-ffffff);box-shadow:0 4px 12px #20252216}
  .btn.secondary:not(:disabled):hover,.btn.ghost:not(:disabled):hover{background:var(--mint);color:var(--ink);box-shadow:none}
  .btn.danger:not(:disabled):hover{background:#F7DCD3;color:#9B3223}
  .home-trip:hover,.account-row:hover,.nav-item:not(.active):hover{background:var(--soft)}
  .routine-banner:hover{background:var(--surface-e9ebe8)}
  .destination-launch:hover{border-color:var(--line-d5d8d5)}
  .link:hover,.update-read:hover{text-decoration:underline;text-underline-offset:4px}
}
@media(max-width:900px){
  .passenger-home-layout{grid-template-columns:1fr;gap:26px}
  .main.page-home.role-passenger{max-width:660px}
  .routine-banner{min-height:220px}
  .routine-banner>img{width:53%;right:-3%;bottom:8px}
  .routine-copy{max-width:62%}
  .routine-copy>strong{font-size:32px}
  .welcome{gap:30px}
  .welcome-art{min-height:440px;padding:28px}
  .welcome-art .art-text{font-size:36px}
  .art-footer{font-size:10px;gap:8px}
}
@media(max-width:620px){
  body{background:var(--surface)}
  .topbar{height:76px;padding:0 22px;margin:0;border-color:var(--line-e9ebe8);gap:10px}
  .wordmark{width:126px;height:30px}
  .top-actions{gap:9px}
  .top-actions .role-switch{padding:7px 10px;font-size:11px;background:var(--soft);border:0;gap:5px}
  .top-actions .role-switch .icon{display:none}
  .notification-bell{background:var(--soft);border:0}
  .main,.main.narrow{padding:0 22px;margin-top:28px;margin-bottom:calc(108px + env(safe-area-inset-bottom))}
  h1,.booking-heading h1,.updates-heading h1{font-size:32px}
  h2{font-size:21px}
  .page-heading{margin-bottom:24px;gap:12px}
  .card{padding:22px;border-radius:18px;box-shadow:none}
  .home-heading h1{font-size:42px}
  .home-heading .muted{font-size:13px;margin-bottom:7px}
  .home-greeting-mark{width:46px;height:46px}
  .home-greeting-mark .icon{width:24px;height:24px}
  .booking-launch.unified-booking{padding:0;border:0;border-radius:0;box-shadow:none}
  .unified-booking .booking-mode{gap:12px;margin-bottom:20px}
  .unified-booking .booking-mode button{padding:17px;min-height:135px;gap:13px}
  .unified-booking .destination-launch{min-height:82px;padding:16px 14px}
  .unified-booking .launch-meta{font-size:11px;padding:18px 0}
  .passenger-home-layout{gap:28px}
  .home-secondary{gap:24px}
  .routine-banner{min-height:208px;padding:24px;border-radius:20px}
  .routine-copy>strong{font-size:30px}
  .routine-copy>small{font-size:8px;max-width:140px}
  .routine-copy>span{font-size:11px;gap:6px}
  .routine-banner>img{width:56%;right:-6%;bottom:20px}
  .home-trip{padding:17px 14px;gap:12px}
  .home-trip-copy strong{font-size:14px}
  .home-trip-icon{width:40px;height:40px;border-radius:12px}
  .home-trips{margin:0}
  .home-trips h2{font-size:18px}
  .booking-form{border:0;padding:0;box-shadow:none;gap:22px;background:transparent}
  .booking-heading .link{font-size:13px;min-width:34px}
  .booking-form>.booking-options{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:12px;padding-top:20px}
  .booking-options .arrival-control,.booking-options .passenger-stepper{height:88px;min-height:88px}
  .arrival-control{padding:10px;gap:7px}
  .arrival-control>.icon{width:18px;height:18px}
  .arrival-control strong{font-size:11px}
  .arrival-control small{font-size:20px}
  .passenger-stepper button{width:32px;min-width:32px}
  .fare{font-size:38px}
  .passenger-journey h2{font-size:25px}
  .path p{font-size:15px}
  .schedule-actions .btn{font-size:12px;padding:13px 10px;gap:7px}
  .schedule-actions .icon{width:18px;height:18px}
  .schedule-trip{padding:20px}
  .schedule-trip h3{font-size:17px}
  .schedule-trip>.row:first-child>strong{font-size:13px}
  .schedule-trip .pill{font-size:10px;padding:5px 9px}
  .schedule-empty{padding:32px 20px}
  .driver-status-card,.driver-status-card.compact-availability{padding:6px 18px;border-radius:20px}
  .compact-availability .driver-availability-row{gap:12px;min-height:92px;padding:18px 0}
  .driver-service-copy strong{font-size:18px}
  .driver-service-copy>span{font-size:12px}
  .driver-service-icon{width:40px;height:40px}
  .offer-actions{margin-left:52px}
  .scheduled-status-row{font-size:12px;padding:15px;gap:8px}
  .scheduled-status-row strong{font-size:11px}
  .offer-fare strong{font-size:24px}
  .offer-route p{font-size:17px}
  .earnings-hero{padding:26px;border-radius:20px}
  .earnings-hero h2{font-size:52px}
  .account-person h1{font-size:32px}
  .account-avatar{width:66px;height:66px;font-size:22px}
  .account-tile{min-height:116px;padding:18px}
  .account-feature{padding:22px 18px;gap:12px}
  .account-feature strong{font-size:20px}
  .account-feature-art{width:44px;height:44px;flex-shrink:0}
  .account-row{padding:18px 16px;min-height:70px}
  .account-subheading h1{font-size:30px}
  .update-item{padding:20px 16px;gap:12px}
  .bottom-nav{left:0;right:0;bottom:0;transform:none;max-width:none;width:100%;padding:7px 12px calc(7px + env(safe-area-inset-bottom));border:0;border-top:1px solid var(--line);border-radius:0;box-shadow:0 -4px 20px #20252203;gap:4px}
  .nav-item{min-height:61px;padding:7px 3px;border-radius:14px;font-size:11px}
  .nav-item .icon{width:22px;height:22px}
  .nav-item.active{background:var(--mint)}
  .modal-backdrop{padding:0;align-items:end}
  .modal{max-width:none;border-radius:24px 24px 0 0;padding:26px 22px calc(26px + env(safe-area-inset-bottom));max-height:calc(100dvh - 24px)}
  .modal h2{font-size:23px}
  .datetime-backdrop{padding:18px}
  .datetime-dialog{border-radius:20px}
  .welcome{display:flex;flex-direction:column;align-items:stretch;gap:32px;margin:24px auto 0;padding:8px 24px 40px;min-height:0}
  .welcome h1{font-size:clamp(42px,11.5vw,60px);margin:18px 0 20px;max-width:none}
  .welcome .lead{font-size:15px;line-height:1.7}
  .welcome-actions{max-width:none;margin-top:26px}
  .welcome-art{min-height:330px;border-radius:24px;padding:26px}
  .welcome-art .art-text{font-size:32px;max-width:none;margin-top:10px}
  .welcome-car{width:84%;left:24%;top:25%}
  .art-footer{font-size:11px;padding-top:16px}
  .sidebar{padding:22px 20px 16px}
  .sidebar button{font-size:12px;padding:10px 13px;min-height:44px}
  .admin-content{padding:28px 20px 60px}
  .admin h1{font-size:30px}
  .metric{padding:18px}
  .metric strong{font-size:30px}
  .admin-header{font-size:11px;gap:12px;flex-wrap:wrap}
}
@media(max-width:360px){
  .topbar{padding:0 16px;gap:8px}
  .wordmark{width:111px}
  .top-actions{gap:6px}
  .top-actions .role-switch{font-size:10px;padding:7px 8px}
  .main,.main.narrow{padding:0 16px}
  .home-heading h1{font-size:38px}
  .unified-booking .booking-mode button{padding:15px;min-height:130px}
  .mode-copy small{font-size:11px}
  .destination-launch strong{font-size:16px}
  .destination-launch small{font-size:11px}
  .booking-form>.booking-options{grid-template-columns:1fr}
  .booking-options .arrival-control,.booking-options .passenger-stepper{height:76px;min-height:76px}
  .arrival-control strong{font-size:13px}
  .passenger-stepper button{width:48px}
  .routine-banner{padding:20px;min-height:190px}
  .routine-copy>strong{font-size:28px}
  .routine-copy>span{font-size:10px}
  .routine-banner>img{right:-10%;width:60%}
  .card{padding:18px}
  .driver-service-icon{width:34px;height:38px}
  .driver-service-copy strong{font-size:16px}
  .driver-service-copy>span{font-size:11px}
  .scheduled-status-row{flex-wrap:wrap}
  .schedule-actions{flex-direction:column}
  .schedule-actions .btn{font-size:14px;flex:auto}
  .account-grid{gap:10px}
  .account-tile{padding:16px;min-height:114px}
  .account-tile small{font-size:10px}
  .account-feature-art{display:none}
  .offer-actions-row .btn{padding:14px 12px;font-size:14px}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}

/* Scheduled booking: one plan, one review, one live trip. */
.time-mode-toggle{font-size:.72rem;margin-left:8px;white-space:nowrap}.scheduled-review{padding:24px}.review-leg+.review-leg{border-top:1px solid var(--line,var(--line-e9ebe8));padding-top:20px;margin-top:20px}.review-total{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line,var(--line-e9ebe8));margin-top:20px;padding-top:20px}.review-total strong{font-size:2rem;letter-spacing:-.06em}.booking-terms,.booking-receipt{padding:16px 0;color:var(--muted,var(--ink-555b57));font-size:.86rem}.booking-terms summary,.booking-receipt summary{cursor:pointer;font-weight:600}.review-footnote{text-align:center;color:var(--muted,var(--ink-555b57));font-size:.78rem;margin:16px 0 0}.confirmed-pickup{border:1px solid var(--line-d5d8d5);background:var(--surface-f5f5f3)}.confirmed-pickup .pickup-time{font-size:1.65rem;margin:10px 0}.confirmed-driver{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line-e9ebe8);padding-top:16px;margin-top:18px}.confirmed-driver strong{letter-spacing:.06em}.trip-status .passenger-journey{padding:0;border:0;margin:0}.linked-trip.selected{border-left:3px solid var(--line-202522);padding-left:12px}.trip-summary>.fare{font-size:1.6rem}.booking-form .return-option{margin:0;padding:16px;border:1px solid var(--line-e9ebe8);border-radius:16px;background:var(--surface-f5f5f3)}@media(max-width:420px){.booking-options{grid-template-columns:minmax(0,1.5fr) minmax(100px,1fr)}.time-mode-toggle{display:block;margin:3px 0 0}.review-total strong{font-size:1.7rem}.confirmed-pickup .pickup-time{font-size:1.4rem}}

.review-payment{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--line-e9ebe8);padding:20px 0}.review-payment small,.review-payment strong{display:block}.review-payment small{color:var(--ink-555b57);margin-bottom:5px}.payment-overlay{position:fixed;inset:0;background:#20252266;z-index:10000;display:flex;align-items:flex-end;justify-content:center;padding:16px}.payment-sheet{background:var(--surface-ffffff);border-radius:24px;padding:24px;width:min(100%,480px);max-height:90dvh;overflow:auto;box-shadow:0 20px 80px #20252244}.payment-sheet h2{font-size:23px;margin:0}.payment-amount{font-size:32px;font-weight:650;margin:24px 0}.payment-choice{display:block;text-align:left;width:100%;padding:17px;margin:12px 0;background:var(--surface-ffffff);border:1px solid var(--line-e9ebe8);border-radius:14px;color:var(--ink-202522);font:inherit}.payment-choice.selected{border:2px solid var(--line-202522);background:var(--surface-f5f5f3)}.payment-choice small{display:block;color:var(--ink-555b57);font-size:12px;margin-top:6px}.payment-save{display:flex;gap:10px;align-items:center;font-size:13px;margin:16px 0}.payment-sheet [data-pay-submit]{margin-top:20px}.payment-sheet button:disabled{opacity:.55;cursor:wait}@media(min-width:640px){.payment-overlay{align-items:center}}

/* Compact passenger checkout */
.review-heading{align-items:center;margin-bottom:20px}.review-heading h1{font-size:28px;line-height:1.2;letter-spacing:-1px;margin:0}.review-heading .btn{min-height:40px;padding:8px 16px}
.scheduled-review{padding:20px;border-radius:22px;box-shadow:0 8px 28px #20252210;margin-bottom:28px}.scheduled-review .review-leg>.row{margin:0 0 18px}.scheduled-review .eyebrow{font-size:10px;letter-spacing:.12em}.review-route{position:relative;display:grid;gap:20px;padding-left:26px}.review-route:before{content:"";position:absolute;left:5px;top:13px;bottom:20px;width:1px;background:var(--surface-d5d8d5)}.review-route>div{position:relative;min-width:0}.review-route>div:before{content:"";position:absolute;left:-26px;top:7px;width:10px;height:10px;border:2px solid var(--line-202522);border-radius:50%;background:var(--surface-ffffff);box-sizing:border-box}.review-route>div:last-child:before{border-radius:2px;background:var(--surface-202522)}.review-route small{display:block;font-size:11px;color:var(--ink-555b57);margin:0 0 4px}.review-route strong{display:block;font-size:15px;line-height:1.4;font-weight:650;overflow-wrap:anywhere}.scheduled-review .review-timing{margin:20px 0 0;padding:11px 13px;background:var(--surface-f5f5f3);border-radius:10px;font-size:12px;color:var(--ink-555b57);line-height:1.5}.scheduled-review .review-total{margin-top:20px;padding-top:18px}.scheduled-review .review-total>span{font-size:14px;font-weight:600}.scheduled-review .review-total strong{font-size:30px;line-height:1.2;letter-spacing:-1px}.scheduled-review .booking-terms{padding:12px 0;margin:0;font-size:12px}.scheduled-review .booking-terms summary{display:flex;align-items:center;justify-content:space-between;list-style:none;min-height:32px;font-size:12px;font-weight:500}.scheduled-review .booking-terms summary::-webkit-details-marker{display:none}.scheduled-review .booking-terms summary:after{content:"+";font-size:18px}.scheduled-review .booking-terms[open] summary:after{content:"−"}.scheduled-review .booking-terms:not([open])>p{display:none!important}.scheduled-review .booking-terms p{font-size:12px;line-height:1.6;margin:8px 0}.scheduled-review .review-payment{margin:0 0 16px;padding:14px;background:var(--surface-f5f5f3);border:0;border-radius:12px}.scheduled-review .review-payment small{font-size:11px;margin-bottom:4px}.scheduled-review .review-payment strong{font-size:14px}.scheduled-review .review-payment .link{font-size:12px;min-height:40px}.scheduled-review>.btn.full{min-height:52px;border-radius:13px;font-size:15px;margin:0}.scheduled-review .review-leg+.review-leg{margin-top:18px;padding-top:18px}

/* Balanced ride booking form */
.page-search:has(.refined-booking) .booking-heading,.page-ride-now:has(.refined-booking) .booking-heading{align-items:center;margin-bottom:20px}.page-search:has(.refined-booking) .booking-heading h1,.page-ride-now:has(.refined-booking) .booking-heading h1{font-size:28px;line-height:1.2;letter-spacing:-1px;margin:0}.booking-heading:has(+.refined-booking) .eyebrow{display:none}
.refined-booking{gap:18px!important}.refined-booking>.booking-mode{padding:4px;border-radius:13px;background:var(--surface-f5f5f3);min-height:48px}.refined-booking>.booking-mode button{min-height:40px;padding:8px;font-size:14px;border-radius:10px}.refined-booking .booking-route{display:grid;gap:14px;padding:18px;background:var(--surface-ffffff);border:1px solid var(--line-e9ebe8);border-radius:18px}.refined-booking .field{gap:7px;margin:0;min-width:0}.refined-booking .booking-route .field>span{font-size:12px;font-weight:600;gap:7px}.refined-booking .booking-route .field>span .icon{width:16px;height:16px}.refined-booking input{height:50px;min-height:50px;border:1px solid var(--line-e9ebe8);border-radius:11px;padding:12px;font-size:16px;background:var(--surface-f5f5f3);width:100%;min-width:0}.refined-booking .pickup-field>small{font-size:11px;line-height:1.5;margin:0;color:var(--ink-555b57)}.refined-booking .location-shortcut{margin:-6px 0 0;padding:4px 0;min-height:36px;font-size:12px;justify-content:flex-start}.refined-booking .location-shortcut .icon{width:16px;height:16px}
.refined-booking>.booking-options{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:12px;border:0;padding:0;margin:0;align-items:start}.refined-booking .booking-options>.field{display:flex;flex-direction:column;gap:8px}.refined-booking .booking-options>.field>span{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;align-content:center;gap:2px 5px;height:38px;min-height:38px;font-size:12px;line-height:1.3}.refined-booking .time-mode-toggle{display:inline-block;font-size:10px;line-height:1.3;margin:0;padding:2px 0;min-height:0}.refined-booking .passenger-range{font-size:10px;color:var(--ink-7c827e)}.refined-booking .booking-options .arrival-control,.refined-booking .booking-options .passenger-stepper{height:76px;min-height:76px;margin:0;background:var(--surface-f5f5f3);border:1px solid var(--line-e9ebe8);border-radius:13px}.refined-booking .arrival-control{padding:10px;gap:8px;display:flex;align-items:center;width:100%;text-align:left}.refined-booking .arrival-control>span:first-of-type{flex:1;min-width:0}.refined-booking .arrival-control>.icon{width:17px;height:17px;flex-shrink:0}.refined-booking .arrival-control strong{display:block;font-size:11px;line-height:1.3}.refined-booking .arrival-control small{display:block;font-size:18px;line-height:1.2;margin-top:4px;font-weight:600}.refined-booking .passenger-stepper{padding:8px;display:flex;align-items:center;justify-content:space-between;gap:4px}.refined-booking .passenger-stepper button{width:32px;min-width:32px;height:42px;font-size:23px;border-radius:9px}.refined-booking .passenger-stepper strong{font-size:23px;line-height:1.2}.refined-booking .passenger-stepper small{font-size:10px}.refined-booking>button[data-action="return-add"]{min-height:44px;padding:10px;border:1px dashed var(--line-d5d8d5);border-radius:12px;background:var(--surface-ffffff);font-size:13px;color:var(--ink-202522)}.refined-booking .promo-disclosure{margin:0;padding:0}.refined-booking .promo-disclosure summary{font-size:12px;min-height:36px}.refined-booking>button[type="submit"]{min-height:52px;margin:0;border-radius:13px;font-size:15px}.refined-booking{margin-bottom:28px}
@media(max-width:350px){.refined-booking .booking-route{padding:14px}.refined-booking>.booking-options{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:8px}.refined-booking .arrival-control>.icon{display:none}.refined-booking .passenger-stepper button{width:28px;min-width:28px}}

/* Passenger trip details */
.page-booking>.page-heading h1{font-size:28px;line-height:1.2;letter-spacing:-1px;margin:5px 0 0}.page-booking>.page-heading{margin-bottom:18px}.page-booking>.page-heading .eyebrow{font-size:10px;letter-spacing:.1em}.page-booking .trip-status{padding:20px;border-radius:18px;background:var(--surface-f5f5f3);border-color:var(--line-e9ebe8);margin-bottom:16px}.page-booking .trip-status .eyebrow{display:none}.page-booking .trip-status h2{font-size:23px;line-height:1.25;letter-spacing:-.6px;margin:0 0 8px}.page-booking .trip-status p{font-size:13px;line-height:1.6;margin:0;max-width:40ch}.page-booking .trip-summary{padding:20px;border-radius:18px;margin-bottom:24px}.page-booking .trip-time-summary{background:var(--surface-f5f5f3);border-radius:10px;padding:11px 12px;margin:20px 0 0;font-size:12px;line-height:1.5}.page-booking .trip-summary>.fare{display:flex;align-items:baseline;gap:8px;font-size:29px;margin:18px 0;letter-spacing:-1px}.page-booking .trip-summary>.fare small{font-size:12px;letter-spacing:0;color:var(--ink-555b57)}.page-booking details.booking-options{display:block;margin:16px 0;padding:0;border-top:1px solid var(--line-e9ebe8);border-bottom:1px solid var(--line-e9ebe8);animation:none;transition:none;overflow-anchor:none}.page-booking details.booking-options summary{display:flex;align-items:center;justify-content:space-between;min-height:50px;font-size:13px;font-weight:600;list-style:none;cursor:pointer}.page-booking details.booking-options summary::-webkit-details-marker{display:none}.page-booking details.booking-options summary:after{content:"+";font-size:20px}.page-booking details.booking-options[open] summary:after{content:"−"}.page-booking details.booking-options:not([open])>:not(summary){display:none!important}.page-booking details.booking-options>.btn{margin:0 0 12px;min-height:44px;font-size:13px;background:var(--surface-fcf3f0);color:#914c38;border-radius:10px}.page-booking .trip-summary>.btn{min-height:46px;font-size:13px;border-radius:12px}.page-booking .confirmed-pickup{padding:20px;border-radius:18px}.page-booking .confirmed-pickup h3{font-size:16px}

.cancel-trip-list{max-height:240px;overflow:auto}.cancel-trip-list p{font-size:12px;padding:10px 0;border-bottom:1px solid var(--line-e9ebe8)}.cancel-trip-list strong{display:block;margin-top:4px}.booking-options>.muted{font-size:12px;line-height:1.5}

.refined-booking select.time-mode-select{width:auto;min-width:108px;min-height:38px;height:38px;padding:6px 24px 6px 0;border:0;border-radius:6px;background-color:transparent;color:var(--ink);font:inherit;font-size:12px;font-weight:600;cursor:pointer;box-shadow:none}.refined-booking select.time-mode-select:focus-visible{outline:2px solid var(--line-202522);outline-offset:2px}.refined-booking .return-label{display:block;margin-bottom:6px}

/* Compact passenger trip */
.compact-trip{max-width:620px;margin:0 auto}.trip-heading{padding:4px 0 20px}.trip-status-label{display:inline-block;color:var(--ink-202522);font-size:14px;font-weight:650;margin-bottom:8px}.trip-heading h1{font-size:clamp(25px,6vw,34px);line-height:1.2;margin:0}.trip-heading p{margin:5px 0 0;font-size:13px}.compact-trip .trip-overview{padding:20px;margin-bottom:12px}.compact-trip .review-route{margin:0}.compact-trip .review-route strong{font-size:16px;overflow-wrap:anywhere}.compact-trip .review-route>div{padding-bottom:18px}.trip-facts{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--line-e9ebe8);padding:14px 0}.trip-facts small{font-weight:400;color:var(--ink-555b57)}.trip-driver-row{display:flex;align-items:center;gap:12px;padding:14px 0;border-top:1px solid var(--line-e9ebe8)}.trip-driver-row>div{min-width:0}.trip-driver-row strong,.trip-driver-row small{display:block;overflow-wrap:anywhere}.trip-driver-row small{margin-top:4px;color:var(--ink-555b57);font-size:13px}.driver-avatar{display:grid;place-items:center;flex:0 0 40px;height:40px;border-radius:50%;background:var(--surface-e9ebe8);color:var(--ink-202522);font-weight:650}.trip-map-disclosure,.trip-detail-disclosure{border-top:1px solid var(--line-e9ebe8);padding:14px 0}.trip-map-disclosure summary,.trip-detail-disclosure summary{font-size:14px;font-weight:650;cursor:pointer;min-height:28px}.compact-trip .live-map-panel{margin:12px 0}.compact-trip .live-ride-map{height:260px}.compact-trip .trip-contact-actions{margin-top:12px}.compact-trip .trip-detail-disclosure p{font-size:14px;overflow-wrap:anywhere}.compact-trip .booking-options{margin-top:10px}.compact-trip .muted:empty{display:none}

/* Passenger ticket: own spacing, independent of review screen styles. */
.page-booking .trip-ticket .trip-heading{padding:0 2px 16px}.trip-ticket .trip-status-label{font-size:12px;display:inline-flex;align-items:center;gap:6px;background:var(--surface-e9ebe8);border:1px solid var(--line-e9ebe8);border-radius:30px;padding:5px 10px;margin-bottom:10px}.trip-ticket .trip-status-label:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--surface-555b57)}.page-booking .trip-ticket .trip-overview{padding:0;border:1px solid var(--line-e9ebe8);border-radius:22px;overflow:hidden;box-shadow:0 6px 24px #20252210;background:var(--surface-ffffff)}.ticket-route{padding:22px 20px 14px;display:grid;gap:20px;background:linear-gradient(135deg,var(--surface-f5f5f3),var(--surface-ffffff) 85%)}.ticket-route>div{position:relative;padding-left:24px;min-width:0}.ticket-route>div:before{content:"";position:absolute;left:0;top:5px;width:9px;height:9px;border:2px solid var(--line-555b57);border-radius:50%;background:var(--surface-ffffff)}.ticket-route>div:first-child:after{content:"";position:absolute;left:5px;top:18px;bottom:-19px;width:1px;background:var(--surface-d5d8d5)}.ticket-route>div:last-child:before{background:var(--surface-555b57);border-radius:3px}.ticket-route small{display:block;font-size:10px;font-weight:700;letter-spacing:1.2px;color:var(--ink-555b57);margin-bottom:5px}.ticket-route strong{display:block;font-size:16px;line-height:1.4;font-weight:650;overflow-wrap:anywhere}.ticket-pickup-link{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 20px 16px;padding:11px 12px;background:var(--surface-f5f5f3);border-radius:10px;text-decoration:none;color:var(--ink-202522);font-size:12px;font-weight:650;min-height:42px}.ticket-pickup-link>span:first-child{display:flex;align-items:center;gap:6px}.ticket-pickup-link svg{width:16px;height:16px}.ticket-pickup-link>span:last-child{font-size:11px;font-weight:500;white-space:nowrap}.trip-ticket .trip-facts{margin:0 20px;padding:13px 0;font-size:13px;border-top:1px dashed var(--line-d5d8d5)}.trip-ticket .trip-facts strong{font-size:19px;letter-spacing:-.4px}.trip-ticket .trip-facts small{font-size:11px;letter-spacing:0}.ticket-seat{display:flex;align-items:center;gap:6px}.ticket-seat svg{width:16px;height:16px}.trip-ticket .trip-driver-row{padding:16px 20px;background:var(--surface-f5f5f3);gap:11px;border-top:1px solid var(--line-e9ebe8)}.trip-ticket .driver-avatar{background:var(--surface-202522);color:var(--ink-ffffff);flex-basis:42px;height:42px;font-size:17px}.trip-ticket .ticket-driver-copy>small{font-size:9px;letter-spacing:1px;margin:0 0 4px;font-weight:700}.trip-ticket .ticket-driver-copy>strong{font-size:14px;line-height:1.35}.ticket-registration{display:inline-block;max-width:100%;overflow-wrap:anywhere;margin-top:7px;background:var(--surface-ffffff);border:1px solid var(--line-d5d8d5);border-radius:5px;padding:3px 7px;font-size:11px;line-height:1.4;font-weight:700;letter-spacing:.5px}.trip-ticket .trip-detail-disclosure{padding:0 2px;border-top:0;border-bottom:1px solid var(--line-e9ebe8)}.trip-ticket .trip-detail-disclosure summary{min-height:48px;display:flex;align-items:center;justify-content:space-between;font-size:13px}.trip-ticket .trip-contact-actions{display:flex;gap:8px;margin:12px 0}.trip-ticket .trip-contact-actions .btn{min-height:40px;padding:9px 13px;font-size:12px;border-radius:10px;flex:1;white-space:nowrap}.trip-ticket .trip-contact-actions svg{width:17px;height:17px}.trip-ticket>.btn{min-height:40px;font-size:12px;padding:10px 14px;border-radius:10px}.trip-ticket .trip-request-time{margin:0 20px 14px;font-size:12px}.trip-ticket .booking-options summary{min-height:46px}

.ticket-estimates{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 20px 16px;padding:13px 14px;background:var(--surface-f5f5f3);border-radius:12px}.ticket-estimates>div+div{border-left:1px solid var(--line-e9ebe8);padding-left:14px}.ticket-estimates small{display:block;font-size:9px;letter-spacing:.8px;color:var(--ink-555b57);font-weight:700}.ticket-estimates strong{display:block;font-size:18px;line-height:1.4;margin-top:5px;color:var(--ink-202522)}.ticket-estimates span{display:block;font-size:10px;color:var(--ink-555b57);margin-top:3px}

/* Driver next-stop workspace */
.driver-focus .driver-focus-heading{padding:18px 2px 16px}.driver-status-dot{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:650;color:var(--ink-202522)}.driver-status-dot:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--surface-555b57)}.driver-focus-heading h1{font-size:27px;line-height:1.2;letter-spacing:-.7px;margin:8px 0}.driver-focus-heading p{font-size:12px;color:var(--ink-555b57);margin:0}.driver-next-card{padding:20px;border:1px solid var(--line-e9ebe8);border-radius:20px;background:linear-gradient(140deg,var(--surface-f5f5f3),var(--surface-ffffff) 65%);box-shadow:0 5px 20px #2025220c}.driver-stop-label{font-size:10px;letter-spacing:1px;font-weight:650;color:var(--ink-555b57)}.driver-next-card h2{font-size:21px;line-height:1.3;margin:8px 0;overflow-wrap:anywhere}.driver-next-destination{font-size:12px;line-height:1.4;color:var(--ink-555b57);margin:0 0 16px}.driver-passenger-line{display:flex;align-items:center;gap:10px;margin:16px 0;padding:14px 0;border-top:1px solid var(--line-e9ebe8)}.driver-passenger-line strong{flex:1;min-width:0;overflow-wrap:anywhere;font-size:14px}.driver-passenger-line .pill{font-size:11px;white-space:nowrap;padding:6px 9px}.driver-passenger-line .driver-avatar{width:36px;height:36px;flex-basis:36px;background:var(--surface-202522);color:var(--ink-ffffff);font-size:14px}.driver-next-card>.btn{min-height:48px;font-size:14px;border-radius:12px}.driver-next-card .trip-contact-actions{margin-top:10px}.driver-next-card .trip-contact-actions:empty{display:none}.driver-next-card .trip-contact-actions .btn{min-height:40px;font-size:12px;padding:9px 12px;border-radius:10px}.driver-next-card .driver-navigation{margin-top:10px;min-height:40px;font-size:12px}.driver-remaining,.driver-map{padding:0 2px;margin-top:12px;border-bottom:1px solid var(--line-e9ebe8)}.driver-remaining summary,.driver-map summary{min-height:48px;display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:650;cursor:pointer}.driver-remaining-row{padding:12px 0;border-top:1px solid var(--line-e9ebe8);font-size:12px}.driver-remaining-row p{margin:6px 0;color:var(--ink-555b57)}.driver-focus .live-ride-map{height:250px}.driver-focus .notice{font-size:12px;line-height:1.5}
.pickup-wait{padding:16px;margin:14px 0;border:1px solid var(--line-d5d8d5);border-radius:16px;background:var(--surface-f5f5f3)}.pickup-wait p,.pickup-wait small{font-size:12px;color:var(--ink-555b57);line-height:1.5}.pickup-wait .wait-countdown{font-size:24px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink-202522)}.pickup-wait .btn{margin-top:8px}.pickup-wait .row{gap:10px}

/* Compact passenger pickup state; stable timer width and grouped actions. */
.passenger-wait{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;margin:12px 0 16px;border-radius:12px}
.passenger-wait strong{font-size:14px;line-height:1.4}.passenger-wait .wait-countdown{font-size:22px;min-width:3.5ch;text-align:right;white-space:nowrap}.passenger-wait [hidden]{display:none}
.pickup-reminder{padding:12px 16px;margin:12px 0 16px;border-left:3px solid var(--line-555b57);background:var(--surface-f5f5f3);border-radius:0 10px 10px 0}.pickup-reminder strong{font-size:14px}.pickup-reminder p{font-size:12px;line-height:1.5;color:var(--ink-555b57);margin:5px 0 0}
.trip-contact-actions{flex-wrap:wrap}.trip-contact-actions .pickup-problem-action{flex:0 0 100%;min-height:36px;margin-top:0;padding:6px;font-size:12px;background:transparent}
/* Passenger live trip: one map and a two-position control panel. */
#app:has([data-passenger-live]) .topbar{display:none}
#app:has([data-passenger-live]) .main.page-booking{margin:0;padding:0;max-width:none}
.passenger-live{position:fixed;inset:0 0 var(--live-nav-height,80px);display:flex;flex-direction:column;background:var(--surface-e9ebe8);overflow:hidden;isolation:isolate}
.passenger-map{position:relative;flex:1;min-height:110px;overflow:hidden}
.passenger-map .live-map-panel{height:100%;margin:0;border:0;border-radius:0}
.passenger-map .live-ride-map{height:100%;min-height:0;border-radius:0}
.passenger-map .map-meta{position:absolute;left:12px;bottom:25px;z-index:401;padding:6px 10px;display:flex;gap:6px;flex-wrap:wrap;max-width:calc(100% - 24px);background:var(--surface-overlay-f2);border-radius:8px;font-size:11px;pointer-events:none}
.passenger-map .map-meta span,.passenger-map .map-meta small{font-size:10px;font-weight:500}
.passenger-map .map-meta [data-route-eta]{display:none}
.map-toolbar{position:absolute;top:max(12px,env(safe-area-inset-top));left:14px;right:14px;z-index:402;display:flex;justify-content:space-between;pointer-events:none}
.map-toolbar .btn{pointer-events:auto;background:var(--surface-ffffff);color:var(--ink-202522);box-shadow:0 2px 12px #20252220;min-height:44px;padding:10px 15px;border-radius:24px;font-size:13px;border:1px solid var(--line-e9ebe8)}
.live-trip-panel{position:relative;z-index:402;flex:none;height:min(350px,55%);display:flex;flex-direction:column;border-radius:24px 24px 0 0;background:var(--surface-ffffff);box-shadow:0 -4px 20px #2025220c;overflow:hidden}
.passenger-live.is-expanded .live-trip-panel{height:72%}
.live-panel-toggle{width:100%;min-height:38px;flex:none;display:flex;align-items:center;justify-content:center;gap:8px;background:var(--surface-ffffff);color:var(--ink-555b57);font-size:11px;touch-action:manipulation}
.panel-grip{width:28px;height:4px;border-radius:4px;background:var(--surface-d5d8d5)}
.live-panel-scroll{overflow-y:auto;overscroll-behavior:contain;overflow-anchor:none;padding:0 20px 14px;min-height:0;scrollbar-width:thin}
.live-trip-heading small{font-size:11px;font-weight:650;color:var(--ink-555b57)}.live-trip-heading h1{font-size:25px;letter-spacing:-.7px;line-height:1.2;margin:4px 0}.live-trip-heading p{font-size:12px;color:var(--ink-555b57);margin:4px 0 10px}
.live-place{display:flex;align-items:center;gap:8px;font-size:13px;min-width:0;margin:10px 0}.live-place>.icon,.live-place>span .icon{width:18px;height:18px}.live-place>strong{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.live-place .ticket-pickup-link{margin:0;padding:8px 10px;width:auto;flex:none;font-size:11px;border-radius:10px}.live-place .ticket-pickup-link>span:last-child{display:none}.live-place .ticket-pickup-link .icon{display:none}
.live-pickup-reminder{font-size:11px;color:var(--ink-555b57);line-height:1.45;margin:8px 0}
.live-trip-panel .trip-contact-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 0}.live-trip-panel .trip-contact-actions .btn{min-width:0;min-height:44px;padding:10px;font-size:13px;border-radius:12px}.live-trip-panel .trip-message-preview{margin:8px 0 0;font-size:12px}
.live-trip-panel .passenger-wait{margin:10px 0;padding:10px 12px}.live-trip-panel .passenger-wait strong{font-size:12px}.live-trip-panel .passenger-wait .wait-countdown{font-size:21px}
.live-trip-details{border-top:1px solid var(--line-e9ebe8);margin-top:16px;padding-top:16px}.live-trip-details[hidden]{display:none}.live-driver{display:flex;gap:12px;align-items:center}.live-driver>div{min-width:0}.live-driver small,.live-driver strong{display:block}.live-driver small{font-size:10px;color:var(--ink-555b57);letter-spacing:.1em}.live-driver strong{font-size:16px}.live-driver .driver-avatar{width:44px;height:44px;min-width:44px;font-size:18px}.live-driver .ticket-registration{font-size:12px;margin-top:5px}.live-trip-details dl{font-size:13px;margin:16px 0}.live-trip-details dl>div{display:flex;justify-content:space-between;gap:20px;padding:8px 0}.live-trip-details dt{color:var(--ink-555b57)}.live-trip-details dd{margin:0;text-align:right;max-width:65%}.live-trip-details .booking-options{margin-top:12px}
#app:has([data-passenger-live]) .bottom-nav{bottom:0;left:0;right:0;transform:none;width:100%;max-width:none;border-radius:0;z-index:46}
#app:has([data-passenger-live]):has([data-trip-chat-host]:not([hidden]) [data-trip-chat]) .live-trip-panel{visibility:hidden;height:min(52dvh,430px);max-height:calc(100dvh - var(--live-nav-height,80px) - 110px)}
#app:has([data-passenger-live]) .trip-chat-sheet{bottom:var(--live-nav-height,80px);height:min(52dvh,430px);max-height:calc(100dvh - var(--live-nav-height,80px) - 110px);width:100%;padding-bottom:0;z-index:44}
#app:has([data-passenger-live]) .trip-chat-sheet.expanded{height:70dvh}
@media(min-width:760px){.passenger-live{left:50%;right:auto;width:min(100%,900px);transform:translateX(-50%)}#app:has([data-passenger-live]) .trip-chat-sheet{width:900px;max-width:100%}#app:has([data-passenger-live]) .bottom-nav{left:50%;right:auto;transform:translateX(-50%);max-width:900px}.live-trip-panel{height:310px}.live-panel-scroll{padding-left:28px;padding-right:28px}}
@media(max-height:560px){.live-trip-panel{height:58%}.passenger-live.is-expanded .live-trip-panel{height:75%}.live-trip-heading h1{font-size:21px}}

#app:has([data-passenger-live]):has([data-trip-chat-host]:not([hidden]) .trip-chat-sheet.expanded) .live-trip-panel{height:70dvh}
/* Approved neutral design system: shared by passenger, driver and admin. */
:root{--ink:var(--tone-202522);--muted:var(--tone-666c68);--green:var(--tone-202522);--green-hover:var(--tone-343a36);--brand:#26C665;--brand-text:#087D36;--mint:var(--tone-f5f5f3);--accent:#26C665;--canvas:var(--tone-fafaf8);--surface:var(--tone-ffffff);--line:var(--tone-e2e4e0);--soft:var(--tone-f5f5f3);--cream:var(--tone-fafaf8);--radius:16px;--shadow:none}
body{background:var(--canvas);color:var(--ink)}
:focus-visible{outline:2px solid var(--brand-text);outline-offset:3px}
.btn{border-radius:12px;min-height:48px;background:var(--ink);color:var(--ink-ffffff);box-shadow:none;transition:background .12s}
.btn.secondary,.btn.ghost{background:var(--surface-ffffff);color:var(--ink);border:1px solid var(--line-cfd3ce)}
.btn.small{min-height:44px}.btn.danger{background:var(--surface-fcede9);color:#9B3223}
.btn:not(:disabled):hover{filter:brightness(.97)}
.card,.empty,.booking-form,.scheduled-review,.driver-next-card,.conversation,.conversation-list,.metric,.account-tile{border-radius:var(--radius);box-shadow:none;border-color:var(--line)}
.card .card{border-radius:0;border-width:0 0 1px;padding:16px 0;background:transparent}
.topbar{background:var(--surface-ffffff)}.notification-bell,.home-greeting-mark,.home-symbol{background:var(--soft);color:var(--ink)}
.field input,.field select,.field textarea{background:var(--soft);border-color:var(--line);border-radius:12px}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--brand-text);border-color:var(--brand-text)}
.booking-launch.unified-booking{border-radius:16px;box-shadow:none}
.unified-booking .booking-mode button{border-radius:12px;background:var(--soft);border:1px solid transparent}
.unified-booking .booking-mode button[aria-pressed=true]{background:var(--surface-ffffff);border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.unified-booking .mode-check{background:transparent}.unified-booking button[aria-pressed=true] .mode-check{background:var(--brand);color:var(--ink-102218)}
.routine-banner,.home-info,.driver-setup,.ticket-estimates{background:var(--soft);border-radius:12px;box-shadow:none}
.trip-ticket .trip-overview,.compact-trip .trip-overview{background:var(--surface-ffffff);border:1px solid var(--line);border-radius:16px;box-shadow:none}
.trip-ticket .ticket-route,.trip-ticket .trip-driver-row{background:var(--surface-ffffff)}.trip-ticket .trip-status-label{background:transparent;color:var(--muted);border:0;padding:0;border-radius:0}
.ticket-pickup-link{background:var(--soft);color:var(--ink);border-radius:12px}.driver-avatar{background:var(--soft);color:var(--ink)}
.driver-status-card,.driver-status-card.compact-availability,.earnings-hero{background:var(--surface-ffffff);color:var(--ink);border:1px solid var(--line);border-radius:16px;box-shadow:none}
.driver-service-copy strong,.earnings-hero h2,.earnings-pending strong{color:var(--ink)}
.driver-service-copy>span,.earnings-hero .row p,.earnings-pending{color:var(--muted)}
.driver-service-icon{background:var(--soft);color:var(--ink)}.instant-plan-current{background:var(--soft);border:0;color:var(--ink)}.instant-plan-current strong{color:var(--ink)}
.driver-status-card .btn.secondary,.driver-status-card .btn.ghost{background:var(--surface-ffffff);border:1px solid var(--line);color:var(--ink)}
.offer-mode-block+.offer-mode-block,.earnings-pending{border-color:var(--line)}
.ride-now-switch[aria-checked=true]:before{background:var(--brand)}.ride-now-switch[aria-checked=true]>span{background:var(--surface-ffffff)}
.active-ride-card,.passenger-active .card{background:var(--surface-ffffff);border:1px solid var(--line);border-left:3px solid var(--brand)}
.support-entry,.account-row-icon,.account-avatar,.account-tile .icon-box{background:var(--soft);color:var(--ink)}
.chat-messages{background:var(--soft)}.chat-message.mine{background:var(--ink);border-color:var(--ink);color:var(--ink-ffffff)}.chat-composer textarea{background:var(--surface-ffffff)}.trip-message-preview{background:var(--soft);color:var(--ink)}
.bottom-nav{background:var(--surface-ffffff);box-shadow:none;backdrop-filter:none;border-color:var(--line);border-radius:0}
.nav-item,.nav-item.active{background:transparent;border-radius:0;color:var(--muted);position:relative}
.nav-item.active{color:var(--brand-text)}.nav-item.active:after{content:'';position:absolute;bottom:0;left:32%;right:32%;height:3px;border-radius:3px;background:var(--brand)}
.pickup-wait,.pickup-reminder{background:var(--soft);border-color:var(--line)}
.live-trip-panel{border-radius:22px 22px 0 0;box-shadow:0 -2px 12px #20252208;height:min(350px,55%)}
.live-trip-heading small{color:var(--muted);font-weight:500;font-size:13px}.live-trip-heading h1{font-size:clamp(25px,6vw,32px);color:var(--ink);letter-spacing:-.035em}.live-trip-heading p{font-size:14px}
.live-place{padding:12px 0;margin:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:15px}.live-place>span{color:var(--brand-text)}
.onboard-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.onboard-actions .btn{min-width:0;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px;font-size:14px}.onboard-actions .icon{width:20px;height:20px}
.live-trip-details .btn{font-size:13px}.live-panel-toggle{min-height:38px;color:var(--muted)}
.sidebar{background:var(--surface-ffffff);border-right:1px solid var(--line)}.sidebar button.active{background:var(--soft);color:var(--brand-text);border-radius:10px}.admin-content .card,.admin .metric{border-radius:16px;box-shadow:none}.admin-header,.god{color:var(--muted)}
@media(max-width:620px){.card{padding:20px;margin-bottom:16px}.booking-form{padding:0;border:0;background:transparent}.scheduled-review{padding:20px}.home-heading h1{font-size:38px}.main{margin-top:24px}.page-heading{margin-bottom:24px}.driver-status-card.compact-availability{padding:4px 18px}.bottom-nav{border-radius:0}.trip-ticket .trip-overview{padding:0}}

.sidebar,.sidebar button{color:var(--ink)}.sidebar p{color:var(--muted)}.sidebar .wordmark{filter:none}.badge.success{background:var(--soft);color:var(--brand-text)}

/* Trips and recurring plans share one compact, neutral hierarchy. */
.trip-tabs{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:20px}.trip-tabs button{justify-content:center;padding:12px 8px}.trip-rows{background:var(--surface-ffffff);border:1px solid var(--line-e6e8e7);border-radius:18px;overflow:hidden}.trip-list-row{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;background:transparent;color:var(--ink-252b28);text-align:left;border:0;border-bottom:1px solid var(--line-eef0ef);padding:18px;cursor:pointer}.trip-list-row:last-child{border-bottom:0}.trip-row-copy{display:grid;gap:6px;min-width:0}.trip-row-copy strong{font-size:17px;overflow-wrap:anywhere}.trip-row-copy small{color:var(--ink-68706b)}.trip-row-copy>span{font-size:13px}.recurring-leg,.recurring-days{border:0;padding:0;margin:0;min-width:0}.recurring-leg{border-top:1px solid var(--line-e6e8e7);padding-top:18px}.recurring-leg[hidden]{display:none}.recurring-leg h2{font-size:17px;margin:0 0 12px}.recurring-days legend{font-weight:600;margin-bottom:12px}.recurring-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}.recurring-review-row{display:flex;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--line-edf0ee)}.recurring-review-row p{font-size:13px;color:var(--ink-68706b);margin:6px 0 0}

/* Ride Now vehicle capacity selection. */
.vehicle-picker{min-width:0;border:0;padding:0;margin:0}.vehicle-picker legend{font-size:19px;font-weight:700;margin-bottom:14px;padding:0}.vehicle-options{display:grid;gap:8px}.vehicle-option{display:flex;align-items:center;gap:14px;min-height:76px;padding:10px 14px;border:1px solid var(--line-e1e5e2);border-radius:14px;background:var(--surface-ffffff);cursor:pointer;color:var(--ink)}.vehicle-option:has(input:checked){border-color:var(--brand,#164b3b);background:var(--surface-f0f7f3);box-shadow:inset 0 0 0 1px var(--brand,#164b3b)}.vehicle-option:focus-within{outline:2px solid #164b3b;outline-offset:2px}.vehicle-illustration{width:62px;height:52px;flex-shrink:0;color:#164b3b}.vehicle-option strong{font-size:17px;white-space:nowrap}.vehicle-capacity{display:flex;align-items:center;gap:4px;margin-left:auto;color:var(--ink-68706b);font-size:14px}.vehicle-capacity .icon{width:18px;height:18px}.vehicle-option input[type=radio]{appearance:auto;width:20px;height:20px;min-height:0;flex:0 0 20px;margin:0;padding:0;accent-color:#164b3b;box-shadow:none}.vehicle-picker>p{font-size:12px;color:var(--muted);margin:12px 0 0}@media(max-width:360px){.vehicle-option{gap:9px;padding:8px 10px}.vehicle-illustration{width:48px}.vehicle-option strong{font-size:16px}}

.vehicle-dropdown{border:1px solid var(--line-dce1de);border-radius:14px;background:var(--surface-ffffff);overflow:hidden}.vehicle-dropdown>summary{display:flex;align-items:center;gap:12px;min-height:66px;padding:8px 14px;list-style:none;cursor:pointer}.vehicle-dropdown>summary::-webkit-details-marker{display:none}.vehicle-dropdown>summary strong{font-size:17px}.vehicle-dropdown .vehicle-illustration{width:52px;height:44px}.vehicle-chevron{font-size:23px;line-height:1;margin-left:4px;color:var(--ink-68706b)}.vehicle-dropdown[open] .vehicle-chevron{transform:rotate(180deg)}.vehicle-dropdown .vehicle-options{gap:0;padding:0 8px 8px;max-height:330px;overflow-y:auto;border-top:1px solid var(--line-e8ece9)}.vehicle-dropdown .vehicle-option{min-height:54px;padding:5px 8px;border:0;border-bottom:1px solid var(--line-edf0ee);border-radius:0;gap:12px}.vehicle-dropdown .vehicle-option:last-child{border-bottom:0}.vehicle-dropdown .vehicle-option:has(input:checked){background:var(--surface-f0f7f3);box-shadow:none;border-radius:8px}.vehicle-dropdown .vehicle-option:focus-within{outline:none}.vehicle-dropdown input[type=radio]:focus-visible{outline:2px solid #164b3b;outline-offset:3px}.vehicle-picker legend{font-size:16px;margin-bottom:8px}.vehicle-picker>p{margin-top:8px}

.vehicle-dropdown>summary,.vehicle-dropdown[open]>summary{min-height:58px;margin:0;padding:6px 12px}.vehicle-dropdown>summary::after{content:none;display:none}.vehicle-dropdown>summary .vehicle-illustration{width:48px;height:40px}


/* Categorised notification cards */
.page-notifications{max-width:760px;margin-inline:auto}
.page-notifications .updates-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}
.notification-tabs{display:flex;gap:8px;margin-bottom:20px}
.notification-tabs button{flex:1;min-height:44px;padding:10px 12px;border:1px solid var(--line);border-radius:28px;background:var(--surface-f1f1f0);color:var(--muted);font-size:14px;white-space:nowrap}
.notification-tabs button[aria-pressed="true"]{background:var(--mint);border-color:#b6dfc7;color:var(--green);font-weight:600}
.notification-tabs button span{display:inline-block;width:6px;height:6px;background:var(--green);border-radius:50%;margin-left:6px;vertical-align:middle}
.page-notifications .updates-feed{display:grid;gap:14px;background:transparent;border:0;overflow:visible}
.page-notifications .update-item{display:block;position:relative;padding:20px;border:1px solid var(--line);border-radius:20px;background:var(--surface-ffffff)}
.update-title{display:flex;gap:12px;align-items:center}
.update-title h2{margin:0;font-size:17px;line-height:1.3;font-weight:600}
.page-notifications .update-symbol{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:38px;height:38px}
.page-notifications .update-unread{position:absolute;top:0;right:0;width:8px;height:8px;border-radius:50%;box-shadow:0 0 0 2px var(--tone-ffffff)}
.page-notifications .update-item>p{font-size:14px;line-height:1.6;color:var(--muted);margin:12px 0 16px;overflow-wrap:anywhere}
.page-notifications .update-item footer{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:10px}
.page-notifications time{font-size:12px;color:var(--muted)}
.update-open{display:inline-flex;align-items:center;gap:4px;background:none;border:0;color:var(--green);font-size:14px;font-weight:600;min-height:44px;padding:4px 0}
.update-open svg{width:16px;height:16px}
.notification-settings-link{display:block;margin:24px auto 0;min-height:44px}
@media(max-width:380px){.notification-tabs button{padding-inline:8px;font-size:13px}.page-notifications .update-item{padding:16px}.page-notifications .updates-heading h1{font-size:28px}}


/* Clean welcome: left-aligned branding and four-line typography. */
body:has(.welcome-bold){background:var(--surface-ffffff)}
.welcome-bold-topbar{position:relative;background:var(--surface-ffffff);border:0;height:88px;padding:24px;max-width:1120px;margin:auto}
.welcome-bold-topbar .wordmark{height:auto;filter:none;opacity:1}
.welcome-bold{max-width:1120px;min-height:calc(100svh - 88px);margin:0 auto;padding:clamp(28px,5svh,48px) 24px max(16px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:flex-start;gap:clamp(32px,6svh,48px);color:var(--ink-000000)}
.welcome-bold-message{width:100%;margin:0;padding:0}
.welcome-bold h1.welcome-stacked-title{font-size:clamp(40px,12.3vw,48px);line-height:1;letter-spacing:-.055em;font-weight:700;margin:0;color:var(--ink-000000);max-width:none}
.welcome-stacked-title>span{display:block;white-space:nowrap}
.welcome-stacked-title>.welcome-title-save{color:#1CBB5F}
.welcome-bold-message>p{font-size:16px;font-weight:400;line-height:1.5;letter-spacing:-.02em;color:var(--ink-6a716c);margin:24px 0 0}
.welcome-bold-entry{width:100%;background:none;border:0;padding:0;margin-top:auto}
.welcome-choices{display:grid;gap:12px}
.welcome-choice{display:flex;align-items:center;gap:16px;width:100%;min-height:60px;padding:16px 22px;border-radius:16px;border:1px solid var(--line-000000);background:var(--surface-000000);color:var(--ink-ffffff);font-size:16px;font-weight:600;line-height:1.4;text-align:left;text-transform:none;letter-spacing:-.015em;transition:background .15s ease,transform .15s ease}
.welcome-choice>.icon:last-child{margin-left:auto;width:24px;height:24px}
.welcome-choice-icon{display:flex;align-items:center;justify-content:center}
.welcome-choice-icon .icon{width:24px;height:24px}
.passenger-choice{background:var(--surface-000000);color:var(--ink-ffffff);border-color:var(--line-000000)}
.driver-choice{background:var(--surface-ffffff);color:var(--ink-000000);border-color:var(--line-000000)}
.passenger-choice .icon,.driver-choice .icon{color:inherit}
.passenger-choice:hover{background:var(--surface-202020);border-color:var(--line-202020)}
.driver-choice:hover{background:var(--surface-f5f5f5);border-color:var(--line-000000)}
.welcome-choice:active{transform:translateY(1px)}
.welcome-choice:focus-visible,.welcome-existing button:focus-visible{outline:3px solid #23bb62;outline-offset:4px}
.welcome-existing{text-align:center;margin:8px 0 0;color:var(--ink-6a716c);font-size:13px;line-height:1.5}
.welcome-existing button{display:inline-block;border:0;background:none;color:var(--ink-000000);font-size:inherit;font-weight:600;min-height:44px;padding:8px 3px}
@media(min-width:800px){
 .welcome-bold-topbar{padding:24px 40px}
 .welcome-bold{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center;padding:48px 40px 80px}
 .welcome-bold h1.welcome-stacked-title{font-size:64px}
 .welcome-bold-message>p{font-size:18px;margin-top:28px}
 .welcome-bold-entry{max-width:420px;margin-top:0}
}
@media(max-height:700px) and (max-width:799px){
 .welcome-bold-topbar{height:80px;padding-top:20px;padding-bottom:20px}
 .welcome-bold{min-height:calc(100svh - 80px);padding-top:24px;gap:28px}
 .welcome-bold h1.welcome-stacked-title{font-size:clamp(38px,11.3vw,44px)}
 .welcome-bold-message>p{margin-top:20px}
}
@media(max-height:580px) and (max-width:799px){
 .welcome-bold-topbar{height:72px;padding-top:16px;padding-bottom:16px}
 .welcome-bold{min-height:calc(100svh - 72px);padding-top:16px;gap:24px}
 .welcome-bold h1.welcome-stacked-title{font-size:36px}
 .welcome-bold-message>p{margin-top:18px;font-size:15px}
 .welcome-choice{min-height:54px;padding-block:12px}
}
@media(prefers-reduced-motion:reduce){.welcome-choice{transition:none}}

.auth-switch{text-align:center;font-size:14px;color:var(--muted);margin:8px 0 0}.auth-switch .link{font-weight:600;min-height:44px}

/* Use the white wordmark on explicitly dark brand surfaces. */
[data-brand-surface="dark"] .wordmark,.wordmark.wordmark-on-dark{filter:brightness(0) invert(1)}

/* Secondary screens retain header actions without a wordmark. */
.topbar.topbar-unbranded{justify-content:flex-end}

/* Wordmark keeps its natural proportions and yields space to home actions. */
.topbar>a:has(.wordmark){flex:0 1 192px;min-width:0}
.topbar .wordmark{display:block;width:100%;max-width:192px;height:auto}
.topbar .top-actions{flex-shrink:0}
.welcome-bold-topbar>a:has(.wordmark){flex-basis:208px}
.welcome-bold-topbar .wordmark{max-width:208px}
@media(max-width:620px){
 .topbar>a:has(.wordmark){flex-basis:160px}
 .topbar .wordmark{max-width:160px}
 .welcome-bold-topbar>a:has(.wordmark){flex-basis:200px}
 .welcome-bold-topbar .wordmark{max-width:200px}
}
/* Driver-posted seats: uses the existing Worcar colour and type system. */
.posted-intro{margin-block:20px}.posted-intro .eyebrow{font-size:11px}.posted-grid,.posted-money{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.posted-form input,.posted-form select{min-width:0;max-width:100%}.posted-money{padding:18px 0;border-block:1px solid var(--line-e1e6e3)}.posted-money div{display:flex;flex-direction:column;gap:6px}.posted-money strong{font-size:20px;line-height:1.25}.posted-money small{color:var(--ink-65726b)}.posted-card{margin-block:20px}.posted-card h2{font-size:21px;line-height:1.35;overflow-wrap:anywhere}.posted-choices,.posted-days{border:0;padding:0;margin:0}.posted-choices legend,.posted-days legend{font-weight:700;margin-bottom:12px}.posted-choices>label{display:flex;align-items:flex-start;gap:12px;border:1px solid var(--line-dce3de);border-radius:16px;padding:16px;margin-block:10px}.posted-choices>label:has(input:checked){border-color:#20bd60;background:var(--surface-effaf3)}.posted-choices input,.posted-consent input,.posted-days input{width:20px!important;height:20px!important;min-height:20px!important;flex-shrink:0;accent-color:#1fb75d;margin-top:2px}.posted-choices span{display:flex;flex-direction:column;gap:6px}.posted-choices small{line-height:1.5;color:var(--ink-53645b)}.posted-days{display:flex;flex-wrap:wrap;gap:12px}.posted-days label{display:flex;align-items:center;gap:5px}.posted-consent{display:flex;gap:12px;line-height:1.5}.posted-plan{border-bottom:1px solid var(--line-e1e6e3);padding-bottom:14px}.posted-form fieldset{min-width:0}.page-posted-journeys{max-width:720px;margin-inline:auto}.posted-form .field{min-width:0}@media(max-width:360px){.posted-grid{grid-template-columns:1fr}}

/* Keep the scheduled pickup heading, timing note and policy on separate lines. */
.pickup-reminder>strong,.pickup-reminder>small{display:block}
.pickup-reminder>small{margin-top:4px;font-size:12px;line-height:1.5;color:var(--ink-555b57)}
.pickup-reminder>p{margin-top:10px}

.topbar .home-mode-label{display:block;margin-top:5px;font-size:12px;font-weight:500;line-height:1.3;color:var(--muted);letter-spacing:.02em}

.topbar>a:has(.home-mode-label){flex-direction:column;align-items:flex-start;justify-content:center;text-decoration:none}

.topbar .home-mode-switch{position:relative;border:0;padding:0;margin:0}.home-mode-switch>summary{display:flex;align-items:center;gap:7px;min-height:44px;padding:8px 4px;list-style:none;font-size:13px;font-weight:600;cursor:pointer;color:var(--ink)}.home-mode-switch>summary::-webkit-details-marker{display:none}.home-mode-switch>summary:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:6px}.home-mode-options{position:absolute;right:0;top:calc(100% + 6px);z-index:100;width:160px;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--surface-ffffff);box-shadow:0 8px 24px #00000018}.home-mode-options>button{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:44px;padding:10px 12px;border:0;border-radius:8px;background:var(--surface-ffffff);color:var(--ink);font:inherit;font-size:14px;text-align:left;cursor:pointer}.home-mode-options>button:hover,.home-mode-options>button:disabled{background:var(--soft)}.home-mode-options>button:disabled{opacity:1;cursor:default}

.topbar .home-mode-switch>summary,.topbar .home-mode-switch[open]>summary{min-height:32px;margin:0;padding:6px 9px;gap:5px;border:1px solid var(--line-e8e8e5);border-radius:999px;background:var(--surface-f5f5f3);font-size:11px;font-weight:600;line-height:18px;white-space:nowrap;justify-content:center}.topbar .home-mode-switch>summary::after,.topbar .home-mode-switch>summary::before{content:none;display:none}.topbar .home-mode-switch .mode-chevron{flex-shrink:0;transition:transform .15s ease}.topbar .home-mode-switch[open] .mode-chevron{transform:rotate(180deg)}.topbar .home-mode-switch[open]>summary{background:var(--surface-ecece9);border-color:var(--line-dededb)}.topbar .home-mode-options{width:176px;top:calc(100% + 10px);padding:6px;border-radius:14px;box-shadow:0 10px 32px #00000014}.topbar .home-mode-options>button{font-size:13px;font-weight:500;border-radius:9px}.topbar .home-mode-options>button:disabled{font-weight:650;background:var(--surface-f1f1ee)}.topbar .home-mode-options>button:focus-visible{outline:2px solid var(--line-202020);outline-offset:-2px}

.topbar .home-mode-segments{display:flex;align-items:center;padding:3px;gap:2px;border:1px solid var(--line-e6e6e3);border-radius:999px;background:var(--surface-f3f3f1)}.topbar .home-mode-segments>button{min-height:36px;padding:8px 10px;border:0;border-radius:999px;background:transparent;color:var(--ink-666666);font:inherit;font-size:11px;font-weight:600;line-height:18px;white-space:nowrap;cursor:pointer}.topbar .home-mode-segments>button[aria-pressed=true]{background:var(--surface-202020);color:var(--ink-ffffff);opacity:1;cursor:default}.topbar .home-mode-segments>button:focus-visible{outline:2px solid var(--line-202020);outline-offset:2px}@media(max-width:480px){.topbar:has(.home-mode-segments){gap:8px}.topbar:has(.home-mode-segments)>a:has(.wordmark){flex-basis:132px}.topbar:has(.home-mode-segments) .top-actions{gap:8px}.topbar .home-mode-segments>button{padding:8px}}@media(max-width:360px){.topbar:has(.home-mode-segments)>a:has(.wordmark){flex-basis:110px}.topbar .home-mode-segments>button{font-size:10px;padding:8px 6px}}

/* Companion home illustrations: reserve enough room for the complete boarding scene. */
.routine-banner.driver-sketch-banner,.routine-banner.passenger-sketch-banner{min-height:196px;padding:22px; margin-top:8px}
.driver-sketch-banner .routine-copy,.passenger-sketch-banner .routine-copy{max-width:49%;gap:10px}
.driver-sketch-banner .routine-copy>strong,.passenger-sketch-banner .routine-copy>strong{font-size:clamp(25px,6.3vw,34px)}
.routine-banner.driver-sketch-banner>img,.routine-banner.passenger-sketch-banner>img{width:61%;right:-7%;bottom:16px;transform:none}
.driver-sketch-banner .routine-copy>span,.passenger-sketch-banner .routine-copy>span{font-size:11px;gap:6px}
@media(max-width:360px){.routine-banner.driver-sketch-banner,.routine-banner.passenger-sketch-banner{padding:17px;min-height:185px}.driver-sketch-banner .routine-copy>strong,.passenger-sketch-banner .routine-copy>strong{font-size:25px}.routine-copy>span .icon{width:16px}}

.routine-banner.passenger-sketch-banner>img{width:64%;right:-3%;bottom:5px}