.portrait {
  position: relative;
  background: radial-gradient(circle at 50% 20%, #ffffff22, transparent 45%), var(--portrait-bg);
  overflow: hidden;
}
.portrait i {
  position: absolute;
  width: 53px;
  height: 67px;
  bottom: -3px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--skin);
  border-radius: 45% 45% 36% 36%;
  box-shadow: 0 42px 0 20px #142238;
}
.portrait i::after {
  content: "";
  position: absolute;
  width: 34px;
  height: 12px;
  left: 9px;
  top: 38px;
  border-bottom: 2px solid #5e342a;
  border-radius: 50%;
}
.portrait b {
  position: absolute;
  width: 56px;
  height: 27px;
  left: 50%;
  bottom: 56px;
  transform: translateX(-50%);
  background: var(--hair);
  border-radius: 50% 55% 20% 20%;
  clip-path: polygon(0 0,100% 0,93% 100%,80% 55%,65% 92%,48% 55%,32% 90%,16% 50%,5% 100%);
}
.portrait.style-2 b { height: 17px; border-radius: 70% 20% 40% 10%; }
.portrait.style-3 b {
  height: 32px;
  clip-path: polygon(0 25%,12% 0,24% 22%,36% 0,48% 23%,60% 0,72% 20%,86% 0,100% 28%,92% 100%,8% 100%);
}
.portrait.style-4 b { height: 10px; border-radius: 50%; }
