/* Native artwork is split only at interactive objects; the static composition is unchanged. */
.hover-art{position:absolute;left:var(--pc-x);top:var(--pc-y);width:var(--pc-w);height:var(--pc-h);z-index:2;pointer-events:none;line-height:0}
.hover-art picture,.hover-art img{display:block;width:100%;height:100%!important;aspect-ratio:auto!important;object-fit:fill}
.hover-art picture{transition:transform .3s ease,filter .3s ease,opacity .3s ease;transform-origin:center}
.hotspot:focus-visible{z-index:3}
@media(max-width:767px){.hover-art{left:var(--sp-x);top:var(--sp-y);width:var(--sp-w);height:var(--sp-h)}}
@media(prefers-reduced-motion:reduce){.hover-art picture{transition:none}}
#cities .hotspot[data-link="fukuoka-summer"]:is(:hover,:focus-visible) ~ .hover-art[data-art="fukuoka-summer"] picture{transform:translateY(-3%);filter:drop-shadow(0 .4em .6em rgba(0,0,0,.18))}
#cities .hotspot[data-link="sendai"]:is(:hover,:focus-visible) ~ .hover-art[data-art="sendai"] picture{transform:translateY(-3%);filter:drop-shadow(0 .4em .6em rgba(0,0,0,.18))}
#cities .hotspot[data-link="yokohama"]:is(:hover,:focus-visible) ~ .hover-art[data-art="yokohama"] picture{transform:translateY(-3%);filter:drop-shadow(0 .4em .6em rgba(0,0,0,.18))}
/* Restore the existing recruitment and venue button feedback. */
#venues .hotspot,#recruitment .hotspot{transition:background-color .2s ease}
@media(hover:hover){#venues .hotspot:hover,#recruitment .hotspot:hover{background-color:rgb(255 255 255 / 25%)}}
#venues .hotspot:focus-visible,#recruitment .hotspot:focus-visible{background-color:rgb(255 255 255 / 25%)}
@media(prefers-reduced-motion:reduce){#venues .hotspot,#recruitment .hotspot{transition:none}}