/* Video reel: vertical clips, horizontal strip with snap. Works on the dark homepage and the light /primerki/ page. */
.reel-strip{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 0 12px;scrollbar-width:thin}
.reel-strip-full{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));overflow:visible}
.reel-card{margin:0;flex:0 0 clamp(200px,21vw,270px);scroll-snap-align:start;min-width:0}
.reel-media{position:relative;aspect-ratio:464/848;background:#0c0e14;border:1px solid #1d2230;border-radius:2px;overflow:hidden}
.reel-media video{width:100%;height:100%;object-fit:cover;display:block}
.reel-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.reel-media:after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#07080bcc);pointer-events:none}
.reel-index{position:absolute;left:12px;top:10px;z-index:1;font:500 10.5px var(--data-font,'Manrope',sans-serif);letter-spacing:.04em;color:#7b9eff;background:#07080bb3;padding:4px 7px}
.reel-toggle{position:absolute;right:10px;bottom:10px;z-index:2;width:44px;height:44px;border-radius:2px;border:1px solid #f2f4f866;background:#07080b99;color:#f2f4f8;display:grid;place-items:center;font-size:14px;cursor:pointer}
.reel-card:not([data-reel-ready]) .reel-toggle{display:none}
.reel-toggle:hover,.reel-toggle:focus-visible{border-color:#7b9eff;color:#7b9eff;outline:none}
.reel-card.is-playing .reel-toggle span:before{content:''}
.reel-copy{padding:14px 2px 0}
.reel-copy h3{font-size:16px;margin:6px 0 6px;letter-spacing:-.02em}
.reel-copy p{font-size:12.5px;line-height:1.5;color:var(--muted,#8d95a8);margin:0}
.home-view .reel-copy h3{color:#f2f4f8}
.home-view .reel-copy p{color:#8d95a8}
@media(max-width:760px){.reel-card{flex-basis:62vw}.reel-strip-full{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Тихая полоса прокрутки ленты */
.reel-strip{scrollbar-width:thin;scrollbar-color:#ffffff26 transparent}
.reel-strip::-webkit-scrollbar{height:4px}
.reel-strip::-webkit-scrollbar-track{background:transparent}
.reel-strip::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:4px}
.reel-strip::-webkit-scrollbar-thumb:hover{background:#7b9eff80}
