/* vtiles v1 — video tiles from Cloudflare R2 (v.videoattic.com).
   Markup:  <div class="vt" data-vid="<id>"></div>
   Options: data-ratio="9/16"  data-controls (native player, no autoplay)  */
.vt{position:relative;width:100%;aspect-ratio:var(--vt-ratio,9/16);background:#111;overflow:hidden;border-radius:inherit;isolation:isolate;-webkit-tap-highlight-color:transparent}
.vt.vt-fill{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
.vt>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#111}
.vt[data-controls]>video{object-fit:contain}
.vt-shield{position:absolute;inset:0;z-index:2;width:100%;height:100%;border:0;padding:0;margin:0;background:transparent;cursor:pointer}
.vt-badge{position:absolute;right:10px;bottom:10px;z-index:3;width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;display:flex;align-items:center;justify-content:center;pointer-events:none;transition:background .2s}
.vt-badge svg{width:19px;height:19px;display:block}
.vt-badge .vt-loud{display:none}
.vt.sound-on .vt-badge .vt-muted{display:none}
.vt.sound-on .vt-badge .vt-loud{display:block}
.vt.sound-on .vt-badge{background:rgba(0,0,0,.35)}