.page-invitation-card {
  padding-bottom: env(safe-area-inset-bottom);
  .card-con {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to bottom, #151b33, #080c1c);
    .card-box {
      position: relative;
      text-align: center;
      margin-top: 100rpx;
      padding-top: 60rpx;
      .bg {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 965rpx;
        font-size: 0;
      }
      .card {
        position: relative;
        .inviter {
          width: 160rpx;
          height: 160rpx;
          font-size: 0;
          border-radius: 160rpx;
          overflow: hidden;
          margin: 20rpx auto;
        }
        .name {
          width: 70%;
          margin: 0 auto;
          overflow: hidden;
          text-overflow: ellipsis;
          display: -webkit-box;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;
          word-break: break-word;
          font-size: 28rpx;
          color: #999;
        }
        .des {
          margin-top: 30rpx;
          font-size: 32rpx;
          padding-left: 30rpx;
        }
        .code {
          width: 300rpx;
          height: 300rpx;
          font-size: 0;
          margin: 20rpx auto 0;
        }
      }
    }
    .action {
      position: absolute;
      top: 1100rpx;
      left: 0;
      right: 0;
      text-align: center;
      color: #fff;
      font-size: 28rpx;
      opacity: .7;
    }
  }
}
