.scroll-progress-container{position:relative;width:60px;height:100%;min-height:400px;display:flex;align-items:center;justify-content:center;background:#fff0;z-index:1000}.progress-line-wrapper{position:relative;width:6px;height:100%;min-height:300px;background:#ccdbea;border-radius:2px;overflow:visible}.progress-line-fill{position:absolute;top:0;left:0;width:100%;height:0%;background:#5b8cbb;border-radius:2px;transition:height 0.1s ease-out}.progress-diamond{position:absolute;width:32px;height:32px;left:50%;transform:translateX(-50%);transition:all 0.3s ease;z-index:10}.progress-diamond svg{width:100%;height:100%;display:block}.progress-diamond.active svg rect{fill:#5b8cbb;transition:fill 0.3s ease}.progress-diamond:not(.active) svg rect{fill:#ccdbea;transition:fill 0.3s ease}.progress-diamond:hover svg rect{fill:#5b8cbb!important;transform:scale(1.1)}@media (max-width:768px){.scroll-progress-container{width:40px}.progress-diamond{width:24px;height:24px}.progress-line-wrapper{width:3px}}@media (max-width:480px){.scroll-progress-container{width:30px}.progress-diamond{width:20px;height:20px}.progress-line-wrapper{width:2px}}