#card-browser-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 0.75rem;
}

#card-browser-controls input[type="search"] {
    max-width: 220px;
}

#card-browser-controls select {
    max-width: 220px;
}

.card-thumb .card-set-badge {
    font-size: 0.65em;
    text-align: center;
    padding: 0 0.3rem 0.3rem;
    color: #888;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rarity-quick-toggle {
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
    color: #78350f;
    font-weight: 600;
}

.rarity-quick-toggle:hover {
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: #78350f;
}

.rarity-quick-toggle.active {
    background: linear-gradient(135deg, #d97706, #b45309);
    color: #fff;
}

@media (max-width: 576px) {
    #card-browser-controls input[type="search"],
    #card-browser-controls select {
        max-width: none;
        width: 100%;
    }
}