video-card{display:grid;grid-template-columns:10.5rem 1fr;gap:var(--space-md);padding:var(--space-sm);border-radius:var(--shape-md);background:var(--paper-raised);box-shadow:var(--shadow-1);transition:box-shadow var(--motion-fast) var(--ease-standard),transform var(--motion-base) var(--ease-spring)}video-card:hover{box-shadow:var(--shadow-2);transform:translateY(-1px)}card-thumb{display:block;position:relative}card-thumb a{display:block;position:relative;line-height:0}card-thumb img{inline-size:100%;aspect-ratio:16 / 9;object-fit:cover;border-radius:var(--shape-sm);background:var(--paper-sunken)}thumb-duration{position:absolute;inset-block-end:var(--space-2xs);inset-inline-end:var(--space-2xs);padding:0 var(--space-2xs);border-radius:var(--shape-xs);background:color-mix(in srgb,var(--shade) 72%,transparent);color:#fff;font-family:var(--voice-machine);font-size:var(--type-label);line-height:1.6}card-body{display:flex;flex-direction:column;gap:var(--space-xs);justify-content:center;min-inline-size:0}card-title{display:block;font-size:var(--type-title);line-height:var(--leading-tight);font-weight:600}card-title a{color:var(--ink);text-decoration:none}card-title a:hover{color:var(--accent)}card-meta{display:flex;flex-wrap:wrap;gap:var(--space-sm)}@media(max-width:40rem){video-card{grid-template-columns:1fr}}