body.route-mode .route-mode-scope[hidden], body.route-mode .route-bottom[hidden], .route-stop-editor[hidden] { display: none !important; }
body.route-mode .route-access-legs button[aria-pressed="true"] { --route-touch-fill: #09bde9; color: #16374e; }
.route-stop-editor { position: fixed; z-index: 1500; bottom: max(12px, env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); box-sizing: border-box; width: min(460px, calc(100% - 24px)); max-height: calc(100dvh - 140px); overflow-y: auto; overscroll-behavior: contain; border: 1px solid #ffffffdd; border-radius: 18px; padding: 10px 16px; color: #16374e; box-shadow: 0 4px 18px #20445714; font-size: 11px; }
.route-stop-heading { display: flex; align-items: center; justify-content: space-between; }
.route-stop-heading small { margin-left: auto; color: #466e81; font-size: 10px; }
.route-stop-heading h3 { margin: 0; font-size: 14px; font-weight: 750; }
.route-stop-editor button, .route-stop-editor input, .route-stop-editor select { font: inherit; min-height: 44px; border-radius: 12px; box-shadow: none; }
/* A slim visual pill inside a full-size target, like the transport editor. */
.route-stop-editor button { position: relative; isolation: isolate; min-width: 44px; color: #16374e; padding: 0 12px; border: 0; background: transparent; }
body.route-mode #layer2 .route-stop-editor button { border: 0 !important; box-shadow: none !important; background: transparent !important; }
.route-stop-editor button::before { content: ''; position: absolute; z-index: -1; pointer-events: none; inset: 11px 0; border-radius: inherit; background: var(--stop-button-fill, #ffffffa6); }
.route-stop-editor button:disabled { opacity: .5; cursor: wait; }
.route-stop-editor :focus-visible { outline: 2px solid #147e9f; outline-offset: 2px; }
.route-stop-heading button { width: 44px; padding: 0; margin-right: -8px; font-size: 20px; --stop-button-fill: transparent; }
.route-stop-intro, .route-stop-explanation { color: #466b7c; font-size: 12px; margin: 10px 0 16px; line-height: 1.6; }
.route-stop-editor form { display: grid; gap: 6px; }
.route-stop-types { display: flex; gap: 6px; align-items: center; padding-bottom: 0; border-bottom: 1px solid #94d5dc65; }
.route-stop-types button { min-width: 72px; --stop-button-fill: #ffffff50; }
.route-stop-types [aria-pressed="true"] { --stop-button-fill: #ffffffdb; font-weight: 700; }
.route-stop-actions [data-stop-save] { --stop-button-fill: #09bde9; color: #073849; font-weight: 700; min-width: 64px; }
.route-stop-types [data-stop-new] { margin-left: auto; min-width: 44px; font-size: 11px; }
.route-stop-editor label { display: grid; gap: 0; font-size: 11px; color: #395e72; }
.route-stop-editor input, .route-stop-editor select { box-sizing: border-box; width: 100%; min-width: 0; color: #16374e; padding: 4px 10px; border: 0; background: #ffffffa6; }
.route-stop-search { display: flex; gap: 8px; }
.route-stop-search input { flex: 1; }
.route-stop-search .route-stop-field { flex: 1; }
/* Let non-interactive labels use the input's transparent upper inset. */
.route-stop-editor { --stop-field-line: 13.75px; --stop-label-offset: calc(3px - (44px - var(--stop-field-line) - 6px) / 2); }
.route-stop-search, .route-stop-editor label > .route-stop-field { margin-top: var(--stop-label-offset); }
/* Keep the input target tall while its visible surface hugs the text. */
.route-stop-field { position: relative; display: grid; min-width: 0; font-size: 11px; line-height: 1.25; }
.route-stop-field::before { content: ''; position: absolute; pointer-events: none; top: 50%; transform: translateY(-50%); width: 100%; height: calc(1.25em + 6px); border-radius: 12px; background: #ffffffa6; }
body.route-mode #layer2 .route-stop-field input, body.route-mode #layer2 .route-stop-field select { position: relative; height: 44px; min-height:44px; padding-block: 3px; font: inherit; border: 0 !important; background: transparent !important; box-shadow: none !important; outline: none; }
.route-stop-field:focus-within::before { outline: 2px solid #147e9f; outline-offset: 2px; }
.route-stop-field input::-webkit-datetime-edit { padding: 0; }
body.route-mode #layer2 .route-stop-field select { appearance:none; -webkit-appearance:none; line-height:1.25; padding-right:26px; }
.route-stop-field:has(select)::after { content:''; position:absolute; right:12px; top:calc(50% - 3px); width:6px; height:6px; border-right:1.5px solid #395e72; border-bottom:1.5px solid #395e72; transform:rotate(45deg); pointer-events:none; }
.route-stop-dates { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.route-stop-dates:has([hidden]) { grid-template-columns: 1fr; }
.route-stop-location { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 11px; color: #466b7c; }
.route-stop-explanation { margin: 0; font-size: 11px; line-height: 1.4; }
.route-stop-message { border-radius: 12px; padding: 10px 12px; background: #ffffffa1; color: #325b70; line-height: 1.6; }
.route-stop-actions { display: flex; justify-content: flex-end; gap: 10px; padding-top: 4px; border-top: 1px solid #94d5dc65; }
.route-stop-actions [data-stop-cancel] { --stop-button-fill: transparent; }
.route-stop-actions [data-stop-delete] { margin-right: auto; --stop-button-fill: transparent; color: #795750; }
.route-stop-list, .route-stop-results { display: grid; gap: 6px; max-height: 140px; overflow-y: auto; }
.route-stop-results:empty { display: none; }
.route-stop-list { margin: 0 0 8px; }
.route-stop-list button { display: flex; align-items: center; gap: 8px; text-align: left; }
.route-stop-list button::before, .route-stop-results button::before { inset-block: 2px; }
.route-stop-list svg { width: 16px; height: 16px; flex-shrink: 0; }
.route-stop-list span, .route-stop-results button { display: grid; gap: 3px; text-align: left; }
.route-stop-list strong, .route-stop-results strong { font-size: 11px; }
.route-stop-list small, .route-stop-results small { font-size: 10px; color: #486d7b; overflow-wrap: anywhere; }
.route-stop-editor [hidden] { display: none !important; }
.route-stop-picking .route-stop-list, .route-stop-picking form > :not(.route-stop-name):not(.route-stop-message) { display: none; }
.route-stop-picking form { padding-top: 14px; }
.route-stop-hit { display: grid; place-items: center; }
.route-stop-stamp { width: 30px; height: 30px; display: grid; place-items: center; border: 2px solid white; border-radius: 11px; box-shadow: 0 3px 10px #315c7238; }
.route-stop-stamp svg { width: 18px; height: 18px; }
body.route-mode .route-stop-thumb { display: grid; place-items: center; background: #d5f0f3; }
body.route-mode .route-stop-thumb svg { width: 26px; height: 26px; color: #315d72; }
.route-stop-popup .leaflet-popup-content { margin: 12px 14px; font-size: 12px; color: #183d54; }
.route-stop-popup .leaflet-popup-content span { display: block; color: #4b7284; font-size: 11px; margin-top: 4px; }
@media (min-width: 900px), (max-height: 500px) and (orientation: landscape) { .route-stop-editor { left: auto; right: max(16px, env(safe-area-inset-right)); transform: none; max-height: calc(100dvh - 32px); width: min(420px, calc(100% - 32px)); } }
@media (pointer: coarse) { .route-stop-editor input, .route-stop-editor select { font-size: 16px; } }
@media (pointer: coarse) { .route-stop-editor { --stop-field-line: 20px; } .route-stop-field { font-size: 16px; } }
.route-stop-results button { padding-block:6px; line-height:1.4; }
.route-stop-results .route-stop-nearest { color:#27586b; }
.route-stop-search { gap:4px; }
.route-stop-search [data-stop-search] { width:52px; flex:none; padding:0; }
.route-stop-search [data-stop-pick] { width:44px; flex:none; padding:0; display:grid; place-items:center; }
.route-stop-search [data-stop-pick]::before { inset:11px; border-radius:50%; }
.route-stop-search [data-stop-pick][aria-pressed="true"] { --stop-button-fill:#09bde9; }
.route-stop-search [data-stop-pick] svg { width:16px; height:16px; }
.route-stop-name-field { z-index:2; }
.route-stop-results { position:relative; box-sizing:border-box; width:calc(100% - 104px); margin-top:calc((var(--stop-field-line) + 6px - 44px)/2 + 2px); z-index:5; padding:4px; gap:2px; border:1px solid #fff; border-radius:0 0 12px 12px; background:linear-gradient(115deg,#e7faf7fa,#d2f1fdfa); box-shadow:0 6px 14px #315c7220; animation:route-stop-results-reveal 160ms ease-out; }
.route-stop-results:empty { padding:0; border:0; }
.route-stop-results button { width:100%; min-width:0; padding:6px; font-size:11px; }
.route-stop-results strong { overflow-wrap:anywhere; }
.route-stop-search-candidate { display:grid; place-items:center; }
.route-stop-search-candidate .route-stop-stamp { border-radius:50%; color:#16374e; background:#e5f7f2; }
.route-stop-search-popup button { display:grid; gap:4px; width:100%; min-height:44px; padding:6px; color:#16374e; text-align:left; border:0; background:#e5f7f2; border-radius:8px; }
.route-stop-search-popup small { font-size:11px; }
@keyframes route-stop-results-reveal { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce) { .route-stop-results { animation:none; } }