@font-face{font-family:FamilyArial;src:local('Arial');font-display:swap}
:root{--green:#285b49;--deep:#214434;--cream:#fffaf1;--paper:#fffefb;--ink:#283e34;--muted:#657366;--line:#b6c7af;--peach:#fae4d5;--sage:#e5eedf;--gold:#dca84f;--font:18px;color-scheme:light}
*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:FamilyArial,Tahoma,Arial,sans-serif;font-size:var(--font);line-height:1.65}body.large-type{--font:21px}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #b87516;outline-offset:4px}button{touch-action:manipulation}button:disabled{cursor:default}button[hidden],[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1{font-size:clamp(34px,4.3vw,48px);font-weight:700;line-height:1.25}h2{font-size:1.4em;line-height:1.4}h3{font-size:1.1em}.skip{position:absolute;top:-80px;right:20px;background:var(--green);color:white;padding:12px;z-index:20}.skip:focus{top:10px}
.topbar{background:var(--paper);border-bottom:1px solid #e8e8dc}.top-inner{max-width:1180px;margin:auto;padding:17px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{border:0;background:none;display:flex;gap:10px;align-items:center;text-align:right;font-size:26px;font-weight:700}.tree-mark{display:grid;place-items:center;background:var(--sage);border-radius:50%;width:50px;height:50px;font-size:38px;color:var(--green)}.brand-sub{display:block;font-weight:400;font-size:13px;color:var(--muted);line-height:1.4}.header-actions{display:flex;gap:10px}.soft-button{min-height:48px;border:1px solid #d5dfd0;background:transparent;border-radius:12px;padding:8px 16px;font-size:16px;font-weight:700}.soft-button:hover,.soft-button[aria-pressed=true]{background:var(--sage)}.soft-button span{margin-right:8px}.soft-button[aria-pressed=true]{border-color:var(--green)}
main{max-width:1120px;margin:auto;padding:0 28px}.intro{display:flex;align-items:center;justify-content:space-between;padding:32px 0 28px}.intro p{color:var(--muted);margin-top:9px}.breadcrumb{background:none;border:0;color:var(--green);padding:4px 0 9px;font-size:15px;min-height:44px}.breadcrumb span{padding-right:8px}.sprig{position:relative;width:115px;height:120px;margin-left:25px;transform:rotate(-15deg)}.sprig span{position:absolute;left:50px;top:15px;height:105px;border-left:3px solid #9bb19a;transform:rotate(12deg)}.sprig i,.sprig b,.sprig em{position:absolute;display:block;width:39px;height:65px;border-radius:90% 5% 90% 5%;background:#d6e4c7;left:50px;top:8px;transform:rotate(25deg)}.sprig b{left:15px;top:35px;transform:rotate(-65deg);background:#f0d399}.sprig em{left:53px;top:64px;width:31px;height:47px;background:#e9bfaa}
.branch-tree{padding:0 0 32px}.founders,.couple{display:flex;align-items:center;justify-content:center;gap:0}.person{min-height:88px;border:1px solid #d1dccb;border-radius:17px;background:var(--paper);padding:15px 18px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px;min-width:160px;max-width:270px;box-shadow:0 3px 0 #dae3d326;transition:background .15s}.person:hover{background:#f1f5e9}.person .person-name{font-weight:700;font-size:1.1em;line-height:1.4}.person .sub{font-size:.8em;color:var(--muted)}.person.root-person{background:var(--sage);min-width:225px;border-color:#c3d2ba;min-height:102px}.marriage{width:44px;height:1px;background:var(--line);flex-shrink:0;position:relative}.marriage:after{content:'';position:absolute;width:9px;height:9px;background:var(--paper);border:2px solid #8da181;border-radius:50%;top:-4px;left:calc(50% - 4px)}.trunk{height:32px;border-left:2px solid var(--line);width:0;margin:auto}.choose-label{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:5px 0 18px}.choose-label h2{font-size:1em}.choose-label span{font-size:.83em;color:var(--muted)}.children-nav{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.child-option{border:1px solid #d5ddcd;border-radius:14px;padding:13px 8px;background:var(--paper);min-height:80px;display:flex;align-items:center;justify-content:center;gap:4px;flex-direction:column}.child-option strong{font-size:1.05em}.child-option small{font-size:.76em;color:var(--muted)}.child-option:hover{background:var(--sage)}.child-option[aria-pressed=true]{background:var(--green);color:white;border-color:var(--green);box-shadow:0 4px 0 #173b2920}.child-option[aria-pressed=true] small{color:#e0ebd9}
.family-section{scroll-margin-top:24px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:14px;margin:8px 0 19px}.eyebrow{color:var(--muted);font-size:.8em;margin-bottom:4px}.selection-note{font-size:.85em;color:var(--green);padding:5px 13px;background:#edf2e6;border-radius:25px;white-space:nowrap}.family-panel{background:var(--paper);border:1px solid #e2e5d9;border-radius:24px;padding:30px 24px 28px}.family-panel .person{background:#fffaf1;box-shadow:none}.family-panel .person:hover{background:#f8eedc}.family-panel .couple .person{min-width:200px}.missing-partner{text-align:center;color:var(--muted);font-size:.85em;margin:11px 0 0}.desc-tree{position:relative;padding-top:56px}.desc-tree:before{content:'';position:absolute;top:0;right:50%;height:29px;border-right:2px solid var(--line)}.grandchildren{display:grid;grid-template-columns:repeat(var(--count),minmax(0,1fr));gap:20px;position:relative}.grandchild-wrap{position:relative;padding-top:0;min-width:0}.grandchild-wrap:before{content:'';position:absolute;top:-28px;width:calc(100% + 20px);height:28px;border-top:2px solid var(--line);right:-10px}.grandchild-wrap:first-child:before{right:50%;width:calc(50% + 10px)}.grandchild-wrap:last-child:before{width:calc(50% + 10px)}.grandchild-wrap:after{content:'';position:absolute;right:50%;height:28px;top:-28px;border-right:2px solid var(--line)}.grandchildren .person{width:100%;min-width:0;max-width:none;background:#eff4e9;min-height:83px}.grandchildren .person .person-name{font-size:1.05em}.empty-family{text-align:center;margin-top:28px;padding:18px;color:var(--muted);background:#f5f6ee;border-radius:12px;font-size:.9em}.tap-hint{color:var(--muted);text-align:center;font-size:.83em;margin:15px 0 0}footer{text-align:center;padding:32px 0 24px;color:var(--muted)}footer p{font-size:.95em}.footer-mark{font-size:30px;color:#698e61}footer small{display:block;font-size:13px;margin-top:8px}.print-tree{display:none}
dialog{border:0;border-radius:22px;background:var(--paper);color:var(--ink);width:min(530px,calc(100% - 28px));max-height:88vh;padding:32px;box-shadow:0 18px 70px #223c3338;direction:rtl}dialog::backdrop{background:#18392b66}.close{position:absolute;left:15px;top:12px;width:46px;height:46px;border:0;border-radius:50%;background:#eef1e7;font-size:30px;line-height:1}.dialog-avatar{display:grid;place-items:center;width:63px;height:63px;border-radius:50%;background:var(--sage);font-size:40px;color:var(--green);margin-bottom:10px}dialog h2{font-size:1.5em}.person-note{color:var(--muted);font-size:.9em;margin-top:6px}dl{margin:24px 0;display:grid;grid-template-columns:1fr 1.5fr;gap:0}dt,dd{margin:0;padding:12px 0;border-bottom:1px solid #e1e5d9}dt{color:var(--muted);font-size:.86em}dd{font-size:.96em;font-weight:700}.primary-button{background:var(--green);color:white;border:0;padding:11px 20px;border-radius:12px;width:100%;min-height:49px}.overview-roots{display:flex;align-items:center;justify-content:center;margin:25px 0;gap:12px}.overview-roots .person{min-width:0;flex:1;padding:15px 8px}.overview-branches{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:13px 0}.overview-item{padding:13px;background:#f1f3ea;border-radius:12px;text-align:center;border:1px solid #dce2d3}.overview-item small{display:block;font-size:.75em;color:var(--muted)}button.overview-item{background:var(--green);color:white}button.overview-item small{color:#e4eddb}.overview-note{font-size:.84em;color:var(--muted)}
@media(max-width:760px){main{padding:0 18px}.top-inner{padding:13px 18px}.intro{padding:25px 0}.sprig{transform:scale(.75) rotate(-15deg);width:75px;margin-left:0}.children-nav{grid-template-columns:repeat(3,1fr)}.person.root-person{min-width:0;flex:1;max-width:230px}.family-panel{padding:24px 15px}.family-panel .couple .person{min-width:0;flex:1}.grandchildren{gap:12px}.grandchild-wrap:before{width:calc(100% + 12px);right:-6px}.grandchild-wrap:first-child:before,.grandchild-wrap:last-child:before{width:calc(50% + 6px)}.grandchild-wrap:first-child:before{right:50%}.grandchildren.many{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-right:12px;border-right:2px solid var(--line);padding-right:18px}.grandchildren.many .grandchild-wrap:before{width:18px;height:0;right:-20px;top:50%;border-top:2px solid var(--line)}.grandchildren.many .grandchild-wrap:after{display:none}.grandchildren.many .grandchild-wrap:nth-child(even):before{width:12px;right:-12px}.desc-tree:has(.many):before{right:calc(50% - 1px)}.desc-tree:has(.many):after{content:'';position:absolute;top:27px;right:12px;left:50%;height:29px;border-top:2px solid var(--line);border-right:2px solid var(--line)}.print-button{display:none}}
@media(max-width:430px){body{--font:18px}.top-inner{gap:8px}.brand{font-size:23px;padding:0;gap:7px}.tree-mark{width:40px;height:40px;font-size:32px}.brand-sub{font-size:11px}.soft-button{padding:8px 10px;font-size:14px}.intro p{font-size:16px}.sprig{display:none}.founders .person{padding:14px 8px}.person.root-person .person-name{font-size:1em}.marriage{width:26px}.choose-label{align-items:start;flex-direction:column;gap:1px}.section-heading{align-items:start}.selection-note{font-size:.75em}.family-panel .person{padding:12px 7px}.grandchildren:not(.many){grid-template-columns:1fr;gap:14px;margin-right:12px;padding-right:18px;border-right:2px solid var(--line)}.grandchildren:not(.many) .grandchild-wrap:before{right:-20px;top:50%;width:18px;height:0;border-top:2px solid var(--line)}.grandchildren:not(.many) .grandchild-wrap:after{display:none}.grandchildren .person{min-height:65px}.desc-tree:after{content:'';position:absolute;top:27px;right:12px;left:50%;height:29px;border-top:2px solid var(--line);border-right:2px solid var(--line)}.grandchildren.many{grid-template-columns:1fr}.grandchildren.many .grandchild-wrap:nth-child(even):before{right:-20px;width:18px}.family-panel .person .person-name{font-size:1em}dialog{padding:27px 20px}.child-option{min-height:75px}.child-option strong{font-size:20px}}
.founders,.couple{position:relative}.founders:has(.marriage)::after,.couple.has-children:has(.marriage)::after{content:'';position:absolute;top:50%;bottom:0;right:calc(50% - 1px);border-right:2px solid var(--line);pointer-events:none}.grandchildren .person{position:relative;z-index:1}
.marriage{z-index:2}.marriage::after{content:'♥';display:grid;place-items:center;position:absolute;left:50%;top:50%;width:28px;height:28px;transform:translate(-50%,-50%);border:0;border-radius:0;background:transparent;color:#b77770;font-family:Arial,sans-serif;font-size:24px;line-height:1}
.founders:has(.marriage)::after,.couple.has-children:has(.marriage)::after,.desc-tree::before,.desc-tree:has(.many)::before{left:50%;right:auto;width:2px;border:0;background:var(--line);transform:translateX(-50%)}
.trunk{width:2px;border:0;background:var(--line)}
@media(min-width:761px){.grandchild-wrap::after{left:50%;right:auto;width:2px;border:0;background:var(--line);transform:translateX(-50%)}}
@media(max-width:760px){#descendants .grandchildren{grid-template-columns:1fr;gap:14px;margin:0;padding-right:26px;border:0}#descendants .grandchildren .grandchild-wrap::before{right:-14px;top:50%;width:14px;height:0;border:0;border-top:2px solid var(--line)}#descendants .grandchildren .grandchild-wrap::after{display:block;right:-14px;top:-14px;bottom:0;height:auto;border:0;border-right:2px solid var(--line)}#descendants .grandchildren .grandchild-wrap:first-child::after{top:0}#descendants .grandchildren .grandchild-wrap:last-child::after{bottom:50%}#descendants .desc-tree::after{content:'';position:absolute;top:27px;right:12px;left:50%;height:29px;border-top:2px solid var(--line);border-right:2px solid var(--line)}}
@media(max-width:380px){.brand-sub{display:none}.brand{font-size:22px}.header-actions{gap:0}.soft-button{padding-inline:9px}.child-option strong{font-size:1.1em}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media print{@page{size:A3 landscape;margin:10mm}html,body{background:white!important;margin:0;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}.topbar,.intro,.branch-tree,.family-section,footer,dialog,.skip{display:none!important}main{max-width:none;width:100%;padding:0;margin:0}.print-tree{display:block;width:100%;break-inside:avoid;page-break-inside:avoid}.print-tree svg{display:block;width:100%;height:auto;max-height:267mm;margin:0 auto}}
/* Keep readable family data available until the interactive app fully starts. */
body:not(.app-ready) .branch-tree,body:not(.app-ready) .family-section,body:not(.app-ready) .header-actions,body:not(.app-ready) .breadcrumb{display:none}
body:not(.app-ready) .brand{pointer-events:none}
.app-ready .preview-fallback{display:none}
.read-notice{color:var(--muted);font-size:.9em;margin-bottom:22px}
.read-family{background:var(--paper);border:1px solid #e2e5d9;border-radius:24px;padding:24px;margin-bottom:24px;break-inside:avoid}
.read-family>h2{margin-bottom:20px}.read-parents,.read-children{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.read-person{background:var(--cream);border:1px solid #d1dccb;border-radius:17px;padding:20px;min-width:0;text-align:center}
.read-children .read-person{background:#eff4e9}.read-person h3{font-size:1.15em}.read-person dl{margin:14px 0 0;text-align:right;font-size:.9em;grid-template-columns:1fr 1.4fr;column-gap:12px}.read-person dt,.read-person dd{padding:8px 0;overflow-wrap:anywhere}.read-memorial{color:var(--muted);font-size:.85em}.read-children-label{margin:22px 0 14px}
@media(max-width:600px){.read-family{padding:18px 14px}.read-parents,.read-children{grid-template-columns:1fr}.read-person{padding:17px}}
@media print{body:not(.app-ready) .print-tree{display:none}.read-family{break-inside:auto}.read-person{break-inside:avoid}}