/* Hover preview on artist cards (script: js/artist-video-hover.js). The wrapper takes the photo's
   place; the 16:9 video is widened to cover the card's photo box edge to edge and centred, fades
   in once loaded, and ignores the pointer so a click still lands on the card. */
.vh-photo { position: relative; display: block; overflow: hidden; }
.vh-photo[data-yt] { cursor: pointer; }
.vh-video {
    position: absolute;
    top: 0; left: 50%;
    height: 100%;
    width: 178%;               /* 16:9 over a square box; wider boxes are still covered */
    min-width: 100%;
    transform: translateX(-50%);
    border: 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity .35s ease;
    z-index: 1;
}
.vh-video.on { opacity: 1; }

/* Full-size player opened by clicking a playing preview. */
.vh-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: none;
    place-items: center;
    padding: 4vmin;
    background: rgba(3, 6, 12, .96);
}
.vh-modal.open { display: grid; }
html.vh-open { overflow: hidden; }
.vh-box { position: relative; width: min(100%, calc((100dvh - 8vmin - 56px) * 16 / 9)); }
.vh-frame { aspect-ratio: 16 / 9; background: #000; border-radius: 8px; overflow: hidden; }
.vh-frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.vh-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }
.vh-name { color: #fff; font-weight: 800; font-size: 1.05rem; margin-right: auto; }
.vh-link {
    padding: 8px 16px;
    border-radius: 999px;
    background: #32d583;
    color: #04140b;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}
.vh-link:hover { filter: brightness(1.08); }
.vh-close {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    font-size: 1.9rem;
    line-height: 1;
    color: #fff;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 50%;
    cursor: pointer;
}
.vh-close:hover { background: rgba(255, 255, 255, .2); }