.code-line{border-radius:5px;flex-flow:row;align-items:center;width:fit-content;display:flex;overflow:hidden}.code-line .code-line__number{color:#ffffff80;background-color:#5e4fd9;border-radius:5px;width:fit-content;padding:6px 10px;font-family:JetBrains Mono,sans-serif;font-size:.9rem;font-weight:400;animation:.8s cubic-bezier(.6,0,0,1) forwards scaleNumberUp;display:block;transform:scale(0)}.code-line .code-line__code{color:#fff;transform-origin:0;background-color:#1e1f22;width:fit-content;padding:6px 20px;font-family:JetBrains Mono,sans-serif;font-size:.9rem;font-weight:400;animation:.8s cubic-bezier(.4,0,0,1) .8s forwards scaleCodeLineX;display:block;transform:scaleX(0);box-shadow:0 11px 5px -6px #32325d40}.code-line .code-line__code span{opacity:0;font-family:JetBrains Mono,sans-serif;font-size:.9rem;font-weight:400;animation:.2s cubic-bezier(.39,.575,.565,1) forwards fadeIn;display:inline-block;position:relative;transform:translate(-2px)}.code-line .code-line__code span:after{content:"";mix-blend-mode:difference;opacity:0;visibility:hidden;background-color:#cdcdcd;width:5px;height:100%;animation:.1s cubic-bezier(.39,.575,.565,1) forwards cursorIn;position:absolute;top:0;bottom:0;left:50%}.code-line .code-line__code span:first-child,.code-line .code-line__code span:first-child:after{animation-delay:1.2s}.code-line .code-line__code span:nth-child(2),.code-line .code-line__code span:nth-child(2):after{animation-delay:1.4s}.code-line .code-line__code span:nth-child(3),.code-line .code-line__code span:nth-child(3):after{animation-delay:1.6s}.code-line .code-line__code span:nth-child(4),.code-line .code-line__code span:nth-child(4):after{animation-delay:1.8s}.code-line .code-line__code span:nth-child(5),.code-line .code-line__code span:nth-child(5):after{animation-delay:2s}.code-line .code-line__code span:nth-child(6),.code-line .code-line__code span:nth-child(6):after{animation-delay:2.2s}.code-line .code-line__code span:nth-child(7),.code-line .code-line__code span:nth-child(7):after{animation-delay:2.4s}.code-line .code-line__code span:nth-child(8),.code-line .code-line__code span:nth-child(8):after{animation-delay:2.6s}.code-line .code-line__code span:nth-child(9),.code-line .code-line__code span:nth-child(9):after{animation-delay:2.8s}.code-line .code-line__code span:nth-child(10),.code-line .code-line__code span:nth-child(10):after{animation-delay:3s}.code-line .code-line__code .code--white{color:#fff}.code-line .code-line__code .code--purple{color:#af97f6}.code-line .code-line__code .code--purple:after{background-color:#af97f6}.code-line .code-line__code span.code--yellow{color:#ffd66d}.code-line .code-line__code span.code--yellow:after{background-color:#ffd66d}.code-line .code-line__code span.code--green{color:#8fda74}.code-line .code-line__code span.code--green:after{background-color:#8fda74}.code-line .code-line__code span.code--orange{color:#df802f}.code-line .code-line__code span.code--orange:after{background-color:#df802f}@keyframes fadeIn{0%{opacity:0;transform:translate(-2px)}20%{opacity:1}to{opacity:1;transform:translate(0)}}@keyframes cursorIn{0%{opacity:0;visibility:hidden;left:0}1%{opacity:1;visibility:visible}99%{opacity:1;visibility:visible}to{opacity:0;visibility:hidden;left:100%}}@keyframes scaleCodeLineX{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes scaleNumberUp{0%{border-radius:5px;transform:scale(0)}95%{border-radius:5px}to{border-radius:5px 0 0 5px;transform:scale(1)}}
