/* tribeTicker v2 (brand-video edition) — extends the shared .ttk-root rules
   in tribeticker-news.css (same base layout/scroll mechanics) with the
   play-icon treatment for video items. Load alongside tribeticker-news.css,
   not instead of it — .ttk-root itself is unchanged. */
.ttk-play{flex:0 0 auto;font-size:9px;color:#FF7A29;opacity:.85}
.ttk-item--video:hover .ttk-play{opacity:1}

/* NAV-010 polish — scoped to .ttk-root--video only, tribeticker-news.css
   (the base file, shared with the house news fallback) stays untouched. */

/* Taste-tuning knobs — override --ttk-speed/--ttk-gap on .ttk-root (or an
   ancestor) in one line, no need to touch the animation/layout rules
   themselves. Defaults match the base file's own prior hardcoded values. */
.ttk-root--video .ttk-rail{gap:var(--ttk-gap, 24px);animation-duration:var(--ttk-speed, 60s)}

/* Pause on keyboard focus too, not just mouse hover — the base file only
   has :hover, and items weren't focusable at all before NAV-010 gave them
   tabindex. Equal-specificity :hover half is redundant with the base rule
   but harmless; source order (this file loads after tribeticker-news.css)
   makes it the winning declaration either way. */
.ttk-root--video:hover .ttk-rail,
.ttk-root--video:focus-within .ttk-rail{animation-play-state:paused}

/* Visible focus state for keyboard users (Tab + Enter/Space triggers
   onSelect, see tribeticker-videos.js). outline-offset is negative so the
   ring stays inside .ttk-track's overflow:hidden clip. */
.ttk-item--video:focus-visible{outline:2px solid #FF7A29;outline-offset:-2px;background:rgba(255,122,41,.12);border-radius:4px}

/* prefers-reduced-motion: the base file already sets .ttk-rail{animation:
   none} — tribeticker-videos.js pairs that by NOT doubling the item list
   in this mode (nothing to seamlessly loop, so no reason to duplicate),
   which leaves more items than fit in 100% width. overflow-x:auto instead
   of the base's overflow:hidden lets a reduced-motion visitor reach them
   via native (non-animated) scroll instead of a cut-off static row. */
@media (prefers-reduced-motion: reduce){
  .ttk-root--video .ttk-track{overflow-x:auto;-webkit-overflow-scrolling:touch}
}
