/* @import './mono.css'; */
:where(html) {

  /* Triad */
  --triad-1-base: oklch(from var(--color-mono) l c calc(h - 120));
  --triad-1-1: color-mix(in oklch, var(--triad-1-base), white 40%); /* lightest */
  --triad-1-2: color-mix(in oklch, var(--triad-1-base), white 30%);
  --triad-1-3: color-mix(in oklch, var(--triad-1-base), white 20%);
  --triad-1-4: color-mix(in oklch, var(--triad-1-base), white 10%);
  --triad-1-5: color-mix(in oklch, var(--triad-1-base), white 0%);
  --triad-1-6: color-mix(in oklch, var(--triad-1-base), black 10%);
  --triad-1-7: color-mix(in oklch, var(--triad-1-base), black 20%);
  --triad-1-8: color-mix(in oklch, var(--triad-1-base), black 30%);
  --triad-1-9: color-mix(in oklch, var(--triad-1-base), black 40%); /* darkest */


  --triad-2-base: oklch(from var(--color-mono) l c calc(h + 120));
  --triad-2-1: color-mix(in oklch, var(--triad-2-base), white 40%); /* lightest */
  --triad-2-2: color-mix(in oklch, var(--triad-2-base), white 30%);
  --triad-2-3: color-mix(in oklch, var(--triad-2-base), white 20%);
  --triad-2-4: color-mix(in oklch, var(--triad-2-base), white 10%);
  --triad-2-5: color-mix(in oklch, var(--triad-2-base), white 0%);
  --triad-2-6: color-mix(in oklch, var(--triad-2-base), black 10%);
  --triad-2-7: color-mix(in oklch, var(--triad-2-base), black 20%);
  --triad-2-8: color-mix(in oklch, var(--triad-2-base), black 30%);
  --triad-2-9: color-mix(in oklch, var(--triad-2-base), black 40%); /* darkest */

}