:where(html) {
  --_bw-step-away-1: 13%;
  --_bw-step-away-2: 26%;
  --_bw-step-away-3: 39%;
  --_bw-step-away-4: 52%;

  --_l-step-away-1: 8; /*9;*/  
  --_l-step-away-2: 16; /*18;*/
  --_l-step-away-3: 24; /*27;*/
  --_l-step-away-4: 30; /*36;*/
  --_l-shade-tint: var(--_l-step-away-2);

  --_c-step-away-1: 0.08;
  --_c-step-away-2: 0.15;
  --_c-step-away-3: 0.20;
  --_c-step-away-4: 0.22;
  --_c-shade-tint: var(--_c-step-away-2);

  --_h-step-away-1: 4; /*4;*/
  --_h-step-away-2: 6; /*6;*/
  --_h-step-away-3: 8; /*8;*/
  --_h-step-away-4: 10; /*10;*/
  --_h-shade-tint: var(--_h-step-away-2);

  --_l-1: var(--_l-step-away-4); /*97%; /*84%;*/
  --_l-2: var(--_l-step-away-3); /*89%; /*77%;*/
  --_l-3: var(--_l-step-away-2); /*80%; /*67%;*/
  --_l-4: var(--_l-step-away-1); /*71%; /*46%;*/
  --_l-5: 0; /*60%; /*32%;*/
  --_l-6: var(--_l-step-away-1); /*49%; /*14%;*/
  --_l-7: var(--_l-step-away-2); /*38%; /*8%;*/
  --_l-8: var(--_l-step-away-3); /*25%; /*4%;*/
  --_l-9: var(--_l-step-away-4); /*12%; /*2%*/

  /* .5 is generally the maximum */
  --_c-1: var(--_c-step-away-4);
  --_c-2: var(--_c-step-away-3);
  --_c-3: var(--_c-step-away-2);
  --_c-4: var(--_c-step-away-1);
  --_c-5: 0;
  --_c-6: var(--_c-step-away-1);
  --_c-7: var(--_c-step-away-2);
  --_c-8: var(--_c-step-away-3);
  --_c-9: var(--_c-step-away-4);

  /* red = 0deg, yellow = 60deg, green = 120deg, teal = 180deg, blue = 240deg, pink = 300deg */
  --_h-1: var(--_h-step-away-4);
  --_h-2: var(--_h-step-away-3);
  --_h-3: var(--_h-step-away-2);
  --_h-4: var(--_h-step-away-1);
  --_h-5: 0;
  --_h-6: var(--_h-step-away-1);
  --_h-7: var(--_h-step-away-2);
  --_h-8: var(--_h-step-away-3);
  --_h-9: var(--_h-step-away-4);
}