Lobotomized owl CSS selector broken

I like to use a pattern of a CSS flex-box with whildren evenly spaced using the lobotomized owl selector.

My CSS looks like this:

  .user-section {
    display: flex;
  }

  .user-section > * + * {
    margin-left: 4px;
  }

Svelte compiles it into this:

.user-section.svelte-1aasoha {
  display: flex
}

.user-section>*+.svelte-1aasoha {
  margin-left: 4px
}

The right eye of the owl is replaced with the unique Svelte-generated selector id for the flexbox. I expected the unique id to be appended to the flexbox selector before the > part of the selector.

Is the id just naively appended to the end of the selector? Maybe a whitespace collapse is set to happen too early when handling this selector.

Svelte version: 3.5.3

[Conduitry]

~ / + should now be getting scoped properly in v3.27.0.

[Conduitry]

I was just thinking about this more, and there seem to be a lot more things to worry about with sibling selectors than with the other ones. For example:

{#each foo as bar}
	<div class='a'>...</div>
	<div class='b'>...</div>
{/each}

then .b + .a is a valid selector, because the loop will wrap around. In general, there seems to be a large number of cases to cover when deciding whether two elements can be (adjacent or non-adjacent) siblings when {#if}s/{#each}s/{:else}s/{#await}s become involved.