/* Homepage "Latest verified changes" ticker (tools/home/build-home.py block home:ticker, js/ticker.js).
   Without JS or with prefers-reduced-motion: a static row that scrolls sideways. With JS: a slow back-and-forth
   drift that pauses on hover, stops while anything in it has focus, and has a Pause button. */
.tkr { margin-top: var(--header-height); border-bottom: 1px solid var(--border-subtle); background: var(--bg-secondary); font-size: var(--fs-sm); }
.tkr + .home-hero { padding-top: 36px; }
.tkr-in { display: flex; align-items: center; gap: 14px; min-height: 42px; }
.tkr-lab { flex: none; display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 600; color: var(--text-primary); white-space: nowrap; }
.tkr-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--text-tertiary); flex: none; }
.tkr-dot--live { background: var(--success, #22c55e); }
.tkr-view { flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: thin; padding: 10px 0;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 16px, #000 calc(100% - 32px), transparent);
  mask-image: linear-gradient(90deg, transparent 0, #000 16px, #000 calc(100% - 32px), transparent); }
.tkr-track { display: flex; gap: 32px; list-style: none; margin: 0; padding: 0 32px 0 16px; width: max-content; }
.tkr-track li { white-space: nowrap; }
.tkr-a { color: var(--text-secondary); text-decoration: none; border-radius: 4px; }
.tkr-a:hover { color: var(--link-hover); text-decoration: underline; text-underline-offset: 3px; }
.tkr-a:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
.tkr-track time { color: var(--text-primary); font-weight: 600; margin-right: 4px; }
.tkr-k { color: var(--text-primary); }
.tkr-pause { flex: none; font: inherit; font-size: var(--fs-xs); font-weight: 600; color: var(--text-secondary); background: none;
  border: 1px solid var(--border-medium); border-radius: 999px; padding: 4px 12px; min-height: 32px; cursor: pointer; }
.tkr-pause:hover { color: var(--text-primary); border-color: var(--text-tertiary); }
.tkr-pause:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }

@media (prefers-reduced-motion: no-preference) {
  .tkr-dot--live { animation: tkr-pulse 2s ease-out infinite; }
  @keyframes tkr-pulse { 0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .55); } 70%, 100% { box-shadow: 0 0 0 8px rgba(34, 197, 94, 0); } }
  .tkr.is-anim .tkr-view { scrollbar-width: none; }
  .tkr.is-anim .tkr-view::-webkit-scrollbar { display: none; }
  .tkr.is-anim .tkr-track { animation: tkr-drift var(--tkr-t, 40s) ease-in-out infinite alternate; }
  @keyframes tkr-drift { 0%, 6% { transform: translateX(0); } 94%, 100% { transform: translateX(var(--tkr-d, 0px)); } }
  .tkr.is-anim:hover .tkr-track, .tkr.is-paused .tkr-track { animation-play-state: paused; }
  /* keyboard: no movement while focus is inside; the row returns to its start and scrolls natively to the focused link */
  .tkr.is-anim:focus-within .tkr-track { animation: none; }
  .tkr.is-anim:focus-within .tkr-view { scrollbar-width: thin; }
}

@media (max-width: 640px) {
  .tkr { font-size: var(--fs-xs); }
  .tkr-in { gap: 10px; }
  .tkr-lab-v { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
  .tkr-pause { padding: 4px 10px; }
  .tkr + .home-hero { padding-top: 28px; }
}
.tkr-lab-a { color: inherit; text-decoration: none; } .tkr-lab-a:hover { text-decoration: underline; text-underline-offset: 3px; }