.videocard{padding:0;border-radius:.33rem;transform-origin:center;box-shadow:0 4px 20px rgba(0,0,0,.08);transition:transform .3s ease,background-color .3s ease,box-shadow .3s ease;will-change:transform;position:relative;z-index:1;height:-moz-fit-content;height:fit-content;overflow:visible;width:97%;background:hsla(0,0%,100%,.05);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid hsla(0,0%,100%,.2);box-shadow:0 4px 20px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.05),inset 0 1px 0 hsla(0,0%,100%,.1)}.dark .videocard{background:hsla(0,0%,100%,.03);border:1px solid hsla(0,0%,100%,.08);box-shadow:0 4px 20px rgba(0,0,0,.3),0 0 0 1px hsla(0,0%,100%,.05),inset 0 1px 0 hsla(0,0%,100%,.05)}@media screen and (min-width:576px){.videocard{padding:0;border-radius:.33rem}}.videocard a{display:block;margin:0;padding:0}.videocard:hover{z-index:1;transition:transform .3s ease .2s,background-color .3s ease .2s,box-shadow .3s ease .2s;box-shadow:0 12px 40px rgba(0,0,0,.15),0 0 0 1px rgba(0,0,0,.08),inset 0 1px 0 hsla(0,0%,100%,.2);background:hsla(0,0%,100%,.08);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid hsla(0,0%,100%,.25)}@media screen and (min-width:976px){.videocard:hover{transform:scale(1.2)}}.videocard:hover .completion-indicator{opacity:0!important;pointer-events:none;transition:opacity .2s ease}.dark .videocard:hover{background:hsla(0,0%,100%,.05);border:1px solid hsla(0,0%,100%,.12);box-shadow:0 12px 40px rgba(0,0,0,.5),0 0 0 1px hsla(0,0%,100%,.08),inset 0 1px 0 hsla(0,0%,100%,.1)}.videocard:hover a{margin:0;padding:0}.videocard:hover .vc-thumb{border-radius:.35rem;margin-bottom:.5rem}.videocard:hover .vc-thumb-button{opacity:1;transition:opacity .3s ease .2s}.videocard:hover .vc-progress{height:auto;opacity:1;display:flex;flex-direction:column;transition:all .3s ease .2s}.videocard:hover .vc-progress-item,.videocard:hover .vc-progress-item:last-child{margin-bottom:.5rem}.videocard:hover .speech-bubble,.videocard:hover .vc-thumb-time,.videocard:hover .vc-thumb-title,.videocard:hover .videocard-poriority-info{opacity:1;transition:opacity .3s ease .2s}.videocard .vc-thumb{display:flex;aspect-ratio:16/9;height:auto;background-position:50%;background-repeat:no-repeat;background-size:110% auto;position:relative;border-radius:0;margin:0;background-image:var(--static-thumb)}.videocard .vc-thumb,.videocard .vc-thumb-layer{width:100%;transition-timing-function:linear;transition-duration:.2s}.videocard .vc-thumb-layer{position:absolute;bottom:0;left:0;height:100%;z-index:1}.videocard .vc-thumb-time{position:absolute;top:.35rem;right:.35rem;padding:.1rem .35rem;display:flex;align-items:center;justify-content:center;z-index:2;transition-timing-function:linear;transition-duration:.2s;opacity:0;transition:opacity .3s ease}.videocard .vc-thumb-time span{font-size:.7rem;color:#fff;line-height:1;border-radius:.25rem}.videocard .vc-thumb-button{display:flex;align-items:center;justify-content:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;opacity:0;transition:opacity .3s ease}.videocard .vc-thumb-button img{width:2rem;height:2rem;transition-timing-function:linear;transition-duration:.2s}.videocard .vc-thumb-title{display:flex;align-items:center;position:absolute;bottom:.35rem;left:.35rem;z-index:2;transition-timing-function:linear;transition-duration:.2s;opacity:0;transition:opacity .3s ease}.videocard .vc-thumb-title h4{font-size:.75rem;color:#fff;line-height:1;font-weight:400;margin:0}.videocard .vc-thumb-title span{margin-left:.35rem}.videocard .vc-thumb-title span svg{width:auto;height:.75rem}.videocard .vc-thumb-title span svg path{stroke:#3b82f6;stroke-width:.3rem}.videocard .vc-thumb:hover{background-image:var(--hover-thumb);transition-delay:.2s}.videocard .vc-thumb-animated{position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;opacity:0;transition:opacity .3s ease .2s;pointer-events:none}.videocard .vc-thumb:hover .videocard .vc-thumb-animated.loaded{opacity:1}.videocard .vc-progress{padding:0 .5rem;height:0;overflow:visible;opacity:0;transition:all .3s ease;gap:0;background:hsla(0,0%,100%,.15);border:1px solid hsla(0,0%,100%,.2);border-radius:.5rem}.dark .videocard .vc-progress{background:rgba(0,0,0,.3);border:1px solid hsla(0,0%,100%,.1)}.videocard .vc-progress-item{display:flex;align-items:center;justify-content:space-between;padding:.2rem .35rem;border-radius:.33rem;margin-bottom:.5rem;transition:margin .3s ease;background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.15);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.dark .videocard .vc-progress-item{background:hsla(0,0%,100%,.05);border:1px solid hsla(0,0%,100%,.08)}@media screen and (min-width:976px){.videocard .vc-progress-item{padding:.25rem .35rem}}.videocard .vc-progress-item p{font-size:.6rem;font-weight:600;margin:0;line-height:.9rem;color:rgba(0,0,0,.9);text-shadow:0 1px 2px hsla(0,0%,100%,.5)}.dark .videocard .vc-progress-item p{color:hsla(0,0%,100%,.95);text-shadow:0 1px 2px rgba(0,0,0,.5)}.videocard .vc-progress-item span svg{width:auto;height:.6rem}@media screen and (min-width:976px){.videocard .vc-progress-item span svg{height:.75rem}}.videocard .vc-progress-item span svg path{stroke:#fff;stroke-width:.2rem}.videocard[data-status=blocked]{opacity:.8;filter:grayscale(1)}.videocard[data-status=blocked] .vc-thumb-button{pointer-events:none}.videocard[data-status=done] .vc-thumb-title h4{color:#3b82f6;font-weight:700}.videocard .completion-indicator,.videocard[data-status=done] .completion-indicator{opacity:1;transition:opacity .3s ease}.videocard .vc-progress-item.done{background-color:#3b82f6}.videocard .success-above-95{background:linear-gradient(90deg,#c5c1da,#75cae4 10%,#80cbe8 30%,#fdb0fd 50%,#1db4f1 80%,#fdb0fd)}.videocard .success-below-70{background-color:#f87272!important}.videocard .success-between-70-90{background-color:#3b82f6!important}.videocard .success-above-90{background-color:#36d399!important}.videocard .speech-bubble{position:absolute;top:0;left:20px;background:#fff;border-radius:80px;padding:6px;opacity:0;transition:opacity .3s ease}.videocard .speech-bubble:after{content:"";position:absolute;top:75%;right:6px;transform:translateY(-50%) rotate(15deg);width:16px;height:16px;background:#fff;z-index:-1}.videocard .speech-bubble svg{transform:scaleX(-1);stroke:#3b82f6;width:16px;height:16px}.videocard .videocard-poriority-info{opacity:0;transition:opacity .3s ease}