/* Shrink the visible circle by 20%, preserving the icon and touch-target sizes.
   One layout rule avoids font baselines and padding shifting the X off-centre. */
:is(.dialog-close,#cancel-pick,#route-preview-close,.leaflet-container a.leaflet-popup-close-button).close-control{--close-size:48px;display:grid;place-items:center;box-sizing:border-box;width:var(--close-size);height:var(--close-size);min-width:var(--close-size);min-height:var(--close-size);flex:0 0 var(--close-size);padding:0;margin:0;border:0;border-radius:50%;background:transparent;color:var(--ink);line-height:1;isolation:isolate;touch-action:manipulation}
.close-control:is(#route-preview-close,.leaflet-popup-close-button){--close-size:44px}
.close-control:not(.leaflet-popup-close-button){position:relative}
.close-control::before{content:"";position:absolute;inset:10%;border:1px solid var(--muted);border-radius:50%;background:var(--paper);pointer-events:none;z-index:-1}
.close-control:hover::before{background:var(--line)}
.close-control>svg{position:relative;display:block;grid-area:1/1;margin:0;pointer-events:none}
.leaflet-popup-close-button.close-control>svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
#route-preview-close.close-control{margin-left:auto}
.clear-place>svg{display:block;width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;pointer-events:none}