/* Creator card (shared by the brand's matches and the .com homepage preview, 14 Oct 2026). Moved unchanged from
   resources/views/v2/brand/find/styles.blade.php, in the same order. */
.find-match--similar { background: #FCFBFF; }
.find-match__reason { font-size: 12px; font-weight: 600; color: #7C4DFF; background: rgba(124, 77, 255, 0.08); border-radius: 999px; padding: 3px 10px; margin: 0 0 8px; }
.find-tip { position: relative; display: inline-block; cursor: help; color: #7C4DFF; font-weight: 600; outline: none; }
.find-tip--label { font-size: 13px; }
.find-tip::after { content: attr(data-tip); position: absolute; z-index: 20; bottom: calc(100% + 6px); right: 0; width: max-content; max-width: 240px; padding: 8px 10px; border-radius: 8px;
    background: #1A1A2E; color: #fff; font-size: 12px; font-weight: 400; line-height: 1.4; text-align: left; white-space: normal; opacity: 0; visibility: hidden; transition: opacity 0.15s ease; }
.find-match__stats .find-tip::after { right: auto; left: 50%; transform: translateX(-50%); }
.find-tip:hover::after, .find-tip:focus::after { opacity: 1; visibility: visible; }
/* Cards wrap to the next row on any screen width (8 Oct 2026): never cut off sideways. */
/* Equal card heights (Sam, 9 Oct 2026): every row of cards as tall as the tallest card; Message at the bottom. */
.find-matches { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); grid-auto-rows: 1fr; gap: 16px; }
.find-match { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 20px 16px; height: 100%; box-sizing: border-box; }
.find-match__photo { border: none; background: none; padding: 0; margin-bottom: 10px; }
.find-match__city { font-size: 12px; color: #5A5F6E; margin: -2px 0 8px; }
.find-match__city i { color: #E91E63; font-size: 11px; margin-right: 2px; }
.find-match__largest { position: absolute; top: 10px; left: 10px; font-size: 11px; font-weight: 700; color: #3F2E86; background: rgba(124, 77, 255, 0.10); border-radius: 999px; padding: 2px 8px; }
.find-match__stats { margin: 0 0 12px; }
.find-match__stat { display: flex; justify-content: space-between; gap: 8px; padding: 3px 0; border-bottom: 1px dashed #F1F5F9; }
.find-match__stat dt { font-weight: 400; color: #5A5F6E; margin: 0; }
.find-match__stat dd { margin: 0; text-align: right; }
.find-match__missing { color: #9CA3AF; }
.find-match__photo img, .find-match__initial { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; display: flex; align-items: center; justify-content: center; }
.find-match__initial { background: linear-gradient(135deg, rgba(233, 30, 99, 0.12), rgba(124, 77, 255, 0.12)); color: #7C4DFF; font-size: 34px; font-weight: 700; }
.find-match__name { font-size: 16px; font-weight: 700; margin: 0 0 6px; color: #1A1A2E; }
.find-match__line { font-size: 13px; color: #374151; margin: 0 0 8px; }
.find-match__headline { font-size: 13px; color: #5A5F6E; margin: 0 0 4px; }
.find-match__headline strong, .find-match__stats strong { color: #1A1A2E; font-weight: 700; }
.find-match__headline strong { font-size: 16px; }
.find-match__toggle { border: none; background: none; color: #E91E63; font-size: 12px; font-weight: 600; cursor: pointer; padding: 4px 8px; margin-bottom: 8px; }
.find-match__toggle i { font-size: 10px; margin-left: 2px; }
.find-match__stats { width: 100%; text-align: left; font-size: 13px; border-top: 1px solid #F1F5F9; padding-top: 10px; margin-bottom: 12px; }
.find-match__stats div { margin-bottom: 4px; }
.find-match__action { margin-top: auto; width: 100%; }
.find-match__message { width: 100%; }
.find-verified { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 600; color: #0E7A4D; background: #E6F6EE; border-radius: 999px; padding: 2px 8px; vertical-align: middle; }
.find-match__note { font-size: 13px; color: #5A5F6E; font-style: italic; margin: 0 0 8px; }
/* Every photo the same circle (15 Oct 2026): the box itself is the 96px circle and crops the photo, centred, so no photo
   shape and no other stylesheet on the page can stretch it into an oval. */
.find-match .find-match__photo { flex: none; width: 96px; height: 96px; border-radius: 50%; overflow: hidden; }
.find-match .find-match__photo img, .find-match .find-match__photo .find-match__initial { width: 100%; height: 100%; min-width: 0; max-width: none; max-height: none;
    aspect-ratio: 1 / 1; object-fit: cover; object-position: center; border-radius: 50%; }
/* A stat's number always keeps room next to its label (15 Oct 2026): the label wraps first, the number is never squeezed out. */
.find-match__stat dt { flex: 1 1 0; min-width: 0; }
.find-match__stat dd { flex: 0 1 auto; min-width: 3.5em; }
@media (max-width: 575px) {
    .find-matches { grid-template-columns: 1fr; }
}