*,:after,:before{box-sizing:border-box}.bracket,.round{display:flex}.round{flex-grow:1;flex-direction:column}.round:first-child .match:before,.round:first-child .match__content:before,.round:last-child .match:after{display:none}.match{display:flex;flex-direction:column;justify-content:center;margin:0 10px;padding:6px 0;flex-grow:1;position:relative}.match:before{content:"";display:block;min-height:30px;border-left:2px solid purple;position:absolute;left:-10px;top:50%;margin-top:-15px;margin-left:-2px}.match:nth-child(odd):after{border:2px solid transparent;border-top-color:purple;border-right-color:purple;top:50%}.match:nth-child(2n):after,.match:nth-child(odd):after{content:"";display:block;height:50%;position:absolute;right:-10px;width:10px}.match:nth-child(2n):after{border:2px solid transparent;border-bottom-color:purple;border-right-color:purple;bottom:50%}.match__content:before{content:"";display:block;width:10px;border-bottom:2px solid purple;margin-left:-2px;position:absolute;top:50%;left:-10px}#app{padding:15px}.config{padding-bottom:15px;padding-left:10px;font-size:18px}.config input{padding:5px 12px;font-size:16px}