[hidden] { display:none !important; }
.route-modes { display:flex; gap:8px; margin-bottom:24px; }
.route-modes button,.route-action { flex:1; min-height:44px; border:1px solid var(--field-line); border-radius:12px; background:var(--surface); color:var(--primary); padding:10px 12px; font:inherit; font-size:14px; cursor:pointer; }
.route-modes button[aria-pressed="true"],.route-action { background:var(--primary); color:var(--paper); }
.route-modes button:disabled,.route-action:disabled { opacity:.5; cursor:default; }
.route-address { margin-bottom:18px; min-width:0; }
.route-address label { margin:0 0 8px; }
.route-address input { width:100%; box-sizing:border-box; min-height:48px; border:1px solid var(--field-line); border-radius:10px; padding:12px; font:inherit; font-size:16px; background:var(--surface); color:var(--primary); }
.route-address input:focus-visible,.route-modes button:focus-visible,.route-action:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.route-address input[data-selected="true"] { border-color:var(--accent); }
.route-options { margin:4px 0 0; padding:0; list-style:none; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.route-options [role="option"] { padding:12px; min-height:44px; box-sizing:border-box; cursor:pointer; font-size:14px; overflow-wrap:anywhere; border-bottom:1px solid var(--line); }
.route-options [role="option"]:last-child { border:0; }
.route-options [aria-selected="true"],.route-options [role="option"]:hover { background:var(--tint); }
.route-info,.maps-message,.maps-privacy,.maps-credit { font-size:12px; color:var(--muted); line-height:1.6; overflow-wrap:anywhere; }
.maps-message { margin:0 0 16px; }
.route-info { margin:16px 0 0; }
.route-action { width:100%; }
.maps-credit { margin:12px 0 0; text-align:right; font-size:12px; font-weight:400; }
.maps-credit span { color:#5e5e5e; font:inherit; font-weight:700; letter-spacing:normal; white-space:nowrap; }
[data-appearance="dark"] .maps-credit span { color:#fff; }
.maps-privacy { margin:8px 0 0; }
.maps-privacy a { color:inherit; }
.route-map { margin-top:16px; border:1px solid var(--line); border-radius:14px; background:var(--surface); overflow:hidden; }
.route-map summary { padding:16px; cursor:pointer; font-size:14px; font-weight:600; }
.route-map-content { padding:0 12px 12px; }
.route-map img { display:block; width:100%; height:auto; border-radius:8px; }
.route-map p { padding:0 4px; }

.privacy-section { margin-top:28px; padding-top:20px; border-top:1px solid var(--line); color:var(--muted); font-size:13px; line-height:1.65; overflow-wrap:anywhere; }
.privacy-section a { color:inherit; text-underline-offset:3px; }
.privacy-details { margin-top:0; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.privacy-details summary { min-height:44px; box-sizing:border-box; padding:12px 16px; color:var(--primary); font-weight:600; cursor:pointer; }
.privacy-details summary:focus-visible,.privacy-section a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.privacy-content { padding:0 16px 16px; }
.privacy-content h3 { margin:20px 0 8px; color:var(--primary); font-size:15px; line-height:1.4; }
.privacy-content p { margin:0 0 12px; }
.privacy-content ul { padding-left:20px; }
.privacy-content li { margin:6px 0; }

#route-editor { padding-top:0; }
.maps-message:empty { display:none; }
.date-trigger { height:auto; min-height:46px; }
.date-trigger span { line-height:1.4; }
.departure-time { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin:14px 0 8px; color:var(--primary); font-size:14px; }
.departure-time span { font-size:11px; color:var(--muted); }
.departure-time input { width:100%; min-height:44px; box-sizing:border-box; background:var(--paper); color:var(--primary); border:1px solid var(--line); border-radius:9px; padding:10px 12px; font:inherit; font-size:16px; }
.departure-time input:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.calendar-confirm { flex:none; margin-top:12px; }
.calendar { max-height:calc(100dvh - 24px); overflow-y:auto; }

.route-fields { position:relative; margin-bottom:20px; padding:4px 0; border-radius:24px; background:var(--tint); }
.route-fields .route-address { position:relative; margin:0; padding:0 48px 0 40px; }
.route-fields .route-address input { min-width:0; height:58px; min-height:58px; padding:12px 4px; border:0; border-radius:0; background:transparent; color:var(--primary); font-size:16px; }
.route-fields .route-address input::placeholder { color:var(--muted); opacity:1; }
.route-fields .route-address input[data-selected="true"] { border:0; }
.route-fields .route-address input:focus-visible { outline:none; box-shadow:inset 0 -2px var(--accent); }
.route-fields .route-origin input { border-bottom:1px solid var(--line); }
.route-fields .route-origin input[data-selected="true"] { border-bottom:1px solid var(--line); }
.route-point { position:absolute; left:12px; top:18px; width:22px; height:22px; color:var(--accent); pointer-events:none; }
.route-origin .route-point { color:var(--primary); }
.route-connector { position:absolute; top:49px; left:21px; width:4px; height:24px; fill:var(--muted); pointer-events:none; }
.route-swap { position:absolute; right:4px; top:calc(50% - 22px); width:44px; height:44px; padding:10px; border:0; border-radius:50%; background:transparent; color:var(--primary); cursor:pointer; }
.route-swap svg { display:block; width:24px; height:24px; }
.route-swap:hover { background:var(--surface); }
.route-swap:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
.route-fields .route-options { position:absolute; z-index:3; left:0; right:0; top:100%; margin:0; background:var(--surface); box-shadow:0 8px 20px #0002; }
@media(max-width:360px) { .route-fields { margin-left:-8px; margin-right:-8px; } .route-fields .route-address { padding-left:32px; padding-right:36px; } .route-point { left:6px; } .route-connector { left:15px; } .route-swap { right:-4px; } }

.calendar .surcharge { margin:0 0 8px; }

.date-trigger .date-trigger-copy { display:grid; gap:3px; min-width:0; }
.date-trigger-copy small { color:var(--muted); font-size:12px; line-height:1.4; }

/* The dialog owns its shell; only the middle section scrolls. */
.calendar { padding:0; inset:min(var(--calendar-top,50dvh),50dvh) 0 auto; margin:0 auto; transform:translateY(-50%); max-height:min(calc(100dvh - 24px),calc(var(--calendar-viewport,100dvh) - 24px)); overflow:hidden; }
.calendar[open] { display:flex; flex-direction:column; }
.calendar .calendar-head { flex:0 0 auto; align-items:center; margin:0; padding:20px 22px 14px; }
.calendar-head h2 { font-size:20px; line-height:1.25; letter-spacing:-.4px; }
.calendar-body { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior-y:contain; -webkit-overflow-scrolling:touch; padding:0 22px 18px; scrollbar-color:var(--field-line) transparent; scroll-padding-block:10px; }
.calendar-arrangements { padding-bottom:6px; }
.calendar .express-option { margin:0; padding:0; border:0; min-height:44px; font-size:14px; line-height:1.4; }
.calendar .calendar-booking-note { margin:0 0 10px; font-size:12px; line-height:1.5; }
.calendar .surcharge { margin:2px 0 10px; }
.calendar .surcharge summary { min-height:36px; }
.calendar .surcharge p { padding:0 0 8px; }
.calendar .departure-time { display:block; margin:18px 0 0; font-size:14px; font-weight:600; }
.calendar .departure-time input { display:inline-block; vertical-align:middle; width:100%; min-width:0; max-width:100%; margin-top:6px; height:50px; min-height:50px; padding:7px 12px; font-size:30px; font-weight:600; line-height:1; text-align:center; font-variant-numeric:tabular-nums; }
.departure-time input::-webkit-date-and-time-value { width:100%; min-height:30px; line-height:30px; margin:0; text-align:center; }
.departure-time input::-webkit-datetime-edit { padding:0; color:inherit; }
.calendar-footer { flex:0 0 auto; position:relative; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 20px max(14px,env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:color-mix(in srgb,var(--surface) 88%,transparent); }
.calendar-footer-copy { min-width:0; }
#calendar-selection { margin:0; color:var(--primary); font-size:12px; line-height:1.5; font-variant-numeric:tabular-nums; }
.calendar-footer .calendar-clear { margin:4px 0 0; padding:0; min-height:30px; text-align:left; font-size:11px; }
.calendar .calendar-confirm { display:inline-flex; flex:0 0 auto; align-items:center; justify-content:center; gap:8px; width:auto; min-height:48px; margin:0; padding:12px 16px; border:0; border-radius:24px; background:var(--selected-bg); color:var(--selected-ink); font:inherit; font-size:14px; font-weight:600; cursor:pointer; }
.calendar-confirm svg { width:18px; height:18px; }
.calendar-confirm:disabled { opacity:.45; cursor:default; }
.calendar-confirm:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
@media(max-width:350px) { .calendar .calendar-head { padding:16px 14px 12px; } .calendar-head h2 { font-size:18px; } .calendar-body { padding-left:14px; padding-right:14px; } .calendar-footer { padding-left:14px; padding-right:14px; gap:8px; } }
@media(max-height:500px) { .calendar .calendar-head { padding-top:12px; padding-bottom:10px; } .calendar-footer { padding-top:10px; padding-bottom:10px; } }

.result-details { margin-top:auto; padding-top:36px; }
.result-details .status { margin:0; min-height:0; line-height:1.6; }
.result-details .route-info { margin:8px 0 0; line-height:1.7; }
.result-details .route-info:empty { display:none; }
@media(max-width:760px) { .result-details { grid-column:1/-1; margin-top:8px; padding-top:10px; border-top:1px solid var(--line); } .result-details .route-info { margin-top:4px; font-size:11px; } }
.result-details:has(.status[hidden]):has(.route-info:empty) { display:none; }

.route-fields .route-options { max-height:220px; overflow-y:auto; overscroll-behavior-y:contain; touch-action:pan-y; }

.result-details .route-info > div { display:flex; align-items:baseline; justify-content:space-between; gap:16px; }
.result-details .route-info dt { font-size:12px; }
.result-details .route-info dd { margin:0; color:var(--primary); font-size:13px; font-weight:500; font-variant-numeric:tabular-nums; white-space:nowrap; }

@media(max-width:760px) { .entry .result { margin-top:22px; margin-bottom:-24px; border-bottom:0; border-radius:0 0 17px 17px; } }

@media(max-width:760px) {
  [data-distance-editing="true"] .entry .date-field { margin-top:8px; }
  [data-distance-editing="true"] #date-hint { display:none; }
  [data-distance-editing="true"] .date-trigger { min-height:44px; padding-top:8px; padding-bottom:8px; font-size:14px; }
  [data-distance-editing="true"] .entry .result { margin-top:8px; padding-top:8px; padding-bottom:8px; }
  [data-distance-editing="true"] .result-details { margin-top:2px; padding-top:0; border-top:0; }
}

:root { --brand-name:var(--accent); --brand-support:var(--primary); }
:root[data-palette="teal"] { --brand-name:var(--primary); --brand-support:var(--accent); }
.maps-credit { color:color-mix(in srgb,var(--brand-support) 96%,var(--surface)); }
.route-action { font-weight:600; }
.route-action:disabled { opacity:1; background:color-mix(in srgb,var(--primary) 92%,var(--surface)); color:var(--paper); border-color:var(--field-line); }
.calendar .express-option { padding:4px 0; }
.express-copy { display:grid; gap:2px; }
.express-heading { color:var(--brand-name); font-size:16px; font-weight:700; line-height:1.3; }
.express-detail { color:var(--brand-support); font-size:13px; }
.fare-info-trigger { display:flex; align-items:center; gap:10px; width:100%; min-height:54px; margin:8px 0 12px; padding:6px 0; border:0; background:transparent; color:var(--primary); text-align:left; font:inherit; cursor:pointer; }
.fare-info-trigger > svg { flex:0 0 auto; width:20px; height:20px; color:var(--accent); }
.fare-info-trigger span { display:grid; gap:1px; }
.fare-info-trigger strong { font-size:13px; font-weight:600; }
.fare-info-trigger small { font-size:11px; color:var(--muted); }
.fare-info-trigger:focus-visible,.fare-info-done:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.calendar::backdrop { background:rgba(29,39,47,.2); backdrop-filter:blur(8px) saturate(.7); -webkit-backdrop-filter:blur(8px) saturate(.7); }
.fare-info { position:fixed; inset:min(var(--calendar-top,50dvh),50dvh) 0 auto; margin:0 auto; transform:translateY(-50%); width:min(350px,calc(100% - 32px)); max-height:min(calc(100dvh - 32px),calc(var(--calendar-viewport,100dvh) - 32px)); overflow-y:auto; padding:22px; color:var(--primary); border:1px solid #ffffffe0; border-radius:26px; background:linear-gradient(145deg,#ffffff85,#ffffff12 48%,#ffffff65),var(--glass); box-shadow:0 24px 64px #17263840,inset 0 1px 1px #fff; backdrop-filter:blur(22px) saturate(.6); -webkit-backdrop-filter:blur(22px) saturate(.6); }
.fare-info::backdrop { background:#10192618; backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); }
.fare-info-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.fare-info h2 { margin:0; font-size:21px; line-height:1.3; letter-spacing:-.4px; }
.fare-info h3 { margin:18px 0 6px; color:var(--brand-name); font-size:19px; font-weight:700; line-height:1.3; }
.fare-info p { margin:0; font-size:14px; line-height:1.65; }
.fare-info .fare-info-note { margin-top:18px; padding-top:14px; border-top:1px solid var(--line); }
.fare-info-done { display:block; width:fit-content; min-height:44px; margin:20px 0 0 auto; padding:10px 18px; border:0; border-radius:24px; background:var(--selected-bg); color:var(--selected-ink); font:inherit; font-size:14px; font-weight:600; cursor:pointer; }
[data-appearance="dark"] .fare-info { border-color:#ffffff60; background:linear-gradient(145deg,#ffffff14,#ffffff03 42%,#ffffff0f),var(--glass); box-shadow:0 24px 64px #0006,inset 0 1px 1px #ffffff55; }
@media(prefers-reduced-transparency:reduce) { .calendar::backdrop,.fare-info::backdrop { backdrop-filter:none; -webkit-backdrop-filter:none; } .fare-info { background:var(--surface); backdrop-filter:none; -webkit-backdrop-filter:none; } }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) { .fare-info { background:var(--surface); } }

.calendar .calendar-head { padding-bottom:6px; }
.calendar-arrangements { padding-bottom:0; }
.fare-info-trigger { min-height:44px; margin-top:2px; margin-bottom:8px; padding-top:2px; padding-bottom:2px; }
.calendar .departure-time { margin-top:10px; text-align:right; color:var(--primary); font-size:13px; }
.calendar .calendar-confirm { padding:10px 14px; gap:6px; font-size:13px; }
.calendar-footer .calendar-clear { max-width:80px; white-space:normal; line-height:1.3; }

.calendar .departure-time .departure-time-label { display:block; width:max-content; max-width:80%; margin-left:auto; margin-right:6%; color:var(--brand-support); }
.calendar .departure-time input { color:var(--brand-name); }
.time-handwriting { display:block; width:var(--lettering-width); max-width:100%; height:33px; overflow:visible; pointer-events:none; }
.time-handwriting path { fill:currentColor; fill-opacity:1; stroke:currentColor; stroke-width:.5; stroke-opacity:0; stroke-linecap:round; stroke-linejoin:round; }
.time-handwriting[data-lettering="waiting"] path { fill-opacity:0; }
.time-handwriting[data-lettering="writing"] path { stroke-dasharray:1; animation:time-ink-stroke .32s ease-out var(--letter-delay) both,time-ink-fill .18s ease calc(var(--letter-delay) + .2s) both; }
@keyframes time-ink-stroke { 0% { stroke-dashoffset:1; stroke-opacity:1; } 80% { stroke-opacity:1; } 100% { stroke-dashoffset:0; stroke-opacity:0; } }
@keyframes time-ink-fill { from { fill-opacity:0; } to { fill-opacity:1; } }
@media(prefers-reduced-motion:reduce) { .time-handwriting path { animation:none!important; fill-opacity:1!important; stroke-opacity:0!important; stroke-dasharray:none!important; } }
@media(max-height:700px) { .calendar .calendar-head { padding-top:16px; } .calendar-body { padding-bottom:10px; } .calendar .calendar-booking-note { margin-bottom:6px; } .calendar .departure-time { margin-top:6px; } }
