.cbox{--border-angle:0turn;--main-bg:conic-gradient(from var(--border-angle),#213,#112 5%,#112 60%,#213 95%);--gradient-border:conic-gradient(from var(--border-angle),transparent 25%,#00cfff,#ff2d55 99%,transparent);position:absolute;inset:0;border-radius:9999px;border:2px solid transparent;background:var(--main-bg) padding-box,var(--gradient-border) border-box,var(--main-bg) border-box;display:grid;place-items:center;pointer-events:none;opacity:0;transition:opacity .3s ease}.animate-on-scroll{animation:bg-spin-load 3s linear forwards;opacity:1}@keyframes bg-spin-load{0%{--border-angle:0turn;opacity:1}to{--border-angle:1.5turn;opacity:0}}@property --border-angle{syntax:"<angle>";inherits:true;initial-value:0turn}