.root {
    composes: grid from global;
    composes: grid-cols-1 from global;
    composes: leading-none from global;
    grid-template-areas:
        'actions'
        'items';
}

.items {
    composes: gap-xs from global;
    composes: grid from global;
    composes: mb-3 from global;
    grid-area: items;
    grid-template-columns: repeat(3, 1fr);
}

@media screen(-sm) {
    .items {
        grid-template-columns: repeat(2, 1fr);
    }
}