/* Explicit icon geometry stays legible when generic button text rules apply.
   Starting-point/destination clear buttons deliberately keep their own styles. */
.control-icon{display:block;width:28px;height:28px;flex:none;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.dialog-close,.dialog-card .dialog-close,.welcome-dialog .dialog-close,#cancel-pick{display:grid;place-items:center;width:48px;height:48px;min-width:48px;min-height:48px;flex:0 0 48px;padding:0;border:1px solid var(--muted);border-radius:50%;background:var(--paper);color:var(--ink);touch-action:manipulation}
.dialog-close:hover,#cancel-pick:hover{background:var(--line)}
.dialog-close:focus-visible,#cancel-pick:focus-visible,.about summary:focus-visible{outline:3px solid var(--green);outline-offset:3px}
.about summary{align-items:center;gap:16px;min-height:48px;list-style:none;font-weight:650}
.about summary::-webkit-details-marker{display:none}
.disclosure-icon{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border:1px solid var(--muted);border-radius:50%;color:var(--ink);background:var(--paper)}
.disclosure-icon .control-icon{width:20px;height:20px;stroke-width:2.25}
.about[open] .disclosure-vertical{display:none}
.about summary:hover .disclosure-icon{background:var(--line)}
.leaflet-container a.leaflet-popup-close-button{top:6px;right:6px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--muted);border-radius:50%;font:600 32px/1 Arial,sans-serif;color:var(--ink);background:var(--paper)}
.leaflet-container a.leaflet-popup-close-button:hover{color:var(--ink);background:var(--line)}
.leaflet-container a.leaflet-popup-close-button:focus-visible{outline:3px solid var(--green);outline-offset:2px}
.leaflet-popup-content{padding-right:30px;min-height:44px}
.search-results .search-correction{margin:0;padding:12px;border-bottom:1px solid var(--line);font-size:1rem;font-weight:650;line-height:1.45;color:var(--ink);background:var(--paper)}
.search-results button>span{display:block;overflow-wrap:anywhere}
.search-results .suggested-name{font-weight:650}
.search-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.place-choice-actions{display:grid;gap:2px}
.place-choice-actions:not(:last-child){padding-bottom:4px;margin-bottom:4px;border-bottom:1px solid var(--line)}
.search-results .place-choice-action{display:flex;align-items:center;gap:10px;min-height:48px;padding:10px 12px;font-size:1rem;font-weight:550;line-height:1.4;touch-action:manipulation}
.place-choice-action svg{width:23px;height:23px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;color:var(--green)}
.search-results>p{font-size:.875rem;line-height:1.4;margin:4px 0;padding:6px 12px}
/* Native select arrows can stay black on phones; this icon shares the label colour. */
.language-control{position:relative;display:inline-flex;align-items:center;color:#fff}
.language-control #language{appearance:none;-webkit-appearance:none;color:inherit;padding-left:10px;padding-right:28px}
.language-control>svg{position:absolute;top:50%;right:7px;transform:translateY(-50%);width:17px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.panel-footer #back-to-top{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--green);touch-action:manipulation}
.panel-footer #back-to-top svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.panel-footer #back-to-top:hover{background:var(--line)}
.panel-footer #back-to-top:focus-visible{outline:3px solid var(--green);outline-offset:2px}

/* Equal endpoint rows share one divider and one icon axis in every state. */
.places{--place-inset:12px;--place-label-space:1.1375rem;--place-control-height:max(44px,2.75rem);--place-surface:#fcfdfb;display:grid;grid-template-rows:repeat(2,1fr);padding-block:var(--place-label-space);isolation:isolate;background:var(--place-surface)}
[data-theme=dark] .places{--place-surface:var(--surface)}
.places::before{content:"";position:absolute;left:calc(var(--place-inset) + 13px);top:calc(25% - 8px + var(--place-label-space)/2);bottom:calc(25% - 8px + var(--place-label-space)/2);border-left:2px dotted var(--muted);transform:translateX(-50%);pointer-events:none;z-index:0}
.places::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;transform:translateY(-50%);background:var(--line);pointer-events:none;z-index:0}
.places>.place-field{position:relative;display:grid;grid-template-columns:26px minmax(0,1fr);align-items:center;gap:10px;min-height:0;border:0}
.places>.place-field:first-child{grid-row:1;padding:6px var(--place-inset) 22px}
.places>.place-field:last-child{grid-row:2;padding:22px var(--place-inset) 6px}
.places .place-input label{position:absolute;left:0;top:calc(-1 * var(--place-label-space));font-size:.875rem;line-height:var(--place-label-space);margin:0;pointer-events:auto}
.places .input-line{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;gap:0;min-height:var(--place-control-height)}
.places .input-line input{width:100%;height:var(--place-control-height);min-height:44px;padding:0;font-size:1rem;line-height:1.375}
.places .input-line button{display:grid;place-items:center;width:44px;min-width:44px;height:var(--place-control-height);min-height:44px;margin:0;padding:0;line-height:1}
.place-symbol{position:relative;display:grid;place-items:center;width:26px;height:26px;padding:0;background:var(--place-surface);color:var(--ink);z-index:1}
.place-symbol svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.end-symbol{color:var(--green)}
.places .endpoint-action{position:absolute;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:44px;height:44px;min-height:44px;min-width:44px;margin:0;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--ink);box-shadow:none;z-index:2;touch-action:manipulation}
.places .new-walk{left:calc(var(--place-inset) + 13px - 22px);right:auto}
.places .swap{left:auto;right:var(--place-inset)}
.endpoint-action svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.places .endpoint-action:hover{background:var(--line)}
.places .endpoint-action:focus-visible{outline:3px solid var(--green);outline-offset:2px}
.large-text .places{--place-label-space:1.4rem}
.large-text .places .place-input label{font-size:1rem}
.large-text .places .input-line input{font-size:1.25rem}
.map-point-menu{display:grid;gap:6px;min-width:190px}
.leaflet-popup-content .map-point-menu button{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;margin:0;padding:9px 10px;text-align:left;font-size:14px;line-height:1.4}
.map-point-menu button svg{flex:none;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
