.change-card .change-head{padding:12px 12px 10px 115px;isolation:isolate}
.change-head .change-art-thumb{position:absolute;inset:0 auto 0 0;width:101px;height:100%;object-fit:cover;object-position:center;background:#e7e1d0;border-right:1px solid #c7bda7;pointer-events:none;z-index:-1}
.change-head .change-stamp,.change-head>svg{display:none}
.change-head small{padding-right:0;font-size:11px;line-height:1.35}
.change-head b{font-size:19px;line-height:1.32;margin:7px 0 6px;letter-spacing:-.03em;word-break:keep-all;overflow-wrap:anywhere}
.change-head>span:not(.change-stamp){font-size:12px;line-height:1.5;padding-right:0;-webkit-line-clamp:2}
.change-head em{font-size:10px;padding-top:4px}
.change-head:hover .change-art-thumb{filter:saturate(1.1)}
.change-art-figure{margin:16px 0 20px;border:1px solid #c8bda4;background:#f3edde;border-radius:3px;overflow:hidden}
.change-art-original{display:block;position:relative;background:#e8e0cc;color:#fdf9eb}
.change-art-original img{display:block;width:100%;height:auto;max-height:245px;min-height:150px;object-fit:contain;box-sizing:border-box}
.change-art-original>span{position:absolute;right:8px;bottom:8px;background:#2d3a2dd9;color:#fff9ea;font-size:10px;padding:5px 7px;border-radius:2px}
.change-art-original:focus-visible{outline:3px solid #59794f;outline-offset:-3px}
.change-art-figure figcaption{padding:10px 12px;color:#5c6650;line-height:1.6;font-size:11px}
.change-art-figure figcaption strong{display:block;font-size:13px;font-weight:500;margin:4px 0}
.art-kind{display:inline-block;font-size:10px;letter-spacing:.03em;color:#59704e}
.art-kind.generated{color:#93613e}
.art-kind.commemorative{color:#956a48}
.change-art-figure figcaption p{margin:5px 0;font-size:11px;line-height:1.7;color:#77745f}
.change-art-figure details{border-top:1px solid #d6cdb7;padding-top:7px;margin-top:7px}
.change-art-figure summary{cursor:pointer;font-size:11px;color:#6e755d}
.change-art-figure details span,.change-art-figure details a{display:block;margin-top:5px;font-size:10px;line-height:1.7;overflow-wrap:anywhere}
.change-art-figure details a{color:#526d43;text-decoration:underline;text-underline-offset:3px}
.map-change.has-art{padding-left:48px;min-height:57px;overflow:hidden}
.map-change .change-art-mini{position:absolute;left:0;top:0;width:40px;height:100%;object-fit:cover;border-right:1px solid #c5b89d;pointer-events:none}
.map-change.has-art span{display:none}
@media(max-width:600px){.change-art-original img{max-height:190px;min-height:110px}.change-art-figure{margin:12px 0}.change-art-figure figcaption{padding:8px 10px}}

.change-art-tag{position:absolute;bottom:7px;left:6px;max-width:88px;padding:3px 5px;background:#faf6e6eb;color:#4d6043;border:1px solid #bfbda7;font:normal 9px/1.3 var(--sans,sans-serif);pointer-events:none}

#historyImageViewer{position:fixed;inset:0;width:min(1050px,92vw);max-width:92vw;max-height:92vh;box-sizing:border-box;overflow:auto;border:1px solid #b2a789;background:#f6efdf;color:#394c34;padding:20px;border-radius:5px;overscroll-behavior:contain;box-shadow:0 25px 80px #1d271d66}
#historyImageViewer::backdrop{background:#1d281edb;backdrop-filter:blur(4px)}
.art-viewer-close{display:block;margin-left:auto;padding:8px 12px;border:1px solid #b7b298;background:#f4efdf;color:#405638;cursor:pointer}
.art-viewer-content h2{font:500 21px/1.5 var(--serif);margin:4px 0 15px}
.art-viewer-content img{display:block;width:100%;height:auto;max-height:65vh;object-fit:contain;background:#e9e0cc}
.art-viewer-content p{font-size:12px;line-height:1.7;margin:10px 0 0;color:#657057}
@media(max-width:600px){#historyImageViewer{padding:14px;max-height:94vh}.art-viewer-content h2{font-size:17px}}

/* The image replaces the old hanja badge; card coordinates stay unchanged. */
body[data-design=tree] .person-main,body[data-design=tree] .person-node.king .person-main{grid-template-columns:54px minmax(0,1fr)}
body[data-design=tree] .person-main .han,body[data-design=tree] .person-node.king .person-main .han{position:relative;width:54px;height:78px;border:0;overflow:hidden;background:#e3dbc6;border-radius:2px}
.person-art-thumb{display:block;width:54px;height:78px;object-fit:cover;object-position:center 28%;border:1px solid #b3a88d;pointer-events:none}
body[data-design=tree] .person-main .han>small{position:absolute;left:3px;bottom:3px;z-index:1;margin:0;padding:2px 4px;font:10px/1.2 Georgia,serif;color:#3f5236;background:#faf5e5e8;border-radius:2px}
body[data-design=tree] .event-marker{position:absolute;padding-left:62px;min-height:88px;overflow:hidden}
.event-marker .event-art-thumb{position:absolute;left:0;top:0;width:50px;height:100%;object-fit:cover;border-right:1px solid #c0b69c;pointer-events:none}
.map-event:has(.event-art-thumb){padding-left:34px;min-height:45px;width:130px;overflow:hidden}
.map-event .event-art-thumb{position:absolute;left:0;top:0;width:28px;height:100%;object-fit:cover;border-right:1px solid #c3baa1;pointer-events:none}
body[data-layout=ordered] .map-name.with-portrait{padding-left:37px;min-height:47px;text-align:left}
.map-name .person-art-thumb{position:absolute;left:2px;top:2px;width:30px;height:calc(100% - 4px);object-fit:cover;border:0;border-radius:2px;pointer-events:none}
body[data-design=tree] .zoom-far .person-main .han{display:none}

.family-child:has(.family-art-thumb){position:relative;padding-left:75px}
.family-art-thumb{position:absolute;left:10px;top:12px;width:54px;height:80px;object-fit:cover;border:1px solid #b4b195;border-radius:2px;pointer-events:none}
.family-art-label{position:absolute;left:11px;top:76px;width:52px;text-align:center;background:#f5efdfed;color:#637450;font:normal 8px/1.5 sans-serif;pointer-events:none}
.family-panel-list button:has(.family-art-thumb){position:relative;min-height:112px;padding-left:76px}

.person-main .han:has(img)::after{content:'자료';position:absolute;right:2px;bottom:3px;background:#fbf5e5e8;color:#4c6044;padding:2px 3px;font:8px/1.2 sans-serif;border-radius:1px;pointer-events:none}
.person-main .han:has(img[data-kind=generated])::after{content:'상상 초상';color:#895d3b}
.person-main .han:has(img[data-kind=place])::after{content:'유적'}
.event-marker:has(img)::after{content:'자료';position:absolute;left:4px;bottom:5px;background:#fbf5e5e8;color:#53664b;padding:2px 4px;font:8px/1.2 sans-serif;pointer-events:none}
.event-marker:has(img[data-kind=generated])::after{content:'AI 재구성';color:#895d3b;left:2px;padding:2px}
.event-marker:has(img[data-kind=place])::after{content:'유적'}

/* Portraits retain their original aspect ratio in the inspector. */
.portrait-art-figure .change-art-original img{height:300px;min-height:220px;max-height:340px;object-fit:contain}
#historyImageViewer.portrait-viewer{width:min(680px,92vw)}
.person-main .han:has(img[data-representation=historical-portrait])::after{content:'초상'}
.person-main .han:has(img[data-representation=posthumous-portrait])::after{content:'후대'}
.person-main .han:has(img[data-representation=photograph])::after{content:'사진'}
@media(max-width:600px){.portrait-art-figure .change-art-original img{height:160px;min-height:140px;max-height:180px}}
