:root, .light, .light-theme {
  --gold-1: #fdfdfc;
  --gold-2: #faf9f2;
  --gold-3: #f2f0e7;
  --gold-4: #eae6db;
  --gold-5: #e1dccf;
  --gold-6: #d8d0bf;
  --gold-7: #cbc0aa;
  --gold-8: #b9a88d;
  --gold-9: #978365;
  --gold-10: #8c7a5e;
  --gold-11: #71624b;
  --gold-12: #3b352b;
  --gold-a1: #55550003;
  --gold-a2: #9d8a000d;
  --gold-a3: #75600018;
  --gold-a4: #6b4e0024;
  --gold-a5: #60460030;
  --gold-a6: #64440040;
  --gold-a7: #63420055;
  --gold-a8: #633d0072;
  --gold-a9: #5332009a;
  --gold-a10: #492d00a1;
  --gold-a11: #362100b4;
  --gold-a12: #130c00d4;
  --gold-surface: #f9f8efcc;
  --gold-indicator: var(--gold-9);
  --gold-track: var(--gold-9);
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    :root, .light, .light-theme {
      --gold-1: color(display-p3 .992 .992 .989);
      --gold-2: color(display-p3 .98 .976 .953);
      --gold-3: color(display-p3 .947 .94 .909);
      --gold-4: color(display-p3 .914 .904 .865);
      --gold-5: color(display-p3 .88 .865 .816);
      --gold-6: color(display-p3 .84 .818 .756);
      --gold-7: color(display-p3 .788 .753 .677);
      --gold-8: color(display-p3 .715 .66 .565);
      --gold-9: color(display-p3 .579 .517 .41);
      --gold-10: color(display-p3 .538 .479 .38);
      --gold-11: color(display-p3 .433 .386 .305);
      --gold-12: color(display-p3 .227 .209 .173);
      --gold-a1: color(display-p3 .349 .349 .024 / .012);
      --gold-a2: color(display-p3 .592 .514 .024 / .048);
      --gold-a3: color(display-p3 .4 .357 .012 / .091);
      --gold-a4: color(display-p3 .357 .298 .008 / .134);
      --gold-a5: color(display-p3 .345 .282 .004 / .185);
      --gold-a6: color(display-p3 .341 .263 .004 / .244);
      --gold-a7: color(display-p3 .345 .235 .004 / .322);
      --gold-a8: color(display-p3 .345 .22 .004 / .436);
      --gold-a9: color(display-p3 .286 .18 0 / .589);
      --gold-a10: color(display-p3 .255 .161 0 / .62);
      --gold-a11: color(display-p3 .433 .386 .305);
      --gold-a12: color(display-p3 .227 .209 .173);
      --gold-surface: color(display-p3 .9765 .9725 .9412 / .8);
    }
  }
}

.dark, .dark-theme {
  --gold-1: #121211;
  --gold-2: #1b1a17;
  --gold-3: #24231f;
  --gold-4: #2d2b26;
  --gold-5: #38352e;
  --gold-6: #444039;
  --gold-7: #544f46;
  --gold-8: #696256;
  --gold-9: #978365;
  --gold-10: #a39073;
  --gold-11: #cbb99f;
  --gold-12: #e8e2d9;
  --gold-a1: #91911102;
  --gold-a2: #f9e29d0b;
  --gold-a3: #f8ecbb15;
  --gold-a4: #ffeec41e;
  --gold-a5: #feecc22a;
  --gold-a6: #feebcb37;
  --gold-a7: #ffedcd48;
  --gold-a8: #fdeaca5f;
  --gold-a9: #ffdba690;
  --gold-a10: #fedfb09d;
  --gold-a11: #fee7c6c8;
  --gold-a12: #fef7ede7;
  --gold-surface: #25231d80;
  --gold-indicator: var(--gold-9);
  --gold-track: var(--gold-9);
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    .dark, .dark-theme {
      --gold-1: color(display-p3 .071 .071 .067);
      --gold-2: color(display-p3 .104 .101 .09);
      --gold-3: color(display-p3 .141 .136 .122);
      --gold-4: color(display-p3 .177 .17 .152);
      --gold-5: color(display-p3 .217 .207 .185);
      --gold-6: color(display-p3 .265 .252 .225);
      --gold-7: color(display-p3 .327 .31 .277);
      --gold-8: color(display-p3 .407 .384 .342);
      --gold-9: color(display-p3 .579 .517 .41);
      --gold-10: color(display-p3 .628 .566 .463);
      --gold-11: color(display-p3 .784 .728 .635);
      --gold-12: color(display-p3 .906 .887 .855);
      --gold-a1: color(display-p3 .855 .855 .071 / .005);
      --gold-a2: color(display-p3 .98 .89 .616 / .043);
      --gold-a3: color(display-p3 1 .949 .753 / .08);
      --gold-a4: color(display-p3 1 .933 .8 / .118);
      --gold-a5: color(display-p3 1 .949 .804 / .16);
      --gold-a6: color(display-p3 1 .925 .8 / .215);
      --gold-a7: color(display-p3 1 .945 .831 / .278);
      --gold-a8: color(display-p3 1 .937 .82 / .366);
      --gold-a9: color(display-p3 .996 .882 .69 / .551);
      --gold-a10: color(display-p3 1 .894 .725 / .601);
      --gold-a11: color(display-p3 .784 .728 .635);
      --gold-a12: color(display-p3 .906 .887 .855);
      --gold-surface: color(display-p3 .1412 .1333 .1098 / .5);
    }
  }
}

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