/* ===== Theming ===== */
  .news-ticker {
    --ticker-height: 44px;
    --ticker-speed: 35s;          /* overall scroll duration for one loop */
    --ticker-gap: 32px;           /* spacing between items */
    --bg-start: #0f172a;          /* slate-900 */
    --bg-end: #020617;            /* slate-950 */
    --accent: #38bdf8;            /* sky-400 */
    --accent-2: #22d3ee;          /* cyan-400 */
    --text: #e2e8f0;              /* slate-200 */
    --text-dim: #94a3b8;          /* slate-400 */
    --badge-bg: #0ea5e9;          /* sky-500 */
    --badge-text: #001018;
  }

  /* ===== Layout ===== */
  .news-ticker {
    position: relative;
    width: 100%;
    overflow: hidden;
    color: var(--text);
    background: linear-gradient(90deg, var(--bg-start), var(--bg-end));
    border-top: 1px solid #0b1020;
    border-bottom: 1px solid #0b1020;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
    font: 500 14px/1.2 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  }

  .ticker-header {
    height: var(--ticker-height);
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
    background: linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0));
    border-bottom: 1px solid rgba(255,255,255,0.06);
  }

  .ticker-logo { font-size: 18px; opacity: .9; }
  .ticker-title { letter-spacing: .12em; font-size: 12px; color: var(--text-dim); }

  .ticker-controls { display: flex; align-items: center; gap: 6px; }
  .tk-btn {
    all: unset; cursor: pointer; user-select: none;
    padding: 4px 6px; border-radius: 8px; line-height: 1;
    background: rgba(255,255,255,0.06);
    transition: transform .12s ease, background .2s ease;
  }
  .tk-btn:hover { transform: translateY(-1px); background: rgba(255,255,255,0.12); }
  .tk-btn:active { transform: translateY(0); }

  .ticker-viewport {
    position: relative; height: var(--ticker-height); overflow: hidden;
    mask-image: linear-gradient(90deg, transparent 0, black 40px, black calc(100% - 40px), transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0, black 40px, black calc(100% - 40px), transparent 100%);
  }

  .ticker-track {
    position: absolute; top: 50%; transform: translateY(-50%);
    display: flex; align-items: center; gap: var(--ticker-gap);
    white-space: nowrap; will-change: transform;
    animation: ticker-scroll var(--ticker-speed) linear infinite;
  }

  /* Duplicate track for seamless looping */
  .ticker-track.clone { left: 100%; }

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

  /* Items */
  .ticker-item { display: inline-flex; align-items: center; gap: 10px; }
  .ticker-item a { color: var(--text); text-decoration: none; }
  .ticker-item a:hover { text-decoration: underline; }

  .ticker-badge {
    padding: 3px 8px; border-radius: 999px; font-size: 11px; font-weight: 700;
    background: linear-gradient(90deg, var(--badge-bg), var(--accent-2));
    color: var(--badge-text);
    text-transform: uppercase; letter-spacing: .08em;
  }

  .ticker-sep { color: var(--text-dim); opacity: .7; }

  /* Pause on hover */
  .news-ticker:hover .ticker-track { animation-play-state: paused; }

  /* Reduced motion accessibility */
  @media (prefers-reduced-motion: reduce) {
    .ticker-track { animation: none; position: relative; left: 0; }
  }

  /* Mobile tweaks */
  @media (max-width: 600px) {
    .news-ticker { --ticker-height: 40px; --ticker-gap: 20px; }
    .ticker-title { display: none; }
    .ticker-controls { gap: 4px; }
  }