.os-video-list{height:100%;padding:10px}.os-video-list .video-data{display:flex;gap:10px;flex-wrap:wrap}.os-video-list .video-data .video-item{position:relative;display:flex;gap:4px;flex-direction:column;align-items:center;border-radius:8px;transition:background .15s}.os-video-list .video-data .video-item:hover{background:#0000000a}.os-video-list .video-data .video-item.is-active .video-icon .video-overlay{opacity:1;background-color:color-mix(in srgb,var(--os-theme) 40%,transparent)}.os-video-list .video-data .video-item .video-icon{position:relative;width:100%;display:inline-flex;border-radius:6px}.os-video-list .video-data .video-item .video-icon:hover .video-overlay{opacity:1}.os-video-list .video-data .video-item .video-icon img{-o-object-fit:cover;object-fit:cover;border-radius:6px}.os-video-list .video-data .video-item .video-icon .video-overlay{opacity:0;position:absolute;inset:0;transition:.3s;display:flex;align-items:center;justify-content:center;border-radius:6px;background-color:#0003}.os-video-list .video-data .video-item .video-icon .video-badge{position:absolute;top:6px;right:6px;background:#0009;color:#fff;padding:2px 6px;border-radius:3px;font-size:10px;font-weight:600;letter-spacing:.3px}.os-video-list .video-data .video-item .video-icon .video-tags{position:absolute;top:6px;left:6px}.os-video-list .video-data .video-item .video-details{position:absolute;left:8px;bottom:8px;display:flex;gap:4px;flex-direction:column}.os-video-list .video-data .video-item .video-details .video-name{max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#ffffffe0}.os-video-list .video-data .video-item .video-details .video-date{opacity:.92;font-size:11px;color:#ffffffe0}
