/* Object-shaped links live on the photograph; labels appear only on intent. */
.detail-hotspot{position:absolute;padding:0;border:0;background:none;pointer-events:none;z-index:15;line-height:1.4}
.detail-hotspot-hit{position:absolute;inset:0;clip-path:var(--detail-shape);pointer-events:auto;cursor:pointer;transition:background .18s}
.detail-hotspot-label{position:absolute;left:var(--hint-x,50%);top:var(--hint-y,50%);transform:translate(-50%,-50%);white-space:nowrap;padding:7px 10px;background:#211b13d9;color:#f0e4cb;font:13px/1.5 'Songti SC',serif;letter-spacing:.1em;opacity:0;pointer-events:none;transition:opacity .18s}
.detail-hotspot:hover .detail-hotspot-label,.detail-hotspot:focus-visible .detail-hotspot-label{opacity:1}
.detail-hotspot:hover .detail-hotspot-hit{background:#ffe8b509}
.detail-hotspot:focus-visible{outline:none}
.detail-hotspot:focus-visible .detail-hotspot-hit{background:#ffe8b52b}
.detail-hotspot:disabled .detail-hotspot-hit{pointer-events:none}
.detail-hotspot:disabled .detail-hotspot-label{opacity:0}
.detail-nav{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:12px;display:flex;align-items:center;gap:8px;z-index:3;line-height:1.5}
.detail-nav-link{min-width:44px;min-height:44px;padding:8px 9px;border:0;background:#211b13b8;color:#eddfc2;font:12px/1.5 'Songti SC',serif;letter-spacing:.08em;text-shadow:0 1px 5px #000;cursor:pointer}
.detail-nav-link:hover{background:#211b13d9}
.detail-nav-link:focus-visible{outline:1px solid #eddfc2;outline-offset:2px;background:#211b13b0}
.detail-nav-link:disabled{opacity:.4;cursor:default}
#typewriter-view>.detail-nav{position:static;justify-content:flex-end;margin-top:12px}
@media(max-height:500px){.detail-nav{right:10px;bottom:8px;gap:4px}}
@media(prefers-reduced-motion:reduce){.detail-hotspot-hit,.detail-hotspot-label{transition:none}}
