:root{--ink:#253d33;--muted:#778176;--green:#365c48;--paper:#f6f4ee;--line:#dddeda;--gold:#b68c50;--maternal:#708a70;--paternal:#9b8170;--white:#fffefa;--shadow:0 12px 40px #263b3010}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit}.topbar{display:flex;justify-content:space-between;align-items:center;padding:24px max(24px,calc((100vw - 1440px)/2));border-bottom:1px solid var(--line);gap:20px;background:var(--white)}.brand{text-decoration:none;display:flex;gap:14px;align-items:center;font-weight:650;letter-spacing:-.02em}.brand small{display:block;color:var(--muted);font-size:11px;font-weight:400;margin-top:3px}.brand-mark{font-size:40px;color:var(--green)}.account{display:flex;align-items:center;gap:16px;font-size:13px}main{max-width:1440px;margin:auto;padding:0 32px}.intro{display:flex;justify-content:space-between;align-items:center;padding:62px 0 46px;gap:40px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.2em;font-weight:650;color:var(--muted)}h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(38px,5vw,66px);line-height:1.07;letter-spacing:-.04em;font-weight:400;margin:16px 0 22px}h1 em{color:#79876c;font-weight:400}p{line-height:1.65}.intro p{font-size:14px;color:var(--muted)}.intro-side{display:grid;grid-template-columns:1fr 1fr;gap:30px 42px;min-width:290px}.stat strong{display:block;font-family:Georgia,serif;font-size:40px;font-weight:400}.stat span{font-size:11px;color:var(--muted)}.branch-legend{grid-column:1/-1;font-size:11px;display:flex;align-items:center;gap:8px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%}.dot.maternal{background:var(--maternal)}.dot.paternal{background:var(--paternal)}.tabs{display:flex;gap:26px;border-bottom:1px solid var(--line);overflow-x:auto}.tabs button{border:0;background:none;padding:14px 0;font-size:13px;color:var(--muted);white-space:nowrap;position:relative}.tabs button.active{color:var(--green);font-weight:600}.tabs button.active:after{content:"";height:2px;background:var(--green);position:absolute;bottom:0;left:0;right:0}.view{padding:30px 0 40px}.section-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.section-toolbar h2{margin:0}.section-toolbar p{font-size:12px;margin:8px 0 0}h2{font-family:Georgia,serif;font-size:27px;font-weight:400;letter-spacing:-.03em}h3{font-size:16px;font-weight:600}.muted{color:var(--muted)}.small{font-size:12px}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--green);color:white;border:1px solid var(--green);border-radius:7px;padding:11px 18px;font-size:12px;line-height:1.3;font-weight:600;text-decoration:none}.button:hover{filter:brightness(1.08)}.button.secondary{background:transparent;color:var(--green);border-color:#cdd4ca}.button:disabled{opacity:.5;cursor:wait}.tree-filters{display:flex;align-items:flex-end;gap:18px;margin-bottom:18px}.tree-filters label{font-size:10px;color:var(--muted);min-width:180px}.tree-filters select{margin-top:6px;background:var(--white);font-size:12px;height:38px}.tree-filters .editor-only{margin-left:auto}.tree-stage{position:relative;height:640px;border:1px solid #dce1d6;border-radius:12px;overflow:hidden;background-color:#eef1e9;background-image:radial-gradient(#cbd3c3 1px,transparent 1px);background-size:24px 24px;touch-action:none}.tree-stage svg{width:100%;height:100%;user-select:none;cursor:grab}.tree-stage svg:active{cursor:grabbing}.zoom-controls{position:absolute;bottom:20px;left:20px;display:flex;align-items:center;border:1px solid var(--line);background:var(--white);border-radius:8px;padding:4px;box-shadow:var(--shadow);gap:2px}.zoom-controls button{border:0;background:transparent;padding:8px 10px;color:var(--ink);font-size:12px}.zoom-controls span{min-width:48px;text-align:center;font-size:11px;color:var(--muted)}.tree-hint{position:absolute;top:16px;left:20px;color:#778575;font-size:10px;pointer-events:none}.legend{font-size:10px;color:var(--muted)}.node-card{cursor:pointer;outline:none}.node-card rect{fill:var(--white);stroke:#d4dccd;stroke-width:1.3;filter:drop-shadow(0 3px 4px #23392908)}.node-card:hover rect,.node-card:focus rect{stroke:#6f8462;stroke-width:2}.node-card.focus rect{fill:#e8eee0;stroke:#5c7652;stroke-width:2}.node-name{font-size:13px;fill:var(--ink);font-weight:550;pointer-events:none}.node-date{font-size:10px;fill:var(--muted);pointer-events:none}.node-avatar{fill:#e1e7d9}.node-initial{font-family:Georgia,serif;font-size:18px;fill:#6c7c63;pointer-events:none}.node-photo{cursor:pointer}.edge-parent{fill:none;stroke:#9cac91;stroke-width:1.6}.edge-partner{fill:none;stroke:var(--gold);stroke-width:2}.edge-other{fill:none;stroke:#b2b8ad;stroke-width:1;stroke-dasharray:5 4}.generation-label{font-size:12px;fill:#7b8872;letter-spacing:.03em}.search{max-width:520px;margin-bottom:22px}.people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}.person-tile{display:flex;gap:15px;align-items:center;text-align:left;border:1px solid var(--line);border-radius:10px;padding:20px;background:var(--white);color:var(--ink)}.person-tile:hover{border-color:#8da07c}.avatar{width:50px;height:50px;min-width:50px;border-radius:50%;object-fit:cover;background:#e5eade;display:grid;place-items:center;font-family:Georgia,serif;color:#758268;font-size:22px}.person-tile strong{display:block;font-size:14px}.person-tile small{display:block;color:var(--muted);font-size:11px;margin-top:6px}.birthday-row{display:flex;align-items:center;gap:20px;border-bottom:1px solid var(--line);padding:17px 4px;cursor:pointer}.birthday-date{font-family:Georgia,serif;min-width:72px;font-size:25px;color:var(--green)}.birthday-row .days{margin-left:auto;color:var(--muted);font-size:12px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0}.panel{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:26px}label{display:block;font-size:12px;margin-bottom:14px;color:var(--ink)}input:not([type=checkbox]),select,textarea{display:block;width:100%;padding:10px 12px;border:1px solid #d9ddd3;border-radius:6px;background:white;color:var(--ink);margin-top:6px;font-size:13px;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--green);box-shadow:0 0 0 2px #365c4810}.check{display:flex;gap:10px;align-items:center;font-size:12px;line-height:1.5}.check input{accent-color:var(--green)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.branch-checks{display:flex;gap:20px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:12px;text-align:left;background:var(--white)}th,td{padding:12px;border-bottom:1px solid var(--line);white-space:nowrap}th{color:var(--muted);font-weight:500}dialog{border:1px solid var(--line);border-radius:14px;padding:32px;width:min(680px,calc(100vw - 32px));max-height:90vh;color:var(--ink);background:var(--white);box-shadow:0 24px 100px #24342b30}dialog::backdrop{background:#24362a70;backdrop-filter:blur(4px)}.dialog-close{position:absolute;right:14px;top:10px;border:0;background:transparent;color:var(--muted);font-size:27px}.profile-top{display:flex;align-items:center;gap:22px;margin-top:10px}.profile-photo{width:110px;height:110px;border-radius:14px;object-fit:cover;background:#e9eddf;display:grid;place-items:center;font-family:Georgia,serif;font-size:40px;color:#7d8b6c}.profile-top h2{margin:4px 0 10px;font-size:30px}.profile-facts{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:24px 0;font-size:13px}.profile-facts small{display:block;color:var(--muted);font-size:10px;margin-bottom:5px}.profile-relations{margin:20px 0}.relative-row{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:12px}.relative-row button{border:0;background:none;color:var(--green);text-align:left;padding:0;text-decoration:underline;text-underline-offset:3px}.relative-row .remove{margin-left:auto;color:#9e7563;font-size:11px}.profile-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.text-block{white-space:pre-wrap;line-height:1.7;font-size:13px}.empty-state{text-align:center;padding:36px;color:var(--muted)}footer{max-width:1440px;margin:auto;padding:24px 32px 40px;border-top:1px solid var(--line);font-size:10px;color:var(--muted);display:flex;justify-content:space-between}#toast{position:fixed;bottom:24px;right:24px;max-width:calc(100vw - 48px);padding:16px 22px;color:white;background:var(--green);border-radius:10px;box-shadow:var(--shadow);z-index:100}#toast.error{background:#88594c}.contact-locked{background:#f0f2ea;border-radius:7px;padding:14px;font-size:12px;color:var(--muted)}[hidden]{display:none!important}@media(max-width:800px){main{padding:0 18px}.topbar{padding:16px 18px}.brand-mark{font-size:30px}.brand small{display:none}.account #identity{display:none}.intro{padding:35px 0;gap:20px;align-items:flex-start}.intro-side{min-width:0;grid-template-columns:1fr;gap:12px}.stat strong{font-size:30px}.stat span{max-width:110px;display:block}.branch-legend{display:none}.tabs{gap:20px}.tree-stage{height:580px}.section-toolbar{align-items:flex-start}.tree-filters{flex-wrap:wrap;gap:8px}.tree-filters label{flex:1;min-width:130px}.tree-filters .editor-only{margin-left:0}.settings-grid{grid-template-columns:1fr}.tree-hint{font-size:9px;left:12px;right:12px}.zoom-controls{left:12px;bottom:12px}.form-grid{grid-template-columns:1fr}.profile-top{gap:14px}.profile-top h2{font-size:24px}.profile-photo{width:80px;height:80px}.profile-facts{grid-template-columns:1fr}.section-toolbar h2{font-size:24px}dialog{padding:28px 20px}.branch-checks{display:block}.birthday-row{gap:12px}.birthday-row .days{font-size:10px}footer{padding:20px 18px}}

.my-person{display:flex;align-items:center;gap:20px;margin-top:24px}.my-person h3{margin:0}.my-person p{margin:7px 0 12px}

.family-zone{stroke-width:1}.zone-paternal{fill:#edf3f7;stroke:#d5e1e9}.zone-maternal{fill:#edf3e8;stroke:#d5e1cb}.zone-common{fill:#fbf5e7;stroke:#e9dcbd}.family-zone-title{font:600 16px sans-serif;fill:#516b5b;letter-spacing:1px}.title-paternal{fill:#53758e}.title-common{fill:#997339}.family-zone-subtitle{font:11px sans-serif;fill:#9b885c}.node-card.anchor rect{fill:#f5dda9;stroke:#ac7834;stroke-width:2.6}.anchor-star{font:13px sans-serif;fill:#a36f26}.paternal-line{stroke:#65869e}.maternal-line{stroke:#708a70}.anchor-line{stroke-width:3}
.dot.paternal{background:#65869e}.dot.anchor{background:#cf9f4f}.node-card.anchor .node-avatar{fill:#eed09a}.node-card.anchor .node-initial{fill:#8f6227}.node-card.anchor .node-date{fill:#806439}

.focus-picker{position:relative;min-width:280px;flex:2}.focus-picker>label{margin-bottom:0}.focus-input{display:flex;align-items:stretch}.focus-input input{min-width:0;border-radius:6px 0 0 6px}.focus-input button{margin-top:6px;border:1px solid #d9ddd3;border-left:0;background:#fff;border-radius:0 6px 6px 0;padding:0 14px;color:#365c48}#focusResults{position:absolute;top:100%;left:0;right:0;max-height:300px;overflow:auto;z-index:10;background:white;border:1px solid #d9ddd3;border-radius:6px;box-shadow:0 10px 25px #24342b25}.focus-option{display:block;width:100%;padding:12px;text-align:left;border:0;background:white;font-size:13px;color:#253d33}.focus-option:hover,.focus-option[aria-selected=true]{background:#eaf0e3}.people-filters{display:flex;gap:20px;align-items:center}.people-filters .search{flex:1;min-width:0;margin:0}.people-filters label{min-width:170px;margin:0}.zone-uncertain{fill:#f1f1ee;stroke:#d7d7d0}.title-uncertain{fill:#777b74}@media(max-width:800px){.focus-picker{flex-basis:100%;min-width:0}.people-filters{align-items:stretch;flex-direction:column;gap:10px}}

.focus-option.active{background:#eaf0e3}

.node-kin{font:10px sans-serif;fill:#365c48}

.tree-filters>label,.tree-filters>.focus-picker{margin-bottom:0}.tree-filters input,.tree-filters select,.tree-filters .focus-input button,.tree-filters>.button{height:40px;box-sizing:border-box}.tree-filters input,.tree-filters select{font-size:12px;line-height:18px}.tree-filters>.button{margin-bottom:0}

.tree-filters .focus-current{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 8px;min-width:0;margin-bottom:8px;color:var(--green);font-size:14px;line-height:1.5}.focus-current-caption{font-weight:500}.focus-current-person{font-size:15px;font-weight:600;overflow-wrap:anywhere}


:root{--dropdown-bg:#edf3e8;--dropdown-line:#cbd9c5;--dropdown-hover:#e2ecd9;--dropdown-ink:#365c48}
.custom-dropdown{position:relative;display:block;width:100%;margin-top:6px;min-width:0}.dropdown-native{display:none!important}.dropdown-trigger{position:relative;display:flex;align-items:center;width:100%;height:40px;padding:9px 44px 9px 12px;border:1px solid var(--dropdown-line);border-radius:8px;background:var(--dropdown-bg);color:var(--ink);text-align:left;font-family:inherit;font-size:12px;line-height:18px;cursor:pointer;box-sizing:border-box;transition:border-color .15s,background .15s}.dropdown-trigger:hover{border-color:#9fb396;background:#e7efe1}.dropdown-trigger:focus-visible,.custom-dropdown.is-open .dropdown-trigger{outline:0;border-color:#708a70;box-shadow:0 0 0 3px #365c4815}.dropdown-trigger:disabled{opacity:.55;cursor:default}.dropdown-value{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-chevron{position:absolute;right:5px;top:50%;display:grid;place-items:center;width:30px;height:28px;border-left:1px solid #cbd9c580;color:var(--dropdown-ink);transform:translateY(-50%)}.dropdown-chevron svg{display:block;transition:transform .15s}.is-open .dropdown-chevron svg,[aria-expanded=true] .dropdown-chevron svg{transform:rotate(180deg)}
.dropdown-menu,#focusResults{padding:5px;overflow-y:auto;background:#f5f8f0;border:1px solid var(--dropdown-line);border-radius:10px;box-shadow:0 12px 30px #24342b20;scrollbar-width:thin;scrollbar-color:#9eb090 #f5f8f0;z-index:30}.dropdown-menu{position:absolute;top:calc(100% + 6px);left:0;right:0;max-height:300px}.opens-up .dropdown-menu{top:auto;bottom:calc(100% + 6px)}.custom-dropdown.is-open{z-index:31}.dropdown-option,.focus-option{position:relative;display:block;width:100%;padding:11px 32px 11px 11px;border:0;border-radius:6px;background:transparent;color:var(--ink);text-align:left;font-family:inherit;font-size:12px;line-height:1.5;cursor:pointer}.dropdown-option:hover,.dropdown-option.is-active,.focus-option:hover,.focus-option.active{background:var(--dropdown-hover)}.dropdown-option.is-selected,.focus-option[aria-selected=true]{background:#e5eedc;color:#294c3b}.dropdown-option.is-selected::after,.focus-option[aria-selected=true]::after{content:"";position:absolute;right:13px;top:50%;width:5px;height:9px;border:solid #52784f;border-width:0 2px 2px 0;transform:translateY(-70%) rotate(45deg)}.dropdown-option:disabled{opacity:.45;cursor:default}.dropdown-option:disabled:hover{background:transparent}.focus-empty{padding:12px;color:var(--muted);font-size:12px}
.focus-input{position:relative;height:40px;box-sizing:border-box;border:1px solid var(--dropdown-line);border-radius:8px;background:var(--dropdown-bg);transition:border-color .15s,background .15s}.focus-input:hover{border-color:#9fb396;background:#e7efe1}.focus-input:focus-within{border-color:#708a70;box-shadow:0 0 0 3px #365c4815}.focus-input input,.focus-input input:focus{height:38px;min-width:0;flex:1;margin:0;padding:9px 12px;border:0;border-radius:8px 0 0 8px;background:transparent;font-size:12px;line-height:18px;box-shadow:none;outline:0}.focus-input button{position:relative;width:39px;height:38px;flex-shrink:0;margin:0;padding:0;border:0;border-radius:0 8px 8px 0;background:transparent;color:var(--dropdown-ink)}.focus-input button:hover{background:#dfead5}.focus-input button:focus-visible{outline:2px solid #708a70;outline-offset:-3px}.focus-input button .dropdown-chevron{right:4px}.focus-input input::placeholder{color:#75876c}.tree-filters .focus-input input,.tree-filters .focus-input button{height:38px}#focusResults{top:calc(100% + 6px)}
.topbar{background:#e4ebdf;border-bottom-color:#becdb5;flex-wrap:wrap;gap:14px}.brand{color:#244831}.brand-mark{color:#365c48}.brand small{color:#5a7153}.account{gap:12px;max-width:100%;margin-left:auto}.account #identity{display:inline-flex;align-items:center;min-height:40px;max-width:320px;padding:8px 14px;border:1px solid #b7c9ab;border-radius:9px;background:#d1dfc7;color:#27482f;font-size:14px;line-height:1.4;font-weight:650;overflow-wrap:anywhere}.topbar .button.secondary{background:#f6f8f1;border-color:#9cb58f;color:#294a34;font-weight:650;white-space:nowrap}.topbar .button.secondary:hover{background:#ecf2e4}
.intro{display:block;position:relative;isolation:isolate;padding:28px 0}.intro-overview{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"copy stats" "names names";gap:22px}.intro-copy{grid-area:copy;min-width:0}.intro h1{font-size:clamp(36px,3.6vw,48px);line-height:1.08;margin:0}.intro-copy p{font-size:12px;line-height:1.8;margin-top:20px}.intro-side{grid-area:stats;min-width:0;grid-template-columns:max-content max-content;gap:12px 32px;justify-content:end;align-self:end}.intro .stat strong{font-size:34px}.surname-explorer{grid-area:names;min-width:0;position:relative;padding-top:26px}.intro .surname-hint{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.surname-backdrop{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));align-items:center;width:100%;gap:14px 20px;padding:8px 0}.surname-button,.surname-button:nth-child(n){display:block;justify-self:center;width:max-content;max-width:100%;padding:6px;margin:0;border:0;background:transparent;color:#536d50;font-family:Georgia,"Times New Roman",serif;font-size:clamp(19px,1.8vw,24px);line-height:1.3;font-style:italic;white-space:nowrap;cursor:pointer;transform:none}.surname-chip{display:block;padding:10px 22px;border:1px solid #c9d6bd;border-radius:50% / 45%;background:#edf2e6;box-shadow:inset 0 1px 0 #ffffff90;animation:surname-drift 24s ease-in-out infinite alternate;transition:background .2s,border-color .2s,box-shadow .2s}.surname-button:nth-child(3n+2){color:#85704c}.surname-button:nth-child(3n+2) .surname-chip{background:#f3ecdf;border-color:#ddceb1;animation-duration:29s;animation-delay:-11s}.surname-button:nth-child(3n) {color:#5b7787}.surname-button:nth-child(3n) .surname-chip{background:#eaf0f3;border-color:#c7d7df;animation-duration:32s;animation-delay:-17s}.surname-button:hover .surname-chip,.surname-button:focus-visible .surname-chip{animation-play-state:paused;background:#e0ead7;border-color:#a6bd98;box-shadow:0 3px 12px #365c4812}.surname-button:focus-visible{outline:2px solid #365c48;outline-offset:0;border-radius:40px}.motion-paused .surname-chip{animation-play-state:paused}.surname-motion{position:absolute;right:0;top:0;z-index:3;border:1px solid #cbd6c2;border-radius:20px;background:#f4f6ee;color:#4c6750;padding:5px 12px;font-family:inherit;font-size:11px;cursor:pointer}.surname-motion:hover{background:#e7efdf}.surname-motion:focus-visible{outline:2px solid #365c48;outline-offset:3px}.surname-motion:disabled{opacity:.65;cursor:default}@keyframes surname-drift{from{transform:translate(-2px,-3px) rotate(-1deg)}to{transform:translate(2px,3px) rotate(1deg)}}@media(prefers-reduced-motion:reduce){.surname-chip{animation:none!important}.surname-button .surname-chip{transition:none}}
.surname-members{display:grid;gap:8px;margin-top:20px}.surname-member{display:flex;align-items:center;gap:14px;width:100%;padding:14px;border:1px solid #dbe2d5;border-radius:10px;background:#f6f8f1;color:var(--ink);text-align:left;cursor:pointer}.surname-member:hover{background:#e8efdf;border-color:#b5c8a9}.surname-member:focus-visible{outline:2px solid #365c48;outline-offset:2px}.surname-member>.avatar{flex-shrink:0}.surname-member>span:not(.surname-member-arrow){flex:1;min-width:0}.surname-member strong{display:block;font-size:14px;font-weight:600;line-height:1.5}.surname-member small{display:block;margin-top:3px;color:#6c7b6a;font-size:12px;line-height:1.5}.surname-member-arrow{color:#708a70;font-size:22px}#surnameDialog h2{padding-right:20px}@media(max-width:1100px){.tree-filters{flex-wrap:wrap}.tree-filters>.focus-picker{flex-basis:100%}.tree-filters>label{flex:1}}
@media(max-width:800px){.topbar{align-items:flex-start}.account{width:100%;margin-left:0;justify-content:space-between;gap:10px}.account #identity{display:inline-flex;min-width:0;max-width:calc(100% - 135px);padding:8px 12px}.intro-side{grid-template-columns:1fr;gap:12px}.surname-backdrop{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.surname-button,.surname-button:nth-child(n){font-size:18px}.surname-chip{padding:9px 12px}.intro h1{font-size:40px}}
@media(max-width:600px){.intro-overview{grid-template-columns:1fr;grid-template-areas:"copy" "names" "stats";gap:18px}.intro-side{grid-template-columns:1fr 1fr;width:100%;justify-content:start;gap:20px}.surname-backdrop{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.surname-button,.surname-button:nth-child(n){font-size:17px}.surname-chip{padding:9px 10px}.intro h1{font-size:36px}.surname-member{padding:12px;gap:10px}.surname-member strong{font-size:13px}.surname-member small{font-size:11px}}
/* Ordered surname rows fill the hero and leave room for the title and counts. */
@media(min-width:1101px){
 .intro{padding:0}.intro-overview{position:relative;display:block;height:400px;min-height:400px}
 .intro-copy{position:absolute;left:0;top:120px;width:min(40%,420px);z-index:2}
 .intro-side{position:absolute;right:0;bottom:6px;z-index:2}
 .surname-explorer{position:absolute;inset:0;display:block;padding:0}
 .surname-motion{top:6px}
 .surname-backdrop{position:absolute;inset:26px 0 0;width:auto;display:block;padding:0;visibility:hidden;pointer-events:none}
 .surname-button,.surname-button:nth-child(n){position:absolute;margin:0;pointer-events:auto}
 .surname-backdrop.is-arranged{visibility:visible}
 .intro-overview.cloud-flow{display:grid;height:auto;min-height:0;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"copy stats" "names names";gap:22px;padding:28px 0}
 .cloud-flow .intro-copy,.cloud-flow .intro-side,.cloud-flow .surname-explorer{position:static;width:auto}
 .cloud-flow .surname-explorer{position:relative;padding-top:26px}
 .cloud-flow .surname-backdrop{position:static;display:grid;visibility:visible;gap:14px 20px;padding:8px 0}
 .cloud-flow .surname-button,.cloud-flow .surname-button:nth-child(n){position:static}
}
.tree-output{margin:16px 0 12px}.tree-output-buttons{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.tree-output p{margin:10px 0 0;max-width:900px;font-size:11px;line-height:1.6}.tree-output .button.secondary{background:#edf3e8;border-color:#c4d4bc}.tree-output .button:focus-visible{outline:2px solid #708a70;outline-offset:3px}@media(max-width:800px){.tree-output-buttons{gap:8px}.tree-output .button{flex:1 1 140px;padding:11px 12px}.tree-output-buttons #printTree{flex-basis:100%}}

#treePrintDialog{width:min(1240px,calc(100vw - 32px));height:85vh;padding:40px 12px 12px}#treePrintFrame{display:block;width:100%;height:100%;border:1px solid #cdd6c4;border-radius:8px;background:#e8ede3}

.my-photo-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.photo-help{flex-basis:100%;font-size:11px;color:var(--muted)}

/* Family Tree shares the photo sites' charcoal-green header and gold signatures. */
.topbar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:18px;direction:ltr;padding:14px max(20px,calc((100vw - 1440px)/2));background:#232923;border-bottom:1px solid #cbb68b40;color:#f4eddf}.header-identity{display:flex;align-items:center;gap:22px;min-width:0}.topbar .brand{gap:10px;color:#f4eddf;flex-shrink:0}.topbar .brand-mark{display:block;width:30px;height:34px;color:#cbb68b}.topbar .brand strong{font:23px/1.2 Georgia,serif;font-weight:500}.topbar .brand small{display:block;color:#c0b9a8;font-size:9px;letter-spacing:.02em}.site-links{display:flex;align-items:center;gap:5px;border-inline-start:1px solid #cbb68b40;padding-inline-start:18px}.site-links a{display:flex;align-items:center;justify-content:center;width:78px;height:34px;border-radius:6px}.site-links img{width:100%;height:auto;display:block}.site-links a:hover{background:#ffffff0a}.site-links a:focus-visible{outline:2px solid #cbb68b;outline-offset:3px}.topbar .account{width:auto;margin-inline-start:auto;gap:9px;justify-content:flex-end}.topbar .account #identity{max-width:230px;min-height:38px;padding:7px 12px;background:#ffffff08;border-color:#cbb68b55;color:#f4eddf;font-size:13px;font-weight:600}.topbar .header-key{display:grid;place-items:center;width:40px;height:40px;padding:0;border-radius:50%;background:transparent!important;border-color:#cbb68b66!important;color:#cbb68b!important}.header-key svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6}.topbar .header-key:hover{background:#ffffff0a!important}.topbar .language-dropdown{width:40px;min-width:40px;margin:0}.topbar .language-dropdown .dropdown-trigger{height:40px;width:40px;padding:0;justify-content:center;border-radius:50%;background:transparent;color:#e4d3ae;border-color:#cbb68b66;font-size:11px}.language-dropdown .dropdown-chevron{display:none}.language-dropdown .dropdown-menu{left:auto;right:0;width:105px;direction:ltr}.language-dropdown .dropdown-option{padding:10px 16px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.name-language{border:1px solid #d7dfcf;border-radius:9px;padding:14px 18px;margin:0 0 16px;background:#f7f9f2}.name-language legend{padding:0 8px;color:#365c48;font-weight:600;font-size:13px}.name-language{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.name-language label{margin:0}.name-language input{font-size:14px}.name-language .muted{font-size:10px}#namesDialog{width:min(820px,calc(100vw - 32px))}#editDialog{width:min(820px,calc(100vw - 32px))}
html[dir=rtl] .topbar .brand>span{direction:rtl;text-align:right}html[dir=rtl] .intro-copy{right:0;left:auto}html[dir=rtl] .intro-side{left:0;right:auto}html[dir=rtl] .surname-motion{left:0;right:auto}html[dir=rtl] .dropdown-trigger{padding-left:44px;padding-right:12px;text-align:right}html[dir=rtl] .dropdown-chevron{left:5px;right:auto;border-left:0;border-right:1px solid #cbd9c580}html[dir=rtl] .dropdown-option,html[dir=rtl] .focus-option{padding:11px 11px 11px 32px;text-align:right}html[dir=rtl] .dropdown-option.is-selected::after,html[dir=rtl] .focus-option[aria-selected=true]::after{left:13px;right:auto}html[dir=rtl] .focus-input input{border-radius:0 8px 8px 0;text-align:right}html[dir=rtl] .focus-input button{border-radius:8px 0 0 8px}html[dir=rtl] .focus-input button .dropdown-chevron{left:4px;right:auto}html[dir=rtl] .surname-member{text-align:right}html[dir=rtl] .surname-member-arrow{transform:scaleX(-1)}html[dir=rtl] .person-tile,html[dir=rtl] table{text-align:right}html[dir=rtl] .birthday-row .days{margin-left:0;margin-right:auto}html[dir=rtl] .language-dropdown .dropdown-trigger{padding:0;text-align:center}html[dir=rtl] .language-dropdown .dropdown-option{text-align:left;padding:10px 16px}.tree-stage svg{direction:ltr}.node-name,.node-kin{unicode-bidi:plaintext}input[type=email],input[type=tel],input[type=password]{direction:ltr} .profile-facts>div{overflow-wrap:anywhere}
@media(max-width:1000px){.topbar{gap:12px;flex-wrap:wrap;padding:12px 18px}.header-identity{gap:14px}.topbar .brand strong{font-size:21px}.site-links{padding-inline-start:12px}.site-links a{width:68px}.topbar .account #identity{max-width:190px}}
@media(max-width:680px){.topbar{display:grid;grid-template-columns:1fr auto;gap:9px 12px}.header-identity{display:contents}.topbar .brand{grid-column:1;grid-row:1;min-width:0}.topbar .brand strong{font-size:18px}.topbar .brand small{font-size:8px}.topbar .brand-mark{width:24px}.site-links{grid-row:2;grid-column:1/-1;border:0;padding:0;justify-content:center}.site-links a{width:76px}.topbar .account{grid-column:2;grid-row:1;gap:6px;flex-wrap:wrap;max-width:190px}.topbar .account #identity{font-size:11px;max-width:160px;min-height:30px;padding:5px 8px;flex-basis:100%;justify-content:center;order:3}.topbar .header-key,.topbar .language-dropdown,.topbar .language-dropdown .dropdown-trigger{width:34px;height:34px;min-width:34px}.name-language{grid-template-columns:1fr;gap:12px}.name-language input{font-size:16px}html[dir=rtl] .intro-copy,html[dir=rtl] .intro-side{position:static}}