/* «Аметист» «Ваше видео» (partials/video.html): loaded only on a site with an effect made from the visitor's own clip
   («Замена персонажа в видео»). The same quiet pieces as the photo — the dashed flame drop, the picked one ringed — the
   clip standing upright in its thumb, muted and looping; what makes a good clip as the amber tag beside its name; a thin
   flame bar while it goes up. Phone first: the tag drops under the name when there is no room. */
.src-video { display: grid; margin-top: 4px; }
.src-head { flex-wrap: wrap; row-gap: 4px; }
/* The hint wears the «по желанию» tag's look, but is always there (style.css hides a tag outside an optional slot). */
.src-video > .slot-head.src-head .src-hint { display: inline-block; white-space: normal; }
.src-body { display: grid; }
.picked-video .picked-thumb { width: 46px; height: 62px; border-radius: 12px; }
.picked-video .picked-thumb video { width: 100%; height: 100%; object-fit: cover; }
.src-progress { display: flex; align-items: center; gap: 10px; margin: 8px 2px 0; color: var(--ash); font-size: 13px; font-variant-numeric: tabular-nums; }
.src-progress progress { flex: 1 1 auto; height: 4px; border: 0; border-radius: 999px; overflow: hidden; -webkit-appearance: none; appearance: none; background: var(--line); }
.src-progress progress::-webkit-progress-bar { background: var(--line); }
.src-progress progress::-webkit-progress-value { background: linear-gradient(90deg, var(--flame), var(--amber)); }
.src-progress progress::-moz-progress-bar { background: linear-gradient(90deg, var(--flame), var(--amber)); }