.film{width:min(100%,1040px);margin-inline:auto}.film__frame{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:18px;background:#000;box-shadow:var(--shadow-phone)}.film__poster{position:absolute;inset:0;display:block;width:100%;padding:0;border:0;border-radius:inherit;background:#04274B;color:#fff;text-align:left}.film__poster img{width:100%;height:100%;object-fit:cover}.film__poster::after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgb(4 22 46/.82))}.film__play{position:absolute;top:50%;left:50%;z-index:1;display:grid;place-items:center;width:clamp(64px,9vw,96px);aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:rgb(4 39 75/.45);color:#fff;box-shadow:0 0 0 1px rgb(255 255 255/.2),var(--shadow-glow);transition:scale var(--t-ui) var(--ease-out)}.film__play .icon{width:100%;height:100%}.film__poster:hover .film__play,.film__poster:focus-visible .film__play{scale:1.06}.film__frame:has(:focus-visible){outline:3px solid var(--focus);outline-offset:2px}@supports not selector(:has(*)){.film__poster:focus-visible{outline-offset:-5px}}.film__meta{position:absolute;inset:auto 16px 14px;z-index:1;display:flex;align-items:flex-end;justify-content:space-between;gap:12px}.film__title{font:700 clamp(15px,1.4vw,19px)/1.3 var(--font-ui);text-shadow:0 1px 2px rgb(0 0 0/.4)}.film__duration{flex:none;padding:4px 10px;border-radius:var(--r-pill);background:rgb(4 39 75/.8);font:700 13px/1.3 var(--font-ui);font-variant-numeric:tabular-nums}.film__frame video,.film__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}.film__transcript{margin-top:16px}.film__transcript summary{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--link);font-weight:700;cursor:pointer}.film__transcript ol{margin:8px 0 0;padding-left:1.4em;color:var(--ink-2)}.film__transcript li + li{margin-top:4px}.film__credit{margin-top:4px;color:var(--ink-2);font-size:var(--fs-cap)}.film__credit a{color:inherit;text-decoration:underline;text-underline-offset:2px}@media (max-width:599px){.film__poster::after{inset:50% 0 0;background:linear-gradient(transparent,rgb(4 22 46/.92) 40%)}}.film--portrait{width:auto}.film--portrait .film__frame{aspect-ratio:auto;overflow:visible;border-radius:calc(var(--phone-w) * .13);background:var(--bezel)}.film--portrait .phone__screen{--screen-ratio:1.7778}