/* Family information card + guide (family-card.html) and the public family
   page (family.html) — 2026-09-23. Shared tokens from styles-prototype.css;
   text is ink / ink-soft / oxblood only (gold is never text). Printed sizes:
   card 3.375 x 2.125 in (wallet), guide US Letter; body text >= 7pt on the
   card and >= 11pt on the guide. */

.fc-back { margin: 0 0 0.75rem; font-size: 0.95rem; }
.fc-back a { color: var(--ink-soft); }
.fc-fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: 0.5rem; }
.fc-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 0.5rem; }
.fc-warnings { margin: 1.25rem 0 0.5rem; padding-left: 1.25rem; color: var(--ink-soft); line-height: 1.55; }
.fc-warnings li + li { margin-top: 0.35rem; }

/* ---- the card (true size on screen and on paper) ---- */
.fc-card-sheet { display: flex; flex-wrap: wrap; gap: 0; margin: 0.75rem 0 0.5rem; max-width: 100%; }
.fc-card {
  box-sizing: border-box; width: 3.375in; height: 2.125in; padding: 0.16in 0.18in;
  background: #fff; color: var(--ink); border: 1px dashed var(--paper-line);
  display: flex; flex-direction: column; overflow: hidden; font-family: var(--sans);
}
.fc-card + .fc-card { border-left: 1px dashed var(--paper-line); }
.fc-card-head { display: flex; align-items: center; gap: 0.08in; margin-bottom: 0.06in; }
.fc-mark { width: 0.36in; height: auto; flex: none; }
.fc-brand { margin: 0; font: 600 7pt/1.1 var(--sans); letter-spacing: 0.08em; text-transform: uppercase; color: var(--oxblood); }
.fc-title { margin: 0; font: 600 10pt/1.15 var(--serif); color: var(--ink); }
.fc-copy { margin: 0; font-size: 7.2pt; line-height: 1.32; color: var(--ink); }
.fc-sign { margin: auto 0 0; font: italic 9pt/1.2 var(--serif); color: var(--ink); overflow-wrap: anywhere; }
.fc-card--back { flex-direction: row; align-items: center; gap: 0.1in; }
.fc-back-text { flex: 1; min-width: 0; }
.fc-line { margin: 0 0 0.05in; font-size: 7.4pt; line-height: 1.3; overflow-wrap: anywhere; }
.fc-k { font-weight: 600; }
[data-fc-contact-phone] { white-space: nowrap; }
.fc-small { font-size: 7pt; color: var(--ink-soft); }
.fc-qr { width: 1in; height: 1in; flex: none; background: #fff; }
.fc-cut { flex-basis: 100%; margin: 0.4rem 0 0; font-size: 0.85rem; color: var(--ink-muted); }

/* ---- the one-page guide ---- */
.fc-guide {
  box-sizing: border-box; max-width: 8.5in; margin: 1.5rem 0; padding: clamp(20px, 5vw, 0.7in);
  background: #fff; color: var(--ink); border: 1px solid var(--paper-line-soft); border-radius: 8px;
  font-family: var(--serif); font-size: 12.5pt; line-height: 1.5;
}
.fc-guide-head { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 1rem; }
.fc-guide-head .fc-mark { width: 44px; }
.fc-guide-head .fc-title { font-size: 20pt; }
.fc-guide-intro { font-size: 13pt; margin: 0 0 0.75rem; }
.fc-steps { margin: 0 0 1rem; padding-left: 1.6rem; list-style: decimal outside; }
.fc-steps li { margin: 0 0 0.5rem; display: list-item; }
.fc-steps li::marker { font-weight: 600; color: var(--oxblood); }
.fc-guide-backup { border-left: 3px solid var(--oxblood); padding: 0.4rem 0.75rem; background: var(--cream-soft); overflow-wrap: anywhere; }
.fc-guide-h2 { font-size: 14pt; margin: 1.25rem 0 0.25rem; }
.fc-guide-foot { margin-top: 1.5rem; border-top: 1px solid var(--paper-line-soft); padding-top: 0.6rem; font-family: var(--sans); font-size: 11pt; color: var(--ink-soft); }
.fc-guide-foot p { margin: 0.15rem 0; overflow-wrap: anywhere; }

/* Phone: the card keeps its true width (324px) and the sheet stacks. */
@media (max-width: 560px) {
  .fc-card + .fc-card { border-left: 1px dashed var(--paper-line); border-top: 0; }
  .fc-actions .btn { width: 100%; }
  .fc-guide { font-size: 11.5pt; }
}
@media (max-width: 360px) {
  .fc-card { width: 100%; height: auto; min-height: 2.125in; }
}

/* ---- printing: only the chosen piece ---- */
@media print {
  @page { size: letter; margin: 0.5in; }
  body.print-card .app-rail, body.print-card .site-footer, body.print-card .fc-controls,
  body.print-card .fc-guide, body.print-card .skip-link,
  body.print-guide .app-rail, body.print-guide .site-footer, body.print-guide .fc-controls,
  body.print-guide .fc-card-sheet, body.print-guide .skip-link { display: none !important; }
  body.print-card, body.print-guide { background: #fff !important; }
  body.print-card .app-rail-shell, body.print-card .app-shell, body.print-card .app-container,
  body.print-guide .app-rail-shell, body.print-guide .app-shell, body.print-guide .app-container {
    display: block; margin: 0; padding: 0; max-width: none; min-height: 0 !important;
  }
  body.print-card .fc-card { border-color: #777; }
  body.print-card .fc-cut { color: #444; }
  body.print-guide .fc-guide { border: 0; border-radius: 0; margin: 0; padding: 0; max-width: none; font-size: 12pt; color: #000; }
  body.print-guide .fc-guide-backup { background: none; }
  .fc-card, .fc-guide { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}

/* ---- public family page (family.html) ---- */
.family-page .family-section { max-width: 40rem; margin: 0 auto 1.75rem; }
.family-page .family-section h2 { font-family: var(--serif); font-size: 1.45rem; margin: 0 0 0.4rem; }
.family-page .family-section p, .family-page .family-section li { color: var(--ink-soft); line-height: 1.6; }
.family-page .family-section p { margin: 0 0 0.8rem; }
.family-page .family-section p:last-child { margin-bottom: 0; }
.family-page .family-emergency { border-left: 4px solid var(--oxblood); background: var(--cream-soft); padding: 0.9rem 1rem; border-radius: 6px; }
.family-page .family-emergency p { color: var(--ink); margin: 0; }
.family-page .family-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 0.5rem; }
