/* Screen-space names stay readable while the tree itself scales. */
#mapLabels{position:absolute;inset:0;pointer-events:none;z-index:3}
.map-name{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;padding:5px 9px;background:#fffdf6f5;color:#303b30;border:1px solid #b7b19d;border-radius:4px;font:600 14px 'Noto Sans KR',sans-serif;box-shadow:0 2px 7px #51472b18;pointer-events:auto}
.map-name.royal-name{border-top:3px solid #8b6c35;font-weight:700}
body[data-design=tree]{--muted:#596451}
body[data-design=tree] .person-main{grid-template-columns:32px minmax(0,1fr);gap:8px;padding:10px}
body[data-design=tree] .person-node.king .person-main{grid-template-columns:36px minmax(0,1fr);gap:10px;padding:15px 12px}
body[data-design=tree] .person-main .han{width:32px;font-size:20px}
body[data-design=tree] .person-node.king .person-main .han{width:36px}
body[data-design=tree] .person-main .node-copy b{font-size:max(20px,calc(17px / var(--map-zoom,1)));line-height:1.35;letter-spacing:-.7px}
body[data-design=tree] .person-node.king .person-main .node-copy b{font-size:max(23px,calc(19px / var(--map-zoom,1)))}
body[data-design=tree] .person-main .node-copy small{color:#45533f;font-size:max(13px,calc(12px / var(--map-zoom,1)));line-height:1.45;margin-top:5px;letter-spacing:-.3px}
body[data-design=tree] .person-main .node-copy .life{display:none;color:#65502c;font:13px/1.4 'Noto Sans KR',sans-serif;letter-spacing:0;margin-top:5px}
body[data-design=tree] .zoom-detail .person-main .node-copy .life{display:block}
body[data-design=tree] .zoom-medium .person-main .node-copy small{display:none}
body[data-design=tree] .zoom-medium .person-main{align-items:center}
body[data-design=tree] .zoom-far .person-main .node-copy,body[data-design=tree] .zoom-far .person-main .han,body[data-design=tree] .zoom-far .expand-branch{display:none}
body[data-design=tree] .zoom-far .edge text{display:none!important}
body[data-design=tree] .edge text{font-size:max(14px,calc(12px / var(--map-zoom,1)));fill:#665027}
body[data-design=tree] .zoom-medium .edge text{display:none}
body[data-design=tree] .zoom-medium .edge.succession text{display:block}
body[data-design=tree] .event-marker{font-size:max(13px,calc(12px / var(--map-zoom,1)));color:#414a35}
body[data-design=tree] .zoom-far .event-marker{visibility:hidden}
body[data-design=tree] .map-controls{z-index:4}
body[data-design=tree] .map-controls button,body[data-design=tree] .map-controls>span{font-size:12px;color:#45533f}
body[data-design=tree] #eventTicks{overflow:auto;gap:14px;padding-bottom:5px}
body[data-design=tree] #eventTicks button{font-size:13px;color:#55614c;flex-shrink:0;white-space:nowrap;min-height:42px}
body[data-design=tree] #eventTicks button span{font-size:12px}
body[data-design=tree] #eventTicks button[aria-pressed=true]{font-weight:700;color:#77571f}
body[data-design=tree] .layer-controls button,body[data-design=tree] .expand-branch{font-size:12px}
body[data-design=tree] .time-heading small,body[data-design=tree] .range-ends{font-size:12px}
body[data-design=tree] .inspector-meta,body[data-design=tree] .connection-list button{font-size:13px;color:#45533f}
body[data-design=tree] .inspector-text{font-size:14px;line-height:1.9;color:#3f4b38}
body[data-design=tree] .connection-list small,body[data-design=tree] .inspector-subhead,body[data-design=tree] .inspector-source{font-size:12px;color:#65502c}
body[data-design=tree] .inspector-actions button,body[data-design=tree] .notice{font-size:12px}
@media(max-width:600px){body[data-design=tree] .time-heading{width:80px}body[data-design=tree] .range-ends{font-size:10px}body[data-design=tree] .map-controls button{padding:7px}body[data-design=tree] .layer-controls button{font-size:11px}}

body[data-design=tree] .person-main .han{font-size:16px;white-space:nowrap;letter-spacing:-1px}

/* Cards grow with wrapped copy; the han badge occupies one explicit grid cell. */
body[data-design=tree] .person-main,
body[data-design=tree] .person-node.king .person-main{
  grid-template-areas:"badge copy";
  grid-template-rows:auto;
  align-items:center;
  height:auto;
  min-height:110px;
}
body[data-design=tree] .person-node.king .person-main{min-height:140px}
body[data-design=tree] .person-main .han{grid-area:badge;grid-row:auto;align-self:center;max-width:100%}
body[data-design=tree] .person-main .node-copy{grid-area:copy;min-width:0;max-width:100%;display:flex;flex-direction:column;gap:5px}
body[data-design=tree] .person-main .node-copy b,
body[data-design=tree] .person-main .node-copy small,
body[data-design=tree] .person-main .node-copy .life{
  white-space:normal;
  word-break:keep-all;
  overflow-wrap:anywhere;
  min-width:0;
  max-width:100%;
  margin:0;
}
body[data-design=tree] .person-main .node-copy b{font-size:clamp(20px,calc(17px / var(--map-zoom,1)),26px)}
body[data-design=tree] .person-node.king .person-main .node-copy b{font-size:clamp(23px,calc(19px / var(--map-zoom,1)),28px)}
body[data-design=tree] .person-main .node-copy .life{flex-shrink:0}