/* Responsive, click-to-play Cloudflare Stream embeds. */
.vsl-player{position:relative;width:100%;max-width:1000px;aspect-ratio:16/9;margin:0 auto 40px;overflow:hidden;border:1px solid #65545d;border-radius:8px;background:#080808}
.vsl-player iframe{position:absolute;inset:0;display:block;width:100%;height:100%;border:0}
.vip-success-video.vsl-player{max-width:none;margin-bottom:0;border-radius:12px}
@media(max-width:600px){.vsl-player{margin-bottom:28px}}
.vsl-player iframe{pointer-events:none}
.vsl-toggle{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;width:100%;height:100%;border:0;padding:16px;background:transparent;color:#fff;cursor:pointer;font:inherit}
.vsl-button-icon{display:grid;place-items:center;width:76px;height:76px;flex-shrink:0;border:1px solid #efd0c9;border-radius:50%;background:linear-gradient(120deg,#efb69b,#b79bd3);box-shadow:0 0 65px #cfaabc30;animation:vsl-shake 3s ease-in-out infinite}
.vsl-button-icon svg{width:30px;height:30px;fill:#252028;grid-area:1/1}
.vsl-pause-icon{display:none}
.vsl-button-label{font-size:16px;font-weight:500;line-height:1.3;text-shadow:0 1px 6px #000;padding:6px 10px;border-radius:6px;background:#08080899}
.vsl-toggle:focus-visible{outline:3px solid #fff;outline-offset:-5px}
.is-playing .vsl-toggle{align-items:flex-end;justify-content:flex-end;gap:6px}
.is-playing .vsl-button-icon{width:44px;height:44px;animation:none}
.is-playing .vsl-button-icon svg{width:22px;height:22px}
.is-playing .vsl-play-icon{display:none}
.is-playing .vsl-pause-icon{display:block}
.is-playing .vsl-button-label{font-size:12px}
@keyframes vsl-shake{0%,72%,100%{transform:translateX(0) rotate(0)}78%{transform:translateX(-3px) rotate(-5deg)}84%{transform:translateX(3px) rotate(5deg)}90%{transform:translateX(-2px) rotate(-3deg)}96%{transform:translateX(2px) rotate(3deg)}}
@media(max-width:600px){.vsl-button-icon{width:58px;height:58px}.vsl-button-label{font-size:14px}.vsl-toggle{gap:10px}}
@media(prefers-reduced-motion:reduce){.vsl-button-icon{animation:none}}
/* Keep the paused play prompt below the speaker's face. */
.vsl-player:not(.is-playing) .vsl-toggle{padding-top:clamp(48px,10vw,100px)}

/* Above the play overlay, always visible in both paused and playing states. */
.vsl-fullscreen{position:absolute;right:12px;top:12px;z-index:3;width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid #ffffff80;border-radius:8px;background:#080808cc;color:#fff;font:28px/1 Arial,sans-serif;cursor:pointer}
.vsl-fullscreen:hover{background:#333}.vsl-fullscreen:focus-visible{outline:3px solid #fff;outline-offset:3px}
.vsl-player:fullscreen,.vsl-player:-webkit-full-screen,.vsl-player.is-fullscreen-fallback{width:100%;height:100%;max-width:none;margin:0;border:0;border-radius:0;background:#000;aspect-ratio:auto}
.vsl-player.is-fullscreen-fallback{position:fixed;inset:0;z-index:2147483647;height:100dvh}
html.vsl-fullscreen-open{overflow:hidden}
.vsl-player:fullscreen .vsl-fullscreen,.vsl-player.is-fullscreen-fallback .vsl-fullscreen{top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right))}

/* Let Cloudflare expose quality, volume and seeking only in fullscreen. */
.vsl-player.has-fullscreen-controls iframe{pointer-events:auto}
.vsl-player.has-fullscreen-controls .vsl-toggle{display:none}