/* /supreme-court/: rulings as cards under their topic, the bench, and the
   vote table. Tokens only (theme.css), so the ink scale and paper follow
   dark mode on their own. Case names are italic, as in a citation, and the
   Court's own words are set in a book serif, as its opinions are. Neither
   side of a vote is coloured as a party: majority and dissent are told
   apart by their label first and a neutral fill second. */

.court-intro { max-width: 72ch; color: var(--ink-600); margin: 0 0 var(--sp-4); }
.court-updating { max-width: 72ch; margin: 0 0 var(--sp-5); }
.court-page cite { font-style: italic; }

/* ------------------------------------------------------------ jump list */
.court-jump { margin: 0 0 var(--sp-6); }
.court-jump ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.court-jump a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: var(--sp-2) var(--sp-4);
  border: 1px solid var(--ink-300);
  border-radius: var(--r-full);
  background: var(--paper);
  color: var(--ink-700);
  font-size: var(--fs-sm);
  font-weight: 600;
  text-decoration: none;
}
.court-jump a:hover { background: var(--ink-50); border-color: var(--ink-400); }
.court-jump a:focus-visible { outline: 3px solid var(--civic-blue); outline-offset: 2px; }

/* --------------------------------------------------------------- topics */
.court-topic,
.court-bench,
.court-votes,
.court-method {
  margin: 0 0 var(--sp-8);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--ink-200);
  scroll-margin-top: calc(var(--nav-h) + var(--sp-3));
}
.court-topic h2,
.court-bench h2,
.court-votes h2,
.court-method h2 { font-size: var(--fs-lg); margin: 0 0 var(--sp-2); text-wrap: balance; }
.court-topic-summary { max-width: 72ch; color: var(--ink-600); margin: 0 0 var(--sp-4); }

.court-cases {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 26rem), 1fr));
  gap: var(--sp-4);
  align-items: start;
}

/* ----------------------------------------------------------------- card */
.court-case {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  padding: var(--sp-4) var(--sp-5);
  background: var(--paper);
  color: var(--ink-800);
  border: 1px solid var(--ink-200);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-sm);
  scroll-margin-top: calc(var(--nav-h) + var(--sp-3));
  min-width: 0;
}
.court-case:target { border-color: var(--civic-blue); box-shadow: var(--shadow-glow-blue); }
.court-case-head { display: flex; flex-direction: column; gap: var(--sp-1); }
.court-case-kind {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-1) var(--sp-2);
  margin: 0;
  font-size: var(--fs-sm);
  color: var(--ink-600);
}
.court-kind {
  display: inline-block;
  padding: 1px var(--sp-2);
  border: 1px solid var(--ink-300);
  border-radius: var(--r-full);
  color: var(--ink-700);
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.court-kind-order { border-style: dashed; }
.court-kind-pending { border-color: var(--civic-blue); color: var(--ink-900); }
.court-vote { font-weight: 700; color: var(--ink-900); font-variant-numeric: tabular-nums; }
.court-case-title { margin: 0; font-size: var(--fs-md); line-height: 1.3; color: var(--ink-900); text-wrap: balance; }
.court-case-meta { margin: 0; font-size: var(--fs-sm); color: var(--ink-600); font-variant-numeric: tabular-nums; }

.court-case-body { margin: 0; }
.court-case-body dt,
.court-label {
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink-600);
}
.court-case-body dd { margin: 2px 0 var(--sp-3); line-height: 1.55; }
.court-case-body dd:last-child { margin-bottom: 0; }

.court-quote { margin: 0; padding: var(--sp-1) 0 var(--sp-1) var(--sp-3); border-left: 3px solid var(--ink-300); }
.court-quote blockquote { margin: 0; }
.court-quote p {
  margin: 0;
  font-family: "Century Schoolbook", "New Century Schoolbook", "TeX Gyre Schola", Georgia, "Times New Roman", serif;
  font-size: var(--fs-base);
  line-height: 1.55;
  color: var(--ink-900);
}
.court-quote figcaption { margin-top: var(--sp-1); font-size: var(--fs-xs); }

