Can we support multiple variants of this form?

[SGAMERyu]

In a variant system, the variants we set up often contain common components, and we only need to modify a single CSS property, such as size.

<style lang="ts">
css({
  variants: {
    size: {
      sm: {
        padding: '{space.3} {space.6}',
      },
      md: {
        padding: '{space.6} {space.8}'
      },
      lg: {
        padding: '{space.8} {space.12}'
      },
      xl: {
        padding: '{space.12} {space.24}'
      },
      options: {
        default: 'sm',
      },
    },
  },
})
</style>

But when we use a multiple variant system, it may be more concise.

css({
  variants: {
    size: {
      [sm, md, lg, xl]: (val) => {
        padding: `{space.${val}}`
     },
      options: {
        default: 'sm',
      },
    },
  },
})