@layer ed-color-variant {
  :where(:root) {
    --ed-color-brand-10: var(--ed-color-petrol-10);
    --ed-color-brand-20: var(--ed-color-petrol-20);
    --ed-color-brand-30: var(--ed-color-petrol-30);
    --ed-color-brand-40: var(--ed-color-petrol-40);
    --ed-color-brand-50: var(--ed-color-petrol-50);
    --ed-color-brand-60: var(--ed-color-petrol-60);
    --ed-color-brand-70: var(--ed-color-petrol-70);
    --ed-color-brand-80: var(--ed-color-petrol-80);
    --ed-color-brand-90: var(--ed-color-petrol-90);
    --ed-color-brand-100: var(--ed-color-petrol-100);
    --ed-color-brand-110: var(--ed-color-petrol-110);
    --ed-color-brand-120: var(--ed-color-petrol-120);
    --ed-color-brand-130: var(--ed-color-petrol-130);
    --ed-color-brand-140: var(--ed-color-petrol-140);
    --ed-color-brand-150: var(--ed-color-petrol-150);
    --ed-color-brand-160: var(--ed-color-petrol-160);
    --ed-color-brand-170: var(--ed-color-petrol-170);
    --ed-color-brand-180: var(--ed-color-petrol-180);
    --ed-color-brand-190: var(--ed-color-petrol-190);
    --ed-color-brand-200: var(--ed-color-petrol-200);
    --ed-color-brand-210: var(--ed-color-petrol-210);
    --ed-color-brand-220: var(--ed-color-petrol-220);
    --ed-color-brand-230: var(--ed-color-petrol-230);
    --ed-color-brand-240: var(--ed-color-petrol-240);
    --ed-color-brand-250: var(--ed-color-petrol-250);
    --ed-color-brand-260: var(--ed-color-petrol-260);
    --ed-color-brand-270: var(--ed-color-petrol-270);
    --ed-color-brand-280: var(--ed-color-petrol-280);
    --ed-color-brand-290: var(--ed-color-petrol-290);
  }
}
