.matches{
    display: flex;
    flex-direction: column;

    .count{
        font-weight: var(--font-weight-primary);
    }

    .match{
        border-bottom: var(--border-size-1) solid var(--gray-3);
        display: flex;
        align-items: center;
        padding: var(--size-5);
        gap: var(--size-5);

        img{
            aspect-ratio: var(--ratio-portrait);
            width: var(--size-10);
        }

        .match__body{
            font-size: var(--font-size-1);
            display: flex;
            flex-direction: column;
            gap: var(--size-3);
            flex-grow: 1;
            overflow-wrap: anywhere;

            a {
                text-decoration: none;
                color: inherit;
            }

            .relevance{
                font-weight: var(--font-weight-secondary);
            }
        }

        &:last-of-type{
            border-bottom: none;
        }
    }
}
