/* Styles for Magnitof Overlap Badge */
.mf-ob-badge{display:flex;flex-direction:column;gap:.4rem}
.mf-ob-top{display:flex;align-items:center;gap:.8rem}
.mf-ob-avatars{display:flex;align-items:center}
.mf-ob-avatars .mf-ob-avatar{position:relative;border-radius:9999px;overflow:hidden;display:inline-block;box-sizing:content-box}
.mf-ob-badge.shape-rounded .mf-ob-avatar{border-radius:12px}
.mf-ob-avatars .mf-ob-avatar img{display:block;width:100%;height:100%;object-fit:cover}
.mf-ob-rating, .mf-ob-rating-link{display:inline-flex;align-items:center;gap:.4rem;font-weight:600}
.mf-ob-rating-link{color:inherit;text-decoration:none}
.mf-ob-text{line-height:1.5}
.mf-ob-text .mf-count{font-weight:700}


/* ==== Layout v1.2.2 ==== */
.mf-ob-row{display:flex;align-items:center;gap:.8rem}
.mf-ob-right{display:flex;flex-direction:column;gap:.35rem}

/* Desktop (>=768px): row layout; rating over text on the right */
@media (min-width:768px){
  .mf-ob-row{flex-direction:row}
  .mf-ob-right{align-items:flex-start}
}

/* Mobile (<=767px): column layout; avatars on top, then rating, then text; avatars forced circular */
@media (max-width:767px){
  .mf-ob-row{flex-direction:column;align-items:center;gap:.75rem}
  .mf-ob-right{align-items:center}
  .mf-ob-avatars .mf-ob-avatar{border-radius:9999px !important}
}