/* Existing workflow recordings, using the shared site type and color tokens. */
.videoWatch{width:100%;margin:28px 0 56px}
.videoWatch h1{max-width:30ch;margin:16px 0 24px}
.videoWatchPlayer{margin:0 0 20px}
.videoWatchPlayer video{display:block;width:100%;height:auto;aspect-ratio:1100/652;background:var(--pt-canvas)}
.videoWatchPlayer figcaption{padding-top:8px;color:var(--pt-muted);font-size:14px}
.videoWatchActions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin:24px 0}
.videoWatchSteps{max-width:760px}
.videoWatchSteps li{padding:0 0 12px 6px}
.videoWatchMore{border-top:1px solid var(--pt-border);margin-top:36px}
.videoWatchMore a{display:block;width:fit-content;padding:6px 0}
.videoIndex{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}
.videoIndex article{border-bottom:1px solid var(--pt-border);padding-bottom:24px}
.videoIndex img{display:block;width:100%;height:auto;aspect-ratio:1100/652}
.videoIndex h2{margin:16px 0 10px}
.videoIndex article>a{text-decoration:none}
.videoIndex article>a:hover h2{text-decoration:underline}
.videoIndex span{color:var(--pt-muted);font-variant-numeric:tabular-nums}
@media(max-width:640px){.videoWatch{margin-top:16px}.videoIndex{grid-template-columns:1fr;gap:24px}.videoWatchActions{gap:12px 18px}}
