@utility fancylist {
  --svg-width: 1em;
  --svg-height: 1lh;
  display: grid;

  /* grid-template-columns: auto 1fr; */
  column-gap: 0.5em;

  :where(li) {
    grid-column: 1 / -1;
    display: grid;

    /* grid-template-columns: subgrid; */
    grid-template-columns: auto 1fr;
    column-gap: inherit;

    /* Positions the Emoji */
    /* This is kind of brute-forced at the moment. */
    :where(.emoji),
    > :where(astro-slot, astro-island) > :where(.emoji) {
      font-size: 0.75em;
      line-height: 1lh;
    }

    :where(ul) {
      grid-column: 2;
      display: grid;
      column-gap: inherit;
    }
  }
}