.court-sides {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: var(--sp-1) var(--sp-3);
  margin: 0;
  font-size: var(--fs-sm);
}
.court-sides dt { font-weight: 600; color: var(--ink-700); }
.court-sides dd { margin: 0; }
.court-note { color: var(--ink-600); }
.court-order-note { margin: 0; font-size: var(--fs-xs); color: var(--ink-600); }
.court-states { margin: 0; font-size: var(--fs-sm); }
.court-states .court-label { margin-right: var(--sp-1); }

.court-links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-1) var(--sp-4); font-size: var(--fs-sm); }
.court-links a,
.court-justice-link a { font-weight: 600; }

.court-news { font-size: var(--fs-sm); }
.court-news summary { cursor: pointer; color: var(--ink-700); font-weight: 600; min-height: 32px; display: flex; align-items: center; gap: var(--sp-1); }
.court-news summary:focus-visible { outline: 3px solid var(--civic-blue); outline-offset: 2px; }
.court-news-count { color: var(--ink-600); font-weight: 400; }
.court-news ul { margin: var(--sp-2) 0 0; padding-left: var(--sp-4); display: flex; flex-direction: column; gap: var(--sp-2); }
.court-news-meta { color: var(--ink-600); }

/* ---------------------------------------------------------------- bench */
/* Nine seats: three rows of three wherever there is room, so no justice
   sits alone on a last row. */
.court-justices {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--sp-3);
}
@media (min-width: 600px) {
  .court-justices { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.court-justice {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  padding: var(--sp-4);
  background: var(--paper);
  border: 1px solid var(--ink-200);
  border-radius: var(--r-lg);
}
.court-justice-name { margin: 0; font-size: var(--fs-md); line-height: 1.3; color: var(--ink-900); }
.court-justice-role { margin: 0; font-size: var(--fs-sm); color: var(--ink-600); }
.court-justice-facts { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; font-size: var(--fs-sm); }
.court-justice-facts dt { font-size: var(--fs-xs); font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-600); margin-top: var(--sp-1); }
.court-justice-facts dd { margin: 0; font-variant-numeric: tabular-nums; }
.court-justice-link { margin: auto 0 0; font-size: var(--fs-sm); }

/* ----------------------------------------------------------- vote table */
.court-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--ink-200);
  border-radius: var(--r-lg);
  background: var(--paper);
}
.court-table-wrap:focus-visible { outline: 3px solid var(--civic-blue); outline-offset: 2px; }
.court-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.court-table th,
.court-table td { padding: var(--sp-2) var(--sp-3); border-bottom: 1px solid var(--ink-200); text-align: left; vertical-align: top; }
.court-table thead th { font-weight: 600; color: var(--ink-900); white-space: nowrap; }
.court-table thead th a { color: inherit; }
.court-th-meta { display: block; font-weight: 400; font-size: var(--fs-xs); color: var(--ink-600); font-variant-numeric: tabular-nums; }
.court-table tbody th { font-weight: 600; color: var(--ink-900); white-space: nowrap; }
.court-table tbody tr:last-child th,
.court-table tbody tr:last-child td { border-bottom: 0; }
.court-cell { white-space: nowrap; }
.court-cell-majority { background: var(--ink-100); color: var(--ink-900); }
.court-cell-dissent { color: var(--ink-900); font-weight: 600; }
.court-cell-recused,
.court-cell-absent { color: var(--ink-500); font-style: italic; }

/* --------------------------------------------------------------- method */
.court-method ul { max-width: 72ch; padding-left: var(--sp-4); display: flex; flex-direction: column; gap: var(--sp-2); }
.court-method p { max-width: 72ch; }
.court-nav { margin-top: var(--sp-4); }
.court-disclaimer { margin-top: var(--sp-3); }

@media (max-width: 640px) {
  .court-case { padding: var(--sp-4); }
  .court-sides { grid-template-columns: minmax(0, 1fr); }
}
/* On a phone each justice's facts sit label beside value: nine cards stay
   short enough to scroll past. */
@media (max-width: 599px) {
  .court-justice { padding: var(--sp-3) var(--sp-4); }
  .court-justice-facts { grid-template-columns: max-content minmax(0, 1fr); gap: var(--sp-1) var(--sp-3); align-items: baseline; }
  .court-justice-facts dt { margin-top: 0; }
}