/* Shared Newsticker – domain-agnostisch via CSS-Variablen
   Erwartet:
   --nt-accent    (Farbe Label + Quellen-Marker)
   --nt-accent-fg (Text-Farbe auf dem Label)
   --nt-bg        (Hintergrund der Leiste)
   --nt-fg        (Text)
   --nt-muted     (Trenner)
   --nt-border    (Rahmen)
*/
.newsticker {
  --nt-accent: #00b8d4;
  --nt-accent-fg: #051219;
  --nt-bg: rgba(0,0,0,0.45);
  --nt-fg: #f5fbff;
  --nt-muted: rgba(245,251,255,0.55);
  --nt-border: rgba(255,255,255,0.14);
  display: flex;
  align-items: stretch;
  height: 44px;
  border: 1px solid var(--nt-border);
  background: var(--nt-bg);
  border-radius: 10px;
  overflow: hidden;
  color: var(--nt-fg);
  font-family: inherit;
}
.newsticker__label {
  flex-shrink: 0;
  background: var(--nt-accent);
  color: var(--nt-accent-fg);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0 14px;
  display: flex;
  align-items: center;
}
.newsticker__track {
  position: relative;
  flex: 1;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
}
.newsticker__inner {
  position: absolute;
  top: 0;
  left: 0;
  white-space: nowrap;
  will-change: transform;
  animation: newstickerScroll 140s linear infinite;
  font-size: 14px;
  line-height: 44px;
}
.newsticker__inner .src {
  color: var(--nt-accent);
  font-weight: 700;
  margin: 0 8px 0 22px;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.newsticker__inner .sep {
  color: var(--nt-muted);
  margin: 0 14px;
}
.newsticker:hover .newsticker__inner { animation-play-state: paused; }

/* Speed-Variante für lange Listen – via data-speed */
.newsticker[data-speed="slow"] .newsticker__inner { animation-duration: 200s; }
.newsticker[data-speed="fast"] .newsticker__inner { animation-duration: 90s; }

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

@media (max-width: 640px) {
  .newsticker { height: 38px; }
  .newsticker__inner { font-size: 13px; line-height: 38px; }
  .newsticker__label { font-size: 10px; padding: 0 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .newsticker__inner { animation: none; }
}