@layer components{.film{margin:0;position:relative}.film__frame{aspect-ratio:var(--film-ar);border-radius:var(--r-xl);background:var(--canvas);box-shadow:var(--sh-3);position:relative;overflow:hidden}.film__poster img,.film video{-o-object-fit:cover;object-fit:cover;block-size:100%;inline-size:100%;display:block;position:absolute;inset:0}.film video{opacity:0;transition:opacity var(--dur-exit) ease}.film[data-shown] video{opacity:1}.film__toggle{cursor:pointer;block-size:44px;inline-size:44px;color:var(--violet-800);box-shadow:var(--sh-1);transition:background-color var(--dur-micro) ease, transform var(--dur-press) var(--ease-out);background:#fffffff0;border:0;border-radius:50%;place-items:center;display:grid;position:absolute;inset-block-end:12px;inset-inline-end:12px}@media (hover:hover) and (pointer:fine){.film__toggle:hover{background:var(--chip-thinking)}}.film__toggle:focus-visible{background:var(--chip-thinking)}.film__toggle:active{transform:scale(.97)}.film__toggle[hidden],.film__i-pause,.film[data-playing] .film__i-play{display:none}.film[data-playing] .film__i-pause{display:inline}.film__lines{gap:var(--s-1);color:var(--ink-3);margin-block-start:var(--s-3);font-size:15px;line-height:1.6;display:grid}.film__line{transition:color var(--dur-exit) ease;display:block}.film__line[data-current]{color:var(--ink)}.film-still{gap:var(--s-2);margin:0;display:grid}.film-still img{border-radius:var(--r-xl);block-size:auto;inline-size:100%;box-shadow:var(--sh-3);background:var(--canvas)}@media (max-width:767px){.film--tall .film__frame{aspect-ratio:var(--film-ar-tall,var(--film-ar))}}}@layer motion{@media (prefers-reduced-motion:no-preference){:root:not([data-a11y-stopmotion]) .film video{transition-duration:var(--dur-panel)}}}
