.shorts-card{position:relative;display:block;overflow:hidden;aspect-ratio:9 / 16;min-width:0;background-color:var(--color-card-deep);background-size:cover;background-position:center;background-repeat:no-repeat;text-decoration:none;transition:opacity var(--transition-fast) var(--ease-standard)}.shorts-card:hover{opacity:1}.shorts-card:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color-on-dark);outline-offset:var(--focus-ring-offset);border-radius:var(--radius-sm)}.shorts-progress{position:absolute;top:0;left:0;right:0;z-index:var(--z-content);height:.25rem;overflow:hidden;background:color-mix(in srgb,var(--color-ink-on-dark) 22%,transparent)}.shorts-progress-fill{display:block;height:100%;background:var(--color-brand)}.shorts-duration{width:55px;height:25px;position:absolute;left:.5rem;top:.5rem;z-index:var(--z-content);display:flex;align-items:center;justify-content:center;gap:.25rem;background:color-mix(in srgb,var(--color-surface-dark) 60%,transparent);color:var(--color-ink-on-dark);font-family:var(--font-sans);font-size:var(--text-shorts-duration);font-weight:var(--text-shorts-duration--font-weight);letter-spacing:var(--tracking-shorts-duration);font-variant-numeric:tabular-nums;line-height:var(--text-shorts-duration--line-height)}.shorts-video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.shorts-play{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;display:inline-flex;align-items:center;justify-content:center;color:var(--color-ink-on-dark);opacity:0;transition:opacity var(--transition-fast) var(--ease-standard),background var(--transition-fast) var(--ease-standard)}.shorts-play:hover{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--color-surface-dark) 15%,transparent) 0,color-mix(in srgb,var(--color-surface-dark) 15%,transparent) .75rem,color-mix(in srgb,var(--color-surface-dark) 15%,transparent) .75rem,color-mix(in srgb,var(--color-surface-dark) 15%,transparent) 1.5rem)}.shorts-play svg{width:auto;height:82px}.shorts-card:hover .shorts-play{opacity:1}.shorts-card[data-previewing] .shorts-play{opacity:0}.shorts-title{position:absolute;right:0;bottom:0;left:0;margin:0;padding:2rem .75rem .75rem;background:linear-gradient(to top,color-mix(in srgb,var(--color-surface-dark) 85%,transparent),transparent)}.shorts-title>span{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;font-family:var(--font-sans);font-size:var(--text-card-sm);font-weight:var(--text-card-sm--font-weight);line-height:var(--text-card-sm--line-height);letter-spacing:var(--tracking-card-sm);color:var(--color-ink-on-dark)}.shorts-card[data-clamp="1"] .shorts-title>span{-webkit-line-clamp:1;line-clamp:1}.shorts-card[data-clamp="2"] .shorts-title>span{-webkit-line-clamp:2;line-clamp:2}.shorts-card[data-clamp="3"] .shorts-title>span{-webkit-line-clamp:3;line-clamp:3}@media(max-width:1024px){.shorts-title>span{font-size:.875rem}}