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

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

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

}