<script>
	let array = [1];
</script>

<style>
	/* boundary of each */
	.a + .d { color: green; }
	.a + .e { color: green; }
	.a + .f { color: green; }
	.a + .g { color: green; }
	.c + .d { color: green; }
	.c + .e { color: green; }
	.c + .f { color: green; }
	.c + .g { color: green; }

	/* nested boundary of each */
	.j + .m { color: green; }
	.j + .n { color: green; }
	.j + .o { color: green; }
	.k + .m { color: green; }
	.k + .n { color: green; }
	.k + .o { color: green; }
	.l + .m { color: green; }
	.l + .n { color: green; }
	.l + .o { color: green; }

	/* parent each */
	.d + .e { color: green; }
	.e + .f { color: green; }

	/* child each */
	.g + .h { color: green; }

	/* wrap around */
	.f + .d { color: green; }
	.f + .e { color: green; }
	.f + .f { color: green; }

	.h + .g { color: green; }
	.i + .h { color: green; }
	.i + .g { color: green; }

	/* wrap around self */
	.d + .d { color: green; }
	.e + .e { color: green; }
	.f + .f { color: green; }
	.g + .g { color: green; }
	.h + .h { color: green; }
	.i + .i { color: green; }

	/* wrap around self + next */
	.e + .e + .f { color: green; }
	.e + .e + .d { color: green; }
	.h + .h + .i { color: green; }
	.h + .h + .g { color: green; }

	/* no match */
	.a + .h { color: green; }
	.a + .i { color: green; }
	.c + .h { color: green; }
	.c + .i { color: green; }
	.d + .f { color: green; }
	.d + .g { color: green; }
	.e + .g { color: green; }
	.g + .i { color: green; }
</style>

<div class="a" />

{#each array as item}
	<div class="b" />
	<div class="c" />
{/each}

{#each array as item}
	{#each array as item}
		{#each array as item}
			<div class="d" />
		{/each}
		<div class="e" />
	{/each}
	<div class="f" />
{/each}

{#each array as item}
	<div class="g" />
	{#each array as item}
		<div class="h" />
		{#each array as item}
			<div class="i" />
		{/each}
	{/each}
{/each}

{#each array as item}
	<div class="j" />
	{#each array as item}
		<div class="k" />
		{#each array as item}
			<div class="l" />
		{/each}
	{/each}
{/each}

{#each array as item}
	{#each array as item}
		{#each array as item}
			<div class="m" />
		{/each}
		<div class="n" />
	{/each}
	<div class="o" />
{/each}