.vv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.vv-card{position:relative;padding:0;border:0;border-radius:10px;overflow:hidden;cursor:pointer;background:#111;aspect-ratio:9/16}
.vv-card img{width:100%;height:100%;object-fit:cover;display:block}
.vv-play{position:absolute;inset:0;margin:auto;width:44px;height:44px;border-radius:50%;background:rgba(0,0,0,.55);backdrop-filter:blur(2px)}
.vv-play::after{content:"";position:absolute;top:50%;left:54%;transform:translate(-50%,-50%);border-left:13px solid #fff;border-top:8px solid transparent;border-bottom:8px solid transparent}
.vv-ov{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.94);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .25s}
.vv-ov.on{opacity:1}
.vv-v{max-width:94vw;max-height:86vh;object-fit:contain;background:#000}
.vv-x{position:absolute;top:14px;right:16px;width:40px;height:40px;border:0;border-radius:50%;background:rgba(255,255,255,.13);color:#fff;font-size:26px;line-height:1;cursor:pointer}
.vv-hd{position:absolute;top:18px;left:18px;right:70px;color:#fff;font-size:13px;display:flex;gap:12px;align-items:baseline;opacity:.9}
.vv-c{opacity:.6;font-variant-numeric:tabular-nums;white-space:nowrap}
.vv-nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border:0;border-radius:50%;background:rgba(255,255,255,.13);color:#fff;font-size:30px;line-height:1;cursor:pointer}
.vv-prev{left:14px}.vv-next{right:14px}
@media(max-width:700px){.vv-nav{display:none}.vv-v{max-width:100vw;max-height:80vh}
.vv-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}}