/* hero playable cards + lightbox */
.hv{cursor:pointer}
@media(hover:hover) and (pointer:fine){.hv{cursor:none}.hv .hmute{cursor:pointer}}
.sv{transition:transform .5s cubic-bezier(.23,1,.32,1)}
@media(hover:hover){.sv:hover{transform:translateY(-6px)}.sv:hover img{filter:brightness(.92)}}
.sv img{transition:filter .3s ease}
.hmute{position:absolute;right:14px;top:14px;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;z-index:3;transition:transform .16s cubic-bezier(.23,1,.32,1)}
.hmute:active{transform:scale(.9)}
.hmute svg{width:17px;height:17px}
.hmute.on:after{content:'';position:absolute;width:15px;height:1.8px;background:#000;transform:rotate(45deg);border-radius:2px}
.hv:focus-visible{outline:3px solid var(--vk);outline-offset:4px}
@media(hover:none){.sv:after{content:'';position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:rgba(255,255,255,.9) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E") 56% 50%/22px no-repeat}}
.vlb{position:fixed;inset:0;z-index:300;display:grid;place-items:center;pointer-events:none;opacity:0;transition:opacity .3s ease}
.vlb.open{opacity:1;pointer-events:auto}
.vlb-bg{position:absolute;inset:0;background:rgba(10,10,12,.82);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.vlb-box{position:relative;width:min(1000px,92vw);transform:translate3d(0,20px,0) scale(.97);transition:transform .45s cubic-bezier(.23,1,.32,1)}
.vlb.open .vlb-box{transform:none}
.vlb.tall .vlb-box{width:min(420px,88vw)}
.vlb-media{position:relative;border-radius:22px;overflow:hidden;background:#000;aspect-ratio:16/9}
.vlb.tall .vlb-media{aspect-ratio:9/16;max-height:82vh}
.vlb-media video,.vlb-media img{width:100%;height:100%;object-fit:cover;display:block}
.vlb-soon{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;background:#fff;border-radius:999px;padding:10px 16px;font:600 14px/1 var(--fb);white-space:nowrap}
.vlb-soon span{font-size:11px}
.vlb-x{position:absolute;right:-8px;top:-52px;width:42px;height:42px;border-radius:50%;border:0;background:#fff;font:400 26px/1 var(--fb);cursor:pointer}
.vlb-cap{margin-top:14px;text-align:center;color:#fff;font:600 15px/1.3 var(--fb)}
.vlb-cap b{font-weight:800}
html.vlb-lock,html.vlb-lock body{overflow:hidden}
@media(max-width:720px){.vlb-x{right:0;top:-50px}}
/* desktop: the cursor is the play button, so hide the static one */
@media(hover:hover) and (pointer:fine){.lplay{display:none}.lv2{cursor:none}}
