/* stylelint-disable color-hex-length */

:root {
  --white: #ffffff;
  --black: #111111;
  /* Deprecated background aliases kept while product packages migrate. */
  --background-primary: var(--background);
  --background-secondary: var(--surface);
  /* Deprecated aliases kept for Mini Apps until they migrate to --primary-*. */
  --elevation-90: var(--primary-90);
  --elevation-80: var(--primary-80);
  --elevation-70: var(--primary-70);
  --elevation-60: var(--primary-60);
  --elevation-50: var(--primary-50);
  --elevation-40: var(--primary-40);
  --elevation-30: var(--primary-30);
  --elevation-20: var(--primary-20);
  --elevation-10: var(--primary-10);
  --elevation-5: var(--primary-5);
  --elevation-4: var(--primary-4);
  --avatar-red-top: #ff885e;
  --avatar-red-bottom: #ff516a;
  --avatar-red-gradient: linear-gradient(180deg, #ff885e 0%, #ff516a 100%);
  --avatar-orange-top: #ffcd6a;
  --avatar-orange-bottom: #ffa85c;
  --avatar-orange-gradient: linear-gradient(
    180deg,
    #ffcd6a 0%,
    #ffa85c 100%
  );
  --avatar-purple-top: #82b1ff;
  --avatar-purple-bottom: #665fff;
  --avatar-purple-gradient: linear-gradient(
    180deg,
    #82b1ff 0%,
    #665fff 100%
  );
  --avatar-green-top: #a0de7e;
  --avatar-green-bottom: #54cb68;
  --avatar-green-gradient: linear-gradient(180deg, #a0de7e 0%, #54cb68 100%);
  --avatar-cyan-top: #53edd6;
  --avatar-cyan-bottom: #28c9b7;
  --avatar-cyan-gradient: linear-gradient(180deg, #53edd6 0%, #28c9b7 100%);
  --avatar-blue-top: #72d5fd;
  --avatar-blue-bottom: #2a9ef1;
  --avatar-blue-gradient: linear-gradient(180deg, #72d5fd 0%, #2a9ef1 100%);
  --avatar-pink-top: #e0a2f3;
  --avatar-pink-bottom: #d669ed;
  --avatar-pink-gradient: linear-gradient(180deg, #e0a2f3 0%, #d669ed 100%);
}

:root,
:where([data-color-scheme="light"]) {
  --accent-red: #e36c5a;
  --accent-red-background: #fef1ee;
  --accent-brown: #d79e57;
  --accent-brown-background: #fbf3ea;
  --accent-yellow: #e6bd1f;
  --accent-yellow-background: #fdf7e4;
  --accent-green: #5ec257;
  --accent-green-background: #eff7ee;
  --accent-teal: #5cb8a0;
  --accent-teal-background: #eaf8f3;
  --accent-cyan: #59afc7;
  --accent-cyan-background: #eaf7fb;
  --accent-blue: #4c92de;
  --accent-blue-background: #edf5fe;
  --accent-indigo: #6d81dd;
  --accent-indigo-background: #f0f4ff;
  --accent-pink: #e45cd6;
  --accent-pink-background: #fbf1f9;
  --background: #ffffff;
  --elevation-1: #ffffff;
  --elevation-2: #ffffff;
  --surface: #f5f5f5;
  --primary: #111111;
  --primary-90: #111111e6;
  --primary-80: #111111cc;
  --primary-70: #111111b3;
  --primary-60: #11111199;
  --primary-50: #11111180;
  --primary-40: #11111166;
  --primary-30: #1111114d;
  --primary-20: #11111133;
  --primary-10: #1111111a;
  --primary-8: #11111114;
  --primary-5: #1111110d;
  --primary-4: #1111110a;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-color-scheme="light"]) {
    --accent-red: #e29183;
    --accent-red-background: #31201d;
    --accent-brown: #e8b577;
    --accent-brown-background: #2e2317;
    --accent-yellow: #e5c346;
    --accent-yellow-background: #2A230F;
    --accent-green: #76d76f;
    --accent-green-background: #1e291d;
    --accent-teal: #75cdb4;
    --accent-teal-background: #172a24;
    --accent-cyan: #72c4db;
    --accent-cyan-background: #15282e;
    --accent-blue: #77a7dd;
    --accent-blue-background: #1c2632;
    --accent-indigo: #8899db;
    --accent-indigo-background: #212433;
    --accent-pink: #e48cd8;
    --accent-pink-background: #2d202b;
    --background: #111111;
    --elevation-1: #1d1d1d;
    --elevation-2: #282828;
    --surface: #111111;
    --primary: #ffffff;
    --primary-90: #ffffffe6;
    --primary-80: #ffffffcc;
    --primary-70: #ffffffb3;
    --primary-60: #ffffff99;
    --primary-50: #ffffff80;
    --primary-40: #ffffff66;
    --primary-30: #ffffff4d;
    --primary-20: #ffffff33;
    --primary-10: #ffffff1a;
    --primary-8: #ffffff14;
    --primary-5: #ffffff0d;
    --primary-4: #ffffff0a;
  }
}

:root[data-color-scheme="dark"],
:where([data-color-scheme="dark"]) {
  --accent-red: #e29183;
  --accent-red-background: #31201d;
  --accent-brown: #e8b577;
  --accent-brown-background: #2e2317;
  --accent-yellow: #e5c346;
  --accent-yellow-background: #2A230F;
  --accent-green: #76d76f;
  --accent-green-background: #1e291d;
  --accent-teal: #75cdb4;
  --accent-teal-background: #172a24;
  --accent-cyan: #72c4db;
  --accent-cyan-background: #15282e;
  --accent-blue: #77a7dd;
  --accent-blue-background: #1c2632;
  --accent-indigo: #8899db;
  --accent-indigo-background: #212433;
  --accent-pink: #e48cd8;
  --accent-pink-background: #2d202b;
  --background: #111111;
  --elevation-1: #1d1d1d;
  --elevation-2: #282828;
  --surface: #111111;
  --primary: #ffffff;
  --primary-90: #ffffffe6;
  --primary-80: #ffffffcc;
  --primary-70: #ffffffb3;
  --primary-60: #ffffff99;
  --primary-50: #ffffff80;
  --primary-40: #ffffff66;
  --primary-30: #ffffff4d;
  --primary-20: #ffffff33;
  --primary-10: #ffffff1a;
  --primary-8: #ffffff14;
  --primary-5: #ffffff0d;
  --primary-4: #ffffff0a;
}