/* Native guide navigation stays in the reading flow. */
.guide-shortcuts{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0 0 6px;min-width:0}
.guide-shortcuts a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 12px;border:1px solid var(--line);font:500 14px/1.5 var(--sans);text-decoration:underline;text-underline-offset:3px;max-width:100%}
.guide-shortcuts a:focus-visible,.photo-guide-link:focus-visible,.photo-destination:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.photo-guide-link:focus-visible{outline-offset:-4px}
:is(.visit-panel,#ticket-options,.profile-location)[tabindex="-1"]{scroll-margin-top:7rem}
:is(.visit-panel,#ticket-options,.profile-location)[tabindex="-1"]:focus-visible{outline:3px solid var(--ink);outline-offset:4px}

/* Keep the help sentence and its existing disclosure button together. */
.filter-help-group{display:flex;align-items:center;gap:6px;max-width:100%;min-width:0;margin-top:8px}
.compact-day-row .filter-help-group #day-help{margin:0;flex:0 1 auto;min-width:0;overflow-wrap:anywhere}
.filter-help-group>.tip-button{flex:0 0 44px;min-width:44px;min-height:44px;margin:0}

/* Product scope precedes its seller; all detailed notes remain visible. */
.museum-booking-row .booking-product-type,.booking-comparison-row .booking-product-type{margin:0 0 4px;font:600 14px/1.6 var(--sans);color:var(--ink);overflow-wrap:anywhere}
.museum-booking-row>div,.booking-comparison-row>div{min-width:0}

/* Stretch within each rail/grid, with natural height for long translated copy. */
.carousel--recommendations>.carousel-track,.carousel--related>.carousel-track{align-items:stretch;flex-wrap:nowrap}
.carousel-track>.related-card{height:auto}
.art-card h3,.related-card h3,.journal-card h3{min-width:0;overflow-wrap:anywhere}
:is(.art-card,.related-card,.journal-card,.home-guide) :is(p,small){overflow-wrap:anywhere}
.art-grid,.journal-grid,.home-city-grid,.home-guide-grid{grid-auto-rows:1fr;align-items:stretch}
.journal-grid>.journal-card,.home-city-grid>.home-city-card{display:flex;flex-direction:column;min-width:0}
.journal-card>.external-link,.journal-card>.text-button{margin-top:auto}
.home-city-card>.home-photo-credit{margin-top:auto}
.home-guide-meta{flex-wrap:wrap;flex-shrink:0}
.home-guide-meta>span{min-width:0;max-width:100%;overflow-wrap:anywhere}
.home-guide-meta .city-badge{white-space:normal}
.home-city-section,.home-guides{container-type:inline-size}
@container(max-width:280px){.home-city-grid,.home-guide-grid{grid-template-columns:minmax(0,1fr)}}
.journal-card-photo .photo-destination{display:block;aspect-ratio:3/2}
.journal-card-photo .photo-destination>picture,.journal-card-photo .photo-destination img{display:block;width:100%;height:100%;object-fit:cover}

/* Screenshot target: this New York recommendation rail can span the viewport. */
body[data-city="new-york"] main>.carousel--recommendations{width:100%;max-width:none;--carousel-gutter:max(64px,calc((100% - 1312px)/2))}
@media(max-width:1100px){body[data-city="new-york"] main>.carousel--recommendations{--carousel-gutter:38px}}
@media(max-width:800px){body[data-city="new-york"] main>.carousel--recommendations{--carousel-gutter:25px}}

/* The same credit links travel with the map when it enters full screen. */
.map-action-row{min-width:0;flex:none}
.map-action-row>.local-map-attribution{overflow-wrap:anywhere}
@media(min-width:901px){
 .map-action-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;margin-top:12px}
 .map-action-row>.local-map-controls{margin:0;flex:0 1 auto}
 .map-action-row>.local-map-attribution{margin:0;flex:0 1 auto}
}

/* Filter controls wrap as groups before they crowd their labels at zoom. */
.explore-toolbar{flex-wrap:wrap}
.explore-toolbar .filters{flex:1 1 14rem;min-width:min(100%,14rem);max-width:100%}
.explore-toolbar .filters>.filter{max-width:100%;min-height:48px;min-width:44px;white-space:normal;flex-wrap:wrap;overflow-wrap:anywhere}
.explore-toolbar .view-toggle{max-width:100%;margin-inline-start:auto;flex-wrap:wrap}
.explore-toolbar .view-toggle button{min-height:48px;min-width:44px}
.compact-visit-controls{display:flex;flex-wrap:wrap}
.day-row .compact-visit-controls>label{flex:1 1 10rem;min-width:min(100%,10rem);max-width:100%}
.day-row .day-select select{padding-inline:8px 26px}
.day-row .compact-visit-controls input[type="date"]{padding-inline:4px}
.compact-visit-controls input[type="date"]::-webkit-datetime-edit{padding:0}
.compact-visit-controls input[type="date"]::-webkit-calendar-picker-indicator{margin-inline:0;padding:0}
.day-control .day-select>.ui-icon{right:8px;width:16px;height:16px}
.explore :is(.filter,[data-view],#visit-day,#visit-date):focus-visible{outline:2px solid var(--ink);outline-offset:3px}