/* 升级版跑马灯样式，覆盖 site.css 的默认样式以增加动效与交互 */
.marquee{
  border-top:1px solid var(--gold);
  border-bottom:1px solid var(--gold);
  background:linear-gradient(90deg, rgba(230,57,70,0.12), rgba(245,194,59,0.06), rgba(0,104,71,0.12));
  overflow:hidden;
  padding:10px 0;
  margin-bottom:36px;
}
.marquee::before, .marquee::after{
  content:"";
  position:absolute;
  top:0; bottom:0; width:120px; z-index:2; pointer-events:none;
}
.marquee::before{ left:0; background:linear-gradient(90deg,var(--pitch-dark),transparent); }
.marquee::after{ right:0; background:linear-gradient(270deg,var(--pitch-dark),transparent); }

.marquee-track{ display:flex; gap:46px; white-space:nowrap; animation:marquee-scroll 16s linear infinite; will-change:transform; align-items:center; }
.marquee-track .item{ display:inline-flex; align-items:center; gap:12px; padding:6px 12px; border-radius:10px; background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0.03)); box-shadow:0 8px 22px rgba(0,0,0,0.28); transition:transform .22s ease; }
.marquee-track .ball{ font-size:18px; width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:linear-gradient(180deg, rgba(255,255,255,0.06), rgba(0,0,0,0.04)); box-shadow:0 8px 18px rgba(245,194,59,0.12), 0 0 12px rgba(255,122,217,0.04) inset; color:var(--gold-bright); }
.marquee-track b{ color:#0a3d2e; font-family:var(--font-num); font-weight:800; padding:4px 10px; background:var(--gold); border-radius:6px; letter-spacing:1px; box-shadow:0 2px 6px rgba(0,0,0,0.18); }

/* 悬停时暂停并强调当前项 */
.marquee:hover .marquee-track{ animation-play-state:paused; }
.marquee-track .item:hover{ transform:translateY(-6px) scale(1.03); z-index:3; }

/* 可选：在小屏幕减速并调整间距 */
@media (max-width:900px){ .marquee-track{ gap:32px; animation-duration:20s; } .marquee-track .item{ padding:6px 8px; } }

@keyframes marquee-scroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* 进阶建议：若滚动内容长度不足，可以在 HTML 中复制 .marquee-track 的子项以保证无缝循环 */