/* ============================================================
   THE CHANNEL — additions to the ledger's studio package.
   Everything structural (topbar, mast, counters, seghead, find,
   blk, cov, srcs, tables, method, share) comes from
   /ledger/ledger.css. Only the components this page introduces
   live here: the doorway map, the raw-string census, and the
   blanked-record rows.
   ============================================================ */

/* ---------------------------------------------------------- doorway map
   Four routes out of a Canadian charity. The grid is the argument: a route
   either carries a key or it does not, and the eye should find the gaps
   before the prose explains them. */
.doors{display:grid;gap:1px;background:var(--card-3);border:1px solid var(--card-3);
  box-shadow:0 20px 44px -30px #000}
.door{background:var(--card);color:var(--ink);padding:.9rem .95rem;display:grid;gap:.5rem}
.door > header{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem}
.door .rt{font-family:var(--mono);font-size:.55rem;letter-spacing:.16em;text-transform:uppercase;
  background:var(--ink);color:#fff;padding:.18rem .42rem}
.door h3{font-size:1.14rem;color:var(--ink);line-height:1}
.door .form{font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;color:var(--ink-3);
  margin-left:auto}
.door p{margin:0;font-size:.94rem;color:var(--ink-2)}
.door .keys{display:flex;flex-wrap:wrap;gap:.3rem}
.key{font-family:var(--mono);font-size:.54rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.2rem .45rem;border:1px solid currentColor;display:inline-flex;gap:.32rem;align-items:center}
.key::before{content:'✓';font-weight:600}
.key.no::before{content:'✕'}
.key.yes{color:#0f5c43;background:#e2f4ec}
.key.no{color:#8f1023;background:#fdeaed}
.key.part{color:#8a5b00;background:#fff4d6}
.key.part::before{content:'~'}
.door .amt{font-family:var(--chyron);font-size:1.75rem;line-height:1;color:var(--ink)}
.door .amt small{font-family:var(--mono);font-size:.34em;letter-spacing:.12em;color:var(--ink-3);
  display:block;margin-top:.25rem;text-transform:uppercase}
.door.dark{background:var(--navy-800);color:var(--white)}
.door.dark h3,.door.dark .amt{color:#fff}
.door.dark p{color:#c9d6e6}
.door.dark .rt{background:var(--red)}
.door.dark .form{color:#93a8c2}

/* ---------------------------------------------------------- string census
   The point of showing the raw values is that they are raw. Set them in the
   data face, unaltered, including the misspellings. */
.chips{display:flex;flex-wrap:wrap;gap:.3rem;margin:.2rem 0 0}
.chips code{font-family:var(--mono);font-size:.62rem;background:var(--navy-700);color:#d8e4f2;
  border:1px solid var(--line);padding:.22rem .45rem;white-space:pre}
.chips code.bad{border-color:#5c1a26;background:var(--red-wash);color:#ffb3bd}
.chips code.void{border-style:dashed;color:#93a8c2}
.censusnote{font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;
  color:#93a8c2;margin:.9rem 0 .35rem}

/* ---------------------------------------------------------- blanked rows
   A public record with the name removed. The rule and the empty box are the
   whole point, so the empty box has to read as deliberate, not as a bug. */
.void-rows{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.void-rows > div{background:var(--navy-800);padding:.7rem .9rem;display:flex;flex-wrap:wrap;
  gap:.5rem 1rem;align-items:baseline}
.void-rows .v{font-family:var(--chyron);font-size:1.3rem;color:#fff;min-width:7.5rem}
.void-rows .n{font-family:var(--mono);font-size:.8rem;color:#c9d6e6;flex:1;min-width:12rem}
.void-rows .n.empty{color:#6d7d92;border-bottom:1px dashed #5c1a26;min-height:1.1rem}
.void-rows .n.quote{color:var(--gold-lit)}
.void-rows .c{font-family:var(--mono);font-size:.55rem;letter-spacing:.14em;color:#93a8c2}

/* ---------------------------------------------------------- ledger pair
   Canadian outbound beside the counterparty record, so the asymmetry is
   visible as a shape rather than asserted in a sentence. */
.pair{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media(min-width:44rem){.pair{grid-template-columns:1fr 1fr}}
.pair > section{background:var(--navy-800);padding:1rem .95rem;width:auto;margin:0;padding-top:1rem}
.pair h3{font-size:1.05rem;color:#fff;margin-bottom:.15rem}
.pair .j{font-family:var(--mono);font-size:.56rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--gold-lit);margin-bottom:.6rem}
.pair dl{margin:0;display:grid;gap:.5rem}
.pair dt{font-family:var(--mono);font-size:.54rem;letter-spacing:.13em;text-transform:uppercase;
  color:#93a8c2}
.pair dd{margin:.1rem 0 0;font-size:.93rem;color:#c9d6e6}
.pair dd b{color:#fff}
.pair .verdict{margin-top:.85rem;padding-top:.7rem;border-top:1px solid var(--line);
  font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase}
.pair .verdict.ok{color:var(--green-lit)}
.pair .verdict.no{color:var(--red-lit)}

/* ---------------------------------------------------------- correction
   A claim this page tested and refused to publish. It earns a distinct
   surface because the refusal is part of the method, not an aside. */
.correction{background:var(--card);color:var(--ink);border:1px solid var(--card-3);
  border-left:4px solid var(--gold);box-shadow:0 20px 44px -30px #000}
.correction > h3{background:#fff4d6;color:#5c4708;font-size:1.05rem;padding:.7rem .95rem;
  border-bottom:1px solid var(--card-3)}
.correction .body{padding:.9rem .95rem}
.correction p{font-size:.94rem;color:var(--ink-2)}
.correction p:last-child{margin-bottom:0}
.correction .tempting{font-family:var(--serif);font-size:1.02rem;font-style:italic;color:var(--ink);
  border-left:3px solid var(--red);padding:.2rem 0 .2rem .8rem;margin:0 0 .8rem}
.correction table{margin-top:.2rem}

/* ---------------------------------------------------------- spec list */
.spec{counter-reset:spec;display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.spec > li{background:var(--navy-800);padding:.85rem .95rem .85rem 3.1rem;position:relative;
  list-style:none}
.spec > li::before{counter-increment:spec;content:counter(spec,decimal-leading-zero);
  position:absolute;left:.95rem;top:.9rem;font-family:var(--mono);font-size:.72rem;
  color:var(--gold-lit)}
.spec h3{font-size:1.04rem;color:#fff;margin-bottom:.25rem}
.spec p{margin:0;font-size:.93rem;color:#c9d6e6}
.spec .needs{font-family:var(--mono);font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;
  color:#93a8c2;margin-top:.45rem}
.spec .needs b{color:var(--gold-lit);font-weight:400}

/* the destination switch mirrors the ledger's bill switch */
.destsw{width:var(--wide);margin:1.4rem auto 0;display:flex;flex-wrap:wrap;gap:.4rem;
  font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;
  align-items:center;color:#93a8c2}
.destsw .lbl{color:var(--gold-lit);margin-right:.4rem}
.destsw a,.destsw span[aria-current]{border:1px solid var(--line);padding:.4rem .6rem;
  text-decoration:none;color:#c9d6e6}
.destsw a:hover{border-color:var(--red);color:#fff}
.destsw span[aria-current]{background:var(--red);border-color:var(--red);color:#fff}