.zzz-agent-icons-card {
    border: 1px solid var(--card-border, #e5e5e5);
    border-radius: var(--radius-md, 8px);
    overflow: visible;
    margin: 12px 0;
    background: var(--card-bg, rgba(0,0,0,.02));
    position: relative;
}
.zzz-agent-icons-card--equipment { overflow: hidden; }
.zzz-agent-icons-card__title {
    font-family: "Exo 2", sans-serif;
    font-weight: 700;
    font-size: 14px;
    color: var(--preset-color-on-primary, #fff);
    padding: 6px 12px;
    background: var(--preset-color-primary, #e07020);
    border-radius: var(--radius-md, 8px) var(--radius-md, 8px) 0 0;
}
:is(.zzz-icon-list, .zzz-equip-icons-grid, .zzz-agent-icons-grid:where(:not([style]))) {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
    gap: 6px;
    padding: 10px 12px;
}
:is(.zzz-icon-list, .zzz-equip-icons-grid, .zzz-agent-icons-grid:where(:not([style]))) .zzz-agent-icon { --icon-size: 96px; }
:is(.zzz-icon-list, .zzz-equip-icons-grid, .zzz-agent-icons-grid:where(:not([style]))) > * { justify-self: center; }
.zzz-icon-list > p, .zzz-icon-list p { display: none; }
.zzz-equip-icons-link { text-decoration: none; display: block; transition: transform .15s; }
.zzz-equip-icons-link:hover { transform: scale(1.06); }
@media (max-width: 600px) {
    :is(.zzz-icon-list, .zzz-equip-icons-grid, .zzz-agent-icons-grid:where(:not([style]))) {
        grid-template-columns: repeat(auto-fill, minmax(60px, 1fr));
        gap: 4px;
        padding: 8px;
    }
    :is(.zzz-icon-list, .zzz-equip-icons-grid, .zzz-agent-icons-grid:where(:not([style]))) .zzz-agent-icon { --icon-size: 60px; }
}