/* =====================================================================
   Vendored sites in the shared header and footer (lib/subsite.js,
   src/blog/subsite.njk): their pages are <html class="subsite-page">, the
   site's own body is <div class="subsite">. One value tells it where the
   shared header (styles/home/home.css) ends:
   --frame-top    the header's height (.nav-wrap); what the site scrolls
                  under, and what its anchors and sticky parts stay below.
   This file is not scoped at build time.
   ===================================================================== */
.subsite-page {
  --frame-top: 88px;
}
@media (max-width: 767px) {
  .subsite-page {
    --frame-top: 76px;
  }
}

/* Dialogs of the shared pages lock the page behind them on <body> (styles/01-base.css,
   body:has(dialog[open])). A vendored site's own dialog (its enlarged figures) already locks
   the page on <html> (html.report-zoom-open); a second lock on <body> makes <body> a scroll
   container, and the sticky header leaves with the scroll position (-6048px).
   Only a dialog inside the box is left to its own site. The phone menu locks the page the
   same way as before (body.menu-open, styles/site-chrome.css). */
.subsite-page body:has(.subsite dialog[open]):not(.menu-open) {
  overflow: visible;
}