sj-miniprogram/unpackage/dist/dev/mp-weixin/pages/assessment/report.wxss

.loading-box.data-v-d9ddd4c0 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  color: #999;
}
.container.data-v-d9ddd4c0 {
  min-height: 100vh;
  background-color: #F8F9FB;
  display: flex;
  flex-direction: column;
}
.scroll-body.data-v-d9ddd4c0 {
  flex: 1;
  padding: 30rpx 40rpx;
  box-sizing: border-box;
}
.report-card.data-v-d9ddd4c0 {
  background: #FFF;
  border-radius: 32rpx;
  padding: 50rpx 40rpx;
  margin-bottom: 30rpx;
  box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.03);
}

/* 维度详情 */
.detail-card .section-header.data-v-d9ddd4c0 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30rpx;
}
.detail-card .section-header .subtitle.data-v-d9ddd4c0 {
  font-size: 24rpx;
  color: #999;
}
.ability-detail-list.data-v-d9ddd4c0 {
  display: flex;
  flex-direction: column;
  gap: 24rpx;
}
.ability-detail-item.data-v-d9ddd4c0 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 30rpx;
  background: #F8F9FB;
  border-radius: 20rpx;
}
.ability-detail-item.data-v-d9ddd4c0:active {
  opacity: 0.8;
}
.ability-detail-item .item-left.data-v-d9ddd4c0 {
  display: flex;
  flex-direction: column;
  gap: 10rpx;
}
.ability-detail-item .item-left .a-name.data-v-d9ddd4c0 {
  font-size: 30rpx;
  font-weight: bold;
  color: #333;
}
.ability-detail-item .item-left .status-tag.data-v-d9ddd4c0 {
  font-size: 20rpx;
  padding: 4rpx 12rpx;
  border-radius: 6rpx;
  width: -webkit-fit-content;
  width: fit-content;
}
.ability-detail-item .item-left .status-tag.pass.data-v-d9ddd4c0 {
  background: rgba(82, 196, 26, 0.1);
  color: #52c41a;
}
.ability-detail-item .item-left .status-tag.fail.data-v-d9ddd4c0 {
  background: rgba(255, 77, 79, 0.1);
  color: #ff4d4f;
}
.ability-detail-item .item-right.data-v-d9ddd4c0 {
  display: flex;
  align-items: center;
}
.ability-detail-item .item-right .a-score.data-v-d9ddd4c0 {
  font-size: 40rpx;
  font-weight: bold;
  color: #1F6CFF;
}
.ability-detail-item .item-right .a-unit.data-v-d9ddd4c0 {
  font-size: 24rpx;
  color: #999;
  margin-left: 4rpx;
  margin-right: 10rpx;
}
.ability-detail-item .item-right .arrow-icon.data-v-d9ddd4c0 {
  width: 32rpx;
  height: 32rpx;
  opacity: 0.3;
}

/* 仪表盘 */
.gauge-container.data-v-d9ddd4c0 {
  height: 440rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}
.gauge-main.data-v-d9ddd4c0 {
  width: 400rpx;
  height: 400rpx;
  position: relative;
}
.gauge-main .gauge-base.data-v-d9ddd4c0 {
  position: absolute;
  inset: 0;
  border: 20rpx solid #F0F2F5;
  border-radius: 50%;
  -webkit-clip-path: polygon(0 100%, 0 0, 100% 0, 100% 100%, 50% 50%);
          clip-path: polygon(0 100%, 0 0, 100% 0, 100% 100%, 50% 50%);
  transform: rotate(135deg);
}
.gauge-main .gauge-progress-bar.data-v-d9ddd4c0 {
  position: absolute;
  inset: 0;
  border: 20rpx solid #1F6CFF;
  border-radius: 50%;
  -webkit-clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%);
          clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%);
  transition: transform 1s cubic-bezier(0.4, 0, 0.2, 1);
}
.gauge-main .gauge-ticks.data-v-d9ddd4c0 {
  position: absolute;
  inset: 30rpx;
}
.gauge-main .gauge-ticks .tick.data-v-d9ddd4c0 {
  position: absolute;
  top: 0;
  left: 50%;
  width: 2rpx;
  height: 12rpx;
  background: #EEE;
  transform-origin: center 130rpx;
}
.gauge-main .gauge-needle-box.data-v-d9ddd4c0 {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
}
.gauge-main .gauge-needle-box .needle.data-v-d9ddd4c0 {
  width: 16rpx;
  height: 110rpx;
  background: #1F6CFF;
  -webkit-clip-path: polygon(50% 0, 100% 100%, 0 100%);
          clip-path: polygon(50% 0, 100% 100%, 0 100%);
  margin-top: 50rpx;
  transform-origin: center 110rpx;
  transition: transform 1s cubic-bezier(0.4, 0, 0.2, 1);
}
.gauge-main .score-display.data-v-d9ddd4c0 {
  position: absolute;
  bottom: 60rpx;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}
