/* vlogos.css · Ki 2:23 PM Oct 19 2026: tap the photo to play, no pill buttons, just round platform logos (YouTube, Apple Music, Spotify). Revert = drop this <link> + vlogos.js. */
.vl,.dr-s{display:flex;align-items:center;justify-content:center;gap:12px;margin:9px 0 2px;flex-wrap:nowrap}
.bp-v .vl,.col-tx .vl,.ff-fav .vl,.lt-yt .vl{justify-content:flex-start}
.vl-i,.dr-i{position:relative;flex:0 0 34px;width:34px;height:34px;border-radius:50%;background:#fff;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.45);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .12s ease}
.vl-i::after,.dr-i::after{content:"";position:absolute;inset:-5px;border-radius:50%}
.vl-i:active,.dr-i:active{transform:scale(.9)}
.vl-i:focus-visible,.dr-i:focus-visible{outline:2px solid #39ff14;outline-offset:2px}
.vl-i svg,.dr-i svg{display:block;width:20px;height:20px}
.vl-yt svg,.dr-i-yt svg{width:21px;height:21px}
.vl-am svg,.dr-i-am svg{width:19px;height:19px}
.vl-s svg,.dr-i-s svg{width:34px;height:34px}
.vl-s,.dr-i-s{background:#000}
/* LATEST DROPS: the photo is the play button */
.dr-p{position:relative;display:block;width:100%;max-width:300px;border-radius:12px;overflow:hidden;box-shadow:0 10px 28px rgba(0,0,0,.6);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .15s ease}
.dr-c.dr-w .dr-p{max-width:560px}
.dr-p img{display:block;width:100%;max-width:100%;border-radius:0;box-shadow:none}
.dr-p:active{transform:scale(.97)}
.dr-pl{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:rgba(0,0,0,.5);border:1.5px solid rgba(255,255,255,.85);display:flex;align-items:center;justify-content:center;pointer-events:none;transition:background .15s,border-color .15s}
.dr-c.dr-w .dr-pl{width:54px;height:54px}
.dr-pl svg{width:22px;height:22px;margin-left:3px}
.dr-p:hover .dr-pl{background:#FF0000;border-color:#FF0000}
/* every other video photo: pointer + press */
.bp-v .bp-th,.col-cv,.ff-th,.vid>button,.lt-v .lt-im,.cz-play{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .15s ease}
.bp-v:active .bp-th,.col-c:active .col-cv,.ff-v:active .ff-th,.vid>button:active,.lt-v:active .lt-im,.cz-play:active{transform:scale(.97)}
.lt-yt li{display:flex;flex-direction:column}
/* era video tiles (.vid is a 16:9 box): logos sit bottom-right over the title shade */
.vid>.vl{position:absolute;right:8px;bottom:8px;margin:0;gap:8px;z-index:3}
.vid>.vl .vl-i{flex-basis:30px;width:30px;height:30px}
.vid>.vl .vl-yt svg{width:18px;height:18px}.vid>.vl .vl-am svg{width:16px;height:16px}.vid>.vl .vl-s svg{width:30px;height:30px}
.vid:has(>.vl) .vt{padding-right:118px}