/* 親子の相性（/parent-child/。2026-10-03）。フォームは components.css の .birth-form をそのまま使う。 */
.family-form-card { padding: 0; overflow: hidden; }
.family-form.birth-form { border-right: 0; }
.family-toggles { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-bottom: 20px; }
.family-toggles .compare-toggle { margin: 0; }
.family-inputs { display: grid; gap: 28px; }
.family-inputs > fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.family-inputs > fieldset > legend { width: 100%; padding: 0 0 12px; color: var(--nc-900); font: 700 1.125rem/1.5 var(--font-sans); border-bottom: 1px solid var(--nc-200); }
@media (min-width: 1024px) {
  .family-inputs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
}
.family-result { display: grid; gap: 24px; margin-block: 32px; }
.family-result[hidden] { display: none; }
.family-pair-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
.family-pair-head h3 { margin: 0; }
.family-level { padding: 4px 12px; border-radius: 999px; font-size: 0.875rem; font-weight: 700; background: var(--nc-100); color: var(--nc-900); }
.family-pair.level-high .family-level { background: var(--nc-900); color: #fff; }
.family-pair.level-low .family-level { background: transparent; border: 1px solid var(--nc-300); }
.family-relation { margin-top: 12px; font-weight: 700; color: var(--nc-900); }
.family-relation span { font-weight: 400; color: var(--muted); }
.family-conclusion { font-size: 1.0625rem; color: var(--nc-900); }
.family-level-text { padding: 12px 16px; border-left: 3px solid var(--nc-300); background: var(--nc-50); }
.family-pair h4, .family-balance h4 { margin: 24px 0 8px; font-size: 1rem; }
.family-list { margin: 0; padding-left: 1.2em; }
.family-list li { margin: 0 0 8px; line-height: 1.8; overflow-wrap: anywhere; }
.family-hints li { color: var(--nc-900); }
.family-evidence { margin-top: 20px; }
.family-evidence summary, .family-method summary { cursor: pointer; font-weight: 700; }
.family-evidence .family-list li { font-size: 0.875rem; color: var(--muted); }
.family-score strong { font-size: 2rem; line-height: 1; margin-right: 4px; }
.family-totals { font-size: 0.875rem; color: var(--muted); }
.family-notice { border: 1px solid var(--nc-300); }
.about-faq { margin: 0; }
.about-faq dt { margin-top: 20px; font-weight: 700; color: var(--nc-900); }
.about-faq dt:first-child { margin-top: 0; }
.about-faq dd { margin: 6px 0 0; line-height: 1.8; color: var(--muted); }
