#vfp-root { padding: 12px 0; font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; }
.vfp-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; align-items: start; max-width: 1400px; margin: 0 auto; }
@media (min-width: 800px) { .vfp-list { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1400px) { .vfp-list { grid-template-columns: repeat(4, 1fr); } }

.vfp-item { border-radius: 10px; overflow: hidden; background: transparent; }
.vfp-thumb-wrapper { width: 100%; aspect-ratio: 16/9; overflow: hidden; border-radius: 8px; display: block; position: relative; }
.vfp-thumb { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s ease; }
.vfp-item:hover .vfp-thumb { transform: scale(1.03); }

.vfp-duration { position: absolute; top: 8px; right: 8px; background: rgba(0,0,0,0.7); color: #fff; font-size: 12px; padding: 3px 6px; border-radius: 4px; z-index: 5; }

.vfp-meta { margin-top: 8px; text-align: left; padding: 0 6px 10px; }
.vfp-title { font-size: 13px; line-height: 1.2; margin: 0; font-weight: 600; color: inherit; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.vfp-loading { text-align:center; padding:12px; color:#666; font-size:13px; }