.demo-film{padding-bottom:90px}.demo-film-frame{border:1px solid var(--site-line,#e3e5f0);background:#10152c;border-radius:20px;position:relative;overflow:hidden;box-shadow:0 24px 70px -30px #24234a35}.demo-film-frame video{aspect-ratio:16/9;object-fit:contain;width:100%;height:auto;display:block}.demo-film-frame video:focus-visible{outline-offset:-5px;outline:3px solid #6ee7ec}.demo-film-frame[data-started=false]:after{content:"";pointer-events:none;background:linear-gradient(#0000 45%,#10152c6b);position:absolute;inset:0}.demo-film-play{z-index:1;color:#10152c;text-align:left;background:#fbfbfe;border:1px solid #ffffff70;border-radius:100px;align-items:center;gap:16px;padding:10px 27px 10px 10px;transition:transform .2s,background .2s;display:flex;position:absolute;bottom:7%;left:5%;box-shadow:0 10px 40px #10152c30}.demo-film-play:hover{background:#eeebff;transform:translateY(-3px)}.demo-film-play-icon{background:var(--site-accent,#7057ff);color:#fff;border-radius:50%;place-items:center;width:52px;height:52px;display:grid}.demo-film-play>span:last-child{font-size:14px;font-weight:600}.demo-film-play small{color:#626b83;margin-top:3px;font-size:11px;font-weight:400;display:block}.demo-film-caption{color:#626b83;justify-content:space-between;gap:12px 24px;padding:18px 2px 26px;font-size:11px;display:flex}.demo-film-caption>span:first-child{align-items:center;gap:8px;display:flex}.demo-film-sound{color:#5b42e4;font-size:17px}.demo-film-chapters{border-top:1px solid var(--site-line,#e3e5f0);grid-template-columns:repeat(4,minmax(0,1fr));gap:0 25px;display:grid}.demo-film-chapters button{text-align:left;border-bottom:1px solid var(--site-line,#e3e5f0);color:#10152c;align-items:center;gap:10px;min-height:63px;padding:12px 3px;font-size:12px;transition:color .2s;display:flex}.demo-film-chapters button:hover{color:#5b42e4}.demo-film-chapters button>span:first-child{font:10px var(--font-mono), monospace;color:#626b83}.demo-film-chapters button>span:last-child{color:#5b42e4;margin-left:auto}.demo-film-bottom{justify-content:space-between;align-items:start;gap:40px;padding-top:26px;display:flex}.demo-film-transcript{width:min(760px,75%);font-size:12px}.demo-film-transcript summary{cursor:pointer;align-items:center;gap:28px;width:fit-content;min-height:36px;list-style:none;display:flex}.demo-film-transcript summary::-webkit-details-marker{display:none}.demo-film-transcript summary>span{color:#5b42e4;font-size:18px}.demo-film-transcript[open] summary>span{transform:rotate(45deg)}.demo-film-transcript>div{background:#f1effb;border-radius:12px;margin-top:14px;padding:22px 26px}.demo-film-transcript p{color:#48516b;margin:0 0 18px;font-size:13px;line-height:1.8}.demo-film-transcript p>span{font:10px var(--font-mono), monospace;color:#5b42e4;margin-right:12px}.demo-film-transcript .demo-film-music-note{color:#626b83;font-size:11px}.demo-film-transcript a{color:#5b42e4;align-items:center;gap:10px;display:inline-flex}.demo-film-try{white-space:nowrap;min-height:36px}.demo-film-error{color:#9c4426;margin:0 0 18px;font-size:13px}@media (max-width:900px){.demo-film-chapters{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-film-frame{border-radius:14px}}@media (max-width:600px){.demo-film{padding-bottom:56px}.demo-film-caption{flex-direction:column;gap:7px;padding-bottom:19px;font-size:10px}.demo-film-play{gap:10px;padding:7px 17px 7px 7px;bottom:7%}.demo-film-play-icon{width:34px;height:34px}.demo-film-play-icon svg{width:18px;height:18px}.demo-film-play>span:last-child{font-size:12px}.demo-film-play small{font-size:10px}.demo-film-chapters{gap:0 16px}.demo-film-chapters button{gap:8px;font-size:11px}.demo-film-bottom{flex-direction:column;gap:12px;padding-top:16px}.demo-film-transcript{width:100%}.demo-film-transcript>div{padding:18px}}@media (prefers-reduced-motion:reduce){.demo-film-play,.demo-film-chapters button{transition:none}}