.wrap {
  width: 745px;
  height: 501px;
  border-radius: 40px;
  background: linear-gradient(
    180deg,
    rgba(27, 50, 89, 0.3),
    rgba(27, 50, 89, 0) 100%
  );

  .header {
    padding: 20px 36px 0 34px;
    .title {
      font-size: 24px;
      font-weight: 700;
      color: #b3d6f7;
    }
  }

  .content {
    padding: 0 38px;
    margin-top: 23px;
  }

  .card {
    text-align: center;
    .numCard {
      width: 138px;
      height: 83px;
      border-radius: 10px;
      background: rgba(67, 113, 180, 0.3);
      text-align: center;
      color: #bccee9;
      cursor: pointer;
      .name {
        font-size: 18px;
        font-weight: 700;
        line-height: 1;
      }
    }
  }
  .center {
    width: 668px;
    height: 139px;
    box-sizing: border-box;
    border-radius: 37px;
    box-shadow: 0 0 80px 0 rgba(10, 18, 61, 0.6);
    background: linear-gradient(
      0.57deg,
      rgba(73, 147, 163, 0.32) 5.085%,
      rgba(34, 129, 247, 0.33) 95.731%
    );
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
  }

  .unit {
    font-weight: 400;
    color: #bccee9;
  }

  :global {
    .ant-statistic-content-value {
      background: linear-gradient(
        180deg,
        rgb(170, 255, 246),
        rgb(37, 187, 255)
      );
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      font-family: D-DIN;
      font-size: 30px;
      font-weight: 700;
    }
  }
}
