/* SEARCH·RESULTCARD (1021) — one pulled answer: kind chip, title, standfirst,
 * the gate, the scope note. Extracted 2026-09-03 (REPORT-207) from
 * web/css/cards/search/surface.css — SAME DECLARATIONS, one renamed stem
 * (`ssf-card`/`ssf-kx`/`ssf-cgate` → `srcard`/`srcard-kx`/`srcard-gate`),
 * because the `ssf` prefix is 701 SEARCH·SURFACE's and a prefix has exactly one
 * owner (mirror check 16). Self-contained under its own root (D-470/D-475).
 *
 * 🔴 TWO CARRIED VALUES LOOK LIKE NOTHING AND ARE LOAD-BEARING — measured, not
 * guessed (probe + before/after render, REPORT-207):
 *   · `line-height: normal` on the root — every line in this card inherits it
 *     from the <button> (no child declares a leading). It came from the UA
 *     button default via app.css's reset, which sets font-family but never a
 *     leading. Declaring a token leading HERE would re-space every line of the
 *     card — a design change, not an extraction. Found, left, flagged.
 *   · NO font-size on the root, on purpose: the UA gives <button> 13.3333px and
 *     it is inert — every text child declares its own size — but writing
 *     var(--size-13) (13px) in its place would NOT be the same value. Carried
 *     as absence, stated here so the next reader does not "fix" it.
 * ⚠️ THE 17px TITLE + STANDFIRST carry the token-exception marker — the type ladder has no 17px
 *   role (--text-subtitle is 18, --text-standfirst/--text-body are 16, tokens.css:510-522), and
 *   moving this card to a role is a DESIGN change (it re-spaces every pulled result). Kept
 *   verbatim; the ruling is owed to Andrew, not taken. Chip + gate swapped to their exact-equal
 *   roles (--text-micro = --size-10, --text-caption = --size-13): same px, honest name.
 *   · `font-family: var(--font-body)` — app.css's button reset says
 *     `font-family: inherit`; the standfirst (.srcard-s) declares no family and
 *     rides it. Explicit here so the card is self-contained off the surface.
 */

.srcard {
  display: block;
  width: 100%;
  text-align: left;
  background: var(--surface-card);
  border: 0;
  border-radius: var(--radius-card-lg);
  box-shadow: var(--shadow-card);
  padding: var(--space-16);
  margin-bottom: var(--space-12);
  font-family: var(--font-body);
  line-height: normal;
}

/* 🔴 THE CURSOR IS THE BUTTON'S PROMISE, NOT THE CARD'S. (dead-affordances, 2026-09-08)
 * `cursor: pointer` used to sit on the card class itself, so the no-route guard branch — which
 * renders a plain <div> on purpose so it "does not pretend" (search.js resultCard) — still
 * pretended, on desktop, one pixel at a time. The pointer now hangs off the button variant
 * only, and lives in the surface stylesheet: check 16 rules every selector leading with this
 * card's .ssf- namespace into surface.css. */

/* the kind chip — shared with the suggestion row via renderSearchKindChip();
 * the card-context rule is the old `.ssf-card .ssf-kx`. */
.srcard-kx { flex: none; padding: var(--space-4) var(--space-8); border-radius: var(--radius-pill); font-family: var(--font-label); font-size: var(--text-micro); font-weight: var(--weight-700); letter-spacing: var(--tracking-05); text-transform: uppercase; }
.srcard .srcard-kx { display: inline-block; margin-bottom: var(--space-8); }
.srcard-k-read { background: var(--kind-read-fill); color: var(--kind-read-icon); }
.srcard-k-do { background: var(--kind-do-fill); color: var(--kind-do-icon); }
.srcard-k-watch { background: var(--kind-watch-fill); color: var(--kind-watch-icon); }
.srcard-k-track { background: var(--kind-track-fill); color: var(--kind-track-icon); }

.srcard-q { font-family: var(--font-display); font-weight: var(--weight-600); font-size: var(--size-17); color: var(--text-primary); margin-bottom: var(--space-4); } /* token-exception */
.srcard-s { font-size: var(--size-17); color: var(--text-secondary); } /* token-exception */
.srcard-meta { font-family: var(--font-label); font-size: var(--text-meta); color: var(--ink-600); margin-top: var(--space-8); }

/* 🔴 THE GATE ON A PULLED RESULT — D-494/D-524 (comment carried from surface.css).
 * She searched "swaddling"; her baby has started rolling. We show the answer (she asked) and we
 * show WHY IT NO LONGER APPLIES. This is not a footnote: for the parent who went looking, this
 * banner IS the answer, and the article behind it is the context.
 * Amber, not red — red is reserved for the acute net, and if everything is an
 * emergency then nothing is. */
.srcard-gate { display: block; margin-top: var(--space-12); padding: var(--space-12); border-radius: var(--radius-12); background: var(--surface-warning); border-left: var(--dim-4) solid var(--warning); }
.srcard-gate-h { display: block; font-family: var(--font-label); font-size: var(--text-caption); font-weight: var(--weight-600); color: var(--text-primary); }
.srcard-gate-b { display: block; font-size: var(--text-caption); color: var(--text-secondary); margin-top: var(--space-4); }

.srcard:active { opacity: 0.9; }
.srcard:focus-visible { outline: var(--focus-ring); outline-offset: var(--focus-offset); border-radius: var(--radius-8); }