Utility wildcard not only as last portion

[drochag]

When using @utility matching theme values I'd like to be able to convert this

  .badge-green {
    @apply border-green-200 bg-green-100 text-green-800;
  }
  .badge-amber {
    @apply border-amber-200 bg-amber-100 text-amber-800;
  }
  .badge-red {
    @apply border-red-200 bg-red-100 text-red-800;
  }
  .badge-blue {
    @apply border-blue-200 bg-blue-100 text-blue-800;
  }

into this

  @utility badge-* {
    background-color: --value(--bg-*-100);
    border: --value(--border-*-200);
    color: --value(--text-*-800);
  }

[simonm-c]

i think this this would be a hugely beneficial addition, because with the current implementation it is impossible to mirror the syntax tailwind itself uses for utilities. e.g. to recreate the font-size utilities;

font-size: var(--text-xs); 
line-height: var(--text-xs--line-height);

would require the ability to use the wildcard --text-*--line-height

[simonm-c]

actually, i've done some investigating, and this approach does seem to work on one of my projects, but not the other. as far as i can tell, the only difference between the 2 builds is that the one that works is using the tailwind postcss plugin, and the one that does not work is using the tailwind vite plugin. all other versioning the same, both using 4.1.11