/* The pilots' faces, on the seat they fly from.

   One each, painted once by tools/chronicle-art.sh and kept in docs/faces/
   from then on — the same picture the chronicle puts beside their name, which
   is the entire reason it is painted once rather than per page. The cabinet
   borrows it from the book; nothing here is fetched and nothing here is drawn.

   Everything in this file has to survive the picture not being there. A clone
   with no faces, a pilot who has never been painted, a file that went missing
   — all three land on a card that looks exactly like a card always did. */

.pilotcard {
  /* The face and the name make a head; everything counted about the pilot runs
     the full width underneath it.

     It was all one right-hand column before, indented past the portrait, which
     kept the lines tidily under the name and cost the card a third of its own
     width — so "34 versions landed · 6 flights on the board" wrapped inside a
     gutter while there was empty space beside the face. The three lines are the
     reason anybody reads a card that is not their own. They get the card. */
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 0.7rem;
  row-gap: 0.2rem;
  align-items: center;
}
/* The name sits beside the portrait; the record sits under both. Without the
   first of these the card falls back to one item per row the moment a face
   appears, which is the layout it keeps for a pilot with no face. */
.pilotcard .pname { grid-column: 2; }
.pilotcard .pmeta,
.pilotcard .pserv,
.pilotcard .pbends { grid-column: 1 / -1; }

.pface {
  grid-row: 1;
  grid-column: 1;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  object-fit: cover;
  background: #05010c;
  border: 1px solid rgba(160, 75, 255, 0.55);
  box-shadow: 0 0 10px rgba(160, 75, 255, 0.4);
}
/* The seat you are in, lit the way the card around it is. */
.pilotcard.on .pface {
  border-color: var(--cyan);
  box-shadow: 0 0 14px rgba(33, 243, 255, 0.45);
}
.pilotcard.on:disabled .pface {
  border-color: var(--lime);
  box-shadow: 0 0 14px rgba(182, 255, 61, 0.4);
}

/* The splash has to land above the fold on a laptop, and a portrait is the
   cheapest thing on the card to shrink — the name is what has to stay. */
@media (max-height: 940px) {
  .pface { width: 2.05rem; height: 2.05rem; }
}