@view-transition 
{
    navigation: auto;
}

.nav
{
    view-transition-name: nav;
}

@keyframes slide-out
{
    from
    {
        opacity: 1;
    }

    to
    {
        opacity: 0;
    }
}

@keyframes slide-in
{
    from
    {
        opacity: 0;
    }

    to
    {
        opacity: 1;
    }
}

::view-transition-old(root)
{
    animation: slide-out 400ms ease-in-out both;
}

::view-transition-new(root)
{
    animation: slide-in 400ms ease-in-out both;
}