No CSS 2.1,z-index aplica-se apenas a elementos posicionados e especifica duas coisas diferentes:

O nível da pilha da caixa no atual contexto de empilhamento.Se a caixa estabelece um contexto de empilhamento.

MasFlexbox diz o seguinte:

Itens flexíveis pinte exatamente o mesmo que blocos embutidos[CSS21], exceto aquiloorderordem de documento modificada é usada no lugar da ordem bruta de documento ez-index valores diferentes deauto crie um contexto de empilhamento, mesmo queposition éstatic.

Ao contrário do CSS2.1, a configuraçãoz-index para algum número inteiro em um item flexível não posicionado cria um contexto de empilhamento.

No entanto, não vejo definido em nenhum lugar qual deve ser o nível da pilha desse contexto de empilhamento.

Um caso semelhante éopacity, que também pode criar estabelecer contextos de empilhamento em elementos não posicionados. Mas, neste caso, o nível da pilha é especificado corretamente como 0:

Se um elemento com opacidade menor que 1 não estiver posicionado, as implementações deverão pintar a camada que criar, dentro do contexto de empilhamento pai, na mesma ordem de empilhamento que seria usada se fosse um elemento posicionado comz-index: 0 eopacity: 1.

Na minha opinião, essas opções são razoáveis:

O nível da pilha é o valor especificado emíndice zO nível da pilha é 0O item flex agrupa seus descendentes em um contexto de empilhamento para que sejam pintados juntos, mas o próprio item flex é pintado como um elemento não posicionado em fluxo normal (como se não estabelecesse um contexto de empilhamento).

De acordo com o teste a seguir, o Firefox e o Chrome fazem a primeira opção.

.container {
  display: flex;
  padding-left: 20px;
}
.item {
  padding: 20px;
  background: #ffa;
  align-self: flex-start;
  margin-left: -20px;
}
.item:nth-child(even) {
  background: #aff;
  margin-top: 40px;
}
.za::after{ content: 'z-index: auto'; }
.z0 { z-index: 0; } .z0::after{ content: 'z-index: 0'; }
.z1 { z-index: 1; } .z1::after{ content: 'z-index: 1'; }
.z-1 { z-index: -1; } .z-1::after{ content: 'z-index: -1'; }

<div class="container">
  <div class="item z1"></div>
  <div class="item z0"></div>
  <div class="item za"></div>
  <div class="item za"></div>
  <div class="item z-1"></div>
</div>

Esse comportamento está definido em algum lugar?