/* tribeTicker fragment CSS — SPEC-tribeshell-v1 §3.2: every selector is
   scoped under .ttk-root, so this is safe to load on any page regardless
   of what else is on it. Shared by the standalone renderer
   (tribeticker-news.html) and any host page that mounts the fragment
   directly (deploy/tribecast-com/index.html's pagebar). */
.ttk-root{display:flex;align-items:center;gap:10px;height:40px;padding:0 16px;background:#000;overflow:hidden;font-family:'Geist','Inter',system-ui,sans-serif;border-bottom:1px solid rgba(255,255,255,.05)}
.ttk-icon{flex:0 0 auto;width:20px;height:20px;display:flex}
.ttk-icon img{width:20px;height:20px;object-fit:contain;filter:hue-rotate(-10deg) saturate(1.2)}
.ttk-label{flex:0 0 auto;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#FF7A29}
.ttk-track{flex:1 1 auto;overflow:hidden;white-space:nowrap;mask-image:linear-gradient(to right,transparent,#000 40px,#000 calc(100% - 40px),transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 40px,#000 calc(100% - 40px),transparent)}
.ttk-rail{display:inline-flex;gap:24px;animation:ttk-scroll 60s linear infinite;padding-left:100%}
.ttk-root:hover .ttk-rail{animation-play-state:paused}
@keyframes ttk-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ttk-item{display:inline-flex;align-items:center;gap:8px;padding:4px 12px;cursor:pointer;border-radius:4px;transition:background .2s ease;font-size:13px}
.ttk-item:hover{background:rgba(255,255,255,.08)}
.ttk-source{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;opacity:.5;color:#fff}
.ttk-headline{color:rgba(255,255,255,.85);font-weight:500}
.ttk-time{font-size:10px;color:rgba(255,255,255,.3)}
.ttk-sep{color:rgba(255,255,255,.1);margin:0 4px}
@media (prefers-reduced-motion: reduce){.ttk-rail{animation:none}}