/* /more. 14 Nov 2026.

   The page file for templates/more.html: a list of pages, each a name and one
   sentence. Everything else on the page is a shared part (the page head, the
   fold, the scrolling table). Colours, sizes and widths come from tokens.css. */

/* A name and its sentence. On a phone the sentence sits under the name; from
   720px the names keep one column so the sentences line up beside them. */
.more-list {
  max-width: var(--reading);
}

.more-list__row {
  padding-block: var(--space-3);
  border-top: var(--rule-hair);
}

.more-list__row:last-child {
  border-bottom: var(--rule-hair);
}

.more-list dt a {
  display: inline-flex;
  align-items: center;
  min-height: var(--target-min);
  font-weight: 600;
}

.more-list dd {
  color: var(--ink-2);
}

@media (min-width: 720px) {
  .more-list__row {
    display: grid;
    grid-template-columns: 15rem minmax(0, 1fr);
    column-gap: var(--gutter);
  }
}

/* The public reviews: each title in the authors' face, its date after it. */
.more-reviews > li {
  padding-block: var(--space-2);
  border-top: var(--rule-hair);
}

.more-reviews a {
  color: var(--ink);
}

/* A list or a fold that follows its sentence keeps a step of air from it. */
.prose + .more-list,
.prose + .fold {
  margin-top: var(--space-4);
}