/* ============================================================
   PACKET 09 · "Tiny Citizen" — BOOK-SPECIFIC PARTS
   ------------------------------------------------------------
   Home pillar: Civic Learning (gold). Sharp 6–8. Reuses
   tokens, pages, book-common. Civic-specific bits only.
   ============================================================ */

/* proposal builder: "that's not fair... it would be better if..." */
.proposal { 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: 16px; }
.proposal-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; }
.proposal-line .lead { color: var(--pillar-ink); }
.proposal-line .blank { display: inline-block; min-width: 220px; border-bottom: 3px dotted var(--pillar); height: 30px; flex: 1; }
.proposal-note { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); margin: 0; }

/* ballot / vote */
.ballot { display: flex; flex-direction: column; gap: 14px; }
.ballot-row { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: center; padding: 14px 18px; background: var(--pillar-8); border: 1.5px solid var(--pillar-bd); border-radius: var(--r-md); }
.ballot-opt { font-family: var(--font-serif); font-weight: 600; font-size: 20px; color: var(--ink); }
.ballot-tally { display: flex; gap: 8px; }
.ballot-tally .box { width: 26px; height: 26px; border: 2px solid var(--pillar); border-radius: var(--r-xs); background: #fff; }
.ballot-foot { margin-top: 6px; font-family: var(--font-serif); font-style: italic; font-size: 15px; color: var(--pillar-ink); text-align: center; }

/* fairness "needs" cards (fair vs equal) */
.needs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.needs-card { padding: 16px; background: var(--pillar-8); border: 1.5px solid var(--pillar-bd); border-radius: var(--r-md); text-align: center; }
.needs-card .nc-who { font-family: var(--font-serif); font-weight: 700; font-size: 18px; color: var(--ink); margin: 0 0 6px; }
.needs-card .nc-need { font-family: var(--font-sans); font-size: 13px; line-height: 1.45; color: var(--ink-soft); }
.needs-card .nc-tag { display: inline-block; margin-top: 10px; font-family: var(--font-sans); font-weight: 700; font-size: 11px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--pillar-ink); background: var(--pillar-16); padding: 4px 10px; border-radius: var(--r-pill); }
