.bb-catalog {
    --bb-catalog-gap: 1.25rem;
    color: inherit;
}

.bb-catalog-filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: 1rem;
    align-items: end;
    margin-block: 1.5rem;
}

.bb-catalog-filters label,
.bb-catalog-filters label span {
    display: block;
}

.bb-catalog-filters label span {
    margin-bottom: .35rem;
}

.bb-catalog-filters input,
.bb-catalog-filters select,
.bb-catalog-filters button {
    box-sizing: border-box;
    min-height: 2.75rem;
    width: 100%;
}

.bb-book-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
    gap: var(--bb-catalog-gap);
    list-style: none;
    padding: 0;
}

.bb-book-card {
    min-width: 0;
}

.bb-book-card-link {
    display: block;
    color: inherit;
    text-decoration: none;
}

.bb-book-card img,
.bb-related-books img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 2 / 3;
    object-fit: cover;
}

.bb-book-card h2 {
    font-size: 1.1rem;
    margin-block: .6rem .25rem;
}

.bb-book-card-language,
.bb-book-card-publisher {
    margin-block: .25rem;
}

.bb-catalog-pagination ul {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    list-style: none;
    padding: 0;
}

.bb-book-detail-header {
    display: grid;
    grid-template-columns: minmax(12rem, 1fr) minmax(0, 2fr);
    gap: 2rem;
    align-items: start;
}

.bb-book-covers {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.bb-book-covers img {
    display: block;
    max-width: min(48%, 20rem);
    height: auto;
}

.bb-book-credits {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: .4rem 1rem;
}

.bb-book-credits dd {
    margin: 0;
}

.bb-book-tags,
.bb-book-narrations ul,
.bb-book-language-pairs ul,
.bb-related-books ul,
.bb-person-links,
.bb-person-books,
.bb-languages-list ul {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1.25rem;
    list-style: none;
    padding: 0;
}

.bb-book-narrations li,
.bb-languages-list li {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.bb-book-narrations img,
.bb-person-grid img,
.bb-person-image {
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    object-fit: cover;
}

.bb-book-reader {
    margin-block: 3rem;
}

.bb-book-page {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1.5rem;
    align-items: center;
    padding-block: 1.5rem;
    border-bottom: 1px solid currentColor;
}

.bb-book-page img {
    display: block;
    width: 100%;
    height: auto;
}

.bb-book-page-text {
    line-height: 1.7;
    white-space: normal;
}

.bb-related-books li {
    width: min(10rem, 40vw);
}

.bb-person-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
    gap: 1rem;
    list-style: none;
    padding: 0;
}

.bb-person-grid a {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.bb-language-book-count {
    margin-inline-start: auto;
}

@media (max-width: 640px) {
    .bb-book-detail-header,
    .bb-book-page {
        grid-template-columns: 1fr;
    }

    .bb-book-covers {
        justify-content: center;
    }

    .bb-book-covers img {
        max-width: min(46%, 16rem);
    }
}
