/* HOME·QUESTION — the before-birth Home's one-question card · SINGLE SOURCE OF TRUTH.
 * Imported by BOTH workbench/home/question.html AND the app (web/index.html).
 * Tokens only (D-421). Class prefix: hq-*. Do NOT restyle hq-* anywhere else.
 *
 * SELF-CONTAINED and RAISED, the same shell the checklist and the spotlight wear and
 * every other Home module already wears (bake-off round 2, ruled 2026-09-20: "1").
 * The question row inside is 1067 SHARED·QUESTIONROW's .qrow-* and the pills are 430's
 * .pills/.pill, each styled by its own sheet; nothing here touches either prefix.
 */

.hq {
  margin: 0 var(--space-16) var(--space-12);
  background: var(--surface-card);
  border-radius: var(--radius-card-lg);
  box-shadow: var(--shadow-card);
  padding: var(--space-20);
}

/* THE QUESTION IS THE CARD'S HEADLINE, and is typed like one — the same display
 * face and size as the Spotlight's title, because they sit on the same Home.
 * ⚠️ WHY THIS CARD OWNS ITS TYPE. It used to compose 1067 SHARED·QUESTIONROW, whose
 * type is built for the inside of a tool sheet: measured here, Fraunces 16 for the
 * stem and Inter 11 for the why-line, against the Spotlight's 22 and 14 beside it.
 * The fix is NOT to restyle .qrow-* from this sheet — that is the two-owners defect
 * check 16 exists for. A heading and a line are not worth a shared component; the
 * pills still are, and those are 430's. */
.hq-stem {
  font-family: var(--font-display);
  font-weight: var(--weight-600);
  font-size: var(--text-title);
  line-height: var(--leading-115);
  color: var(--text-primary);
  margin: 0 0 var(--space-4);
}

/* The why-line is body copy, not fine print. A question with no stated purpose reads
 * as data collection, so the reason has to be legible at a glance. */
.hq-why {
  font-size: var(--text-body-sm);
  line-height: var(--leading-140);
  color: var(--text-secondary);
  margin: 0 0 var(--space-16);
}

/* The control is the caller's; this card owns only where it sits. */
.hq-control { margin: 0; }