/* ═════ 档案填写页样式 ═════ */
.profile {
  position: relative;
  min-height: 100vh;
}
.profile-bg {
  position: fixed;
  left: 0; top: 0;
  width: 100%;
  height: 100%;
  /* 上半部分露出背景图,表单区由白色卡片承载 */
}
.profile-body {
  position: relative;
  padding: 48rpx 32rpx 64rpx;
  box-sizing: border-box;
}
.page-title {
  color: #FFFFFF;
  font-size: 44rpx;
  font-weight: 600;
  text-align: center;
  margin-bottom: 48rpx;
}

.form-row {
  display: flex;
  justify-content: space-between;
}
.field { margin-bottom: 32rpx; }
.field-half { width: 48%; }
.field-label {
  color: #FFFFFF;
  font-size: 28rpx;
  margin-bottom: 16rpx;
  text-align: center;
}
.pick {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 88rpx;
  background: #FFFFFF;
  border-radius: 16rpx;
  padding: 0 24rpx;
  box-sizing: border-box;
}
.pick-value {
  color: #282828;
  font-size: 28rpx;
}
.chev {
  color: #868686;
  font-size: 28rpx;
}

/* ─── 肤质卡 ─── */
.skin-card {
  background: #FFFFFF;
  border-radius: 24rpx;
  padding: 32rpx 24rpx;
  box-sizing: border-box;
}
.skin-axis {
  display: flex;
  justify-content: center;
  margin-bottom: 24rpx;
}
.axis-item {
  display: flex;
  align-items: center;
  font-size: 24rpx;
  color: #868686;
  margin: 0 16rpx;
}
.chip {
  display: inline-block;
  width: 20rpx;
  height: 20rpx;
  border-radius: 50%;
  margin-right: 8rpx;
}
.chip-dry { background: #EAE6E1; }
.chip-oily { background: #F5F078; }
.chip-balance { background: #DBF6D6; }

.skin-stage {
  display: flex;
  align-items: center;
}
.skin-arrow {
  width: 64rpx;
  font-size: 56rpx;
  color: #868686;
  text-align: center;
  flex-shrink: 0;
}
.skin-swiper {
  flex: 1;
  height: 460rpx;
}
.skin-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 16rpx;
  box-sizing: border-box;
}
.skin-img {
  width: 280rpx;
  height: 280rpx;
}
.skin-name {
  font-size: 32rpx;
  font-weight: 600;
  margin-top: 16rpx;
}
.skin-desc {
  font-size: 24rpx;
  color: #868686;
  text-align: center;
  margin-top: 8rpx;
}
.skin-dots {
  display: flex;
  justify-content: center;
  margin-top: 16rpx;
}
.dot {
  width: 12rpx;
  height: 12rpx;
  border-radius: 50%;
  background: #E5E5E5;
  margin: 0 6rpx;
}
.dot.on { background: #282828; }

.btn-submit { margin-top: 24rpx; }
.picker-sheet { background: white; width: 100%; align-self: flex-end; border-radius: 24rpx 24rpx 0 0; }
.picker-actions { display: flex; justify-content: space-between; padding: 32rpx; }
.native-picker { width: 100%; height: 440rpx; text-align: center; line-height: 80rpx; }