Logo (Akatsuki) not aligning with nav items

CodePen

If you see, I have header { display: flex; align-items: flex-start;} BUT flex-start won’t work for Akatsuki. Neither center, neither the others.

Why?

Inspect h1 element and you’ll see that browser sets default margin.

Oh, so I have to do :root { margin: 0; padding: 0;?