/* ===================================
   TIK.R — Ticker Bar
   Uses purple gradient + gold stars
   =================================== */

.ticker-bar {
	width: 100%;
	height: var(--ticker-height);
	background: linear-gradient(
		90deg,
		var(--purple) 0%,
		var(--pink) 50%,
		var(--purple) 100%
	);
	overflow: hidden;
	padding: 13px 0;
	position: relative;
	z-index: 10;
}

.ticker-track {
	display: flex;
	align-items: center;
	white-space: nowrap;
	animation: ticker-scroll 28s linear infinite;
}

.ticker-item {
	font-family: var(--font-display);
	font-size: 4rem;
	letter-spacing: 0.18em;
	color: #fff;
	padding: 0 28px;
}

.ticker-star {
	color: var(--gold);
	font-size: 0.85rem;
	padding: 0 4px;
}

@keyframes ticker-scroll {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-50%);
	}
}

@media (max-width: 580px) {
	.ticker-bar {
		height: var(--ticker-height-sm);
	}

	.ticker-item {
		font-size: 2rem;
	}
}