.tvg-grid{display:grid;grid-template-columns:repeat(var(--tvg-cols,3),1fr);gap:var(--tvg-gap,12px)}
.tvg-card{position:relative;border-radius:16px;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,.1)}
.tvg-thumb{display:block;position:relative;width:100%;background:linear-gradient(135deg,#ffeef8 0%,#e0f4ff 50%,#fff4e6 100%);border:0;padding:0;cursor:pointer}
.tvg-poster{display:none}
.tvg-play{display:none}

/* aspect ratio via CSS variable */
.tvg-card{--tvg-aspect:16/9}
.tvg-card[data-aspect="9:16"]{--tvg-aspect:9/16}
.tvg-card[data-aspect="1:1"]{--tvg-aspect:1/1}
.tvg-thumb,.tvg-player-wrap{aspect-ratio:var(--tvg-aspect)}

.tvg-player-wrap{position:relative;width:100%;background:#000}
.tvg-player-wrap iframe,.tvg-player-wrap video{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}

.tvg-controls{position:absolute;right:12px;bottom:12px;display:flex;gap:10px;z-index:10}
.tvg-controls button{background:rgba(255,255,255,0.2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid #ffffff;border-radius:50%;width:44px;height:44px;box-shadow:0 2px 10px rgba(0,0,0,.3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;transition:all .2s;position:relative;color:#ffffff}
.tvg-controls button:hover{background:rgba(255,255,255,0.3);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transform:scale(1.1)}
.tvg-controls button:focus{outline:none}

/* Progress circle around pause button */
.tvg-pause{position:relative}
.tvg-progress-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:52px;height:52px;pointer-events:none}
.tvg-progress-ring circle{fill:none;stroke:#ffffff;stroke-width:2.5;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dashoffset .3s ease}

.tvg-caption{padding:8px 12px;font-size:14px;color:#333;background:#f9f9f9;text-align:center}