.collection-filters {
    grid-template-columns: minmax(180px, 1fr) 160px 160px minmax(150px, .7fr) auto;
}

.collection-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    margin-bottom: 18px;
    border: 1px solid var(--line);
    background: var(--surface);
}

.collection-meta div {
    min-width: 0;
    padding: 16px 18px;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.collection-meta div:nth-child(3n) {
    border-right: 0;
}

.collection-meta div:nth-last-child(-n+3) {
    border-bottom: 0;
}

.collection-meta span,
.collection-meta strong {
    display: block;
}

.collection-meta span {
    margin-bottom: 7px;
    color: var(--muted);
    font-size: 12px;
}

.collection-meta strong {
    overflow-wrap: anywhere;
    font-size: 15px;
    font-weight: 600;
}

.collection-error {
    white-space: normal;
}

@media (max-width: 1000px) {
    .collection-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .collection-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .collection-meta div,
    .collection-meta div:nth-child(3n) {
        border-right: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
    }

    .collection-meta div:nth-child(2n) {
        border-right: 0;
    }

    .collection-meta div:nth-last-child(-n+2) {
        border-bottom: 0;
    }
}

@media (max-width: 600px) {
    .collection-filters,
    .collection-meta {
        grid-template-columns: 1fr;
    }

    .collection-meta div,
    .collection-meta div:nth-child(2n),
    .collection-meta div:nth-child(3n) {
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .collection-meta div:last-child {
        border-bottom: 0;
    }
}