/* Notes from the Field — editorial article layout (adopted 2026-08-31, NO. 10 register) */
.article-masthead { max-width: 1100px; margin: 0 auto; padding: 44px 24px 0; }
.am-row { display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--font-mono); font-size: 13px; font-weight: 500; letter-spacing: .2em;
  color: var(--muted); padding-bottom: 12px; }
.am-row .am-no { font-weight: 400; }
.am-dot { display: inline-block; width: 11px; height: 11px; border-radius: var(--r-pill);
  background: var(--lemon); margin-right: 11px; }
.am-rule-thick { border-top: 4px solid var(--ink); }
.am-rule-hair { border-top: 1px solid var(--ink); margin-top: 3px; }
.article-back { display: block; max-width: 1100px; margin: 0 auto; padding: 12px 24px 0;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .02em; color: var(--muted); text-decoration: none; }
.article-back:hover { color: var(--ink); }

.article-head { max-width: 720px; margin: 0 auto; padding: 64px 24px 0; text-align: center; }
.article-kicker { font-family: var(--font-mono); font-size: 13px; font-weight: 500;
  letter-spacing: .24em; text-transform: uppercase; color: var(--gold); }
.article-title { font-family: var(--font-serif);
  font-weight: 400; font-size: 44px; line-height: 1.15; letter-spacing: -0.01em; margin-top: 22px; }
.article-dek { font-family: var(--font-serif);
  font-style: italic; font-size: 21px; line-height: 1.5; color: var(--muted); margin-top: 22px; }
.article-byline { margin-top: 30px; padding: 18px 0; border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline); font-family: var(--font-mono); font-size: 13px;
  letter-spacing: .02em; color: var(--muted);
  display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }
.article-byline strong { color: var(--ink); font-weight: 500; }

.article-body { max-width: 620px; margin: 0 auto; padding: 48px 24px 24px;
  font-family: var(--font-serif); color: var(--ink-print);
  font-size: 19px; line-height: 1.68; letter-spacing: 0; }
.article-body p { margin: 0 0 26px; }
.article-body h2 { font-family: var(--font-sans); font-size: 21px; font-weight: 600;
  line-height: 1.3; letter-spacing: -0.2px; margin: 40px 0 18px; }
.article-body p.first::first-letter { font-family: var(--font-sans); font-weight: 700;
  font-size: 64px; line-height: .85; float: left; padding: 8px 12px 0 0; color: var(--ink); }
.article-body a { color: var(--ink); text-decoration-color: var(--lemon); text-decoration-thickness: 2px; }

.article-sources { max-width: 620px; margin: 0 auto; padding: 24px 24px 40px;
  font-family: var(--font-mono); font-size: 13px; line-height: 1.7; color: var(--muted);
  border-top: 1px solid var(--hairline); overflow-wrap: anywhere; }
.article-sources p { margin: 0 0 10px; }
.article-sources a { color: var(--ink); }

.article-nav { max-width: 620px; margin: 0 auto; padding: 24px 24px 32px;
  display: flex; justify-content: space-between; gap: 24px;
  font-family: var(--font-mono); font-size: 13px; line-height: 1.5; letter-spacing: .02em; }
.article-nav a { flex: 1 1 0; color: var(--ink); text-decoration: none; }
.article-nav a:hover { text-decoration: underline; text-decoration-color: var(--lemon); text-decoration-thickness: 2px; }
.article-nav a[rel="next"] { text-align: right; }
.article-nav small { display: block; font-size: 12px; color: var(--muted); }
.article-signoff { max-width: 620px; margin: 0 auto; padding: 0 24px 72px;
  font-family: var(--font-mono); font-size: 13px; letter-spacing: .02em; color: var(--muted); }
.article-signoff a { color: var(--gold); text-decoration: none; }

@media (max-width: 640px) {
  .article-title { font-size: 31px; }
  .article-body { font-size: 18px; }
}

/* Note film: between the head and the body, wider than the 620 prose column (mirrors .lab-film) */
.note-film { max-width: 980px; margin: 48px auto 0; padding: 0 24px; }
.note-film video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: var(--charcoal);
  border: 1px solid var(--hairline); border-radius: var(--r-md); }
.note-film figcaption { margin-top: var(--sm); font-family: var(--font-mono); font-size: 13px; line-height: 1.5;
  letter-spacing: .02em; color: var(--muted); text-wrap: pretty; }

/* Note figure: an image inside the prose column (NO. 20's custody sheets) */
.note-fig { margin: 8px 0 34px; }
.note-fig img { display: block; width: 100%; height: auto; border: 1px solid var(--hairline); border-radius: var(--r-md); }
.note-fig figcaption { margin-top: var(--sm); font-family: var(--font-mono); font-size: 13px; line-height: 1.5;
  letter-spacing: .02em; color: var(--muted); }

@media print {
  @page { margin: 18mm; }
  .site-nav, .footer, .btn, .skip-link, .am-dot, .article-back, .article-nav { display: none !important; }
  body { color: #000; background: #fff; font-size: 11pt; }
  .article-body { color: #000; }
  .article-body a[href^="http"]::after, .article-sources a[href^="http"]::after { content: " (" attr(href) ")"; font-family: var(--font-mono); font-size: 9pt; }
  h1, h2 { break-after: avoid; }
}
