:root {
  --background: #161c24;
  --background-btn: #2d333b;
  --foreground: #e4e6eb;
  --primary: #f0f0f0;
  --secondary: #161c24;
  --grey-160: #6c727829;
  --grey-240: #6c72783d;
  --grey-300: #6c727852;
  --grey-320: #919eab29;
  --input-background: #212b36;
  --aside-background: #212b36;
  --overlay-background: #000000b3;
  --promo-accent: #23e98a;
  --green: #2bfd98;
  --black: #212b36;
  --white: #ffffff;
  --grey: #637381;
  --disabled: #919eab;
  --red: #ff3e3e;
  --text-primary: #212b36;
  --purple: #b14ef0;
  --promo-highlight: #ff6b6b;
  --promo-code: #ffffff;
  --promo-border: rgba(177, 78, 240, 0.5);
  --panel: #121925;
  --line-strong: rgba(255, 255, 255, 0.14);
  --brand-green: #23e98a;
  --brand-red: #e74c5f;
  --gray-bright: #b9c0cb;
  --gray-soft: #6f7886;
  --panel-2: #161e2c;
}

html.light {
  --background: #ffffff;
  --background-btn: #161c24;
  --foreground: #212b36;
  --primary: #212b36;
  --secondary: #ffffff;
  --grey-160: #919eab29;
  --grey-240: #919eab3d;
  --grey-300: #919eab52;
  --grey-320: #f4f6f8;
  --input-background: #fff;
  --aside-background: #fff;
  --overlay-background: #00000080;
  --promo-accent: #059669;
  --gray-bright: #3d4552;
  --gray-soft: #8b95a3;
  --panel-2: #eef1f6;
}