@keyframes glow{0%,to{box-shadow:0 0 8px var(--glow-color),0 0 16px var(--glow-color-faded)}50%{box-shadow:0 0 16px var(--glow-color),0 0 32px var(--glow-color-faded)}}@keyframes pop-in{0%{transform:scale(.8);opacity:0}70%{transform:scale(1.1);opacity:1}to{transform:scale(1);opacity:1}}@keyframes checkmark-draw{0%{stroke-dashoffset:30}to{stroke-dashoffset:0}}@keyframes confetti-burst{0%{transform:translateY(20%) scale(0);opacity:0}10%{opacity:1}80%{transform:translateY(-150%) scale(1.2)}to{transform:translateY(-200%) scale(1.2);opacity:0}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.rewards-bar-wrapper{--glow-color: #f59e0b;--glow-color-faded: rgba(245, 158, 11, .5);--completed-color: #10b981;--completed-glow: rgba(16, 185, 129, .6);--track-bg: #374151;--bar-bg: #1f2937;--text-color: #f9fafb;--label-color: #9ca3af;background-color:var(--bar-bg);padding:4px 12px 16px;border-radius:20px;border:1px solid rgba(255,255,255,.1);box-shadow:0 4px 12px #0000004d,inset 0 1px 2px #00000080;margin:2px 0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;position:relative;overflow:hidden}.rewards-bar-wrapper.all-unlocked:before{content:"\1f389";position:absolute;top:50%;left:50%;font-size:50px;animation:confetti-burst .8s cubic-bezier(.25,1,.5,1) forwards}.rewards-bar-message{font-size:16px;font-weight:500;color:var(--text-color);text-align:center;margin-bottom:22px;transition:all .4s ease}.rewards-bar-message .rewards-highlight{color:var(--glow-color);font-weight:700}.rewards-bar-wrapper.all-unlocked .rewards-bar-message{font-weight:600;color:var(--completed-color)}.rewards-bar-track{height:40px;position:relative}.rewards-bar-grid{display:flex;justify-content:space-between;align-items:center;height:100%}.checkpoint{display:flex;flex-direction:column;align-items:center;text-align:center;z-index:2}.marker{width:40px;height:40px;background-color:var(--track-bg);border:2px solid #4b5563;border-radius:50%;display:grid;place-items:center;transition:all .4s cubic-bezier(.25,1,.5,1);position:relative}.marker-icon,.marker-checkmark{grid-area:1 / 1;transition:all .4s ease}.marker-icon svg{width:20px;height:20px;stroke:var(--label-color);transition:stroke .3s ease}.marker-checkmark{transform:scale(.5);opacity:0}.marker-checkmark svg{width:22px;height:22px;stroke:#fff;stroke-dasharray:30;stroke-dashoffset:30}.label{font-size:12px;color:var(--label-color);margin-top:8px;white-space:nowrap;transition:color .3s ease,font-weight .3s ease}.checkpoint.active .marker{background-color:#4b5563;border-color:var(--glow-color);animation:glow 2s infinite ease-in-out}.checkpoint.active .marker:before{content:"";position:absolute;top:-5px;left:-5px;right:-5px;bottom:-5px;border:2px solid transparent;border-top-color:var(--glow-color);border-radius:50%;animation:spin 1.5s linear infinite}.checkpoint.active .label{color:var(--glow-color);font-weight:600}.checkpoint.completed .marker{background-color:var(--completed-color);border-color:var(--completed-color);box-shadow:0 0 10px var(--completed-glow);animation:pop-in .5s cubic-bezier(.25,1,.5,1) forwards}.checkpoint.completed .marker-icon{opacity:0;transform:scale(0)}.checkpoint.completed .marker-checkmark{opacity:1;transform:scale(1);transition-delay:.1s}.checkpoint.completed .marker-checkmark svg{animation:checkmark-draw .4s .2s ease-out forwards}.checkpoint.completed .label{color:var(--text-color)}.connector-wrapper{flex-grow:1;height:8px;margin:0 -1px}.connector{width:100%;height:100%;background-color:var(--track-bg);border-radius:4px;position:relative;overflow:hidden}.connector:after{content:"";position:absolute;top:0;left:0;height:100%;width:var(--progress-percent, 0%);background-color:var(--glow-color);border-radius:4px;transition:width .8s cubic-bezier(.45,.05,.55,.95)}.connector.unlocked:after{width:100%;background-color:var(--completed-color);transition:width .6s cubic-bezier(.65,0,.35,1)}.connector.active:after{background-image:linear-gradient(90deg,var(--glow-color) 0%,#fde047 50%,var(--glow-color) 100%);background-size:200% 100%;animation:shimmer 2s linear infinite}
/*# sourceMappingURL=/cdn/shop/t/25/assets/rewards-bar.css.map */