/* SHARED·GUIDEPLAYER (1225) — the deck player's own chrome: the full-screen sheet a
 * guide deck plays in, and the numbered-steps list style no existing card owns.
 *
 * EVERYTHING INSIDE THE SHEET IS COMPOSED, NEVER RESTATED: the header is 401 (wordmark ·
 * ✕) with 441's who-chip in its centre, the card is 1124 (nav row · body scale · footer),
 * the boxes are 411, the timeline is 1122, the tile is 1125, the rows are 1126, the
 * keep-exploring row is 420, the source stamps are 1118. This file owns the sheet and
 * nothing else — a style a component could own that appears here is a defect.
 *
 * Card CSS self-contained (D-470/D-475) for what this card owns: the sheet's every
 * value is explicit under its own root class, zero reliance on page defaults.
 */
.gdp {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  background: var(--surface-ground);
  color: var(--text-primary);
  font-family: var(--font-body);
  touch-action: pan-y; /* D-812: the track never claims vertical; the JS axis-lock owns horizontal */
}

/* the header is 401's own bar (wordmark · who-chip centre · round ✕) with the drafts' hairline
 * beneath it — all of it owned by 401's centre variant; the sheet restyles nothing in it. */

/* ── the numbered-steps list, inside a 411 voice box. The box owns the chassis and
 *    the head; the list is the deck's own arrangement (drafts 2026-09-11: numbered
 *    discs, one step per line). Host-context: leads with .gdp, so it lives here by
 *    the 2026-08-25 rule (counted by check 16, like .gd-foot .lg-cta). ── */
.gdp .gdp-steps { list-style: none; margin: var(--space-8) 0 0; padding: 0; }
.gdp .gdp-steps li { display: flex; gap: var(--space-8); align-items: center;
  font-size: var(--text-body-sm); line-height: var(--leading-140); color: var(--text-primary);
  margin: 0 0 var(--space-8); }
.gdp .gdp-steps li:last-child { margin-bottom: 0; }
.gdp .gdp-steps li b { flex: 0 0 auto; width: var(--dim-24); height: var(--dim-24);
  border-radius: var(--radius-round); background: var(--white); color: var(--accent-hover);
  font-family: var(--font-label); font-size: var(--text-caption); font-weight: var(--weight-700);
  display: flex; align-items: center; justify-content: center; }

/* ── the chip row: "the seven, as named things" (the allergens card's anatomy row).
 *    The approved drafts' own pill look (solids-std .alg), one row of white pills.
 *    One definition, applied identically — a type that lives where it is used; if a
 *    second consumer appears, that is the moment it becomes its own card. ── */
.gdp-chips { display: flex; flex-wrap: wrap; gap: var(--space-8); margin: 0 0 var(--space-16); }
.gdp-chips span { font-size: var(--text-body); font-weight: var(--weight-600); color: var(--text-primary);
  background: var(--surface-card); border: 1px solid var(--border-hairline); /* token-exception */
  border-radius: var(--radius-pill); padding: var(--space-4) var(--space-12); }

/* the blocks' rhythm: 411's own margin is top-only, the tile's bottom-only — the space
 * BETWEEN the player's blocks is the player's arrangement, so it lives here */
.gdp .ntc { margin-bottom: var(--space-16); }
.gdp .gdp-chips { margin-bottom: var(--space-16); }

/* the headless gold note (the last card's "Every baby is different"): 411's acute rule
 * gives a following <p> a top margin sized for the head row — with no head row the line must
 * not be pushed down inside its own box */
.gdp .ntc.acute > p:first-child { margin-top: 0; }
/* the drafts' gold boxes are FILLED (draft token block: --kind-fill --gold-100); 411's chassis paints no fill
 * (background: transparent), so the deck paints the fill 411 already declares as --kind-fill — scoped to the
 * deck, so chat's hard gate and the search acute net are untouched */
.gdp .ntc.acute { background: var(--kind-fill); }
/* the drafts' TEAL boxes are filled too — a near-white pale teal (draft `.ntc.cu` --kf), the wash inside the
 * 4px teal bar. It is --teal-50, not 411's --kind-fill (--teal-100): that rung is a visibly deeper teal than the
 * drafts' wash. The same scoped paint covers every boxed teal block the deck draws (Worth knowing, the printed
 * guide, the four steps, the menu chart). */
.gdp .ntc.voice { background: var(--teal-50); }
/* the chart's month ticks paint a patch of the box's own fill over the rules they sit on (1122 declares the
 * teal-100 patch for the 1122 gallery's ground) — inside this deck the box is --teal-50, so the patch follows */
.gdp .fdtl-axb i, .gdp .fdtl-wkaxis i { background: var(--teal-50); }

/* ── the last card's source line, DIRECTLY under the content (never pinned to the foot):
 *    a hairline, the draft's teal "Sources" label, one 1118 tap-to-open stamp per authority.
 *    The stamps own their own look; this owns the frame and the rhythm between them. ── */
.gdp .gdp-src { border-top: 1px solid var(--border-hairline); /* token-exception */
  padding-top: var(--space-12); margin-top: var(--space-16); }
.gdp .gdp-src-ey { font-family: var(--font-label); font-size: var(--text-label); font-weight: var(--weight-700);
  line-height: var(--leading-140); color: var(--teal-700); text-transform: uppercase;
  letter-spacing: var(--tracking-12); margin-bottom: var(--space-8); }
.gdp .gdp-src .stamp { margin-bottom: var(--space-8); }

/* ── the table box's rows (1126), the drafts' layout: one row per age, the label LEFT in regular weight, the value
 *    RIGHT in bold, a hairline between rows. 1126's own grammar stacks a small-caps label over the value (Andrew's
 *    option A, 2026-09-11); the player's deck is the drafts' justified form, so it is set here under .gdp. ── */
.gdp .kvr-row { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-12); } /* align-exception: .kvr-row — the bottle deck's label (left) and value (right) are different sizes and share a TEXT BASELINE, deliberately not box-centred (Andrew-approved deck layout, 2026-10-02); same reasoning as .nh-mhead / .ys-head */
.gdp .kvr-k { display: block; font-family: var(--font-body); font-size: var(--text-body); font-weight: var(--weight-400);
  letter-spacing: normal; text-transform: none; color: var(--text-primary); margin-bottom: 0; }
.gdp .kvr-v { font-weight: var(--weight-700); text-align: right; }

/* ── the drafts' pill door: the deck's primary button is a full pill (draft .cta border-radius 999px) ── */
.gdp .gd-foot .lg-cta { border-radius: var(--radius-pill); }

/* ── the authority names in the last card's source block read in the secondary text colour (Andrew, 2026-10-03:
 *    "We can't have the source title and sources in teal" — PROVISIONAL, matching the draft's grey authority names).
 *    The "SOURCES" heading above stays teal; the chevron and the cited link are unchanged. Scoped to this block, so
 *    1118/1119's own frames keep the teal ruling of 2026-10-02. ── */
.gdp .gdp-src .stamp-who { color: var(--text-secondary); }