/* The supplied monster sits beside the existing wordmark at every header size. */
a.brand-lockup { display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; }
a.brand-lockup > img.brand-mark { display: block; width: 40px; height: 40px; flex: 0 0 40px; object-fit: contain; image-rendering: pixelated; }
@media (max-width: 759px) {
  a.brand-lockup { gap: 6px; }
  a.brand-lockup > img.brand-mark { width: 30px; height: 30px; flex-basis: 30px; }
}
@media (max-width: 359px) {
  .site-header:has(.brand-lockup) { gap: 6px; }
  a.brand-lockup { gap: 4px; }
  a.brand-lockup > img.brand-mark { width: 26px; height: 26px; flex-basis: 26px; }
}