/* v5.5.46 · 285px equal cards, expandable outer card height, and the exact
   current PlayStyle+ gold badge silhouette used elsewhere in the site. */

@media(min-width:1281px){
  /* 4 x 285 + 3 x 14 = 1182px */
  #specializationPanel #specializationCards.specialization-cards{
    width:min(1182px,100%)!important;
    max-width:1182px!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:14px!important;
    align-items:start!important;
  }
  #specializationCards .specialization-card{
    width:100%!important;
    min-width:0!important;
  }

  /* Default cards remain perfectly aligned at 426px. Only a card whose perk
     accordion is open is allowed to grow downward with its content. */
  #specializationCards .specialization-card.has-expanded-perk{
    height:auto!important;
    min-height:426px!important;
    overflow:hidden!important;
  }
}

/* Allow longer perk copy to remain fully visible inside the growing card. */
#specializationCards .base-perk-block .spec-perk-row.rich.is-expanded .spec-perk-desc,
#specializationCards .spec-extra-perk-block .spec-perk-row.rich.is-expanded .spec-perk-desc,
#specializationCards .spec-extra-perk-block .spec-perk-row.rich.is-expanded .spec-reward-desc{
  max-height:220px!important;
}

/* ---------- Exact site PlayStyle+ badge geometry ----------
   Reuse the same --fc27-ps-gold asset as the PlayStyle page instead of the
   hand-drawn shield from v5.5.45. */
#specializationCards .spec-ps-badge{
  --badge-h:27px;
  --badge-w:32.4px;
  --icon-box:16.2px;
  --gold-lift:1.6px;
  position:relative!important;
  display:block!important;
  flex:0 0 36px!important;
  width:36px!important;
  height:32px!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  clip-path:none!important;
  filter:none!important;
  overflow:visible!important;
}
#specializationCards .spec-ps-badge::before{
  content:""!important;
  position:absolute!important;
  z-index:1!important;
  left:50%!important;
  top:50%!important;
  width:var(--badge-w)!important;
  height:var(--badge-h)!important;
  transform:translate(-50%,-50%)!important;
  background:var(--fc27-ps-gold) center/100% 100% no-repeat!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  clip-path:none!important;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.20))!important;
  pointer-events:none!important;
}
#specializationCards .spec-ps-badge::after{
  display:none!important;
  content:none!important;
}
#specializationCards .spec-ps-badge img{
  position:absolute!important;
  z-index:2!important;
  display:block!important;
  left:50%!important;
  top:calc(50% - var(--gold-lift))!important;
  width:var(--icon-box)!important;
  height:var(--icon-box)!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  filter:none!important;
  opacity:1!important;
  transform:translate(-50%,-50%)!important;
}
#specializationCards .spec-ps-badge-fallback{
  position:absolute!important;
  z-index:2!important;
  inset:0!important;
  display:grid!important;
  place-items:center!important;
  color:#111820!important;
  font-size:7px!important;
  font-weight:900!important;
}