`<picture />` elements generated by `@sveltejs/enhanced-img` cannot be styled

Describe the problem

Classes/styles applied to <enhanced:img /> elements are applied to the contained <img /> element, not the outer container. This makes grid/flex layouts hard to manage without a wrapper element.

<enhanced:img class="grid-item" />

becomes

<picture>
  <img class="grid-item" />
</picture>

Describe the proposed solution

The <picture /> element could be marked as display: contents, or maybe classes/styles could be applied to the <picture />.

The example above could become either

<picture style="display:contents">
  <img class="grid-item" />
</picture>

or

<picture class="grid-item">
  <img />
</picture>

Alternatives considered

As a workaround, you can wrap a <div /> around each <enhanced:img /> with your grid/flex logic applied to it, but this feels wrong when <picture /> is already wrapping your images.

Importance

would make my life easier

Additional Information

No response

Start from the @sveltejs/enhanced-img transformation that handles <enhanced:img /> attributes and inspect how classes and styles are transferred into the generated and elements. Compare the proposed output options and confirm the chosen behavior with the existing generated markup; done means users can style the outer picture element for grid or flex layouts without an extra wrapper.