/* ============================================================
   PACKET 06 · "The Repair Kit" — BOOK-SPECIFIC PARTS
   ------------------------------------------------------------
   Home pillar: Empathy (sage). Sharp 6–8. Reuses tokens.css,
   pages.css, book-common.css. Only repair-specific bits here.
   ============================================================ */

/* the four-tool flow strip */
.flow { display: flex; align-items: stretch; gap: 10px; }
.flow-step { flex: 1; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 16px 10px; background: var(--pillar-8); border: 1.5px solid var(--pillar-bd); border-radius: var(--r-md); }
.flow-step .fs-num { width: 34px; height: 34px; border-radius: 50%; background: var(--pillar); color: var(--cream); display: flex; align-items: center; justify-content: center; font-family: var(--font-serif); font-weight: 700; font-size: 17px; }
.flow-step .fs-name { font-family: var(--font-serif); font-weight: 700; font-size: 18px; color: var(--ink); }
.flow-step .fs-sub { font-family: var(--font-sans); font-size: 12px; line-height: 1.35; color: var(--ink-soft); }
.flow-arrow { align-self: center; font-family: var(--font-sans); font-weight: 700; font-size: 20px; color: var(--pillar); }

/* apology builder sentence frame */
.apology-frame { padding: 20px 24px; background: var(--pillar-8); border: 1.5px solid var(--pillar-bd); border-radius: var(--r-md); display: flex; flex-direction: column; gap: 14px; }
.apology-line { font-family: var(--font-serif); font-weight: 600; font-size: 22px; color: var(--ink); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.apology-line .lead { color: var(--pillar-ink); }
.apology-line .blank { display: inline-block; min-width: 200px; border-bottom: 3px dotted var(--pillar); height: 30px; }
.apology-note { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); }