How can I use css grid and subgrid layout correctly for lists?

ol {
    counter-reset: Nr;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: min-content 1fr;
    grid-column: subgrid;



    li {
        counter-increment: Nr;
    grid-column: 1 / -1;
        display: grid;
        grid-template-columns: subgrid;
        margin-top: var(--listsep);

        &::before {
            content: counter(Nr) ".";
            text-align: end;
            margin-right: 0.85rem;
        }

        ol {
            counter-reset: lit;

            li {
                counter-increment: lit;

                &::before {
                    content: counter(lit, lower-latin)')';
                }
            }
        }
    }
}

<ol>
  <li>This <strong>text</strong> is an example.</li>
  <li>This is ok.</li>
    <li>Nesting should still be possible
        <ol>
            <li>This is nested</li>
        </ol>
    </li>
</ol>