.family-breadcrumb { display:flex; align-items:center; gap:.55rem; margin-bottom:1.5rem; }
.family-guide .prose { max-width:54rem; }
.family-guide .prose h2 { margin-top:2rem; }
.family-table { overflow-x:auto; }
.family-table caption { text-align:left; padding-bottom:.5rem; color:var(--muted); }
.family-table table { min-width:0; }
.family-table th, .family-table td { vertical-align:top; text-align:left; }
#family-chart td:last-child { text-align:center; }
#family-chart table { table-layout:fixed; }
#family-chart td { height:2.8rem; }
#family-chart th:nth-child(1) { width:24%; }
#family-chart th:nth-child(4) { width:16%; }
.family-print-action { margin-top:1rem; }
.family-setup { margin-top:2rem; }

@media (max-width:560px) {
  .family-table th, .family-table td { padding:.55rem .4rem; }
  .family-table table { font-size:.86rem; overflow-wrap:break-word; }
}
@media print {
  @page { size:A4; margin:15mm; }
  body { background:#fff; color:#000; font-size:11pt; }
  body > :not(main), .family-guide > :not(#family-chart), .family-print-action { display:none !important; }
  .family-guide { max-width:none; padding:0; margin:0; }
  #family-chart h2 { font-size:19pt; margin:0 0 12pt; }
  .family-table { overflow:visible; }
  #family-chart table { break-inside:avoid; }
  #family-chart th, #family-chart td { color:#000; background:#fff; border:1px solid #777; }
  #family-chart td { height:26pt; }
}