.ch-ytoverlay-playlist-container {container-type: inline-size;container-name: ch-yt-playlist;}
.ch-ytoverlay-playlist {display: flex;gap:28px;}

.ch-ytoverlay-player {flex-basis: 60%;flex-shrink: 0;flex-grow: 0;}
.ch-ytoverlay-player .ch-youtube-overlay-wrap:not(.active) {display: none;}

.ch-ytoverlay-video-list {flex-basis: 40%;flex-grow: 0;position: relative;}
.ch-ytoverlay-video-list-scroll-wrap {position: absolute;height: 100%;width: 100%;top: 0;bottom: 0;overflow: scroll;}
.ch-ytoverlay-video-list-scroll-wrap:after {content: " ";position: sticky;display: block;bottom: 0;left: 0;right: 0;height: 30px;background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #FFF 100%);}
.ch-ytoverlay-video-list-item {display:flex;gap:16px;background:none;border:none;border-bottom:2px solid #b7b7b7;padding: 8px 0px;text-align: left;}
.ch-ytoverlay-video-list-item:first-of-type {border-top:2px solid #b7b7b7;}
.ch-ytoverlay-video-list-item-title {font-weight: bold;font-size: .9em;}
.ch-ytoverlay-video-list-item-description {font-size: .8em;line-height: 1.2;}
.ch-ytoverlay-video-list-item-thumb {aspect-ratio: 16/9;min-width: 72px;width: 24%;height:100%;position: relative;flex-shrink: 0;flex-grow: 0;}
.ch-ytoverlay-video-list-item-thumb img {aspect-ratio: 16/9;object-fit: cover;width: 100%;border-radius: 4px;}
.ch-ytoverlay-video-list-item-thumb .video-duration {position: absolute;right: 5px;bottom: 5px;background: #fff;border-radius: 100px;padding: 0px 8px;font-size: 10px;line-height: 1.8;}
.ch-ytoverlay-video-list-item-play-icon {
    width: 24px;height: 24px;background: #fff;border-radius: 200px;position: absolute;top: calc(50% - 12px);left: calc(50% - 12px);
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 16 16' style='enable-background:new 0 0 16 16;' xml:space='preserve'%3E%3Cpath d='M3,14.3V1.7L15.6,8L3,14.3z'/%3E%3C/svg%3E");
    background-size: 16px 16px;background-repeat: no-repeat;background-position: center;box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.25);border: none;display: none;
}
.ch-ytoverlay-video-list-item.active .ch-ytoverlay-video-list-item-play-icon {display: block;}
.ch-ytoverlay-video-list-item.active .video-duration {display: none;}
.ch-ytoverlay-video-list-item:not(.active) .ch-ytoverlay-video-list-item-description {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}

@container ch-yt-playlist (max-width: 960px) {
    .ch-ytoverlay-player {flex-basis: 50%}
    .ch-ytoverlay-video-list {flex-basis: 50%;}
}

@container ch-yt-playlist (max-width: 700px) {
    .ch-ytoverlay-playlist {flex-direction: column;}
    .ch-ytoverlay-video-list-scroll-wrap {position:relative;max-height: 300px;}
}