It’s kind of a hack, but also just translates well to CSS too. I think of it more like providing @media rules. Each set contains the same token, but its value is changed based on the viewport size. Which is pretty similar to writing something like this in CSS:
nav { /* this might be equivalent to your default/global set */
width: 100%; /* this could be a nav.width token */
}
@media (max-width: 1024px) { /* tablet set */
nav {
width: 900px; /* in the tablet set, this is the value for the nav.width token */
}
}
@media (max-width: 1200px) { /* desktop set */
nav {
width: 1100px; /* in the desktop set, this is the value for the nav.width token */
}
}
Arguably, we should be moving away from fixed breakpoints (and pixel sizing) but that’s a different discussion 
Importantly, **multiple themes can be active simultaneously**. As you say, they cross connect. You can group them as “modes” and use the themes to determine which token sets are active when that theme is enabeld. So you don’t need to recreate all your tokens for each theme. Again, this is like CSS, in that your rules for @media (max-width: 1200px) and @media (prefers-color-scheme: dark) can be totally separate and not affect each other. (Or you can choose conditions that apply when they both interact.)
So for your list of themes:
You would have:
- Breakpoint (mode/theme group)
- Mobile (token set)
- Tablet (token set)
- Desktop (token set)
- Colour (mode/theme group)
- Light (token set)
- Dark (token set)
Tokens can also reference other tokens. So a theme might only contain one token that has a ripple effect throughout the other tokens. (Like using a CSS custom property or variable in code.) This is how I mostly work with “breakpoint” tokens. I use it to set the width of the viewport board using a breakpoint token, and design everything inside that board to be responsive. Sometimes I’ll also scale a font size token multiplier slightly differently based on breakpoint, or have a max-width token for text.
You might find the demo file I made for the last hands-on session useful if you want to play with theme setup:
