#progressBar{z-index:99999;aspect-ratio:1;background-color:var(--color-background-one);border-radius:50%;justify-content:center;align-items:center;width:3rem;display:flex;position:fixed;bottom:50%;right:.5rem;box-shadow:5px 5px 10px -5px #00000080,-5px -5px 10px -5px #ffffff80}#progressBar .block{width:2.5rem;height:2.5rem;box-shadow:inset 0 0 10px #00000080}#progressBar .block,#progressBar .box{border-radius:50%;justify-content:center;align-items:center;display:flex;position:relative}#progressBar .box{width:calc(100% - .5rem);height:calc(100% - .5rem);color:var(--color-text);flex-direction:column;box-shadow:0 0 10px #00000080}#progressBar .box:before{content:"";border-radius:50%;width:calc(100% + 28px);height:calc(100% + 28px);position:absolute}#progressBar .box .number span{color:var(--color-text)}#progressBar .box .number .num{font-size:.5rem;font-weight:500}#progressBar .box .number .sub{font-size:.5rem}#progressBar .box .title{color:var(--color-text);font-size:.3rem;font-weight:500}#progressBar .dots{z-index:2;border-radius:50%;width:100%;height:100%;transition:transform 1s,opacity 1s;display:block;position:absolute}#progressBar .dots:after{content:"";background-color:var(--fc-background-webkit);border-radius:50%;width:.2rem;height:.2rem;position:absolute;top:.02rem;left:50%;transform:translate(-50%);box-shadow:0 0 5px 2px #585858}#progressBar .svg{fill:none;width:100%;height:100%;position:absolute;transform:rotate(-90deg)}#progressBar .circle{stroke:url(#gradientStyle);stroke-width:.2rem;color:#fff;transition:stroke-dashoffset 1s;animation-duration:1s;animation-timing-function:linear;animation-fill-mode:forwards}.element{opacity:0;visibility:hidden;transition:all .5s;transform:translateZ(0)}.visible{opacity:1;visibility:visible;transition:all 1s;transform:translate(-1rem)}