a.live-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:44px;
  padding:8px 10px 8px 18px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:12px;
  color:#fff;
  background:linear-gradient(120deg,#6d28d9,#2563eb);
  box-shadow:0 6px 16px rgba(79,70,229,.24),inset 0 1px 0 rgba(255,255,255,.16);
  font-size:13px;
  font-weight:850;
  line-height:1.2;
  text-decoration:none;
  transition:transform .18s ease,box-shadow .18s ease;
}
a.live-link .live-link-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  flex-shrink:0;
  border-radius:8px;
  background:rgba(255,255,255,.16);
}
a.live-link svg{width:16px;height:16px;transition:transform .18s ease}
a.live-link:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(79,70,229,.32)}
a.live-link:hover svg{transform:translate(1px,-1px)}
a.live-link:active{transform:translateY(0)}
a.live-link:focus-visible{outline:3px solid #f59e0b;outline-offset:4px}
@media(prefers-reduced-motion:reduce){a.live-link,a.live-link svg{transition:none}a.live-link:hover,a.live-link:hover svg{transform:none}}