@import url("../every-map/post.css");

/* The same reading column and margin notes as Every Map. */
:root { --blue: #233c66; --blue-l: #779bae; --sans: "Onest", Helvetica, sans-serif; }
.opening { height: auto; }
.opening .hold { position: static; min-height: 0; padding: 54px 0 0; }
.opening .head { max-width: 980px; margin: 0 auto; padding: 0 32px 24px; }
.opening .giant { max-width: 820px; }
.opening .dek { max-width: 670px; margin: 0 auto 22px; }
.opening .hero { max-width: 1000px; width: 100%; margin: 12px auto 0; }
.hero img, .fig img { display: block; width: 100%; height: auto; }
.opening + .page { margin-top: 76px; }
.toc { font-size: 14px; gap: 16px; }
.body h2 { font-family: var(--serif); }
.ref a, .note-back { text-decoration: none; color: var(--blue); }
.ref a { padding: 0 2px; }
.ref a:focus-visible, .note-back:focus-visible, .figure-link:focus-visible { outline: 2px solid var(--blue); outline-offset: 4px; }
.sn { scroll-margin-top: 120px; }
.sn:target { background: #f1f5f8; outline: 8px solid #f1f5f8; }
.figure-link { display: block; text-decoration: none; }
.article-source { font: 14px/1.6 var(--sans); color: var(--soft); margin-top: 64px; padding-top: 20px; border-top: 1px solid var(--rule); }
@media (max-width: 700px) {
  .opening .hold { padding-top: 34px; }
  .opening .head { padding: 0 20px 18px; }
  .opening .hero { margin-top: 12px; }
  .opening + .page { margin-top: 48px; }
}
@media print {
  .lab-header, .toc, .shared-footer { display: none; }
  .lab-article { padding-top: 0; }
  .page { display: block; margin: 36px auto; max-width: 760px; }
  .body.notes-js .sn { position: static; display: block; width: auto; margin: 12px 0 18px; }
  .fig { break-inside: avoid; }
}