div with role=group looks bad in nav

[davi4046]

Description

Having a div with role="group" in the nav does not vertically center-align the group and the other nav items.

<nav>
  <ul>
    <li>Hi</li>
    <li>
      <div role="group">
        <input />
      </div>
    </li>
  </ul>
</nav>

Expected behaviour

The group and the other nav items should be center-aligned vertically.

Reproduction URL

https://codepen.io/davi4046/pen/XJXdzqK

Environment

OS: Windows 11
Browser: Firefox 143.0.1
Pico version: 2.1.1