Html 如何通过css创建动态步骤向导树设计？

我想使用css创建一个垂直阶梯向导设计，如下图所示。经过多次尝试，我还是做不到。有什么好的建议吗

我在react中使用了情感css包来设计这个组件。你可以建议我为这个设计纯html和css，我也想这样

            position: fixed;
            top: 0;
            left: 0;
            width: 32%;
            bottom: 0;
            overflow: auto;
            border-right: 1px solid red;
            padding-top: 80px;
            
            .clip-art {
                padding-left: 70px;
                img { width: 75px }
            }
            
            
            .steps {
                padding: 20px 150px;
            }
            
            .stepLevelContainer {
                position: relative;
                
                .stepLevel {
                    position: relative;
                    margin-bottom: 90px;
                    
                    table {
                        width: 100%;
                        
                        td {
                            /*border: 1px solid #000;*/
                        }
                        
                        td:first-child {
                            text-align: center;
                            vertical-align: middle;
                        }
                        
                        td:last-child {
                            vertical-align: middle;
                            width: 100%;
                            padding-left: 20px;
                        }
                        
                        .button-container  {
                            background: #ffffff;
                            color: #ffffff;
                            font-size: 20px;
                            border: 1px solid #9296d3;
                            border-radius: 50%;
                            width: 50px;
                            height: 50px;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            padding: 10xp;
                                
                            button {
                                background: #494FB1;
                                color: #ffffff;
                                font-size: 20px;
                                border: 1px solid #a6a6a6;
                                border-radius: 50%;
                                width: 40px;
                                height: 40px;
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                cursor: pointer;
                                outline: 0;
                                
                                &:hover {background: #8084cb}
                            }
                        }
                            
                        .levelTitle {
                            display: block;
                            font-size: 17px;
                            font-weight: bold;
                        }
                            
                        .levelSubTitle {
                            display: block;
                            font-size: 14px;
                            color: #a6a6a6;
                        }
                    }
                    
                    
                    
                    
                    .tree-line {
                        position: absolute;
                        top: 100%;
                        left: 25px;
                        height: 90px;
                        padding-top: 10px;
                        
                        .first-border {
                            position: absolute;
                            width: 7px;
                            height: 40px;
                            border-radius: 19px;
                            background: #494FB1;
                        }
                        
                        .last-border {
                            position: absolute;
                            top: 60px;
                            bottom: 25px;
                            width: 7px;
                            border-left: 7px dotted #494FB1;
                        }
                    }
                    
                    
                    .subTreeLine {
                        border: 1px solid red;
                    }
                }
                
                .disabled {
                    .button-container  {
                        border: 1px solid #a6a6a6 !important;
                        
                        button {
                            background: grey !important;
                        }
                    }
                }
            }