.badge-card{width:100%;padding:.3rem;border-radius:.3rem;background:#fff;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-transition:all .3s ease;transition:all .3s ease}.badge-card:active{-webkit-transform:scale(.95);-ms-transform:scale(.95);transform:scale(.95)}.badge-card.unlocked{-webkit-box-shadow:0 .05rem .2rem rgba(0,0,0,.08);box-shadow:0 .05rem .2rem #00000014}.badge-card.locked{background:#f9fafb;opacity:.8}.badge-icon-container{width:1.4rem;height:1.4rem;border-radius:50%;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;margin-bottom:.2rem;position:relative}.badge-lock{position:absolute;bottom:-.05rem;right:-.05rem;width:.5rem;height:.5rem;border-radius:50%;background:#fff;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-shadow:0 .025rem .075rem rgba(0,0,0,.1);box-shadow:0 .025rem .075rem #0000001a}.badge-name{font-size:.325rem;font-weight:600;text-align:center;margin-bottom:.1rem}.badge-desc{font-size:.25rem;color:#9ca3af;text-align:center;line-height:1.3}.badge-progress{width:100%;height:.075rem;background:#e5e7eb;border-radius:.05rem;margin-top:.2rem;overflow:hidden}.badge-progress-bar{height:100%;border-radius:.05rem;-webkit-transition:width .3s ease;transition:width .3s ease}.badge-wall{width:100%}.badge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.3rem}.badge-mini{border-radius:50%;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.stat-card{-webkit-flex:1;-ms-flex:1;flex:1;padding:.3rem;background:#fff;border-radius:.3rem;border-left:.075rem solid;-webkit-box-shadow:0 .025rem .075rem rgba(0,0,0,.05);box-shadow:0 .025rem .075rem #0000000d}.stat-value{font-size:.5rem;font-weight:700;margin-bottom:.05rem}.stat-label{font-size:.275rem;opacity:.8}.achievement-progress{background:#fff;border-radius:.3rem;padding:.3rem;margin-bottom:.2rem}.achievement-header{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-ms-flex-align:center;align-items:center;margin-bottom:.2rem}.achievement-title{font-size:.325rem;color:#374151;font-weight:500}.achievement-count{font-size:.3rem;font-weight:600}.progress-bar-bg{width:100%;height:.15rem;background:#e5e7eb;border-radius:.075rem;overflow:hidden}.progress-bar-fill{height:100%;border-radius:.075rem;-webkit-transition:width .5s ease;transition:width .5s ease}.achievement-reward{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;gap:.1rem;margin-top:.15rem;font-size:.275rem;color:#f59e0b}.badge-detail{padding:.5rem;text-align:center}.badge-detail-icon{width:2rem;height:2rem;border-radius:50%;margin:0 auto .4rem;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.badge-detail-name{font-size:.45rem;font-weight:700;margin-bottom:.2rem}.badge-detail-desc{font-size:.35rem;color:#6b7280;margin-bottom:.4rem;line-height:1.5}.badge-detail-progress{background:#f3f4f6;border-radius:.2rem;padding:.3rem;margin-top:.3rem}@-webkit-keyframes badge-unlock{0%{-webkit-transform:scale(.5);transform:scale(.5);opacity:0}50%{-webkit-transform:scale(1.2);transform:scale(1.2)}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes badge-unlock{0%{-webkit-transform:scale(.5);transform:scale(.5);opacity:0}50%{-webkit-transform:scale(1.2);transform:scale(1.2)}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.badge-unlock-animation{-webkit-animation:badge-unlock .5s ease;animation:badge-unlock .5s ease}.badge-glow{-webkit-box-shadow:0 0 .5rem currentColor;box-shadow:0 0 .5rem currentColor}
