.yt-lite{position:relative;width:100%;aspect-ratio:16/9;background-position:center;background-size:cover;cursor:pointer;border-radius:12px;overflow:hidden}
.yt-lite::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.12);transition:background .2s}
.yt-lite:hover::before{background:rgba(0,0,0,.25)}
.yt-lite::after{content:"";position:absolute;inset:0;margin:auto;width:68px;height:48px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='48' viewBox='0 0 68 48'%3E%3Cpath fill='%23000' fill-opacity='.4' d='M66.52 7.74a8 8 0 0 0-5.62-5.66C56.74 1 34 1 34 1s-22.74 0-26.9 1.08a8 8 0 0 0-5.62 5.66C0.4 11.9 0.4 24 0.4 24s0 12.1 1.08 16.26a8 8 0 0 0 5.62 5.66C11.26 47 34 47 34 47s22.74 0 26.9-1.08a8 8 0 0 0 5.62-5.66C67.6 36.1 67.6 24 67.6 24s0-12.1-1.08-16.26z'/%3E%3Cpath d='M45 24 27 14v20z' fill='%23fff'/%3E%3C/svg%3E") no-repeat center/100% 100%;transition:transform .12s}
.yt-lite:hover::after{transform:scale(1.06)}