/* Results ticker: the last thing on the page, styled like an LED display.
   #F2B04B (amber) is the figures' color; everything else is theme tokens. */
.ticker {
  position: relative; overflow: hidden; padding: 10px 0;
  background: #0a0f1a; color: var(--on-dark-muted);
  border-top: 1px solid color-mix(in srgb, var(--on-dark) 14%, transparent);
  font-family: var(--mono); font-size: clamp(12px, 1.5vw, 15px); letter-spacing: 0.1em; text-transform: uppercase;
}
.tk-row { display: flex; width: max-content; padding: 8px 0; will-change: transform; }
.tk-track { display: flex; flex: 0 0 auto; margin: 0; padding: 0; list-style: none; }
.tk-track li { display: inline-flex; align-items: baseline; gap: 0.6em; padding: 0 clamp(18px, 3vw, 40px); white-space: nowrap; border-right: 1px solid color-mix(in srgb, var(--on-dark) 14%, transparent); }
.tk-track b { color: #f2b04b; font-weight: 500; text-shadow: 0 0 6px rgba(242, 176, 75, 0.75), 0 0 16px rgba(242, 176, 75, 0.35); }
.tk-row[data-dir="right"] .tk-track li { color: var(--on-dark-soft); }

.tk-pause {
  position: absolute; right: 12px; top: 50%; z-index: 2; transform: translateY(-50%);
  min-width: 64px; min-height: 44px; padding: 0 14px; border: 1px solid color-mix(in srgb, var(--on-dark) 36%, transparent); border-radius: 999px;
  background: #0a0f1a; color: var(--on-dark-soft); font: 500 12px var(--mono); letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer;
  box-shadow: 0 0 14px 10px #0a0f1a;
}
.tk-pause:hover { color: var(--on-dark); border-color: var(--on-dark); }
.tk-pause:focus-visible { outline: 2px solid #f2b04b; outline-offset: 2px; }

/* No motion: a static, readable block (one copy, wrapping). */
.ticker.is-static .tk-row { width: auto; flex-wrap: wrap; justify-content: center; padding: 6px 12px; }
.ticker.is-static .tk-track { flex-wrap: wrap; justify-content: center; }
.ticker.is-static .tk-track[aria-hidden="true"], .ticker.is-static .tk-pause { display: none; }
.ticker.is-static .tk-track li { border-right: 0; padding: 4px 14px; }
