body {
  margin: 0;
  line-height: normal;
}

:root {
  /* Common Style Variables */

  /* Color */
  --color-darkslategray: #454545;
  --color-dimgray: #515151;
  --color-gainsboro-100: #e6e6e6;
  --color-gainsboro-200: #e0e0e0;
  --color-gainsboro-300: #dedede;
  --color-palevioletred: #7d3d58;
  --color-steelblue: #007da2;
  --color-white: #fff;
  --color-whitesmoke: #f7f7f7;
  --Text-Primary: #000;

  /* Gap */
  --gap-8: 8px;
  --gap-12: 12px;
  --gap-16: 16px;
  --gap-32: 32px;

  /* Padding */
  --padding-0: 0px;
  --padding-12: 12px;
  --padding-16: 16px;

  /* BorderRadius */
  --br-4: 4px;
  --br-8: 8px;

  /* Font */
  --font-inter: Inter, Arial, sans-serif;

  /* FontSize */
  --fs-16: 16px;
  --fs-19: 19px;
  --fs-20: 20px;
  --fs-26: 26px;
  --fs-32: 32px;

  /* WidthHeights */
  --height-24: 24px;
  --height-32: 32px;
  --height-40: 40px;
  --height-144: 144px;
  --min-w-72: 72px;
  --width-24: 24px;

  /* LineHeights */
  --lh-19: 19px;
  --lh-22: 22px;
  --lh-24: 24px;
  --lh-26: 26px;
  --lh-30: 30px;

  --left-12: 12px;
  --left-16: 16px;
  --top-4: 4px;
  --top-16: 16px;
}