@import url('/assets/css/main.css');

.live-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem}
.live-card{
  background:var(--bg-soft);border:1px solid var(--line-soft);border-radius:var(--radius-sm);
  padding:1.2rem 1.1rem;display:flex;flex-direction:column;gap:.35rem;align-items:flex-start;
}
.live-card.hero-card{grid-column:1/-1;align-items:center;text-align:center;background:linear-gradient(135deg,var(--primary-dim),var(--purple-dim));border-color:rgba(34,211,238,.3)}
.live-lbl{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-2)}
.live-big{font-size:clamp(2.4rem,6vw,3.6rem);font-weight:700;color:var(--primary);font-variant-numeric:tabular-nums}
.live-mid{font-size:clamp(1.4rem,3.5vw,2rem);font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
.live-small{font-size:1.02rem;font-weight:600;color:var(--text);word-break:break-all}
.live-sub{font-size:.9rem;color:var(--muted)}
.live-card .btn{align-self:flex-start;margin-top:.4rem}
.hero-card .btn{align-self:center}