/* A manuscript-inspired frame around a semantic, source-aware family diagram. */
#genealogia{scroll-margin-top:0}
.medieval{padding:5rem clamp(1rem,4vw,5rem);background:#193129;color:#392b21}
.manuscript{max-width:1500px;margin:auto;padding:3rem clamp(1rem,3vw,3rem) 2rem;background:radial-gradient(ellipse at 50% 25%,#fcf5e5 0%,#efe0c1 100%);border:1px solid #c0a16b;outline:1px solid #998054;outline-offset:8px;box-shadow:inset 0 0 80px #ac85441a,0 24px 70px #071c1866;position:relative}
.manuscript-heading{text-align:center;max-width:800px;margin:auto}
.heraldry{margin:0 auto 1.2rem;display:grid;justify-items:center;gap:.7rem}
.heraldry img{width:150px;height:200px;object-fit:contain}
.heraldry figcaption{font-family:var(--serif);text-transform:uppercase;font-size:1rem;letter-spacing:.26em;color:#772f2b}
.manuscript-heading h1{font-family:var(--serif);font-size:clamp(2.2rem,4vw,4rem);font-weight:500;line-height:1.12;letter-spacing:-.035em;margin:.6rem 0;color:#60251f}
.tree-subtitle{font-family:var(--serif);font-size:1.25rem;margin:1rem 0}
.heraldic-note{font-size:.875rem;line-height:1.7;color:#655137;max-width:700px;margin:1.5rem auto 2rem}
.tree-help{font-size:.875rem;color:#66513b;margin:1rem 0}
.tree-scroll{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-color:#a9874c #e9dbc0;border-block:1px solid #c3ab7d;padding:1.5rem 0 2.5rem}
.family-tree{position:relative;min-width:1510px;margin:0 auto}
.tree-connections{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.tree-connections path{fill:none;stroke:#9a8970;stroke-width:1.5}
.tree-generations{position:relative;display:flex;flex-direction:column;gap:110px}
.generation{display:flex;justify-content:center;gap:34px;position:relative;min-height:130px;padding-inline:16px}
.generation-mark{position:absolute;left:10px;top:0;font-family:var(--serif);color:#a28b65;font-size:.875rem;pointer-events:none}
.tree-person{position:relative;width:174px;flex:0 0 174px;min-height:130px;padding:.85rem .55rem;border:1px solid #bca984;background:#f5ead4;color:#493728;cursor:pointer;text-align:center;box-shadow:0 4px 8px #7052200d}
.tree-person::after{content:'';position:absolute;inset:6px;border:1px solid #c7b07e66;pointer-events:none}
.tree-person strong{display:block;font-family:var(--serif);font-weight:500;font-size:1.25rem;line-height:1.2;margin:.15rem 0}
.tree-person .surname{display:block;font-family:var(--serif);font-size:.875rem}
.tree-person small{display:block;color:#6b5943;font-size:.875rem;line-height:1.4;margin-top:.35rem}
.tree-person:hover{border-color:#762e28;background:#fffbf0}
.tree-person[aria-pressed=true]{background:#702e29!important;color:#fff3d7;border-color:#4d211e;box-shadow:0 6px 18px #4c241b22}
.tree-person[aria-pressed=true] small{color:#f4dfb8}
.medieval :focus-visible{outline:3px solid #215b6a;outline-offset:4px}
.medieval .person-panel{max-width:850px;text-align:left;margin:2rem auto 0;padding:clamp(1rem,3vw,2rem);border:1px solid #bda16a;background:#fff8e7;box-shadow:inset 0 0 0 5px #f2e6cd}
.medieval .person-panel h3{color:#672c27;font-size:2rem;line-height:1.2;margin:.5rem 0 1rem}
.medieval .person-panel p{color:#55432f;font-size:1rem;margin:.5rem 0}
.tree-return{margin-top:1rem;padding:.65rem 1rem;color:#fff4dc;background:#672c27;border:1px solid #672c27;cursor:pointer;font-size:.875rem}
.tree-source,.crest-credit{max-width:850px;margin:1.2rem auto 0;font-size:.875rem;color:#6d5840;line-height:1.7}
.crest-credit{font-size:.75rem;border-top:1px solid #c9b285;padding-top:1rem}
.crest-credit a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:600px){.medieval{padding:2.5rem .8rem}.manuscript{outline-offset:3px;padding:2rem .75rem 1.5rem}.heraldry img{width:120px;height:160px}.tree-scroll{margin-inline:-.75rem}.tree-help{font-size:.875rem}.generation-mark{display:none}.manuscript-heading h1{font-size:2.3rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.person-biography{margin-top:1.25rem;padding:1.25rem 0;min-height:170px;border-top:1px solid #d7c5a0}
.person-biography h4{font-family:var(--serif);font-size:1.4rem;font-weight:500;color:#672c27;margin:0 0 .75rem}
.person-biography p{white-space:pre-line}
.person-biography .biography-empty{font-style:italic;color:#74634d}

/* The seven couples fit the available width, including a phone screen. */
.family-tree{min-width:0;width:100%;max-width:620px}
.tree-scroll{padding:16px 0;overflow-x:visible}
.tree-generations{gap:24px}
.generation{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;min-height:0;padding-inline:2px}
.generation-mark{display:none}
.tree-person{width:100%;min-width:0;min-height:70px;padding:8px 6px;overflow-wrap:anywhere}
.tree-person strong{font-size:1rem;line-height:1.15;margin:0}
.tree-person .surname{font-size:.875rem;line-height:1.2}
.tree-person small{font-size:.875rem;line-height:1.2;margin-top:3px}
.tree-person::after{inset:3px}
.branch-tree{display:block}
.family-root,.family-descendants{list-style:none;margin:0;padding:0}
.family-branch{position:relative;margin:0;padding:0}
.family-couple{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;position:relative}
.family-couple:not(.single-person)::before{content:'';position:absolute;left:50%;top:50%;width:14px;transform:translateX(-50%);border-top:3px double #9a8970}
.family-descendants{margin:14px 0 0 10px;padding-left:14px;border-left:1px solid #9a8970}
.family-descendants>.family-branch{margin-bottom:18px}
.family-descendants>.family-branch::before{content:'';position:absolute;left:-14px;top:34px;width:14px;border-top:1px solid #9a8970}
.family-couple.single-person{grid-template-columns:minmax(0,1fr)}
.family-tree{max-width:850px}
@media(max-width:600px){.family-descendants{margin-left:3px;padding-left:6px}.family-descendants>.family-branch::before{left:-6px;width:6px}.family-couple{gap:10px}.family-couple:not(.single-person)::before{width:10px}}
.family-tree{max-width:none}
.kin-tree{display:block}
.kin-ancestry{max-width:760px;margin:auto;display:grid;gap:26px}
.kin-stage{position:relative}
.kin-stage:not(:last-child)::after{content:'';position:absolute;left:50%;bottom:-22px;height:18px;border-left:1px solid #ad9368}
.kin-label{display:block;font:500 .875rem/1.4 var(--sans,sans-serif);letter-spacing:.025em;color:#786142;margin:0 0 10px}
.kin-stage>h3{text-align:center}
.kin-stage-row{display:flex;gap:16px;align-items:stretch;justify-content:center;flex-wrap:wrap}
.kin-stage-row>.kin-card{flex:1 1 260px;max-width:540px}
.kin-card{min-width:0;padding:16px;background:#fcf5e6;border:1px solid #c3a574;border-radius:4px}
.kin-couple{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.kin-couple>.tree-person,.kin-spouse{flex:1 1 125px;min-width:0}
.kin-spouse>.kin-label{margin-bottom:4px}
.kin-tree .tree-person{min-height:76px;background:#fffaf0;padding:10px;border:1px solid #d7c6a6;box-shadow:none;border-radius:3px}
.kin-tree .tree-person::after{display:none}
.kin-tree .tree-person strong{font-size:1.1rem;line-height:1.25}
.kin-tree .tree-person .surname,.kin-tree .tree-person small{font-size:.9375rem}
.kin-tree .tree-person:hover{border-color:#752f29;background:#f0e1c3}
.kin-branches{margin-top:36px}
.kin-branches-title{font:500 1.6rem/1.3 var(--serif);text-align:center;color:#672c27;margin:0 0 20px}
.kin-branch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:start}
.kin-branch-grid>.kin-card{border-top:3px solid #9f7d48}
.kin-children{border-top:1px solid #d7c6a6;margin-top:16px;padding-top:16px;display:grid;gap:10px}
.kin-children>.kin-label{margin:0}
.kin-children>.kin-card{padding:10px;background:#f5ead5}
@media(max-width:700px){.kin-branch-grid{grid-template-columns:1fr}.kin-card{padding:12px}.kin-ancestry{gap:26px}.kin-stage-row{gap:10px}}
.tree-scroll:has(.classic-tree){overflow:auto;padding:20px 0;max-width:100%}
.classic-tree{min-width:0;max-width:none;margin:0 auto;position:relative}
.classic-generations{position:absolute;left:0;top:0;width:max-content;transform-origin:top left;padding:10px 16px 24px}
.classic-root,.classic-children{display:flex;justify-content:center;list-style:none;margin:0;padding:0;position:relative}
.classic-branch{position:relative;display:flex;flex-direction:column;align-items:center;padding:32px 10px 0}
.classic-root>.classic-branch{padding-top:0}
.classic-couple{display:flex;align-items:stretch;gap:16px;position:relative}
.classic-couple>.tree-person{width:142px;min-width:142px;min-height:94px;flex:none;padding:10px 6px}
.classic-couple>.tree-person+ .tree-person::before{content:'';position:absolute;left:-17px;top:46px;width:16px;border-top:3px double #96733f}
.classic-couple .tree-person strong{font-size:1rem}
.classic-children{padding-top:26px}
.classic-children::before{content:'';position:absolute;left:50%;top:0;height:26px;border-left:2px solid #96733f}
.classic-children>.classic-branch::before{content:'';position:absolute;top:0;left:0;right:0;border-top:2px solid #96733f}
.classic-children>.classic-branch::after{content:'';position:absolute;top:0;left:50%;height:32px;border-left:2px solid #96733f}
.classic-children>.classic-branch:first-child::before{left:50%}
.classic-children>.classic-branch:last-child::before{right:50%}
.classic-children>.classic-branch:only-child::before{display:none}
.tree-zoom{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:18px 0 8px}
.tree-zoom button{font:inherit;font-size:.9375rem;min-height:44px;padding:8px 12px;border:1px solid #ac8e59;background:#fff8e7;color:#672c27;cursor:pointer}
.tree-zoom button:hover{background:#eddbb8}
.zoom-value{font-size:.875rem;color:#6b5943;margin-left:6px}
.tree-documents{display:grid;gap:32px;margin-top:40px}
.tree-documents figure{margin:0}
.tree-documents figcaption{font:500 1.35rem/1.4 var(--serif);color:#672c27;margin-bottom:12px}
.tree-documents a{display:block;cursor:zoom-in}
.tree-documents img{display:block;width:100%;height:auto;border:1px solid #c3a574}
.classic-branch>.tree-person{width:142px;min-height:94px}
.marriage-label{font-size:.9375rem;color:#672c27;margin:0 0 8px}

.person-documents{margin-top:22px;padding-top:18px;border-top:1px solid #cbb58b}
.person-documents h4{font-family:var(--serif);font-size:1.3rem;margin:0 0 12px}
.person-document-list{padding-left:1.2rem;display:grid;gap:14px;margin:0 0 20px}
.person-document-list a{color:#6b3028;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere;line-height:1.6}
.person-document-context{display:block;font-size:.875rem;color:#69563d;margin-top:3px}
.person-document-list a:focus-visible{outline:2px solid #28646e;outline-offset:4px}