/* Player mechanics shared by the three mock-ups; each page skins it. */
.vsl{position:relative;overflow:hidden;isolation:isolate}
.vsl-media{position:absolute;inset:0}
.vsl-media img,.vsl-media video{width:100%;height:100%;object-fit:cover;display:block}
.vsl-media video{position:absolute;inset:0}
.vsl-loop{opacity:0;transition:opacity .8s}
.vsl-loop.on{opacity:1}
.vsl-play{position:absolute;inset:0;z-index:2;display:grid;place-items:center;background:none;border:0;cursor:pointer;color:inherit;font:inherit}
.vsl-play .disc{display:grid;place-items:center;transition:transform .35s cubic-bezier(.2,.8,.2,1),background-color .25s}
.vsl-play:hover .disc{transform:scale(1.06)}
.vsl-play:active .disc{transform:scale(.97)}
.vsl-play:focus-visible .disc{outline:3px solid currentColor;outline-offset:6px}
.vsl-sound,.vsl-pause{display:none}
.vsl[data-state="muted"] .vsl-sound{display:flex}
.vsl[data-state="playing"] .vsl-start-icon{display:none}
.vsl[data-state="playing"] .vsl-play .disc{opacity:0;transform:scale(.8)}
.vsl[data-state="playing"] .vsl-play:hover .disc{opacity:1;transform:none}
.vsl[data-state="playing"] .vsl-pause{display:block}
.vsl-bar{position:absolute;left:0;right:0;bottom:0;height:4px;z-index:3;pointer-events:none}
.vsl-bar i{display:block;height:100%;transform:scaleX(0);transform-origin:left;transition:transform .25s linear}
.vsl-note{position:absolute;z-index:4;inset:auto 16px 16px 16px}
.vsl-note[hidden]{display:none}
.vsl[data-state="soon"] .vsl-play{display:none}
[data-sticky]{position:fixed;z-index:50;left:12px;right:12px;bottom:12px;translate:0 140%;transition:translate .4s cubic-bezier(.2,.8,.2,1)}
[data-sticky][data-on]{translate:0 0}
@media (min-width:901px){[data-sticky]{left:auto;width:auto}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important}}
/* tag on generated stand-in photos */
.gen-tag{position:absolute;z-index:2;top:12px;left:12px;padding:4px 8px;border-radius:4px;background:rgba(10,14,22,.62);color:#fff;font:500 11px/1.2 ui-monospace,monospace;letter-spacing:.03em;pointer-events:none}
.vsl[data-state="muted"] .gen-tag,.vsl[data-state="playing"] .gen-tag,.vsl[data-state="paused"] .gen-tag{display:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
