:root {
  --color-blue-light: #dfdafe;
  --color-blue: #2d00f7;
  --color-blue-deep: #21007a;
  --color-red-light: #fadcdc;
  --color-red: #c1121f;
  --color-red-deep: #780000;
  --color-teal-light: #d7ecee;
  --color-teal: #0a9396;
  --color-teal-deep: #005f73;
  --color-orange-light: #feead4;
  --color-orange: #fb8b24;
  --color-orange-deep: #a04d00;
  --color-brown-light: #efe1d5;
  --color-brown: #99582a;
  --color-brown-deep: #582f0e;
  --color-yellow-light: #fff3c2;
  --color-yellow: #ffd500;
  --color-yellow-deep: #715e00;
  --color-green-light: #d6efd6;
  --color-green: #008000;
  --color-green-deep: #005200;
  --color-purple-light: #e6ddfb;
  --color-purple: #7a46e0;
  --color-purple-deep: #45238a;
  --color-grey-light: #e8eaef;
  --color-grey: #545c6b;
  --color-grey-deep: #2e3440;
  --color-card: #fff;
  --color-page: #fbfbf9;
  --color-ink: #1a1b1f;
  --color-muted: #545c6b;
  --color-bezel: #1a1b1f;

  --font-display: "Signika", sans-serif;
  --font-body: "Nunito Sans", sans-serif;
  --font-zh: "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", sans-serif;
  --text-display: 64pt;
  --text-prompt-min: 44pt;
  --text-prompt-max: 72pt;
  --text-section: 28pt;
  --text-body-large: 22pt;
  --text-child-min: 20pt;
  --text-label: 16pt;
  --text-caption: 14pt;

  --radius-panel: 32px;
  --radius-card: 28px;
  --radius-answer: 26px;
  --radius-tile: 20px;
  --radius-round: 999px;
  --shadow-pickup: 0 8px 0 rgb(26 27 31 / 12%);
  --target-exercise: 120pt;
  --target-control: 64pt;
}