Dificuldades com FlexBox e UL

Pessoal, estou com uma dúvida que está me tirando o sono!

Então, vou exibir 2 situações com Flexbox onde 1 delas está dando uma falha. (Será mesmo?).

Nessa versão, com DIV's, tudo funciona bem:

CSS:

span.vertical {

        writing-mode: vertical-lr;
        transform: rotate(180deg);
    }
    span.comum {        
        
    }
    div.cabecalhoVertical{
        display: flex;
        height: 200px;
        border: .1px rgb(0,0,0) solid;
        
    }
    div.cabecalhoVertical div {
        display: flex;
        flex-grow: 1;
        list-style: none;
        border-right: .1px rgb(0,0,0) solid;
        align-items: center;
        justify-content: center;
    }
    div.cabecalhoVertical div span {
        text-align: center;
        font-weight: bolder;
    }

	**HTML**:

<div class='cabecalhoVertical'>
    <div style='width:215px;'><span class='comum'   >Nome do Gcéu </span></div>
    <div style='width:215px;'><span class='vertical'>Supervisor</span></div>
    <div style='width:215px;'><span class='comum'   >Líder</span></div>
    <div style='width:035px;'><span class='vertical'>Houve Supervisão?</span></div>
    <div style='width:035px;'><span class='vertical'>Houve dia de Jejum?</span></div>
    <div style='width:035px;'><span class='vertical'>Houve dia de Evangedismo?</span></div>
    <div style='width:035px;'><span class='vertical'>Membros Compromissados</span></div>
    <div style='width:035px;'><span class='vertical'>Visitantes</span></div>
    <div style='width:035px;'><span class='vertical'>Crianças de 0 à 12 anos</span></div>
    <div style='width:035px;'><span class='vertical'>Total de presentes</span></div>
    <div style='width:035px;'><span class='vertical'>Ofertas</span></div>                    
    <div style='width:035px;'><span class='vertical'>Disicpulados</span></div>                    
    <div style='width:035px;'><span class='vertical'>Número de decisões</span></div>            
</div>    

	**Resultado**:

	![imagem](https://forum.imasters.com.br/monthly_2019_03/a.jpg.8b5ec06e1c5c75bb03cb832ce08e1365.jpg)

	 

	**Agora com UL -> A falha**:

	 

	**CSS**:

    span.vertical {
        writing-mode: vertical-lr;
        transform: rotate(180deg);
    }
    span.comum {        
        
    }
    ul.cabecalhoVertical{
        display: flex;
        height: 200px;
        border: .1px rgb(0,0,0) solid;
        
    }
    ul.cabecalhoVertical li {
        display: flex;
        flex-grow: 1;
        list-style: none;
        border-right: .1px rgb(0,0,0) solid;
        align-items: center;
        justify-content: center;
    }
    ul.cabecalhoVertical li span {
        text-align: center;
        font-weight: bolder;
    }

HTML:

<ul class='cabecalhoVertical'>
    <li style='width:215px;'><span class='comum'   >Nome do Gcéu </span></li>
    <li style='width:215px;'><span class='vertical'>Supervisor</span></li>
    <li style='width:215px;'><span class='comum'   >Líder</span></li>
    <li style='width:035px;'><span class='vertical'>Houve Supervisão?</span></li>
    <li style='width:035px;'><span class='vertical'>Houve dia de Jejum?</span></li>
    <li style='width:035px;'><span class='vertical'>Houve dia de Evangedismo?</span></li>
    <li style='width:035px;'><span class='vertical'>Membros Compromissados</span></li>
    <li style='width:035px;'><span class='vertical'>Visitantes</span></li>
    <li style='width:035px;'><span class='vertical'>Crianças de 0 à 12 anos</span></li>
    <li style='width:035px;'><span class='vertical'>Total de presentes</span></li>
    <li style='width:035px;'><span class='vertical'>Ofertas</span></li>                    
    <li style='width:035px;'><span class='vertical'>Disicpulados</span></li>                    
    <li style='width:035px;'><span class='vertical'>Número de decisões</span></li>            
</ul>    

	Percebam agora na print como aparece um** bloco adicional **no **lado esquerdo** antes da primeira **LI**

	![imagem](https://forum.imasters.com.br/monthly_2019_03/b.png.0a5c542e90ed35b85bfe169e0ffb9642.png)

	 

	Gostaria de saber 2 coisas:

	 

	1) Porquê isso acontece uma vez que **list-style** está setado para **none** nas **LI's**?

	2) Como corrigir essa falha?

	 

	Obrigado a quem puder ajudar.