/* Shared masthead for the homepage and release articles. Keep the wordmark,
   navigation baseline and gutters identical, independent of article width. */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap");

body :is(.site-header, .home-nav).aligned-header {
  --header-gutter: max(24px, calc((100% - 1120px) / 2));
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 84px;
  padding: 20px var(--header-gutter);
}
body .home-nav.aligned-header { position: absolute; z-index: 20; top: 0; inset-inline: 0; }
body .home-nav.aligned-header a { color: #3b3d37; text-decoration: none; }
body .home-nav.aligned-header a:hover { text-decoration: underline; }
body .home-nav.aligned-header a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
body .aligned-header :is(.site-brand, .home-brand) { display: inline-flex; align-items: center; flex: 0 0 auto; min-height: 44px; }
body .aligned-header :is(.site-logo, .site-brand img, .home-brand img) { display: block; width: 116px; height: auto; max-height: none; }
body .aligned-header :is(.site-nav, .home-nav-links) {
  position: relative;
  display: flex;
  align-items: center;
  gap: 28px;
  margin: 0;
  font: 400 14px/1.4 "Inter", system-ui, sans-serif;
}
body .aligned-header :is(.site-nav, .home-nav-links) a { display: inline-flex; align-items: center; min-height: 44px; white-space: nowrap; }
/* Reserve the same right edge for Join Us on every page. */
body .aligned-header .site-nav .theme-toggle { position: absolute; inset: 50% auto auto calc(100% + 4px); width: 20px; margin: 0; transform: translateY(-50%); }

@media screen and (max-width: 700px) {
  body :is(.site-header, .home-nav).aligned-header { --header-gutter: 24px; min-height: 76px; gap: 16px; padding-block: 16px; }
  body .aligned-header :is(.site-logo, .site-brand img, .home-brand img) { width: 92px; }
  body .aligned-header :is(.site-nav, .home-nav-links) { gap: 18px; font-size: 12px; }
  body .aligned-header :is(.site-nav, .home-nav-links) { min-width: 0; flex-wrap: wrap; justify-content: flex-end; column-gap: 14px; row-gap: 0; }
  body .aligned-header :is(.site-nav, .home-nav-links) a { min-height: 22px; padding-block: 0; }
  body .aligned-header .site-nav { padding-right: 0; }
  body .aligned-header .site-nav .theme-toggle { inset-inline-start: calc(100% + 1px); width: 20px; }
  body .site-header.aligned-header[data-folded="true"] { min-height: 116px; padding-bottom: 56px; }
  body .site-header.aligned-header[data-folded="true"] > :is(.site-brand, .site-nav) { transform: none; }
}

@media print { body :is(.site-header, .home-nav).aligned-header { min-height: 0; padding: 12px 0; } }

/* Older articles have uppercase, tracked links; the masthead uses one type style. */
body .aligned-header :is(.site-nav, .home-nav-links) a { font: inherit; letter-spacing: normal; text-transform: none; color: var(--ink, #3b3d37); }
body .aligned-header .site-logo { opacity: 1; }
body .aligned-header .theme-toggle { box-sizing: border-box; height: 32px; padding: 0; border: 0; background: transparent; color: var(--ink); border-radius: 50%; font-size: 0; cursor: pointer; }
/* Boba's original quiet circle control: outline in light mode, half filled in dark. */
body .aligned-header .theme-toggle::before { content: ""; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 10px; height: 10px; box-sizing: border-box; border: 1.5px solid currentColor; border-radius: 50%; background: transparent; opacity: .6; -webkit-mask: none; mask: none; }
body .aligned-header .theme-toggle[aria-pressed="true"]::before { background: linear-gradient(90deg, currentColor 50%, transparent 50%); }
body .aligned-header .theme-toggle:hover::before { opacity: 1; }
body .aligned-header .theme-toggle:focus-visible { outline: 2px solid var(--accent, currentColor); outline-offset: 3px; }
body .aligned-header .theme-toggle[hidden] { display: none; }
@media screen { html[data-site-theme="dark"] .aligned-header .site-logo { filter: invert(1) grayscale(1); } }
body :is(.site-header, .home-nav).aligned-header { border-bottom: 0; }