/* ===== FEMALE ICON ===== */
    .female-icon {
      width: 90px;
      height: 80px;
      position: relative;
      opacity: 0.45;
      transition: all 0.35s ease;
      filter: grayscale(0.3);
    }
    
    .female-icon.active {
      opacity: 1;
      filter: none;
      transform: scale(1.12);
    }
    
    .female-icon .boob {
      position: absolute;
      width: 32px;
      height: 32px;
      background: #ffb6c1;
      border-radius: 50%;
      top: 4px;
      box-shadow: inset -4px -4px 8px rgba(0, 0, 0, 0.15);
    }
    
    .female-icon .boob.left {
      left: -px;
    }
    
    .female-icon .boob.right {
      right: -1px;
    }
    
    .female-icon .nipple {
      position: absolute;
      width: 8px;
      height: 8px;
      background: #e75480;
      border-radius: 50%;
      top: 12px;
      left: 12px;
    }
    
    .female-icon .pussy {
      position: absolute;
      bottom: 6px;
      left: 50%;
      transform: translateX(-50%);
      width: 28px;
      height: 22px;
      background: #ffb6c1;
      border-radius: 50% 50% 40% 40%;
      box-shadow: inset 0 -3px 6px rgba(0, 0, 0, 0.12);
    }
    
    .female-icon .slit {
      position: absolute;
      top: 6px;
      left: 50%;
      transform: translateX(-50%);
      width: 3px;
      height: 12px;
      background: #c71585;
      border-radius: 2px;
    }
    
    /* Female selected animation */
    .female-icon.active .boob {
      animation: boobBounce 1.2s ease-in-out infinite;
    }
    
    .female-icon.active .boob.right {
      animation-delay: 0.15s;
    }
    
    .female-icon.active .pussy {
      animation: pussyPulse 1.4s ease-in-out infinite;
    }
    
    @keyframes boobBounce {

      0%,
      100% {
        transform: translateY(0);
      }
      
      50% {
        transform: translateY(-5px);
      }
    }
    
    @keyframes pussyPulse {

      0%,
      100% {
        transform: translateX(-50%) scale(1);
      }
      
      50% {
        transform: translateX(-50%) scale(1.12);
      }
    }
    
    /* ===== MALE ICON ===== */
    .male-icon {
      width: 70px;
      height: 85px;
      position: relative;
      opacity: 0.45;
      transition: all 0.35s ease;
      filter: grayscale(0.3);
    }
    
    .male-icon.active {
      opacity: 1;
      filter: none;
      transform: scale(1.12);
    }
    
    .male-icon .shaft {
      position: absolute;
      bottom: 18px;
      left: 50%;
      transform: translateX(-50%);
      width: 18px;
      height: 28px;
      background: #ffb6c1;
      border-radius: 8px 8px 4px 4px;
      transition: height 0.4s ease, background 0.3s;
    }
    
    .male-icon .head {
      position: absolute;
      bottom: 42px;
      left: 50%;
      transform: translateX(-50%);
      width: 24px;
      height: 18px;
      background: #ff9aab;
      border-radius: 50% 50% 40% 40%;
      transition: bottom 0.4s ease, height 0.4s ease;
    }
    
    .male-icon .balls {
      position: absolute;
      bottom: 4px;
      left: 50%;
      transform: translateX(-50%);
      width: 36px;
      height: 20px;
      display: flex;
      justify-content: space-between;
    }
    
    .male-icon .ball {
      width: 16px;
      height: 16px;
      background: #ffb6c1;
      border-radius: 50%;
      box-shadow: inset -2px -2px 4px rgba(0, 0, 0, 0.12);
    }
    
    /* Male selected = erect */
    .male-icon.active .shaft {
      height: 42px;
      background: #ff9aab;
      animation: shaftPulse 1.3s ease-in-out infinite;
    }
    
    .male-icon.active .head {
      bottom: 56px;
      height: 20px;
      animation: headBob 1.3s ease-in-out infinite;
    }
    
    @keyframes shaftPulse {

      0%,
      100% {
        transform: translateX(-50%) scaleY(1);
      }
      
      50% {
        transform: translateX(-50%) scaleY(1.06);
      }
    }
    
    @keyframes headBob {

      0%,
      100% {
        transform: translateX(-50%) translateY(0);
      }
      
      50% {
        transform: translateX(-50%) translateY(-3px);
      }
    }
    
.navel {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);

  width: 30px;
  height: 35px;
  border-radius: 50%;

  background:#ffb6c1;

  box-shadow:
    inset 4px 0 6px rgba(50, 20, 10, 0.3),
    inset -4px 0 6px rgba(255, 190, 155, 0.3);
}

.belly-button {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);

  width: 2px;
  height: 4px;
  border-radius: 50%;

  background: #c71585;
}