.gauge-main .score-display .num.data-v-d9ddd4c0 {
  font-size: 64rpx;
  font-weight: bold;
  color: #1F6CFF;
  display: block;
  line-height: 1;
  margin-bottom: 6rpx;
}
.gauge-main .score-display .total.data-v-d9ddd4c0 {
  font-size: 24rpx;
  color: #999;
}
.job-name.data-v-d9ddd4c0 {
  font-size: 40rpx;
  font-weight: bold;
  color: #1A1A1A;
  text-align: center;
  margin-top: 40rpx;
  margin-bottom: 30rpx;
}
.report-meta.data-v-d9ddd4c0 {
  display: flex;
  justify-content: space-between;
  font-size: 26rpx;
  color: #999;
}

/* 雷达图核心容器 */
.spider-chart-box.data-v-d9ddd4c0 {
  height: 600rpx;
  width: 100%;
  position: relative;
  margin-top: 40rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}
.pentagon-grids.data-v-d9ddd4c0 {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.pentagon-grids .p-grid.data-v-d9ddd4c0 {
  position: absolute;
  width: 100%;
  height: 100%;
  background: none;
  border: 1.5rpx solid #F0F2F5;
  box-sizing: border-box;
}
.axes.data-v-d9ddd4c0 {
  position: absolute;
  inset: 0;
}
.axes .axis.data-v-d9ddd4c0 {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 50%;
  height: 1rpx;
  background: #F0F2F5;
  transform-origin: left center;
}
.data-area.data-v-d9ddd4c0 {
  position: absolute;
  inset: 0;
}
.data-area .data-polygon.data-v-d9ddd4c0 {
  position: absolute;
  inset: 0;
  background: rgba(31, 108, 255, 0.15);
  border: 3rpx solid #1F6CFF;
  transition: all 1s ease-in-out;
}
.data-area .node-point.data-v-d9ddd4c0 {
  position: absolute;
  width: 0;
  height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.data-area .node-point.data-v-d9ddd4c0::after {
  content: "";
  position: absolute;
  width: 12rpx;
  height: 12rpx;
  background: #1F6CFF;
  border-radius: 50%;
  border: 4rpx solid #FFF;
  box-shadow: 0 0 10rpx rgba(31, 108, 255, 0.3);
  transform: translate(-50%, -50%);
}
.data-area .node-point .v-label.data-v-d9ddd4c0 {
  font-size: 24rpx;
  color: #333;
  white-space: nowrap;
}
.data-area .node-point .v-score.data-v-d9ddd4c0 {
  font-size: 20rpx;
  color: #1F6CFF;
  white-space: nowrap;
  margin-top: 40rpx;
}
.card-anim.data-v-d9ddd4c0 {
  animation: slideUp-d9ddd4c0 0.8s ease-out;
}
@keyframes slideUp-d9ddd4c0 {
from {
    transform: translateY(30rpx);
    opacity: 0;
}
to {
    transform: translateY(0);
    opacity: 1;
}
}