 a grid container with reading-flow.">
  <template shadowrootmode="open">
    <style>
    .wrapper {
      display: grid;
      reading-flow: grid-order;
    }
    </style>
    <div class="wrapper">
      <button style="order: 4" id="before">Before</button>
      <slot style="order: 10"></slot>
      <button style="order: 2" id="after">After</button>
    </div>
  </template>
  <button style="order: 3" id="a4">Item A</button>
  <button style="order: 1" id="b4">Item B</button>
  <button style="order: 6" id="c