/* anagram-solver/page.css — route-local because sieve.css is shared: a rule
   one route uses is paid for by eight if it goes there (solvers.js's budget
   header). Everything reusable stays sieve.css's, the A3.11 reservation set
   included; this adds three readout boxes and the pairs table.

   ZERO CLS, NO NEW RESERVED REGION: the table sits inside .results, which
   sieve.css fixes at 18rem with internal scrolling, so no number of rows moves
   the page. Each box is sized to the widest string its value can hold (#r-rack
   is sieve.css's, sized to the input's maxlength, 15ch). Bounds, 2026-08-17.
   #r-one is one anagram key's group, and the largest in the shipped index is
   12 words (key `aeprs`, over all 152,215 keys) — 2 chars, 3ch. #r-pairs is
   the TRUE split total; widest measured 2,269 (rack `aeeilnoprsst`) over two
   searches that agreed — every 10-, 11- and 12-letter ENABLE1 word used as a
   rack (47,167 of them) and a 40-restart hill climb — so 5 chars, 6ch, the
   margin because this bound is empirical. #r-splits is
   proved instead: cap 12 letters, at most 2^n deals, unordered dedupe keeps at
   most half — 2,048, 5 chars, 5ch. */
#r-one, #r-pairs, #r-splits { display: inline-block; }
#r-one { min-width: 3ch; }
#r-pairs { min-width: 6ch; }
#r-splits { min-width: 5ch; }

/* THE DISTINCT RUNG. A pair is two words and the shape of the split, so it is
   a table; it is not inside .prose, so `.prose table` cannot reach it. Heads
   take .len-head's treatment, and the split column is arithmetic about the row
   rather than part of the answer. */
.pairs {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--mono);
  font-size: 0.92rem;
  margin: 0 0 0.6rem;
}

.pairs th {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-soft);
  font-weight: 600;
  text-align: left;
  padding: 0 0.5rem 0.3rem 0;
  border-bottom: 1px solid var(--line);
}

.pairs td {
  padding: 0.18rem 0.5rem 0.18rem 0;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}

.pairs tr:last-child td { border-bottom: 0; }

.pairs .split {
  color: var(--ink-soft);
  text-align: right;
  padding-right: 0;
}
