.vf{--vf-radius:calc(var(--radius-md)*2);--vf-play-bg:var(--color-accent);--vf-play-ink:var(--btn-on-dark-primary-color);--vf-play-size:calc(var(--btn-height-md)*2)}.vf--split{align-items:center;display:grid;gap:var(--space-5xl);grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.vf--split .tm-head{margin-bottom:0}.vf-figure{margin:0}.vf-player{aspect-ratio:16/9;background:var(--color-media-bg);border-radius:var(--vf-radius);isolation:isolate;overflow:hidden;position:relative}.vf-player--cinema{aspect-ratio:21/9}.vf-player--classic{aspect-ratio:4/3}.vf-poster{height:100%;inset:0;object-fit:cover;position:absolute;transition:scale var(--transition-slow);width:100%}.vf-player[data-vf]{cursor:pointer}.vf-player[data-vf]:hover .vf-poster{scale:102%}.vf-media{background:var(--color-media-bg);border:0;height:100%;inset:0;position:absolute;width:100%;z-index:3}.vf-player.is-playing .vf-play{display:none}.vf-play{background:var(--vf-play-bg);border:0;border-radius:var(--radius-full);box-shadow:var(--shadow-xl);color:var(--vf-play-ink);cursor:pointer;display:grid;height:var(--vf-play-size);left:50%;padding:0;place-items:center;position:absolute;top:50%;transition:background-color var(--transition-fast),scale var(--transition-fast);translate:-50% -50%;width:var(--vf-play-size);z-index:2}.vf-play:hover{scale:106%}.vf-play:focus-visible{outline:var(--focus-ring);outline-offset:var(--space-xs)}.vf-play--md{--vf-play-size:calc(var(--btn-height-md)*1.5)}.vf-play--xl{--vf-play-size:calc(var(--btn-height-md)*2.5)}.vf-play--accent:hover{--vf-play-bg:var(--color-accent-hover)}.vf-play--primary{--vf-play-bg:var(--color-primary);--vf-play-ink:var(--btn-primary-color)}.vf-play--white{--vf-play-bg:var(--color-background);--vf-play-ink:var(--color-primary)}.vf-play-icon{height:36%;margin-left:6%;position:relative;width:36%;z-index:1}.vf-play--ring:before{background:var(--vf-play-bg);border-radius:inherit;content:"";inset:0;opacity:45%;position:absolute;z-index:0}@media (prefers-reduced-motion:no-preference){.vf-play--ring:before{animation:vf-pulse calc(var(--duration-slow)*7) var(--ease) infinite}}@keyframes vf-pulse{0%{opacity:45%;scale:100%}70%,to{opacity:0;scale:150%}}.vf-caption{align-items:center;display:flex;flex-wrap:wrap;gap:var(--space-lg) var(--space-xl);justify-content:space-between;margin-top:var(--space-xl)}.vf-title{color:var(--color-heading);font-family:var(--font-family-heading);font-size:var(--font-size-lg);line-height:var(--line-height-snug)}.vf-duration,.vf-title{font-weight:var(--font-weight-bold)}.vf-duration{align-items:center;background:var(--color-manila);border-radius:var(--radius-full);color:var(--color-primary);display:inline-flex;font-size:var(--font-size-xs);font-variant-numeric:tabular-nums;gap:var(--space-sm);min-height:var(--chip-height);padding:0 var(--space-lg)}.vf-duration svg{height:var(--icon-size-tick);width:var(--icon-size-tick)}.bg-dark .vf .tm-head p{color:var(--color-muted-on-dark)}.bg-dark .vf .vf-title{color:var(--color-background)}.bg-dark .vf .vf-duration{background:var(--color-surface-on-dark);color:var(--color-accent)}.vf-dialog{background:transparent;border:0;margin:auto;max-height:none;max-width:var(--container-max-width);overflow:visible;padding:var(--container-padding);width:100%}.vf-dialog::backdrop{background:var(--color-overlay)}.vf-dialog-frame,.vf-dialog-inner{position:relative}.vf-dialog-frame{aspect-ratio:16/9;background:var(--color-media-bg);border-radius:var(--vf-radius);overflow:hidden}.vf-dialog-frame.vf-player--cinema{aspect-ratio:21/9}.vf-dialog-frame.vf-player--classic{aspect-ratio:4/3}.vf-close{background:var(--color-accent);border:0;border-radius:var(--radius-full);bottom:100%;color:var(--btn-on-dark-primary-color);cursor:pointer;display:grid;height:var(--btn-height-sm);margin-bottom:var(--space-lg);padding:0;place-items:center;position:absolute;right:0;width:var(--btn-height-sm)}.vf-close:hover{background:var(--color-accent-hover)}.vf-close:focus-visible{outline:var(--focus-ring);outline-offset:var(--space-xs)}.vf-close svg{height:50%;width:50%}@media (max-width:1100px){.vf--split{gap:var(--stack-content);grid-template-columns:minmax(0,1fr)}}@media (max-width:767px){.vf{--vf-radius:var(--card-border-radius)}.vf-play--lg,.vf-play--xl{--vf-play-size:calc(var(--btn-height-md)*1.5)}.vf-player--cinema,.vf-player--wide{aspect-ratio:16/9}.vf-title{font-size:var(--font-size-body)}}