.toc {
    max-inline-size: var(--measure);
}

[class^='toc-'] [class^='toc-'] {
  margin-block-start: var(--list-item-proximity);
}

/*
What should the min-width be in the following media query?

The aim is to position toc to the left of the main content only when there is enough space on the screen to keep the main content in *center* of the screen, while also fitting the content of sidebar on LHS without overflowing it out of the screen.

For that to happen, the width must at least be `size-of-toc + size-of-main-content + size-of-toc`.
*/
@container (min-width: 130ch) {
}