.tree-source-portrait{height:125px;width:100%;display:block}.family-tree-card:has(.tree-source-portrait){min-height:405px}.tree-unknown{min-height:78px!important;height:78px;padding:10px;color:#647081}.tree-unknown p{font-size:12px;margin:0}.tree-unknown .tree-role{margin-bottom:5px}.charlie-source-credit{font-size:13px;line-height:1.6}.charlie-five-generation .family-tree-scroll{max-height:1050px;overflow:auto}.charlie-five-generation .family-tree-diagram>.family-tree-branch{margin:0}.charlie-five-generation .family-tree-card:not(.tree-unknown){min-height:290px}.charlie-five-generation .family-tree-parents{gap:12px}@media(max-width:600px){.charlie-five-generation .family-tree-scroll{max-height:650px}}
/* Danni: six compact columns, preserving the conventional sire-over-dam structure. */
.danni-five-generation.wrap{max-width:1480px}
.danni-five-generation .family-tree-scroll{max-height:1000px;padding:18px 8px;overflow:auto}
.danni-five-generation .family-tree-diagram{padding:5px 0}
.danni-five-generation .family-tree-diagram>.family-tree-branch{margin:0}
.danni-five-generation .family-tree-card,.danni-five-generation .family-tree-card:has(.tree-photo){width:174px;min-height:100px;padding:9px 8px}
.danni-five-generation .tree-photo img{height:76px}
.danni-five-generation .tree-dog-name{font:13px/1.4 Georgia,serif;padding:6px 0;overflow-wrap:anywhere}
.danni-five-generation .tree-role{font-size:10px;letter-spacing:.6px;margin-bottom:5px}
.danni-five-generation .tree-profile,.danni-five-generation .tree-dob,.danni-five-generation .tree-external{font-size:11px;line-height:1.4;margin:4px 0}
.danni-five-generation .tree-no-photo{height:18px;font-size:14px}
.danni-five-generation .family-tree-parents{gap:10px;padding-left:12px}
.danni-five-generation .family-tree-parents:after{width:12px}
.danni-five-generation .tree-stem{width:12px}
.danni-five-generation .tree-unknown{width:174px;min-height:65px!important;height:65px}
@media(max-width:600px){.danni-five-generation .family-tree-scroll{max-height:680px}.danni-five-generation .tree-offspring .family-tree-card{width:100%}}

/* Compact picture pedigrees: photographs unchanged in size; less text and card furniture. */
.compact-picture-pedigree.wrap{max-width:1480px}
.compact-picture-pedigree .family-tree-card,.compact-picture-pedigree .family-tree-card:has(.tree-photo),.compact-picture-pedigree .family-tree-card:has(.tree-source-portrait){width:174px;min-height:0;padding:6px;border-radius:2px}
.compact-picture-pedigree .tree-photo img,.compact-picture-pedigree .tree-source-portrait{height:125px;width:100%;object-fit:contain}
.compact-picture-pedigree .tree-dog-name{font:12px/1.3 Georgia,serif;padding:5px 0;margin:0}
.compact-picture-pedigree .tree-registered-name{font-size:10px;line-height:1.3;margin:3px 0}
.compact-picture-pedigree .tree-role{font-size:9px;letter-spacing:.4px;margin:0 0 4px}
.compact-picture-pedigree .tree-profile,.compact-picture-pedigree .tree-dob,.compact-picture-pedigree .tree-external{font-size:10px;line-height:1.3;margin:3px 0;padding:0}
.compact-picture-pedigree .family-tree-parents{gap:8px;padding-left:10px}
.compact-picture-pedigree .family-tree-parents:after{width:10px}
.compact-picture-pedigree .tree-stem{width:10px}
.compact-picture-pedigree .tree-no-photo{height:14px;font-size:12px}
.compact-picture-pedigree .tree-unknown{width:174px;height:52px;min-height:52px!important;padding:5px}
.compact-picture-pedigree .tree-unknown p{font-size:10px;line-height:1.3}
.compact-picture-pedigree .family-tree-scroll{height:900px;max-height:75vh;padding:12px 8px;overflow:auto}
.compact-picture-pedigree .family-tree-diagram{width:max-content;min-width:max-content;padding:5px 0}
.tree-view-options{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.tree-view-options button{font:inherit;font-size:14px;padding:8px 12px;background:#14233a;color:#69cefa;border:1px solid #a98d56;cursor:pointer}
.tree-view-options button[aria-pressed=true]{background:#eadab7;color:#14233a}
.tree-view-options button:focus-visible{outline:3px solid #69cefa;outline-offset:3px}

.compact-picture-pedigree .family-tree-diagram .family-tree-card{min-height:0!important;height:auto}.compact-picture-pedigree .family-tree-diagram .tree-unknown{height:52px;min-height:52px!important}

/* Size regular photo trees to the content of each card. */
.family-tree-page:not(.compact-picture-pedigree) {
  --tree-branch-gap: 14px;
  --tree-connector: 12px;
}
.family-tree-page:not(.compact-picture-pedigree) .family-tree-scroll {
  padding: 16px 12px;
}
.family-tree-page:not(.compact-picture-pedigree) .family-tree-diagram {
  padding: 4px;
}
.family-tree-page:not(.compact-picture-pedigree) .family-tree-card {
  width: 184px;
  min-height: 0;
  padding: 10px;
}
.family-tree-page:not(.compact-picture-pedigree) .tree-role {
  margin-bottom: 6px;
}
.family-tree-page:not(.compact-picture-pedigree) .tree-dog-name {
  font-size: 19px;
  padding: 6px 0 2px;
}
.family-tree-page:not(.compact-picture-pedigree) .tree-no-photo {
  height: 18px;
  font-size: 14px;
}
.family-tree-page:not(.compact-picture-pedigree) :is(.tree-dob, .tree-external) {
  margin-block: 4px;
}
.family-tree-page:not(.compact-picture-pedigree) .family-tree-parents {
  gap: var(--tree-branch-gap);
  padding-left: var(--tree-connector);
}
.family-tree-page:not(.compact-picture-pedigree) .tree-stem {
  width: var(--tree-connector);
}
.family-tree-page:not(.compact-picture-pedigree) .family-tree-parents::after {
  content: none;
}
/* Anchor each connector to its own branch's centre, even at different card heights. */
.family-tree-page:not(.compact-picture-pedigree) .family-tree-parents > .family-tree-branch::before {
  content: '';
  position: absolute;
  top: 50%;
  right: 100%;
  width: var(--tree-connector);
  border-top: 1px solid #b99b5a;
}
.family-tree-page:not(.compact-picture-pedigree) .family-tree-parents > .family-tree-branch:not(:only-child)::after {
  content: '';
  position: absolute;
  left: calc(-1 * var(--tree-connector));
  border-left: 1px solid #b99b5a;
}
.family-tree-page:not(.compact-picture-pedigree) .family-tree-parents > .family-tree-branch:first-child::after {
  top: 50%;
  bottom: calc(-1 * var(--tree-branch-gap));
}
.family-tree-page:not(.compact-picture-pedigree) .family-tree-parents > .family-tree-branch:last-child::after {
  top: 0;
  bottom: 50%;
}
@media (max-width: 600px) {
  .family-tree-page:not(.compact-picture-pedigree) .tree-offspring .family-tree-card {
    width: 100%;
    min-width: 0;
  }
}

.tree-colour { font-size: 12px; line-height: 1.4; margin: 4px 0; color: #455366; }
.compact-picture-pedigree .tree-colour { font-size: 10px; margin: 3px 0; }

.family-tree-page:not(.compact-picture-pedigree) .family-tree-card:has(.tree-source-portrait) { min-height: 0; }
