/* Click-to-play YouTube cards shared by the home, updates and licenses pages. */
.inline-youtube-player {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.inline-youtube-player > img,
.inline-youtube-player .inline-youtube-cover {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.inline-youtube-player iframe {
    position: absolute;
    inset: 0;
    z-index: 20;
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
    border-radius: inherit;
    background: #000;
}

.inline-youtube-player:focus-visible {
    outline: 3px solid #ff9d00;
    outline-offset: 4px;
}

.inline-youtube-player.is-playing {
    cursor: default;
}

.inline-youtube-player.is-playing::after {
    display: none !important;
}

.inline-youtube-player.is-playing > :not(iframe) {
    display: none !important;
}

.inline-youtube-hero-play {
    position: absolute;
    inset: 50% auto auto 50%;
    z-index: 4;
    width: 62px;
    height: 62px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #080808;
    background: #ff9d00;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .46), 0 0 30px rgba(255, 157, 0, .18);
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.inline-youtube-local-note {
    position: absolute;
    z-index: 30;
    inset: auto 18px 18px;
    padding: 12px 14px;
    border: 1px solid rgba(255, 157, 0, .38);
    border-radius: 10px;
    color: #f2f2f2;
    background: rgba(10, 10, 10, .94);
    font: 600 12px/1.45 'Inter', sans-serif;
    text-align: center;
}

.inline-youtube-local-note strong {
    color: #ffb02c;
}

@media (max-width: 600px) {
    .inline-youtube-hero-play { width: 52px; height: 52px; }
    .inline-youtube-local-note { inset: auto 10px 10px; font-size: 11px; }
}