// 颜色(危险色)
@red-1: #fff1f0;
@red-2: #ffccc7;
@red-3: #ffa39e;
@red-4: #ff7875;
@red-5: #ff4d4f;
@red-6: #f5222d;
@red-7: #cf1332;
@red-8: #a8071a;
@red-9: #820014;

// 颜色(警告色)
@gold-1: #fffbe6;
@gold-2: #fff1b8;
@gold-3: #ffe57f;
@gold-4: #ffd666;
@gold-5: #ffc53d;
@gold-6: #faad14;
@gold-7: #d48806;
@gold-8: #ad6800;
@gold-9: #874d00;

// 颜色(强调色)
@blue-1: #e6f7ff;
@blue-2: #bae7ff;
@blue-3: #91d5ff;
@blue-4: #69c0ff;
@blue-5: #40a9ff;
@blue-6: #1890ff;
@blue-7: #096dd9;
@blue-8: #0050b3;
@blue-9: #003a8c;

// 颜色(成功色)
@green-1: #f6ffed;
@green-2: #d9f7b3;
@green-3: #b7eb8f;
@green-4: #95de64;
@green-5: #73d13d;
@green-6: #52c41a;
@green-7: #389e0d;
@green-8: #237804;
@green-9: #135200;

// 颜色(灰度色)
@grey-1: #ffffff;
@grey-2: #f5f5f5;
@grey-3: #eeeeee;
@grey-4: #d9d9d9;
@grey-5: #cccccc;
@grey-6: #a6a6a6;
@grey-7: #797979;
@grey-8: #4a4a4a;
@grey-9: #333333;

// 黑白颜色
@white: #ffffff;
@black: #000000;

// 距离
@length-3s: 4px;
@length-2s: 8px;
@length-s: 12px;
@length-m: 16px;
@length-l: 24px;
@length-2l: 32px;
@length-3l: 48px;
@length-4l: 64px;

// 圆角
.radius-s {
  border-radius: 6px;
}
.radius-m {
  border-radius: 10px;
}
.radius-l {
  border-radius: 16px;
}
// 阴影
.shd-s {
  box-shadow: 0px 2px 4px #000;
}
.shd-m {
  box-shadow: 0px 8px 16px #000;
}
.shd-l {
  box-shadow: 0px 20px 24px #000;
}
// font scale
.title-l {
  font-size: 40px;
  line-height: 48px;
}
.title-m {
  font-size: 20px;
  line-height: 24px;
}
.title-s {
  font-size: 18px;
  line-height: 24px;
}
.p-l {
  font-size: 16px;
  line-height: 24px;
}
.p-m {
  font-size: 14px;
  line-height: 22px;
}
.p-s {
  font-size: 13px;
  line-height: 20px;
}
.p-xs {
  font-size: 11px;
  line-height: 16px;
}