/* R55: persistent posters, quiet buffering, readable captions and creator framing. */
#view-clips .vd-clip-card__media :is(video,img) { position:absolute; inset:0; }
#view-clips .vd-clip-card__media video { opacity:0; }
#view-clips .vd-clip-card.is-previewing .vd-clip-card__media video { opacity:1; }
#view-clips .vd-clip-card__poster[hidden] { display:none; }
#view-clips .vd-clip-card__cap:empty { display:none; }
#view-clips .vd-clip-card__views { margin-left:4px; }
#view-clips .clip-slide__buffer { flex-direction:column; gap:12px; color:#fff; font:500 13px/1.4 system-ui,sans-serif; text-shadow:0 1px 5px #000; }
#view-clips .clip-slide__buffer > span:last-child { padding:6px 10px; border-radius:10px; background:rgb(7 11 18 / .82); }
#app #view-clips .clip-slide.is-reading-caption .clip-caption { padding:10px 12px 0; margin:4px -2px 0; border:1px solid rgb(255 255 255 / .18); border-radius:14px; background:rgb(7 11 18 / .96); }
#app #view-clips .clip-slide.is-reading-caption .clip-caption p { overscroll-behavior:contain; touch-action:pan-y; }
#app #view-clips .clip-slide.is-reading-caption .clip-slide__playpause { opacity:1; }
.vy-video-drafts__item { display:grid; grid-template-columns:60px minmax(0,1fr); grid-template-rows:auto auto auto; gap:4px 12px; min-height:108px; align-items:center; }
.vy-video-drafts__thumb { position:relative; grid-row:1 / 4; width:60px; height:100px; border-radius:10px; overflow:hidden; background:var(--surface-2,#182333); color:var(--text-muted,#aab6c8); display:grid; place-items:center; font-size:10px; text-align:center; }
.vy-video-drafts__thumb img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.vy-video-drafts__thumb [hidden] { display:none; }
.vy-video-drafts__duration { position:absolute; bottom:4px; right:4px; z-index:1; padding:2px 4px; border-radius:4px; background:#070b12dc; color:#fff; font:600 10px/1.3 system-ui,sans-serif; }
.vy-video-drafts__item > strong { overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow-wrap:anywhere; }
.vy-video-drafts__item > span:not(.vy-video-drafts__thumb) { font-size:12px; color:var(--text-muted); }
.vy-video-drafts__actions { grid-column:2; display:flex; flex-wrap:wrap; gap:8px; }
.vy-video-drafts__actions button { min-height:44px; }
.vy-shorts-framing { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 12px; font-size:13px; }
.vy-shorts-framing label { display:flex; align-items:center; min-height:44px; gap:8px; }
.vy-shorts-framing label[hidden] { display:none; }
.vy-shorts-framing input { width:20px; height:20px; accent-color:var(--accent); }
.vy-shorts-framing select { min-height:44px; max-width:180px; border:1px solid var(--border); border-radius:10px; background:var(--surface-2); color:var(--text); font:inherit; padding:6px; }
.vy-shorts-frame { position:relative; min-width:0; width:100%; }
.vy-shorts-frame__layers[hidden] { display:none; }
.vy-shorts-frame[data-frame="off"] .vy-shorts-frame__stage { width:100%; }
.vy-shorts-frame:not([data-frame="off"]) { height:var(--frame-render-height); }
.vy-shorts-frame:not([data-frame="off"]) .vy-shorts-frame__stage { position:absolute; left:50%; margin-left:calc(var(--frame-width) / -2); width:var(--frame-width); height:var(--frame-height); transform:scale(var(--frame-scale)); transform-origin:top center; overflow:hidden; border-radius:14px; background:#070b12; color:#fff; }
.vy-shorts-frame:not([data-frame="off"]) video { position:absolute; inset:0; width:100%; height:100%; max-height:none; aspect-ratio:auto; object-fit:contain; border-radius:0; }
.vy-shorts-frame__layers { position:absolute; inset:0; pointer-events:none; font:400 13px/1.35 system-ui,sans-serif; }
.vy-shorts-frame__layers button { pointer-events:auto; }
.vy-shorts-frame__top { position:absolute; top:0; left:0; right:0; display:flex; justify-content:space-between; padding:8px 10px 30px; min-height:60px; box-sizing:border-box; background:linear-gradient(#070b12cc,transparent); }
.vy-shorts-frame__top span { padding:10px 12px; height:44px; box-sizing:border-box; border-radius:14px; background:#0a111da8; font-size:14px; }
.vy-shorts-frame__bottom { position:absolute; bottom:70px; left:0; right:0; display:flex; align-items:flex-end; justify-content:space-between; gap:12px; padding:64px 10px 8px; background:linear-gradient(to top,#070b12dc,#070b1247 45%,transparent 94%); }
.vy-shorts-frame__meta { min-width:0; flex:1; padding:8px; }
.vy-shorts-frame__meta strong { display:block; min-height:44px; line-height:44px; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.vy-shorts-frame .clip-caption p { margin:0; max-height:2.7em; line-height:1.35; overflow:hidden; overflow-wrap:anywhere; white-space:pre-wrap; }
.vy-shorts-frame .clip-caption__toggle { min-height:44px; min-width:44px; margin:0; padding:4px 0; border:0; background:transparent; color:#d9e8ff; font:600 13px/1.3 system-ui,sans-serif; }
.vy-shorts-frame .clip-caption__toggle[hidden] { display:none; }
.vy-shorts-frame .clip-caption.is-expanded { background:#070b12f5; padding:10px; border-radius:12px; }
.vy-shorts-frame .clip-caption.is-expanded p { max-height:220px; overflow:auto; overscroll-behavior:contain; pointer-events:auto; }
.vy-shorts-frame__rail { display:flex; flex-direction:column; gap:8px; }
.vy-shorts-frame__rail span { width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:#0a111da8; }
.vy-shorts-frame__playback { position:absolute; bottom:10px; left:10px; right:10px; height:52px; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:3px 10px; box-sizing:border-box; background:#080e189e; border-radius:16px; }
.vy-shorts-frame__playback button { min-height:44px; min-width:44px; background:transparent; color:#fff; border:0; font:500 13px/1.3 system-ui,sans-serif; }
.vy-shorts-frame__layers :focus-visible { outline:3px solid #a8c8ff; outline-offset:-2px; }
.vy-shorts-frame[data-frame="wide"] .vy-shorts-frame__stage { padding:0 10px; box-sizing:border-box; }
.vy-shorts-frame[data-frame="wide"] .vy-shorts-frame__rail { flex-direction:row; gap:2px; }
.vy-shorts-frame[data-frame="wide"] .vy-shorts-frame__bottom { padding:12px 10px 4px; }
.vy-shorts-frame[data-frame="wide"] .clip-caption:not(.is-expanded) p { max-height:1.35em; }
.vy-shorts-frame[data-frame="wide"] .clip-caption.is-expanded p { max-height:91px; }
@media (prefers-reduced-motion:reduce) { #view-clips .clip-slide__buffer-spin { animation:none !important; } #view-clips .vd-clip-card:hover { transform:none; } }
html[data-vy-motion="off"] #view-clips .clip-slide__buffer-spin { animation:none !important; }
html[data-vy-motion="off"] #view-clips .vd-clip-card:hover { transform:none; }
