:root {
  --white: #fff;
  --white70a: rgba(255, 255, 255, 0.7);

  --gray90: #333;
  --gray90a: rgba(0, 0, 0, 0.8);
  --gray80: #4c4c4c;
  --gray80a: rgba(0, 0, 0, 0.7);
  --gray60: #7b7b7b;
  --gray60a: rgba(0, 0, 0, 0.52);
  --gray50: #adadad;
  --gray50a: rgba(0, 0, 0, 0.32);
  --gray40: #ccc;
  --gray40a: rgba(0, 0, 0, 0.2);
  --gray35a: rgba(0, 0, 0, 0.15);
  --gray30: #ebebee;
  --gray30a: rgba(0, 0, 0, 0.08);
  --gray20: #f5f5f5;
  --gray20a: rgba(0, 0, 0, 0.04);
  --gray5a: rgba(0, 0, 0, 0.01);

  --dark90: #2e3c56;
  --dark50: #b6bbc4;
  --dark35: #dadde1;
  --dark30: #eaecee;
  --dark30a: rgba(46, 60, 86, 0.1);
  --dark20: #f0f1f3;
  --dark20a: rgba(46, 60, 86, 0.07);
  --dark10: #f9f9fa;
  --dark10a: rgba(46, 60, 86, 0.03);

  --navy90: #153b64;
  --navy80: #26496F;
  --navy70: #38587b;
  --navy60: #607995;
  --navy50: #98a8ba;
  --navy40: #c9d2db;
  --navy35: #dae0e7;
  --navy30: #e9ecf1;

  --red80: #a10000;
  --red70: #cf0000;
  --red60: #f13333;
  --red50: #f89999;
  --red50a: rgba(241, 51, 51, 0.5);
  --red40: #facccc;
  --red30: #fddedf;
  --red20: #ffebec;
  --red10: #fff5f5;

  --salmon80: #a03416;
  --salmon60: #f65022;
  --salmon50: #fdaa9f;

  --peach60: #fa6c11;
  --peach50: #ffbf99;

  --orange90: #ffe7cc;
  --orange80: #cc6c00;
  --orange70: #e57a00;
  --orange60: #ff8800;
  --orange55: #FFA744;
  --orange50: #ffc788;
  --orange50a: rgba(255, 136, 0, 0.47);
  --orange40: #ffdbb3;
  --orange40a: rgba(255, 136, 0, 0.3);
  --orange20: #fff3e6;
  --orange20a: rgba(255, 136, 0, 0.1);

  --melon60: #fdab06;
  --melon50: #ffda8a;

  --yellow80: #bf9c00;
  --yellow70: #ddb507;
  --yellow60: #face0d;
  --yellow50: #fcdf62;
  --yellow40: #fce892;
  --yellow20: #fdf5cf;

  --pear60: #cbc521;
  --pear50: #e8e699;

  --iris60: #7362BF;

  --wasabi60: #92bb39;
  --wasabi50: #d2e3ab;
  --wasabi80: #577710;

  --grass60: #5cb14f;
  --grass55: #94ce92;
  --grass50: #b2ddb6;

  --green80: #006330;
  --green70: #008a43;
  --green60: #27a765;
  --green50: #8ad0ab;
  --green50a: rgba(39, 167, 101, 0.53);
  --green40: #c1e8d4;
  --green30: #d7f2e4;
  --green20: #e7faf0;
  --green20a: rgba(11, 203, 104, 0.1);
  --green10: #f3fcf8;

  --blue90: #1F5687;
  --blue80: #25659f;
  --blue70: #2a73b8;
  --blue60: #3288d7;
  --blue55: #6caae2;
  --blue50: #a7ccee;
  --blue50a: rgba(50, 136, 215, 0.43);
  --blue40: #cce1f5;
  --blue30: #D9EBFA;
  --blue20: #e5f2fc;
  --blue20a: rgba(16, 137, 249, 0.11);
  --blue10: #f5fafe;

  --violet80: #6a3772;
  --violet60: #984ea3;
  --violet50: #d1afd6;
  --violet40: #e5d3e8;
  --violet20: #f2eaf4;

  --pink60: #D95090;
  --pink55: #E485B1;

  --beige80: #8b6944;
  --beige70: #ba9369;
  --beige60: #ccaf8f;
  --beige50: #ebcaa5;
  --beige30: #f3dfc9;

  --cobalt90: #001836;
  --cobalt80: #00306a;
  --cobalt70: #00479e;
  --cobalt60: #1968BA;

  --facebook60: #1164bb;
  --facebook50: #70a2d6;

  --pinterest60: #bd081c;
  --pinterest50: #d76b77;

  --perplexity60: #22808D;

  --linkedin60: #0077b5;
  --linkedin50: #4da0cb;

  --twitterx60: rgba(0, 0, 0, 1);
  --instagram60: rgba(255, 0, 118, 1);
  --threads60: rgba(0, 0, 0, 1);
  /* text */
  --text--primary: var(--gray90);
  --text--secondary: var(--gray60a);
  --text--tertiary: var(--gray50a);
  --text--dark: var(--dark90);

  --text--accent: var(--orange60);

  --text--danger: var(--red60);
  --text--dangerContrast: var(--red70);

  --text--success: var(--green60);
  --text--successContrast: var(--green70);

  --text--warning: var(--yellow60);
  --text--warningContrast: var(--yellow80);

  --text--info: var(--blue60);
  --text--debug: var(--violet60);

  --text--link: var(--cobalt70);
  --text--url: var(--green70);

  --text--badgeBlack: var(--gray90);

  --text--twitter: var(--twitter60);
  --text--facebook: var(--facebook60);
  --text--pinterest: var(--pinterest60);
  --text--linkedin: var(--linkedin60);

  --text--perplexity: var(--perplexity60);

  --text--iconFill: var(--gray35a);
  --text--lightIconFill: var(--white);

  /* border */
  --border--line: var(--gray30);
  --border--lineAlpha: var(--gray30a);
  --border--controlDisabled: var(--dark35);

  --border--control: var(--gray40);
  --border--controlAlpha: var(--gray40a);
  --border--controlHover: var(--gray50);
  --border--controlHoverAlpha: var(--gray50a);

  --border--selected: var(--beige50);
  --border--selectedHover: var(--beige60);
  --border--selectedActive: var(--beige70);
  --border--selectedMuted: var(--beige30);

  --border--accent: var(--orange60);

  --border--danger: var(--red60);
  --border--dangerMuted: var(--red40);
  --border--dangerMutedHover: var(--red50);

  --border--success: var(--green60);
  --border--warning: var(--yellow60);
  --border--info: var(--blue60);

  --border--linkBase: var(--blue50a);
  --border--linkNeutral: var(--gray50a);
  --border--linkMuted: var(--gray40a);
  --border--linkSuccess: var(--green50a);
  --border--linkDanger: var(--red50a);
  --border--linkWarning: var(--yellow70);
  --border--linkAccent: var(--orange50a);
  --border--linkUrl: var(--green50a);
  --border--avatar: var(--white);

  /* background */
  --background--page: var(--dark30);
  --background--box: var(--white);
  --background--controlDisabled: var(--dark20);
  --background--controlDisabledAlpha: var(--dark20a);
  --background--boxDark: var(--dark10);
  --background--boxDarkAlpha: var(--dark10a);
  --background--boxDarker: var(--dark20);
  --background--negative: var(--gray90);

  --background--overlay: var(--gray60a);
  --background--overlayDark: var(--gray90a);
  --background--overlayBox: var(--white70a);

  --background--neutral: var(--gray60);
  --background--controlHover: var(--gray20a);
  --background--controlHoverMuted: var(--dark10);
  --background--boxHover: var(--dark10a);
  --background--sidebarItemHover: var(--dark10a);
  --background--controlActive: var(--gray40a);
  --background--checkboxHover: var(--dark30a);
  --background--checkboxActive: var(--gray40a);
  --background--favicon: var(--dark30);
  --background--sidebarItemSelected: var(--dark20a);
  --background--neutralMidMuted: var(--gray30);
  --background--neutralMidMutedAlpha: var(--gray30a);
  --background--code: var(--gray20);
  --background--codeAlpha: var(--gray20a);

  --background--knob: var(--white);
  --background--track: var(--gray40a);
  --background--trackHover: var(--gray50a);

  --background--accent: var(--orange60);
  --background--accentHover: var(--orange70);
  --background--accentActive: var(--orange80);
  --background--accentMidMuted: var(--orange40);
  --background--accentMuted: var(--orange20);
  --background--accentUnderMuted: var(--orange90);

  --background--selected: var(--orange40);
  --background--selectedActive: var(--orange50);
  --background--selectedMuted: var(--orange20);
  --background--selectedMutedAlpha: var(--orange20a);

  --background--danger: var(--red60);
  --background--dangerHover: var(--red70);
  --background--dangerActive: var(--red80);
  --background--dangerMidMuted: var(--red40);
  --background--dangerMuted: var(--red20);
  --background--dangerHardMuted: var(--red10);
  --background--dangerNofillHover: var(--red20);
  --background--dangerNofillActive: var(--red40);

  --background--success: var(--green60);
  --background--successHover: var(--green70);
  --background--successMidMuted: var(--green40);
  --background--successMuted: var(--green20);
  --background--successHardMuted: var(--green10);

  --background--warning: var(--yellow60);
  --background--warningMidMuted: var(--yellow40);
  --background--warningMuted: var(--yellow20);

  --background--info: var(--blue60);
  --background--infoMidMuted: var(--blue40);
  --background--infoMuted: var(--blue20);

  --background--twitter: var(--twitter60);
  --background--twitterx: var(--twitterx60);
  --background--threads: var(--threads60);
  --background--facebook: var(--facebook60);
  --background--pinterest: var(--pinterest60);
  --background--linkedin: var(--linkedin60);
  --background--instagram: var(--instagram60);
  --background--avatar1: var(--red60);
  --background--avatar2: var(--orange60);
  --background--avatar3: var(--yellow60);
  --background--avatar4: var(--wasabi60);
  --background--avatar5: var(--green60);
  --background--avatar6: var(--blue60);
  --background--avatar7: var(--cobalt60);
  --background--avatar8: var(--violet60);
  --background--avatar9: var(--beige60);
  --background--avatar10: var(--red70);
  --background--avatar11: var(--orange70);
  --background--avatar12: var(--green70);
  --background--avatar13: var(--cobalt70);
  --background--avatar14: var(--red80);
  --background--avatar15: var(--orange80);
  --background--avatar16: var(--yellow80);
  --background--avatar17: var(--wasabi80);
  --background--avatar18: var(--green80);
  --background--avatar19: var(--blue80);
  --background--avatar20: var(--violet80);
  --background--avatar21: var(--beige80);
  --background--avatar--empty: var(--dark30);

  --background--stripesGray: var(--gray30a);
  --background--stripesGrayToWhite: var(--gray30a);
  --background--stripesRed: var(--red20);

  /* shadow */
  --shadow--elevation1: var(--gray5a);
  --shadow--elevation1Bottom: var(--gray20a);
  --shadow--elevation2: var(--gray30a);
  --shadow--elevation3: var(--gray35a);

  --shadow--border: var(--gray30a);

  /* chart */
  --chart--empty: var(--dark30);
  --chart--line: var(--gray30a);
  --chart--caption: var(--gray50a);

  --chart--black: var(--gray90);

  --chart--gray: var(--gray60);
  --chart--grayContrast: var(--gray80);
  --chart--grayContrastAlpha: var(--gray80a);
  --chart--grayMidMuted: var(--gray50);
  --chart--grayMidMutedAlpha: var(--gray50a);
  --chart--grayMuted: var(--gray40);
  --chart--grayBg: var(--gray20);
  --chart--grayBgAlpha: var(--gray20a);

  --chart--darkContrast: var(--dark80);
  --chart--dark: var(--dark60);
  --chart--darkMidMuted: var(--dark50);
  --chart--darkHardMuted: var(--dark30);

  --chart--blue: var(--blue60);
  --chart--blueSoftMuted: var(--blue55);
  --chart--blueMidMuted: var(--blue50);
  --chart--blueMuted: var(--blue40);
  --chart--blueHardMuted: var(--blue30);
  --chart--blueBg: var(--blue20);
  --chart--blueBgAlpha: var(--blue20a);
  --chart--blueMutedBg: var(--blue10);
  --chart--blueMidContrast: var(--blue70);
  --chart--blueContrast: var(--blue80);
  --chart--blueHardContrast: var(--blue90);

  --chart--orange: var(--orange60);
  --chart--orangeSoftMuted: var(--orange55);
  --chart--orangeMidMuted: var(--orange50);
  --chart--orangeMuted: var(--orange40);
  --chart--orangeContrast: var(--orange80);
  --chart--orangeBg: var(--orange20);
  --chart--orangeBgAlpha: var(--orange20a);

  --chart--melon: var(--melon60);

  --chart--pear: var(--pear60);

  --chart--iris: var(--iris60);

  --chart--wasabi: var(--wasabi60);
  --chart--wasabiMidMuted: var(--wasabi50);

  --chart--grass: var(--grass60);
  --chart--grassSoftMuted: var(--grass55);

  --chart--green: var(--green60);
  --chart--greenMidMuted: var(--green50);
  --chart--greenMuted: var(--green40);
  --chart--greenHardMuted: var(--green30);
  --chart--greenBg: var(--green20);
  --chart--greenBgAlpha: var(--green20a);
  --chart--greenMutedBg: var(--green10);
  --chart--greenMidContrast: var(--green70);
  --chart--greenContrast: var(--green80);

  --chart--red: var(--red60);
  --chart--redMidMuted: var(--red50);
  --chart--redMuted: var(--red40);
  --chart--redHardMuted: var(--red30);
  --chart--redBg: var(--red20);
  --chart--redMutedBg: var(--red10);
  --chart--redMidContrast: var(--red70);
  --chart--redContrast: var(--red80);

  --chart--salmon: var(--salmon60);
  --chart--salmonContrast: var(--salmon80);

  --chart--peach: var(--peach60);

  --chart--violet: var(--violet60);
  --chart--violetMidMuted: var(--violet50);
  --chart--violetMuted: var(--violet40);
  --chart--violetContrast: var(--violet80);

  --chart--pink: var(--pink55);

  --chart--yellow: var(--yellow60);
  --chart--yellowMidMuted: var(--yellow50);
  --chart--yellowMuted: var(--yellow40);
  --chart--yellowContrast: var(--yellow80);

  --chart--navy: var(--navy60);
  --chart--navyMidMuted: var(--navy50);
  --chart--navyMuted: var(--navy40);
  --chart--navySemihardMuted: var(--navy35);
  --chart--navyHardMuted: var(--navy30);
  --chart--navyContrast: var(--navy80);

  --chart--beige: var(--beige60);
  --chart--beigeMidMuted: var(--beige50);

  --chart--cobalt: var(--cobalt60);
  --chart--cobaltMidContrast: var(--cobalt70);
  --chart--cobaltContrast: var(--cobalt80);
  --chart--cobaltHardContrast: var(--cobalt90);

  --chart--kd1: var(--green50);
  --chart--kd2: var(--grass50);
  --chart--kd3: var(--wasabi50);
  --chart--kd4: var(--pear50);
  --chart--kd5: var(--yellow40);
  --chart--kd6: var(--melon50);
  --chart--kd7: var(--orange50);
  --chart--kd8: var(--peach50);
  --chart--kd9: var(--salmon50);
  --chart--kd10: var(--red50);

  --image--gray1: var(--gray30a);
  --image--gray2: var(--gray40a);
  --image--gray3: var(--gray50a);
  --image--gray4: var(--gray60a);
  --image--black: var(--gray90);
  --image--orange1: var(--orange30a);
  --image--orange2: var(--orange55);
  --image--orange3: var(--orange70);
  --image--yellow: var(--yellow60);
  --image--wasabi: var(--wasabi60);

  /* alternative */
  --alt-dark90: #2e3c56;
  --alt-white: #fff;
  --alt-white70a: rgba(255, 255, 255, 0.7);
  --alt-white40a: rgba(255, 255, 255, 0.3);
  --alt-white35a: rgba(255, 255, 255, 0.2);
  --alt-white30a: rgba(255, 255, 255, 0.15);
  --alt-white20a: rgba(255, 255, 255, 0.1);
  --alt-white10: #434F67;
  --alt-white10a: rgba(255, 255, 255, 0.08);
  --alt-yellow: #fce892;
  --alt-green: #36d984;
  --alt-violet: #db95e5;

  /* alternative: text */
  --alt-text--primary: var(--alt-white);
  --alt-text--secondary: var(--alt-white70a);
  --alt-text--tertiary: var(--alt-white40a);
  --alt-text--negative: var(--alt-white);
  --alt-text--onBrightBg: var(--alt-white);

  --alt-text--operator: var(--alt-yellow);
  --alt-text--combinator: var(--alt-green);
  --alt-text--field: var(--alt-violet);

  /* alternative: border */
  --alt-border--line: var(--alt-white20a);
  --alt-border--controlDisabled: var(--alt-white20a);
  --alt-border--control: var(--alt-white40a);
  --alt-border--controlHover: var(--alt-white70a);
  --alt-border--linkMuted: var(--alt-white35a);
  --alt-border--linkAccent: var(--alt-white40a);

  /* alternative: background */
  --alt-background--box: var(--alt-dark90);
  --alt-background--control: var(--alt-white30a);
  --alt-background--controlHover: var(--alt-white35a);
  --alt-background--controlActive: var(--alt-white40a);
  --alt-background--neutralMuted: var(--alt-white10a);
  --alt-background--controlDisabled: var(--alt-white10);
  --alt-background--controlDisabledAlpha: var(--alt-white10a);
  --alt-background--boxHover: var(--alt-white10a);
  --alt-background--badgeWhite: var(--alt-white);
  --alt-background--stripesWhite: var(--alt-white30a);
  --alt-background--stripesWhiteToGray: var(--alt-white30a);

  /* keywords explorer */
  --ke-empty--gradient: url('#gradient-light');
  --ke-difficulty-gradient-stroke: url("#gradient-difficulty-stroke");
  --ke-difficulty-gradient-fill: url("#gradient-difficulty-fill");
  --ke-volume-gradient-fill: url("#gradient-volume-fill");
  --ke-volume-gradient-forecast-fill: url("#ke-volume-gradient-forecast-fill");

  --exports-background: rgba(55, 157, 228, .08);
  --exports-background-hover: rgba(55, 157, 228, .12);
}
