Sfide nella creazione di una tavolozza di colori personalizzata

Questo è estremamente confuso. Nella styleguide le variabili CSS etichettate usano i trattini:

Mentre in questo (e in altri) schemi di esempio hanno i trattini bassi:

Ammetto di non essere il coltello da codice più affilato nel cassetto, e sono sicuro che le persone che ci hanno lavorato a lungo lo trovino più ovvio e intuitivo… ma cercare di farsi strada in questo mi fa sentire un po’ pazzo.

È davvero difficile avere una comprensione intuitiva di tutta la logica su come vengono utilizzati i colori della modalità chiara e scura. Tra la moltitudine di file SCSS e trasformazioni, JSON, GUI di amministrazione, palette che sono (in qualche modo?) indipendenti dai temi…

Scusa per il mio divagare, sto solo lottando un po’ qui.