.debugger-process-viewer-root{position:fixed;left:0;top:0;width:100vw;height:100vh;background-color:#fafafa;z-index:10000;padding:10px;box-sizing:border-box;font-size:12px;overflow:auto;line-height:1.2}.debugger-process-viewer-root .recorder-container{position:relative;-webkit-user-select:auto;-moz-user-select:auto;user-select:auto}.debugger-process-viewer-root .recorder-container .title{position:relative;text-align:center;padding:40px 0;font-size:24px;font-weight:bold}.debugger-process-viewer-root .recorder-container .title .desc{text-align:center;font-size:14px;color:#555;font-weight:normal;-webkit-user-select:text;-moz-user-select:text;user-select:text;margin-top:10px}.debugger-process-viewer-root .recorder-container .refresh-btn{position:absolute;left:calc(100% + 6px);bottom:0;width:30px;height:40px;line-height:46px;border-radius:50%;cursor:pointer}.debugger-process-viewer-root .recorder-container .close-btn{position:absolute;right:20px;top:20px;width:40px;height:40px;border-radius:50%;font-size:30px;cursor:pointer;display:flex;align-items:center;justify-content:center}.debugger-process-viewer-root .recorder-container .close-btn:hover{background-color:#ddd}.debugger-process-viewer-root .recorder-container .process-container{position:relative;width:90%;min-width:600px;margin:0 auto}.debugger-process-viewer-root .recorder-container .process-container .controls{display:flex;justify-content:flex-end;margin-bottom:10px}.debugger-process-viewer-root .recorder-container .process-container .warning-text{color:#aaa;font-size:12px;text-align:center;margin-top:50px;line-height:1.5;-webkit-user-select:text;-moz-user-select:text;user-select:text}.debugger-process-viewer-root .process-item{border-top:1px solid #ccc}.debugger-process-viewer-root .process-item:last-child{border-bottom:1px solid #ccc}.debugger-process-viewer-root .process-item .process-msg{height:80px;position:relative;padding:20px;padding-left:100px;box-sizing:border-box;cursor:pointer}.debugger-process-viewer-root .process-item .process-msg:hover{background-color:#f1f1f1}.debugger-process-viewer-root .process-item .process-msg .process-icon{position:absolute;left:20px;top:20px;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#4a90e2}.debugger-process-viewer-root .process-item .process-msg .process-icon.error{background:#9d1c1c}.debugger-process-viewer-root .process-item .process-msg .process-icon.success{background:green}.debugger-process-viewer-root .process-item .process-msg .process-icon.warning{background:#f8b938}.debugger-process-viewer-root .process-item .process-msg .process-name{font-weight:bold;font-size:20px;line-height:26px}.debugger-process-viewer-root .process-item .process-msg .process-name.error{color:#9d1c1c}.debugger-process-viewer-root .process-item .process-msg .process-desc{font-size:14px;color:#555}.debugger-process-viewer-root .process-item .process-msg .open-icon{position:absolute;right:0;top:0;width:80px;height:80px;line-height:80px;text-align:center;font-weight:100;font-size:18px}.debugger-process-viewer-root .process-item .process-msg .open-icon.open{transform:rotate(90deg)}.debugger-process-viewer-root .process-detail .spans-container{height:150px;width:100%;overflow-x:auto;overflow-y:hidden;white-space:nowrap;padding-top:20px;box-sizing:border-box;text-align:center}.debugger-process-viewer-root .process-detail .spans-container .span-item{position:relative;display:inline-block;margin-right:30px;width:100px;height:70px}.debugger-process-viewer-root .process-detail .spans-container .span-item .span-icon{position:relative;width:30px;height:30px;border-radius:50%;background:#4a90e2;margin:20px auto;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;cursor:pointer}.debugger-process-viewer-root .process-detail .spans-container .span-item .span-icon.selected:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:40px;height:40px;border-radius:50%;border:2px solid #4a90e2;box-sizing:border-box}.debugger-process-viewer-root .process-detail .spans-container .span-item .span-icon.error{background-color:#9d1c1c}.debugger-process-viewer-root .process-detail .spans-container .span-item .span-icon.success{background:green}.debugger-process-viewer-root .process-detail .spans-container .span-item .span-name{position:absolute;left:50%;bottom:0;transform:translate(-50%);width:auto;text-align:center;font-size:12px;-webkit-user-select:text;-moz-user-select:text;user-select:text}.debugger-process-viewer-root .process-detail .spans-container .span-item:not(.debugger-process-viewer-root .process-detail .spans-container .span-item:last-child):after{content:"";position:absolute;left:70px;top:35px;width:90px;height:2px;background-color:#ddd}.debugger-process-viewer-root .process-detail .current-span-log{background:#000;color:#fff;height:500px;overflow:auto;padding:10px;box-sizing:border-box;-webkit-user-select:text;-moz-user-select:text;user-select:text}.debugger-process-viewer-root .process-detail .current-span-log .span-log-line{margin-top:6px;line-height:1.4}.debugger-process-viewer-root .process-detail .current-span-log .span-log-line.error{color:#ff5454}.debugger-process-viewer-root .process-detail .current-span-log .span-log-line.first{margin-top:20px}@keyframes blink{0%{opacity:1}50%{opacity:0}to{opacity:1}}.debugger-process-viewer-root .link{color:blue}
