.league-hero {
  position: relative;
  overflow: hidden;
  min-height: 330px;
  padding: 40px 46px;
  text-align: left;
  display: flex;
  align-items: center;
  background-position: right center;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #071827;
  backdrop-filter: none;
  border: 1px solid rgba(255, 255, 255, .34);
  border-bottom: 4px solid var(--crimson);
}

.league-hero-season1 {
  background-image:
    linear-gradient(90deg, rgba(3, 14, 24, .18), rgba(3, 14, 24, .02) 54%, rgba(3, 14, 24, .12) 100%),
    url('/sq/season1/banner.webp?v=20260728');
}

.league-hero-season2 {
  background-image:
    linear-gradient(90deg, rgba(3, 14, 24, .18), rgba(3, 14, 24, .02) 54%, rgba(3, 14, 24, .12) 100%),
    url('/sq/season2/banner.webp?v=20260728');
}

.league-hero-panel {
  position: relative;
  z-index: 1;
  max-width: 760px;
  padding: 24px 28px;
  border-radius: 18px;
  background: rgba(255, 255, 255, .88);
  border: 1px solid rgba(255, 255, 255, .64);
  box-shadow: 0 18px 36px rgba(3, 14, 24, .22);
  backdrop-filter: blur(6px);
}

.league-back-link { align-self: flex-start; margin-bottom: 14px; }
.league-eyebrow { color: var(--crimson-dark); }
.league-title { max-width: 620px; text-align: left; color: var(--text-primary); text-shadow: none; }
.league-lead { max-width: 650px; margin: 16px 0 0; text-align: left; color: #43515e; }
.league-cache-note { max-width: 680px; margin: 14px 0 0; text-align: left; color: #687482; }

.league-rule-actions {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  flex-wrap: wrap;
  margin: 0 0 18px;
}

.league-rule-actions h3 { margin: 0; }

.league-rule-button {
  margin: 0;
  min-height: 38px;
  padding: 0 16px;
  font-size: 13px;
  white-space: nowrap;
}

.league-rule-button-x {
  background: #111827;
  border-color: #111827;
  color: #fff;
}