/* ---------- the Buy Credit window ----------

   docs/BETA-DOOR.md, ruling 6, Lane 5. A floating window over whatever room is
   open, drawn at the top level by lib/render.js the way every modal here is,
   which is why it has a sheet of its own rather than a block in house-shell.css.

   EVERY SIZE COMES OFF THE --t-* SCALE AND EVERY COLOUR IS A TOKEN (CLAUDE.md,
   the theme law). A raw colour here is a pixel no theme can reach, and this
   window opens in Day and in Night alike.

   THE HOUSE FACE, NOT MONO (Mark's ruling on the left panel's face, which
   applies to every column of chrome): the kicker is the house's own letters at
   the small size with the wide tracking, not a typewriter. */

.credit{
  width:min(360px, 92vw);
  gap:var(--s5);
  padding:var(--s7);
}
.credit-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--s5);
}
.credit-name{
  display:flex;
  flex-direction:column;
  gap:var(--s2);
}
.credit-kicker{
  font-size:var(--t-label);
  letter-spacing:.2em;
  color:var(--accent);
}
.credit-title{
  font-size:var(--t-head);
  color:var(--text);
}
.credit-said{
  margin:0;
  font-size:var(--t-body);
  color:var(--text);
  line-height:1.5;
}
/* THREE PRESSES, EQUAL WIDTH, so no amount looks like the one the house wants
   you to pick. */
.credit-picks{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:var(--s4);
}
.credit-pick{
  font-size:var(--t-sub);
  color:var(--text);
  background:transparent;
  border:var(--bd) solid var(--edge);
  border-radius:var(--r-sm);
  padding:var(--s5) var(--s4);
  cursor:pointer;
}
.credit-pick:hover:not(:disabled){
  background:var(--sel);
  border-color:var(--accent);
}
.credit-pick:disabled{
  opacity:.5;
  cursor:default;
}
.credit-note{
  margin:0;
  font-size:var(--t-small);
  color:var(--muted);
  line-height:1.5;
}