.family { background: #f0e8f7; border-radius: 35rpx; color: #746086; min-height: 220rpx; padding: 35rpx; display: flex; align-items: center; gap: 12rpx; } .family > view { flex: 1; min-width: 0; } .family text, .family strong { display: block; } .family text { color: #765984; font-size: 23rpx; } .family strong { font-size: 32rpx; margin-top: 20rpx; } .family image { width: 48%; height: 185rpx; flex-shrink: 0; } .add { font-weight: 600; color: #b95738; } .pet { display: flex; align-items: center; gap: 22rpx; } .pet-avatar { width: 125rpx; height: 125rpx; flex: none; border-radius: 28rpx; background: #f1d2a3; display: grid; place-items: center; font-size: 63rpx; overflow: hidden; } .pet-avatar image { width: 100%; height: 100%; } .pet-info { display: flex; flex-direction: column; gap: 6rpx; flex: 1; } .pet-info strong { font-size: 32rpx; } .pet-info text { font-size: 23rpx; color: #886c5f; } .arrow { font-size: 42rpx; color: #886c5f; } .add-button { margin-top: 25rpx; }