/* The record pages of a paper. 14 Nov 2026.

   The page file for templates/paper_integrity_page.html,
   paper_citation_record_page.html and pith_record_page.html. A record page is a
   head that says what the page is, then sections of rows. A row has two cells, as
   the plate has: on the left what was looked at (a check, a reference, a kind of
   addition), on the right what a program made of it. Under 960px the cells stack.
   Colours, sizes and widths come from tokens.css. */

.record-head {
  padding-block: var(--space-5) var(--space-6);
}

.record-head > * + * {
  margin-top: var(--space-3);
}

.record-head h1 a {
  color: var(--ink);
  text-decoration: none;
}

.record-head h1 a:hover {
  color: var(--hand);
  text-decoration: underline;
}

.record-head__authors {
  font-weight: 600;
}

.record-head__lede {
  max-width: 60ch;
  margin-top: var(--space-5);
  font: var(--type-lede);
}

.record-head__scope {
  max-width: var(--measure);
}

/* A link that stands by itself is a full touch target. */
.record-head__back a {
  display: inline-flex;
  align-items: center;
  min-height: var(--target);
}

.record-notice {
  padding-block: var(--space-4);
  border-top: var(--rule);
}

.record-section {
  padding-block: var(--space-6) var(--space-7);
  border-top: var(--rule);
}

.record-section > h2 {
  margin-bottom: var(--space-4);
}

.record-section > h2 + .apparatus {
  margin-bottom: var(--space-4);
}

/* Rows: one hair between them, two cells in each. */
.record-rows {
  border-bottom: var(--rule-hair);
}

.record-row {
  display: grid;
  gap: var(--space-3) var(--gutter);
  padding-block: var(--space-4);
  border-top: var(--rule-hair);
}

.record-row__what > * + *,
.record-row__result > * + * {
  margin-top: var(--space-2);
}

.record-row__name {
  font: var(--type-body);
  font-weight: 700;
}

.record-row__speaker {
  margin-top: var(--space-3);
  color: var(--apparatus);
}

/* The paper's own words: the phone's inset rule beside them, as on the plate. */
.record-row__passage {
  padding-inline-start: var(--space-3);
  border-inline-start: var(--rule-inset);
  overflow-wrap: anywhere;
}

.record-row__items > li + li {
  margin-top: var(--space-2);
}

.record-row__result .fold {
  margin-top: var(--space-3);
}

.record-row__result form {
  margin-top: var(--space-2);
}

/* Facts: a name, a value printed whole, a sentence that says what it is. */
.record-fact {
  padding-block: var(--space-4);
  border-top: var(--rule-hair);
}

.record-fact > dd > * + * {
  margin-top: var(--space-2);
}

.record-fact > dt {
  color: var(--apparatus);
  margin-bottom: var(--space-2);
}

/* A fingerprint is printed whole and breaks where the line ends. */
.record-hash {
  font: var(--type-line);
  color: var(--ink);
  overflow-wrap: anywhere;
}

.record-break {
  overflow-wrap: anywhere;
}

.record-command {
  max-width: 100%;
  margin-top: var(--space-2);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.record-section__note {
  margin-block: var(--space-3) var(--space-4);
}

/* What a visitor can ask for: text buttons in a row, each a full target. */
.record-asks {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-5);
  margin-top: var(--space-3);
}

.record-asks .btn {
  min-height: var(--target);
}

.record-limits {
  padding-inline-start: var(--space-5);
  list-style: disc;
}

.record-limits > li + li {
  margin-top: var(--space-2);
}

.record-links > li + li {
  margin-top: var(--space-3);
}

.record-links p {
  max-width: var(--measure);
}

.record-foot {
  padding-block: var(--space-5) 0;
  border-top: var(--rule);
}

.record-foot > * + * {
  margin-top: var(--space-3);
}

.record-foot a {
  display: inline-block;
  padding-block: var(--space-1);
}

@media (min-width: 960px) {
  .record-row {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  }

  .record-fact {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 9fr);
    gap: var(--gutter);
  }

  .record-fact > dt {
    margin-bottom: 0;
  }
}

/* The Pith number pages (templates/pith_number_page.html, pith_action_page.html,
   connected_record_page.html). 14 Nov 2026. */

.record-example > * + * {
  margin-top: var(--space-2);
}

.record-example {
  margin-bottom: var(--space-4);
}

/* The checks a stranger can run: a name, what it does, the command and its answer. */
.record-checks > li {
  padding-block: var(--space-4);
  border-top: var(--rule-hair);
}

.record-checks > li > * + * {
  margin-top: var(--space-2);
}

.record-table {
  min-width: 46rem;
  margin-top: var(--space-4);
  font: var(--type-small);
}

.record-table th[scope="row"] {
  font-weight: 600;
}

/* What a sent form answered: the answer, then the way back. */
.record-result > * + * {
  margin-top: var(--space-3);
}

/* A form that adds to a record: one column, a field under a field. */
.record-form {
  display: grid;
  gap: var(--space-5);
  margin-top: var(--space-4);
}

.record-form__send {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3) var(--space-5);
}

/* The integrity pages (templates/findings.html, flags.html, finding_detail_page.html,
   flag_detail_page.html, event_detail_page.html, integrity_hub_page.html,
   integrity_protocol_page.html, integrity_self_audit_page.html). 14 Nov 2026. */

/* A list's choices sit under its heading; a second row of tabs under the first. */
.record-section > .tabs + .tabs,
.record-choosing > .tabs + .tabs {
  margin-top: var(--space-2);
}

/* The choices of a page with two lists stand above both, under the head. */
.record-choosing {
  padding-block: var(--space-4) var(--space-5);
  border-top: var(--rule);
}

.record-choose {
  margin-top: var(--space-3);
}

/* Choices that are too many for a row of tabs: links that wrap, each a full target. */
.record-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--space-5);
}

.record-choices a,
.record-choices .ident {
  display: inline-flex;
  align-items: center;
  min-height: var(--target);
}

.record-choices a[aria-current] {
  color: var(--ink);
  font-weight: 700;
  text-decoration: none;
}

/* One paper's findings in a list of many: the paper, then its rows. */
.record-group {
  padding-top: var(--space-5);
}

.record-group + .record-group {
  margin-top: var(--space-5);
  border-top: var(--rule);
}

.record-group__head {
  margin-bottom: var(--space-3);
}

.record-group__title {
  font: var(--type-lede-paper);
}

.record-group__more,
.record-older {
  margin-top: var(--space-3);
}

/* A reader's own words, kept as they typed them. */
.record-dispute {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.record-links__name {
  font-weight: 600;
}

/* One check on the page that says how each works: a rule above it, and room
   below the header when a link jumps to it. */
.record-check {
  padding-block: var(--space-5);
  border-top: var(--rule-hair);
  scroll-margin-top: var(--space-5);
}

.record-check > * + * {
  margin-top: var(--space-3);
}

.record-steps {
  padding-inline-start: var(--space-5);
  list-style: decimal;
}

.record-steps > li + li {
  margin-top: var(--space-2);
}

/* The list of challenges (templates/challenges.html). 14 Nov 2026. The first
   label of a cell needs no room above it. */
.record-row__speaker--first {
  margin-top: 0;
}

/* The pages for programs (templates/api_docs_page.html, developers_page.html,
   dumps_page.html). 14 Nov 2026. A button that stands between the head and the
   first section keeps clear of the section's rule. */
.record-after-head {
  padding-bottom: var(--space-6);
}