Self-modifying variables: the inherit() workaround

In a previous article I wrote about a method to get a --depth value based on alternating classes. But Roman Komarov found a better method to achieve a similar effect. I'll give a small spoiler about the method, but for the full break-down, you have to read the article.

* {
  @container not style(--is-alternate: ) {
    --is-alternate: ;
  }
  @container style(--is-alternate: ) {
    --is-alternate: initial;
  }
}

One caveat, it requires style queries to be support by your browser. We are not there yet, but it will come in the future.