.film-frame{position:relative;aspect-ratio:16 / 9;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.1);background:#0a0a0a;box-shadow:0 30px 80px #0000008c,0 0 0 1px #7fdbf60f}.film-frame__video{display:block;width:100%;height:100%;object-fit:cover}.film-frame__play{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:0;border:0;background:linear-gradient(180deg,#1212120d,#12121259);color:#fff;cursor:pointer;font-family:inherit;transition:opacity .3s ease}.film-frame.is-playing .film-frame__play{opacity:0;pointer-events:none}.film-frame__play-ring{display:inline-flex;align-items:center;justify-content:center;width:76px;height:76px;border-radius:50%;background:var(--color-accent);color:#121212;box-shadow:0 0 0 10px #7fdbf62e,0 18px 40px #0006;transition:transform .2s ease,box-shadow .2s ease}.film-frame__play:hover .film-frame__play-ring,.film-frame__play:focus-visible .film-frame__play-ring{transform:scale(1.06);box-shadow:0 0 0 14px #7fdbf638,0 18px 40px #0006}.film-frame__play:focus-visible{outline:2px solid var(--color-accent);outline-offset:-4px}.film-frame__play-label{font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#ffffffd9;text-shadow:0 1px 8px rgba(0,0,0,.6)}.film-frame--light{border-color:#faf7f229;background:#faf7f2;box-shadow:0 30px 80px #00000080,0 0 0 1px #faf7f20f,0 0 90px #faf7f20d}.film-frame--light .film-frame__play{background:linear-gradient(180deg,#faf7f21a,#18161438)}.film-frame--light .film-frame__play-label{color:#1b1a18;text-shadow:0 1px 10px rgba(250,247,242,.9)}.film-frame--light .film-frame__play-ring{box-shadow:0 0 0 10px #7fdbf63d,0 18px 40px #18161440}.film-frame--light .film-frame__play:hover .film-frame__play-ring,.film-frame--light .film-frame__play:focus-visible .film-frame__play-ring{box-shadow:0 0 0 14px #7fdbf64d,0 18px 40px #18161440}.film-caption{display:flex;align-items:center;gap:.75rem;margin:1rem 0 0;font-size:.85rem;color:var(--color-text-muted)}.film-caption__dot{flex:0 0 6px;width:6px;height:6px;border-radius:50%;background:var(--color-accent);box-shadow:0 0 0 4px #7fdbf60f}@media (max-width: 900px){.film-frame{border-radius:10px}.film-frame__play-ring{width:60px;height:60px}}@media (max-width: 700px){.film-frame__play-ring{width:54px;height:54px}.film-frame__play-label{display:none}}@media (prefers-reduced-motion: reduce){.film-frame__play,.film-frame__play-ring{transition:none}}
