.cmp-gallery-v1{padding:0}

.cmp-gallery-v1__grid{display:grid;grid-template-columns:1fr;gap:4px}

.cmp-gallery-v1__tile{position:relative;overflow:hidden;background:var(--bg-2);aspect-ratio:4/3}

.cmp-gallery-v1__img,.cmp-gallery-v1__vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:opacity .4s ease}

.cmp-gallery-v1__vid{opacity:0}

.cmp-gallery-v1__hint{position:absolute;top:14px;right:14px;display:inline-flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.55);color:#fff;width:32px;height:32px;border-radius:999px;backdrop-filter:blur(4px);
  opacity:1;transition:opacity .3s ease;pointer-events:none;z-index:2}

.cmp-gallery-v1__hint svg{width:13px;height:13px}

.cmp-gallery-v1__tile--playing .cmp-gallery-v1__hint{opacity:0}

.cmp-gallery-v1__tile--playing .cmp-gallery-v1__img{opacity:0}

.cmp-gallery-v1__tile--playing .cmp-gallery-v1__vid{opacity:1}

@media(min-width:940px){
  .cmp-gallery-v1__grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:340px;gap:4px}
  .cmp-gallery-v1__tile{aspect-ratio:auto;height:100%}
}