:root, .light, .light-theme {
  --red-1: #fffcfc;
  --red-2: #fff7f7;
  --red-3: #feebec;
  --red-4: #ffdbdc;
  --red-5: #ffcdce;
  --red-6: #fdbdbe;
  --red-7: #f4a9aa;
  --red-8: #eb8e90;
  --red-9: #e5484d;
  --red-10: #dc3e42;
  --red-11: #ce2c31;
  --red-12: #641723;
  --red-a1: #ff000003;
  --red-a2: #ff000008;
  --red-a3: #f3000d14;
  --red-a4: #ff000824;
  --red-a5: #ff000632;
  --red-a6: #f8000442;
  --red-a7: #df000356;
  --red-a8: #d2000571;
  --red-a9: #db0007b7;
  --red-a10: #d10005c1;
  --red-a11: #c40006d3;
  --red-a12: #55000de8;
  --red-surface: #fff5f5cc;
  --red-indicator: var(--red-9);
  --red-track: var(--red-9);
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    :root, .light, .light-theme {
      --red-1: color(display-p3 .998 .989 .988);
      --red-2: color(display-p3 .995 .971 .971);
      --red-3: color(display-p3 .985 .925 .925);
      --red-4: color(display-p3 .999 .866 .866);
      --red-5: color(display-p3 .984 .812 .811);
      --red-6: color(display-p3 .955 .751 .749);
      --red-7: color(display-p3 .915 .675 .672);
      --red-8: color(display-p3 .872 .575 .572);
      --red-9: color(display-p3 .83 .329 .324);
      --red-10: color(display-p3 .798 .294 .285);
      --red-11: color(display-p3 .744 .234 .222);
      --red-12: color(display-p3 .36 .115 .143);
      --red-a1: color(display-p3 .675 .024 .024 / .012);
      --red-a2: color(display-p3 .863 .024 .024 / .028);
      --red-a3: color(display-p3 .792 .008 .008 / .075);
      --red-a4: color(display-p3 1 .008 .008 / .134);
      --red-a5: color(display-p3 .918 .008 .008 / .189);
      --red-a6: color(display-p3 .831 .02 .004 / .251);
      --red-a7: color(display-p3 .741 .016 .004 / .33);
      --red-a8: color(display-p3 .698 .012 .004 / .428);
      --red-a9: color(display-p3 .749 .008 0 / .675);
      --red-a10: color(display-p3 .714 .012 0 / .714);
      --red-a11: color(display-p3 .744 .234 .222);
      --red-a12: color(display-p3 .36 .115 .143);
      --red-surface: color(display-p3 .9961 .9647 .9647 / .8);
    }
  }
}

.dark, .dark-theme {
  --red-1: #191111;
  --red-2: #201314;
  --red-3: #3b1219;
  --red-4: #500f1c;
  --red-5: #611623;
  --red-6: #72232d;
  --red-7: #8c333a;
  --red-8: #b54548;
  --red-9: #e5484d;
  --red-10: #ec5d5e;
  --red-11: #ff9592;
  --red-12: #ffd1d9;
  --red-a1: #f4121209;
  --red-a2: #f22f3e11;
  --red-a3: #ff173f2d;
  --red-a4: #fe0a3b44;
  --red-a5: #ff204756;
  --red-a6: #ff3e5668;
  --red-a7: #ff536184;
  --red-a8: #ff5d61b0;
  --red-a9: #fe4e54e4;
  --red-a10: #ff6465eb;
  --red-a11: #ff9592;
  --red-a12: #ffd1d9;
  --red-surface: #2f151780;
  --red-indicator: var(--red-9);
  --red-track: var(--red-9);
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    .dark, .dark-theme {
      --red-1: color(display-p3 .093 .068 .067);
      --red-2: color(display-p3 .118 .077 .079);
      --red-3: color(display-p3 .211 .081 .099);
      --red-4: color(display-p3 .287 .079 .113);
      --red-5: color(display-p3 .348 .11 .142);
      --red-6: color(display-p3 .414 .16 .183);
      --red-7: color(display-p3 .508 .224 .236);
      --red-8: color(display-p3 .659 .298 .297);
      --red-9: color(display-p3 .83 .329 .324);
      --red-10: color(display-p3 .861 .403 .387);
      --red-11: color(display-p3 1 .57 .55);
      --red-12: color(display-p3 .971 .826 .852);
      --red-a1: color(display-p3 .984 .071 .071 / .03);
      --red-a2: color(display-p3 .996 .282 .282 / .055);
      --red-a3: color(display-p3 1 .169 .271 / .156);
      --red-a4: color(display-p3 1 .118 .267 / .236);
      --red-a5: color(display-p3 1 .212 .314 / .303);
      --red-a6: color(display-p3 1 .318 .38 / .374);
      --red-a7: color(display-p3 1 .4 .424 / .475);
      --red-a8: color(display-p3 1 .431 .431 / .635);
      --red-a9: color(display-p3 1 .388 .384 / .82);
      --red-a10: color(display-p3 1 .463 .447 / .853);
      --red-a11: color(display-p3 1 .57 .55);
      --red-a12: color(display-p3 .971 .826 .852);
      --red-surface: color(display-p3 .1647 .0863 .0863 / .5);
    }
  }
}

:root {
  --red-contrast: white;
}