main[hidden], #familyPanel[hidden] { display: none !important; }
#familyBar, #familyStatus, #familyPanel {
  max-width: 960px;
  margin-inline: auto;
  padding-inline: 20px;
}
#familyBar:not(:empty) {
  margin-top: 12px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
#familyBar button { margin-inline-start: auto; }
#familyStatus:not(:empty) {
  padding-block: 10px;
  color: #812447;
}
#familyPanel {
  margin: 24px auto;
  width: min(960px, calc(100% - 28px));
  box-sizing: border-box;
  padding-block: 22px;
  color: #322247;
  background: #fff;
  border: 1px solid #e7ddf6;
  border-radius: 24px;
}
#familyPanel h1 { color: #432665; margin: 0 0 12px; }
#familyPanel h2 { margin: 0 0 4px; }
#familyPanel form { max-width: 400px; }
#familyPanel label { display: block; font-weight: 700; margin: 0 0 14px; }
#familyPanel input {
  display: block;
  box-sizing: border-box;
  width: min(100%, 430px);
  margin-top: 4px;
  padding: 10px 12px;
  border: 1px solid #a597b9;
  border-radius: 10px;
  background: #fff;
  color: #322247;
  font: inherit;
}
#familyPanel form [role="alert"] { color: #812447; }
.family-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-block: 14px; }
#familyBar button, #familyStatus button, #familyPanel button, .family-result button {
  border: 0;
  border-radius: 14px;
  background: #69419b;
  color: #fff;
  padding: 9px 14px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
#familyPanel button:disabled { opacity: .6; cursor: wait; }
.family-children { display: grid; gap: 12px; margin-top: 16px; }
.family-child { background: #f8f3ff; padding: 16px; border-radius: 16px; overflow-wrap: anywhere; }
.family-child p { margin-block: 5px 10px; }
.family-child strong { color: #533082; }
.family-child summary { cursor: pointer; font-weight: 700; }
.family-history { padding-inline-start: 24px; }
.family-history li { margin-block: 5px; }
.family-result {
  margin-block: 16px 4px;
  border-radius: 14px;
  padding: 12px;
  color: #412362;
  background: #f1e7fd;
  font-weight: 700;
}