/* ============================================================
   notes.jennifergallo.net — additions only.

   Chrome comes from the live jennifergallo.net (assets/chrome.css):
   accent strip, masthead, wordmark, nav, buttons, footer.
   Everything inside the article area comes from the live Sweet Tea
   & Class War stylesheet (assets/site.css), scoped to #stcw-newsroom.

   This file adds only what neither site has: the series furniture and
   the research components a two-readings study needs. Every rule is
   scoped to #stcw-newsroom so nothing here can reach the chrome.
   ============================================================ */

/* — series furniture — */
#stcw-newsroom .series-bar {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px;
  font-family: var(--font-ui); font-size: 11.5px; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted);
  border-left: 3px solid var(--stcw-teal); background: var(--surface-soft);
  padding: 10px 14px; margin: 0 0 4px;
}
#stcw-newsroom .series-bar a { color: var(--stcw-teal); text-decoration: none; }
#stcw-newsroom .series-bar a:hover { text-decoration: underline; }

/* A piece with too few sections to index has no side nav, so it must not sit in
   the two-column reader grid — it gets the full reading column instead. */
#stcw-newsroom .article-single { display: block; }

/* — research components: the case and the counter, side by side — */
#stcw-newsroom .article-body .story { margin-top: 30px; padding-top: 18px; border-top: 1px solid var(--stcw-line); }
#stcw-newsroom .article-body .src {
  font-family: var(--font-ui); font-size: 11.5px; letter-spacing: .03em;
  color: var(--text-muted); margin: 2px 0 12px;
}
#stcw-newsroom .article-body .nums {
  font-family: var(--font-ui); font-size: 12px; color: var(--stcw-teal); margin: 8px 0 14px;
}
#stcw-newsroom .article-body .pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 18px 0; }
@media (max-width: 760px) { #stcw-newsroom .article-body .pair { grid-template-columns: 1fr; } }
#stcw-newsroom .article-body .pair > div { padding: 14px 16px; border-left: 3px solid; }
#stcw-newsroom .article-body .pair .for { border-color: var(--stcw-teal); background: var(--surface-soft); }
#stcw-newsroom .article-body .pair .against { border-color: #c2410c; background: #fdf3ee; }
#stcw-newsroom .article-body .pair .eyebrow {
  font-family: var(--font-ui); font-size: 10.5px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; margin-bottom: 6px;
}
#stcw-newsroom .article-body .pair .for .eyebrow { color: var(--stcw-teal); }
#stcw-newsroom .article-body .pair .against .eyebrow { color: #9a3412; }
#stcw-newsroom .article-body .pair p { margin: 4px 0; font-size: 1rem; line-height: 1.6; }

/* a lexical hit: the same word on both sides */
#stcw-newsroom .article-body .hit { background: var(--surface-soft); border-bottom: 2px solid var(--stcw-teal); padding: 0 .12em; }

/* legend cards, callouts, quoted documents */
#stcw-newsroom .article-body .key { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 12px; margin: 18px 0; }
#stcw-newsroom .article-body .key div { border: 1px solid var(--stcw-line); padding: 14px 16px; font-size: .95rem; }
#stcw-newsroom .article-body .key b { display: block; font-weight: 800; margin-bottom: 4px; }
#stcw-newsroom .article-body .callout { border: 1px solid var(--stcw-line); padding: 16px 18px; margin: 20px 0; font-size: .95rem; }
#stcw-newsroom .article-body .callout.pending { border-color: #c2410c; border-style: dashed; }
#stcw-newsroom .article-body blockquote.letter {
  margin: 16px 0; padding: 14px 18px; border-left: 3px solid var(--stcw-teal);
  background: var(--surface-soft); font-style: italic;
}

/* evidence tables stay in the reading column and scroll sideways when wide */
#stcw-newsroom .article-body .tablewrap,
#stcw-newsroom .article-body .table-wrap {
  overflow-x: auto; margin: 20px 0; border: 1px solid var(--stcw-line);
}
#stcw-newsroom .article-body table { border-collapse: collapse; width: 100%; font-size: .85rem; line-height: 1.5; }
#stcw-newsroom .article-body .tablewrap table { min-width: 40rem; }
#stcw-newsroom .article-body th,
#stcw-newsroom .article-body td { text-align: left; vertical-align: top; padding: 9px 11px; border-bottom: 1px solid var(--stcw-line); }
#stcw-newsroom .article-body th {
  font-family: var(--font-ui); font-size: 10.5px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--text-muted); background: var(--surface-soft);
}
#stcw-newsroom .article-body td.n { font-family: var(--font-ui); font-variant-numeric: tabular-nums; white-space: nowrap; }
#stcw-newsroom .article-body .fit {
  font-family: var(--font-ui); font-size: 10.5px; letter-spacing: .05em; white-space: nowrap;
  padding: 2px 6px; border: 1px solid var(--stcw-line);
}
#stcw-newsroom .article-body .fit.T { border-color: var(--stcw-teal); color: var(--stcw-teal); }
#stcw-newsroom .article-body .fit.S { border-color: #c2410c; color: #9a3412; }
#stcw-newsroom .article-body .fit.N { color: var(--text-muted); }

#stcw-newsroom .article-body ul.gaps, #stcw-newsroom .article-body ol.arc { max-width: 68ch; }
#stcw-newsroom .article-body footer {
  margin-top: 40px; padding-top: 18px; border-top: 1px solid var(--stcw-line);
  font-size: .9rem; color: var(--text-muted);
}