Template:Brand directory/styles.css

/* Brand directory styles */
.brand-directory {
    column-count: 4;
    column-gap: 2em;
    margin: 1.5em 0;
}

.brand-directory-item {
    break-inside: avoid;
    margin-bottom: 0.5em;
    line-height: 1.6;
}

.brand-directory-item .brand-count {
    color: #72777d;
    font-size: 0.9em;
}

/* Night mode support */
.skin-citizen-dark .brand-directory-item .brand-count {
    color: #a2a9b1;
}

/* Responsive adjustments */
@media (max-width: 1200px) {
    .brand-directory { column-count: 3; }
}

@media (max-width: 800px) {
    .brand-directory { column-count: 2; }
}

@media (max-width: 500px) {
    .brand-directory { column-count: 1; }
}