/* 1156 SHARED·ROWPIECE — row pieces: the left icon/label/sub cluster and the
 * trailing piece inside the profile screen's rows.
 * ═══════════════════════════════════════════════════════════════════════════════
 * EXTRACTED 2026-09-28 (brief 9500, the profile shared-component alignment) —
 * MOVED out of web/css/app.css (the census group .s block, lines 838–861) and
 * aligned to the index-type row standard the app already ships (web/css/
 * home-shell.css .nh-tmid/.nh-tchip/.nh-tname/.nh-tval, and the signed-off
 * profile drawings of 2026-09-20). One anatomy, one owner — the row exists so the
 * most-reached-for row anatomy has an owner to consult.
 *
 * ── THE ALIGNMENT, VALUE BY VALUE (what moved vs what changed) ─────────────────
 * MOVED VERBATIM: .s-left's flex/align/flex:1 · .s-label's weight 500 ·
 * .s-sub's ink-600 · .s-right's ink-600. CHANGED to the index standard (the type's
 * standard wins — LANE-RULES §2; no new ruling taken):
 *   · .s-left gap 10px → var(--space-12) (the row gap every index row uses).
 *   · .s-left min-width:0 added — load-bearing on the index row (a flex item
 *     cannot shrink below its longest word without it).
 *   · .s-ic becomes the index icon CHIP: a 40px round well (--dim-40, the tab
 *     icon well dimension) in --teal-100 with --teal-700 ink, sizing a Phosphor
 *     svg at --size-18 — the .nh-ychip treatment. Emoji callers keep rendering
 *     (the emoji rides the chip at its own --size-22).
 *   · .s-label takes the index name treatment: display face, weight 500,
 *     --size-16 (was --size-14 body).
 *   · .s-sub takes the index meta treatment: label face, --text-meta, weight 600
 *     (was size-12 regular), --space-4 above (the .nh-tval offset).
 *   · .s-chev NEW — the chevron form of the trailing piece: a 16px caret mark in
 *     --ink-600 (D-740's text ink — the mark ink --ink-400 is forbidden on the
 *     ground a shared piece must survive; see the rule below). Rows that carry
 *     a value word keep .s-right's text treatment.
 *
 * ── SELF-CONTAINMENT ──────────────────────────────────────────────────────────
 * Every element this card renders gets its style explicitly under its own root
 * class, zero reliance on page or user-agent defaults. The `s` prefix is unique
 * among the cards for being ONE LETTER — chat-sources-label and every other
 * s-substring is NOT this family (registry note, 2026-09-14).
 * ═══════════════════════════════════════════════════════════════════════════════ */

.s-left {
  display: flex;
  align-items: center;
  gap: var(--space-12);
  flex: 1;
  min-width: 0;
}

/* the icon chip — a 40px round well for a Phosphor glyph (svg) or an emoji */
.s-ic {
  width: var(--dim-40);
  height: var(--dim-40);
  border-radius: var(--radius-round);
  background: var(--teal-100);
  color: var(--teal-700);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: var(--size-22); /* token-exception */ /* emoji glyph size — raw step carried from the shipped row */
}

.s-ic svg {
  width: var(--size-18);
  height: var(--size-18);
  display: block;
}

/* name line — the index row's name treatment */
.s-label {
  font-family: var(--font-display);
  font-weight: var(--weight-500);
  font-size: var(--text-body); /* = --size-16, the role ladder's byte-equal name (D-463) */
  color: var(--text-primary);
  line-height: var(--leading-120);
}

/* secondary line — the index row's meta treatment */
.s-sub {
  font-family: var(--font-label);
  font-size: var(--text-meta);
  font-weight: var(--weight-600);
  color: var(--ink-600);
  margin-top: var(--space-4);
}

/* the trailing piece — a value word ("Full", "Add & view") */
.s-right {
  flex: none;
  font-family: var(--font-label);
  font-size: var(--text-meta);
  font-weight: var(--weight-600);
  color: var(--ink-600);
}

/* THE ONE-LETTER NAMESPACE (2026-09-28): `.s` on its own is this card's letter.
 * The legacy global utility `.n, .s { display:block }` split when 1156 went draft —
 * the `.s` half lives here now. Consumers elsewhere (the timeline card's caption
 * span, previews) keep rendering identically: a bare `.s` is a block. */
.s {
  display: block;
}

/* the chevron form of the trailing piece — a caret mark. ⚠️ --ink-600, NOT the
 * index .nh-ychev's --ink-400: D-740 puts --ink-400 over the 3:1 non-text floor on
 * --surface-ground (2.69) and FORBIDS it there — and a SHARED piece must stay
 * legible on any mount, including bare ground (the contrast audit's page-ground
 * fallback is exactly that case). On the card panel the two inks sit one shade
 * apart; on the ground only this one clears the floor. */
.s-chev {
  flex: none;
  display: inline-flex;
  width: var(--size-16);
  height: var(--size-16);
  color: var(--ink-600);
}

.s-chev svg {
  width: 100%;
  height: 100%;
  display: block;
}