@charset "UTF-8";
/* ==========================================================================
   Who Did It — styles.css
   --------------------------------------------------------------------------
   ALMOST EVERYTHING THIS PAGE LOOKS LIKE IS SOMEWHERE ELSE, ON PURPOSE.

     /biblegames/shared/theme.css   the night sky, the golds, the three levels
                                    of ink, the type stacks, the focus ring,
                                    the self-check report panel.
     /biblegames/shared/quiz.css    the whole four-choice layout: the no-scroll
                                    flex column, the scoreboard, the answer
                                    grid, the feedback panel, the score card.
     this file                      only what belongs to Who Did It alone.

   index.php loads them in that order, so anything here overrides both.

   The test for whether a rule belongs in this file: WOULD WHO SAID IT WANT IT
   DIFFERENT? If no, it goes in quiz.css and both games get it. If yes, here.

   To re-theme the whole site: shared/theme.css.
   To change every quiz on the site: shared/quiz.css.
   To change this one game: below.
   ========================================================================== */

/* -------------------------------------------------------------------------- */
/* 1. What this game asks for                                                 */
/* -------------------------------------------------------------------------- */

:root {
  /*
   * The deed is a plain statement of fact — "Stretched out his hand over the
   * sea, and the waters were divided" — so it is set in the display face at
   * full strength, upright, like a caption under a painting.
   *
   * Who Said It overrides exactly this block to set its quotations in italic
   * with quotation marks, which is the one real visual difference between the
   * two games.
   */
  --ask-style: normal;
}

/* -------------------------------------------------------------------------- */
/* 2. The deed                                                                */
/* -------------------------------------------------------------------------- */

/*
 * Deeds run longer than the two book names in Which Comes First but shorter
 * than a quotation, so the measure is a little wider than quiz.css's default
 * and the type a little smaller. Long enough to say what happened, short
 * enough to take in at a glance.
 */
.ask {
  max-width: 40ch;
  font-style: var(--ask-style);
}

/* -------------------------------------------------------------------------- */
/* 3. The answers                                                             */
/* -------------------------------------------------------------------------- */

/*
 * Answers here are people's names, and the longest in the bank are "Joseph of
 * Arimathaea" (20 characters), "The queen of Sheba" and "John the Baptist".
 * Those need a slightly smaller ceiling than quiz.css's default or they wrap to
 * three lines on a narrow phone and make the four buttons different heights.
 *
 * The floor is unchanged: a short name like "Job" still fills the button.
 */
:root {
  --ans-font: clamp(0.9rem, 3.1vw, 1.25rem);
}

/* -------------------------------------------------------------------------- */
/* 4. Print                                                                   */
/* -------------------------------------------------------------------------- */

/* The blanket print rules are in quiz.css. Nothing here needs adding. */