/* Refinement of the original atlas: coordinates and graph structure are unchanged. */
body[data-design=tree] .person-node,body[data-design=tree] .person-node.king{width:250px}
body[data-design=tree] .person-main,body[data-design=tree] .person-node.king .person-main{width:250px;height:148px;min-height:148px;display:grid;grid-template-columns:76px minmax(0,1fr);gap:10px;padding:10px;align-items:center;text-align:left}
body[data-design=tree] .person-main .han,body[data-design=tree] .person-node.king .person-main .han{width:76px;height:104px;display:block;position:relative;border:0;overflow:hidden}
body[data-design=tree] .person-main .person-art-thumb{width:76px;height:104px;object-fit:cover;display:block}
body[data-design=tree] .person-main .node-copy{min-width:0}body[data-design=tree] .person-main .node-copy b,body[data-design=tree] .person-node.king .person-main .node-copy b{font-size:18px;line-height:1.35;white-space:normal;word-break:keep-all}
body[data-design=tree] .person-main .node-copy small{font-size:12px;line-height:1.5;white-space:normal;max-height:none;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
/* Medium zoom enlarges role text: let complete lines determine the card height. */
body[data-design=tree] .zoom-medium .person-main,body[data-design=tree] .zoom-medium .person-node.king .person-main{height:auto;min-height:148px}
body[data-design=tree] .zoom-medium .person-main .node-copy{flex-shrink:0}
body[data-design=tree] .zoom-medium .person-main .node-copy small{display:block;overflow:visible;max-height:none;flex-shrink:0;-webkit-line-clamp:unset}
body[data-design=tree] .person-main .node-copy .life{font-size:10px;line-height:1.4;display:block;white-space:normal}
body[data-design=tree] .zoom-far .person-node,body[data-design=tree] .zoom-far .event-marker,body[data-design=tree] .zoom-far .change-card{visibility:hidden!important;pointer-events:none}
body[data-design=tree] .zoom-far #edges .edge-label{display:none!important}
body[data-design=tree] #mapLabels .balance-person{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:2px;background:#fbf8ee;border:1px solid #c4bea9;border-radius:3px;box-shadow:0 1px 3px #3a432013;overflow:hidden;user-select:none;color:#314331}
body[data-design=tree] #mapLabels .balance-person.balance-royal{border-top:2px solid #9b733d;background:#fbf3df}body[data-design=tree] #mapLabels .balance-person.balance-selected{outline:2px solid #6c815b;outline-offset:1px}
body[data-design=tree] #mapLabels .balance-person .person-art-thumb{position:static;display:block!important;width:calc(var(--balance-face)*.76);height:var(--balance-face);object-fit:cover;flex-shrink:0;border-radius:1px}
body[data-design=tree] #mapLabels .balance-person b{display:block;max-width:100%;font-size:var(--balance-name);line-height:1.1;text-align:center;white-space:normal;word-break:keep-all;font-weight:650}
body[data-design=tree] #viewport{overflow:clip}
body[data-design=tree] #balanceZoom{background:#faf6e9;color:#4b5940;border:1px solid #b8bea8;border-radius:3px;font:inherit;font-size:11px;max-width:88px;padding:4px}
body[data-design=tree] .workspace-head{min-height:124px!important;padding-top:16px!important;padding-bottom:16px!important}body[data-design=tree] .workspace-head .era-scroll-note{display:none}
body[data-design=tree] #inspector .portrait-art-figure{display:grid;grid-template-columns:108px minmax(0,1fr);margin:12px 0}
body[data-design=tree] #inspector .portrait-art-figure .change-art-original img{width:108px;height:148px;min-height:148px;max-height:148px;object-fit:cover}body[data-design=tree] #inspector .portrait-art-figure figcaption{padding:8px}body[data-design=tree] #inspector .portrait-art-figure figcaption p{font-size:10px}
/* Zoom reveals persistent information; no hover is needed to read it. */
body[data-design=tree] .person-main .node-detail{display:none}
body[data-design=tree] #viewport:not(.zoom-far) .person-main .life{display:block}
body[data-design=tree] #viewport:not(.zoom-far) .expand-branch{display:none}
body[data-design=tree] .zoom-detail .person-main,body[data-design=tree] .zoom-detail .person-node.king .person-main{height:180px;min-height:180px;grid-template-rows:104px 1fr;gap:4px 10px;padding:10px}
body[data-design=tree] .zoom-detail .person-main .han{grid-area:auto;grid-column:1;grid-row:1}
body[data-design=tree] .zoom-detail .person-main .node-copy{grid-area:auto;grid-column:2;grid-row:1;gap:3px;overflow:hidden;max-height:104px}
body[data-design=tree] .zoom-detail .person-main .node-detail{display:-webkit-box;grid-column:1/-1;grid-row:2;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;max-height:48px;font:12px/16px 'Noto Sans KR',sans-serif;color:#46513f;text-align:left;word-break:keep-all}
body[data-design=tree] .zoom-detail .family-node-action,body[data-design=tree] .zoom-detail .family-node-status{min-height:24px;padding:4px 6px;margin-top:4px;font-size:11px;line-height:16px}
body[data-design=tree] #viewport:not(.zoom-far):not(.zoom-medium) #edges .edge text{display:none!important}
body[data-design=tree] .poster-button:hover{transform:none}
/* Family browsing stays in one dialog with a persistent local close/back bar. */
#familyDialog{width:min(1000px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 40px);padding:0;margin:auto;overflow:auto;overscroll-behavior:contain;background:#f9f5e9;color:#344332;border:1px solid #a8b394;border-radius:12px;box-shadow:0 20px 80px #1c302d55}
#familyDialog::backdrop{background:#15292370;backdrop-filter:blur(2px)}
#familyDialog .family-dialog-toolbar{position:sticky;top:0;z-index:10;height:auto;min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;background:#faf7ed;border-bottom:1px solid #c6cbb6}
#familyDialogContext{font-size:11px;color:#68745d}#familyDialogTitle{font:600 23px/1.35 var(--serif);margin:5px 0 0;color:#35482e}
.family-dialog-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.family-dialog-actions button{min-height:40px;padding:8px 12px;background:#eef0e1;border:1px solid #a7b398;border-radius:5px;color:#3c5436;font-size:12px}.family-dialog-actions [hidden]{display:none}
#familyDialog #familyWorld{position:static;padding:18px 20px;width:auto;height:auto;transform:none}
#familyDialog .family-map{position:static!important;left:auto!important;top:auto!important;width:100%!important;height:auto!important;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:#344332}
#familyDialog .family-parent-tether{display:none}#familyDialog .family-map-head{height:auto;margin:0 0 15px;padding:0 0 12px;border-color:#c8ceba}#familyDialog .family-map-head small,#familyDialog .family-map-head h3{display:none}#familyDialog .family-map-head p{font-size:14px;margin:0 0 6px;color:#42583a}#familyDialog .family-map-head span,#familyDialog .family-map-foot{color:#67745b;font-size:12px}
.family-dialog-filters{display:flex;gap:7px;margin-bottom:15px}.family-dialog-filters button{padding:7px 15px;border-color:#b6c0a6;color:#4d6043;background:#f4f3e7}.family-dialog-filters button[aria-pressed=true]{background:#526c49;color:#fffdf0;border-color:#526c49}
#familyDialog .family-map-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#familyDialog .family-child{height:155px}#familyDialog #familyWorld>.inspector-kicker,#familyDialog #familyWorld>.inspector-name{display:none}#familyDialog .inspector-text{color:#42533c}#familyDialog .portrait-art-figure{max-width:620px}#familyDialog .portrait-art-figure .change-art-original img{max-height:300px;object-fit:contain}#familyDialog .family-map-foot{margin-bottom:8px}
.art-viewer-close{position:sticky;top:0;z-index:5;box-shadow:0 2px 8px #23351b20}.relation-note{position:absolute}.note-close{position:absolute;right:10px;top:10px;min-width:30px;min-height:30px;font-size:max(13px,calc(11px / var(--map-zoom,1)));padding:4px 7px;border:1px solid #a7b59b;background:#f8f5e9;color:#426039;z-index:1}.relation-note .note-heading{padding-right:42px}
@media(max-width:700px){#familyDialog{width:calc(100vw - 16px);max-height:calc(100dvh - 20px)}#familyDialog .family-dialog-toolbar{padding:12px;gap:8px;align-items:flex-start}#familyDialogTitle{font-size:19px}.family-dialog-actions{gap:5px;flex-wrap:wrap;justify-content:flex-end}.family-dialog-actions button{font-size:11px;padding:7px 9px}#familyDialog #familyWorld{padding:14px 12px}#familyDialog .family-map-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#familyDialog .family-child{height:165px}#familyDialog .family-child b{font-size:17px}#familyDialog .family-child small,#familyDialog .family-child span{font-size:11px}}
@media(max-width:420px){#familyDialog .family-map-grid{grid-template-columns:1fr}#familyDialog .family-child{height:140px}}
/* Open explanations sit above screen-space labels, so labels cannot cover their controls. */
body[data-design=tree] #world:has(.relation-note){z-index:4}
body[data-design=tree] .note-close{min-width:max(30px,calc(32px / var(--map-zoom,1)));min-height:max(30px,calc(32px / var(--map-zoom,1)));font-size:max(14px,calc(13px / var(--map-zoom,1)));padding:4px}
body[data-design=tree] .relation-note .note-heading{padding-right:max(42px,calc(44px / var(--map-zoom,1)))}
.family-dialog-coverage{margin-top:18px;padding:13px 15px;border:1px solid #ccd2be;border-radius:7px;font-size:12px;color:#58664d;line-height:1.7}.family-dialog-coverage summary{cursor:pointer;font-weight:600}.family-dialog-coverage a{color:#5b6c3f;display:block;margin:8px 0}.family-dialog-coverage p{margin:10px 0}

/* Family cards share person records and leave space for a readable life preview. */
#familyDialog .family-child{height:auto;min-height:194px;display:grid;grid-template-columns:64px minmax(0,1fr);grid-template-rows:auto auto auto 1fr;gap:5px 10px;align-content:start;padding:13px}
#familyDialog .family-child .family-art-thumb{position:static;grid-column:1;grid-row:1/4;width:64px;height:88px;object-fit:cover}
#familyDialog .family-child .family-art-label{position:static;grid-column:1;grid-row:4;align-self:start;font-size:9px;text-align:center;padding:3px 0;max-width:64px}
#familyDialog .family-child>small,#familyDialog .family-child>b,#familyDialog .family-child>span{grid-column:2;min-width:0;padding:0;line-height:1.45}
#familyDialog .family-child>b{font-size:18px;color:#fff4db}
#familyDialog .family-child .family-biography-preview{grid-column:1/-1;grid-row:5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.65;max-height:none;margin:3px 0 0;color:#dce5d8;padding:8px 0 0;border-top:1px solid #d5dfca33}
#familyDialog .family-canonical{background:#e9eedc;border:1px solid #bdc9ad;border-radius:6px;padding:10px 12px;font-size:13px;color:#415b35;line-height:1.6}
#familyDialog .family-life{margin:18px 0;max-width:680px}#familyDialog .family-life h3{font-size:17px;margin:0 0 9px;color:#354f2c}#familyDialog .family-life .inspector-text{font-size:15px;line-height:1.9}#familyDialog .family-record-note{font-size:12px;line-height:1.7;color:#68725e}

body[data-design=tree] .person-life{border-top:1px solid #bbc4ad;margin:20px 0;padding-top:18px;text-align:left;color:#3d5037}
body[data-design=tree] .person-life h3{font:600 19px/1.4 var(--serif);margin:0 0 18px;color:#344c2b}
body[data-design=tree] .person-life h4{font:600 15px/1.5 var(--serif);margin:18px 0 7px;color:#3e5833}
body[data-design=tree] .person-life p{font:14px/1.9 'Noto Sans KR',sans-serif;margin:0 0 12px;word-break:keep-all;overflow-wrap:anywhere;color:#43523c}
body[data-design=tree] .person-life .person-life-source{display:block;font-size:12px;line-height:1.7;margin:16px 0 0;color:#52653f}
#familyDialog .person-life{max-width:680px}#familyDialog .person-life p{font-size:15px}

/* Biological mother links remain legible, including in the compact-card range. */
body[data-design=tree] #edges .edge.mother path{stroke:#537d77;stroke-dasharray:5 4;opacity:.68}
body[data-design=tree] .zoom-far #edges .edge.mother path{stroke-width:calc(1px / var(--map-zoom,1));opacity:.68}
body[data-design=tree] #edges .edge.mother.relevant path,body[data-design=tree] #edges .edge.mother.hover-relevant path{opacity:1;stroke:#356a60;stroke-width:2.7}
body[data-design=tree] .zoom-far #edges .edge.mother.relevant path,body[data-design=tree] .zoom-far #edges .edge.mother.hover-relevant path{opacity:1;stroke-width:calc(1.6px / var(--map-zoom,1))}
body[data-design=tree] .map-relation.mother{color:#365e57;border-color:#6c999477;background:#f0f7ef}