/* Shared site header; only the Guide listing opts out of sticking. */
:root{--site-header-height:90px;scroll-padding-top:calc(var(--site-header-height) + 16px)}
.skip:focus{z-index:601}
header.nav{position:sticky;top:0;z-index:600;background:var(--paper);border-bottom:var(--rule);box-shadow:none}
header.nav[data-header-static]{position:relative;top:auto;z-index:50}
html:has(header[data-header-static]){scroll-padding-top:0}
@media(min-width:721px){header.nav .navlinks{gap:var(--space-8)}}
@media(max-width:720px){
 /* Keep all mobile routes on one behavior; only the Guide listing opts out. */
 header.nav{position:sticky;top:0;z-index:600;overflow:visible}
 header.nav[data-header-static]{position:relative;top:auto;z-index:50}
 header.nav .navlinks{top:100%;z-index:1;max-height:calc(100svh - var(--site-header-height) - 16px);overflow-y:auto;overscroll-behavior-y:contain}
 .skip:focus{z-index:601}
}
@media(min-width:901px){
 .restaurant-detail .detail-rail-inner,.restaurant-detail .detail-rail-inner.can-stick{top:calc(var(--site-header-height) + 24px);max-height:calc(100svh - var(--site-header-height) - 48px);overflow-y:auto;scrollbar-width:thin}
 /* Put the scroll edge in the existing gutter, clear of text and the map. */
 .restaurant-detail .detail-rail-inner{margin-right:-28px;padding-right:28px;scrollbar-gutter:stable}
}
@media(min-width:901px) and (max-width:1100px){
 .restaurant-detail .detail-rail-inner{margin-right:-20px;padding-right:20px}
}
@media(min-width:961px) and (min-height:850px){
 .music-page .music-player-inner{top:calc(var(--site-header-height) + 24px);max-height:calc(100svh - var(--site-header-height) - 48px);overflow-y:auto;scrollbar-width:thin}
}
@media(max-width:720px){.blog-feature-top h2{top:calc(var(--site-header-height) + 12px)}}

/* Reuse the hero typeface for only the italic wordmark suffix. */
header.nav .brand-wordmark>span{font-family:var(--font-display);font-style:italic;font-size:26.64px;line-height:36.6px}