/* @import './mono.css'; */
:where(html) {
  /* Tetradic */
  --tetra-1-base: oklch(from var(--color-mono) l c calc(h + 90));
  --tetra-1-1: color-mix(in oklch, var(--tetra-1-base), white 40%); /* lightest */
  --tetra-1-2: color-mix(in oklch, var(--tetra-1-base), white 30%);
  --tetra-1-3: color-mix(in oklch, var(--tetra-1-base), white 20%);
  --tetra-1-4: color-mix(in oklch, var(--tetra-1-base), white 10%);
  --tetra-1-5: color-mix(in oklch, var(--tetra-1-base), white 0%);
  --tetra-1-6: color-mix(in oklch, var(--tetra-1-base), black 10%);
  --tetra-1-7: color-mix(in oklch, var(--tetra-1-base), black 20%);
  --tetra-1-8: color-mix(in oklch, var(--tetra-1-base), black 30%);
  --tetra-1-9: color-mix(in oklch, var(--tetra-1-base), black 40%); /* darkest */
  

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

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