/* @import "./palette-steps.css"; */

:where(html) {
  /* Blue/Cyan */
  /* --blue: #228BE6;
  --blue-1: hsl(from var(--blue) calc(l + var(--_l-1)) h calc(s + var(--_h-1))); 
  --blue-2: hsl(from var(--blue) calc(l + var(--_l-2)) h calc(s + var(--_h-2))); 
  --blue-3: hsl(from var(--blue) calc(l + var(--_l-3)) h calc(s + var(--_h-3))); 
  --blue-4: hsl(from var(--blue) calc(l + var(--_l-4)) h calc(s + var(--_h-4))); 
  --blue-5: var(--blue);
  --blue-6: oklch(from var(--blue) calc(l - var(--_l-6)) c calc(h - var(--_h-6))); 
  --blue-7: oklch(from var(--blue) calc(l - var(--_l-7)) c calc(h - var(--_h-7))); 
  --blue-8: oklch(from var(--blue) calc(l - var(--_l-8)) c calc(h - var(--_h-8)));   
  --blue-9: oklch(from var(--blue) calc(l - var(--_l-9)) c calc(h - var(--_h-9)));  */
  --blue: #228be6;
  --blue-1: #a5d8ff;
  --blue-2: #74c0fc;
  --blue-3: #4dabf7;
  --blue-4: #339af0;
  --blue-5: var(--blue);
  --blue-6: #1971c2;
  --blue-7: #1864ab;
  --blue-8: #145591;
  --blue-9: #114678;
  --blue-contrast: var(--white); /*color-contrast(var(--blue) vs var(--white), var(--black));*/
  --blue-shade: var(--blue-7);
  --blue-tint: var(--blue-3);
  /* --blue-3: #63b3ed;
  --blue-5: #4299e1;
  --blue-7: #3182ce;
  --blue: var(--blue-5); */
}