
/* ==========================================================================
   4. THE SHEET — the shared component, driven exactly as Mines drives it:
   <dialog> WITHOUT showModal(), [open] plus .is-on, and .cpscrim inside the
   game's own frame. A modal dialog would claim the iframe's top layer and
   trap focus in a frame the player can tab out of anyway.
   ========================================================================== */
/* repeat(3), not auto-fit: six figures against a 140px minimum resolved to
   four on the first row and two orphans on the second, which is a ragged shape
   for a fixed set of six. */
.led{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 14px}
@media (max-width:520px){ .led{grid-template-columns:repeat(2,minmax(0,1fr))} }
/* `.led > div`, NOT `.led div`. A descendant selector matched the label and the
   value inside each tile as well as the tile, so every figure came out as two
   bordered boxes nested inside a third. Visible instantly, invisible to every
   assertion in the suite. */
.led > div{background:#0A0C11;border:1px solid var(--cps-hair,#242731);border-radius:10px;padding:9px 11px}
.led .k{font:600 9.5px/1 var(--ui);letter-spacing:.13em;text-transform:uppercase;color:#666C7E}
.led .v{margin-top:5px;font:700 16px/1 var(--fig);font-variant-numeric:tabular-nums;color:var(--ink)}
.led .v[data-s="up"]{color:var(--win)}
.led .v[data-s="dn"]{color:var(--loss)}
.rowlist{display:grid;gap:5px}
.rl{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:12px;align-items:center;
  padding:8px 11px;background:#0A0C11;border:1px solid var(--cps-hair,#242731);border-radius:9px;
  font:600 12px/1 var(--fig);font-variant-numeric:tabular-nums}
/* fixed width, or every row jogs sideways as the nonce crosses 10 and 100 */
.rl .n{color:#5C6274;font-size:11px;min-width:34px}
.rl .b{color:var(--cps-ink-dim,#767C90);font-family:var(--ui);font-size:11px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rl .r{color:var(--ink)}
/* TASK 7 fix-round: was --acc, same defect as 40-track.css's #chipv and
   30-history.css's .hp — found auditing for other instances of it once the
   coordinator's ruling named the pattern. This row's own .p two lines down
   was already --win; the roll figure beside it read red on the same won
   row, which is the identical "two verdicts at once" bug relocated into
   the fairness sheet's round list. */
.rl[data-w="1"] .r{color:var(--win)}
.rl[data-w="0"] .r{color:var(--loss)}
.rl .p{color:#8A91A4;min-width:64px;text-align:right}
.rl[data-w="1"] .p{color:var(--win)}
/* wf-anim §2.6: the NEWEST pill arrives with v1's hin pop. histHTML puts
   the class on the first (newest) pill only, so a reopened door animates
   one entrance, never the whole record at once. */
.rl.hinew{animation:hin .3s cubic-bezier(.2,1.4,.4,1)}
@keyframes hin{from{transform:scale(.3);opacity:0}}

/* the verifier, behind a disclosure closed by default — COMPONENTS.md is
   explicit that ninety-nine players out of a hundred open this panel to read
   or replace a seed, and the hundredth is the one who wants the arithmetic */
.pfMore{margin-top:14px;border-top:1px solid var(--cps-hair,#242731);padding-top:12px}
.pfMore summary{cursor:pointer;font:600 12px/1 var(--ui);color:var(--cps-ink-dim,#767C90);
  list-style:none;display:flex;align-items:center;gap:7px}
.pfMore summary::-webkit-details-marker{display:none}
.pfMore summary::before{content:"\203A";display:inline-block;transition:transform .16s;
  color:var(--cp-red-hi);font-size:15px}
.pfMore[open] summary::before{transform:rotate(90deg)}
.pfMore summary:hover{color:var(--cps-ink,#E7E9F0)}
.pfBody{margin-top:12px;display:grid;gap:11px}
.pfBody code.blk{display:block;padding:10px 12px;background:var(--cps-well,#07080B);
  border:1px solid var(--cps-hair,#242731);border-radius:9px;
  font:500 11px/1.7 ui-monospace,Menlo,Consolas,monospace;color:#9AA1B4;
  white-space:pre-wrap;word-break:break-all}
.vf{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:9px}
.vf label{display:grid;gap:4px;min-width:0}
.vf .cap{font:600 9px/1 var(--ui);letter-spacing:.11em;text-transform:uppercase;color:#666C7E}
.vf input{width:100%;min-width:0;height:32px;padding:0 9px;background:var(--cps-well,#07080B);
  border:1px solid var(--cps-hair,#242731);border-radius:8px;
  font:500 11.5px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--cps-ink,#E7E9F0)}
.vf input:focus{outline:none;border-color:var(--cps-red-hi,#E0392B)}
#vout{font:600 12.5px/1.6 var(--ui);color:var(--cps-ink-mid,#A7ACBD)}
/* task 4 judgement call: this bold figure carries no [data-w]/[data-s] — it
   is a verifier readout, not a win/lose signal, so it fits neither this
   task's ACCENT nor WIN bucket. Left on --gold it would still be gold; put
   here on --ink (matching .kv b's own near-white treatment two rules below)
   rather than force it into a semantic it may not have. Flagged in the task
   4 report for a ruling. */
#vout b{font-family:var(--fig);font-variant-numeric:tabular-nums;color:var(--ink)}
.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 14px;
  font:600 12px/1.7 var(--ui);color:var(--cps-ink-mid,#A7ACBD)}
.kv b{font-family:var(--fig);font-variant-numeric:tabular-nums;color:var(--cps-ink,#E7E9F0);
  font-weight:700;justify-self:start}
