/* Overlay the bottom of the picture; never resize or recenter the video. */
.watch-shell{--watch-banner-content-height:0px;--watch-banner-height:var(--watch-banner-content-height)}
.watch-player-banner{position:absolute;z-index:5;left:0;right:0;bottom:var(--watch-footer);height:var(--watch-banner-height);box-sizing:border-box;display:block;pointer-events:none;background:transparent;border:0;overflow:hidden}
.watch-player-banner[hidden]{display:none}
.watch-player-banner-card{display:block;width:var(--watch-banner-image-width,100%);max-width:100%;height:var(--watch-banner-content-height);margin:0 auto;overflow:hidden;pointer-events:none;background:transparent}
a.watch-player-banner-card{pointer-events:auto}
a.watch-player-banner-card:focus-visible{outline:2px solid #fff;outline-offset:-3px}
.watch-player-banner-card img{display:block;width:100%;height:100%;object-fit:contain}
/* Controls remain usable above the image; episode actions stay at the bottom. */
.watch-shell.has-player-banner .watch-progress{bottom:calc(var(--watch-footer) + var(--watch-banner-height) + 5px)}
.watch-shell.has-player-banner .watch-title-button{bottom:calc(var(--watch-footer) + var(--watch-banner-height) + 58px)}
.watch-shell.has-player-banner .watch-member-cta{bottom:calc(var(--watch-footer) + var(--watch-banner-height) + 110px)}
.watch-shell.has-player-banner .watch-social-actions{bottom:calc(var(--watch-footer) + var(--watch-banner-height) + 128px)}
/* Expanded players reach the viewport edge when their controls are hidden. */
.watch-shell.is-inline-player.controls-hidden .watch-player-banner,.watch-shell.is-expanded.controls-hidden .watch-player-banner{bottom:0;--watch-banner-height:calc(var(--watch-banner-content-height) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}
.watch-shell.is-detail-open .watch-player-banner,.watch-shell.is-ad-playing .watch-player-banner{display:none}
@media(orientation:landscape){
 .watch-shell.has-player-banner .watch-social-actions{bottom:calc(var(--watch-footer) + var(--watch-banner-height) + 40px)}
}

/* Move only the banner image; its measured frame keeps controls in place. */
.watch-player-banner-card.is-entering{animation:mj-player-banner-in .4s cubic-bezier(.2,.7,.2,1) both}
.watch-player-banner-card.is-leaving{animation:mj-player-banner-out .3s ease-out both;pointer-events:none}
@keyframes mj-player-banner-in{from{transform:translateX(var(--watch-banner-enter-x,-100%));opacity:0}to{transform:translateX(0);opacity:1}}
@keyframes mj-player-banner-out{from{opacity:1}to{opacity:0}}
@media(prefers-reduced-motion:reduce){.watch-player-banner-card.is-entering,.watch-player-banner-card.is-leaving{animation:none}}
