Slotted elements become children of the shadow container

Expected: the four items sit in one row, packed to the left with 10px gaps. A <slot> is display: contents by default, so it generates no box and the slotted elements become flex items of the shadow tree's flex container.

Flex properties apply to slotted items

Expected: the middle item stretches to fill the remaining width — flex: 1 is set on the light-DOM element itself and it really is a flex item of the shadow container.

Slotted items in a grid

Expected: a 3-column grid; item "wide" spans two columns. Grid placement of slotted elements works exactly as if they were written inside the shadow tree.

order reshuffles slotted items

Expected: visual order is C A B — the light DOM is written A, B, C but C carries order: -1 inside the shadow flex container.