/* ============================================================================
   27-ch6-packs.css — the asset-pack table and its links, chapter 6 only
   ----------------------------------------------------------------------------
   Split out of the type pilot when that pilot rolled out to every chapter.
   Everything here is bound to chapter 6's subject matter — six downloadable
   packs — rather than to the type system, so it keeps its prefix.

   Note the card rules at the foot: they make .reel .card a column so the
   download button can sit at its foot. Chapter 4 also uses .reel, and has no
   such button, so that restructuring must not reach it.
   ========================================================================== */

/* ------------------------------------------------ 12. THE PACK TABLE + LINKS
   Every pack named in this chapter is a real download, and until now not one
   of them was reachable from the card that named it. The table is the index —
   six rows, smallest first, each one a link — and each card carries the same
   link at its foot so a reader deep in section 04 does not have to scroll back
   up to the index to act on what they just read. */

[data-chapter-body="6"] .packs{border-collapse:collapse;width:100%;
  font-family:var(--disp);font-size:.92rem}
[data-chapter-body="6"] .packs caption{caption-side:bottom;text-align:left;
  margin-top:.6rem}
[data-chapter-body="6"] .packs th,
[data-chapter-body="6"] .packs td{text-align:left;padding:.6rem .7rem;
  border-bottom:1px solid var(--rule);vertical-align:baseline}
[data-chapter-body="6"] .packs thead th{font-family:var(--mono);font-size:.62rem;
  font-weight:400;letter-spacing:.13em;text-transform:uppercase;color:var(--ink3);
  border-bottom:1px solid var(--rule2);white-space:nowrap}
[data-chapter-body="6"] .packs tbody th{font-weight:650;color:var(--ink);
  letter-spacing:-.012em;min-width:14rem}
[data-chapter-body="6"] .packs tbody tr:hover{background:var(--wash)}
[data-chapter-body="6"] .packwhy{display:block;font-weight:300;font-size:.8rem;
  line-height:1.4;color:var(--ink2);margin-top:.1rem}
[data-chapter-body="6"] .packsz{font-family:var(--mono);font-size:.8rem;
  color:var(--acctxt);white-space:nowrap;font-variant-numeric:tabular-nums}

/* Size and action shrink to their contents; the pack name absorbs the rest.
   Without this the two narrow columns split the table evenly with the names
   and the action ends up marooned in the middle of a wide empty cell. */
[data-chapter-body="6"] .packs th:nth-child(2),
[data-chapter-body="6"] .packs td:nth-child(2),
[data-chapter-body="6"] .packs th:nth-child(3),
[data-chapter-body="6"] .packs td:nth-child(3){width:1%;white-space:nowrap}
[data-chapter-body="6"] .packs td:nth-child(3){text-align:right}
[data-chapter-body="6"] .packs th:nth-child(3){text-align:right}

[data-chapter-body="6"] .packget,
[data-chapter-body="6"] .cardget{
  display:inline-flex;align-items:center;gap:.35rem;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.02em;
  color:var(--acctxt);text-decoration:none;white-space:nowrap;
  background:var(--wash);border:1px solid var(--acc);border-radius:3px;
  padding:.32rem .55rem}
[data-chapter-body="6"] .packget:hover,
[data-chapter-body="6"] .cardget:hover{background:var(--acc);color:var(--card)}
[data-chapter-body="6"] .packget:focus-visible,
[data-chapter-body="6"] .cardget:focus-visible{outline:2px solid var(--acc);
  outline-offset:2px}
/* Pushed to the foot of the card whatever the two descriptions above it run to,
   so a row of cards has its actions on one line. */
/* Making the card a column is what lets the button sit at its foot; it also
   makes every child stretch to full width, which turned the size chip into a
   band. Both the chip and the button opt out. */
[data-chapter-body="6"] .reel .card{display:flex;flex-direction:column;align-items:stretch}
[data-chapter-body="6"] .reel .card > s{align-self:flex-start}
[data-chapter-body="6"] .cardget{align-self:flex-start;margin-top:auto;
  padding-top:.34rem}
[data-chapter-body="6"] .reel .card > p:last-of-type{margin-bottom:.7rem}
