.badge-medal{display:inline-grid;place-items:center;width:65px;height:72px;background:linear-gradient(150deg,#faf7ff,#dfd1f4);clip-path:polygon(50% 0,91% 20%,97% 59%,78% 86%,50% 100%,22% 86%,3% 59%,9% 20%);color:#8351c5;flex-shrink:0}.badge-medal>span{width:46px;height:46px;border:2px solid #ffffffb3;border-radius:50%;display:grid;place-items:center;font-size:28px;text-shadow:0 2px 0 #fff8}.badge-medal.mint{background:linear-gradient(145deg,#e3faf0,#a1d9c5);color:#35866c}.badge-medal.peach{background:linear-gradient(145deg,#fff2da,#efd09e);color:#b27c32}.badge-medal.rose{background:linear-gradient(145deg,#ffeaf1,#e9b4cc);color:#bd6391}.badge-medal.blue{background:linear-gradient(145deg,#e6f2ff,#b6ccef);color:#537db5}.badge-medal.large{width:90px;height:102px;margin:12px 0}.badge-medal.large>span{width:66px;height:66px;font-size:37px}.badge-medal.tiny{width:29px;height:33px}.badge-medal.tiny>span{width:21px;height:21px;font-size:14px;border-width:1px}.badge-collection-title p{font-size:11px;line-height:1.8}.badge-filters{display:flex;gap:8px;margin:20px 0}.badge-filters button{padding:8px 12px;border-radius:20px;background:#f5f1fa;color:#9784ad;font-size:11px}.badge-filters .active{background:#8254c4;color:white}.badge-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.badge-tile{display:flex;flex-direction:column;align-items:center;gap:9px;min-width:0;border:1px solid #eee8f4;border-radius:16px;padding:14px 5px;background:white}.badge-tile b{font-size:10px;text-align:center;line-height:1.55;min-height:31px}.badge-tile small{font-size:9px;color:#9d8aaf}.badge-tile.locked .badge-medal{filter:grayscale(.8);opacity:.5}.badge-tile.unlocked{background:#fdfbff;border-color:#e1d1f4}.badge-tile.unlocked small{color:#8c58c7}.badge-detail-art{text-align:center}.badge-rule{padding:16px;background:#f8f5fc;border-radius:15px;margin:18px 0}.badge-rule>b{font-size:12px}.badge-rule p{font-size:12px}.badge-rule small{font-size:10px;color:#9986a9;display:block;line-height:1.8;margin-top:7px}.badge-rule progress{width:100%;height:7px;accent-color:#9464cf}.profile-badge{font-size:10px;font-weight:600;background:#eee7f8;color:#8253b7;border-radius:20px;padding:7px 11px;margin-top:13px}.profile-badge.mint{background:#e4f5ee;color:#388974}.profile-badge.blue{background:#edf3fb;color:#557fae}.profile-badge.peach{background:#fff3df;color:#ac7e3a}.badge-summary{display:flex;width:calc(100% - 36px);align-items:center;text-align:left;gap:12px;margin:16px 18px;padding:15px 13px;background:#faf6ff;border:1px solid #eae1f5;border-radius:16px}.badge-summary-icons{display:flex;gap:2px}.badge-summary>span:nth-child(2){flex:1}.badge-summary b{font-size:12px}.badge-summary small{display:block;font-size:9px;color:#9e8aaa;margin-top:7px}.badge-summary>span:last-child{color:#bba4cd;font-size:20px}@media(max-width:360px){.badge-medal{width:55px;height:62px}.badge-tile b{font-size:9px}.badge-summary-icons .badge-medal:nth-child(3){display:none}}


.badge-medal.badge-flat{clip-path:none;border-radius:22px;background:#efe7fb;color:#bb96ec;width:68px;height:68px;border:1.5px solid #ded0ee;transform:rotate(-5deg)}
.badge-flat svg{width:57px;height:57px;transform:rotate(5deg)}
.badge-medal.badge-flat.mint{background:#e5f6ed;color:#7bd5ac;border-color:#c4e8d6;border-radius:50%}
.badge-medal.badge-flat.rose{background:#fff0f4;color:#f1a4bd;border-color:#f2d3df}
.badge-medal.badge-flat.peach{background:#fff5d9;color:#f1ca69;border-color:#eddfb6;border-radius:50%}
.badge-medal.badge-flat.blue{background:#eaf1ff;color:#8db5f2;border-color:#ceddf5}
.badge-medal.badge-flat.large{width:108px;height:108px}.badge-flat.large svg{width:90px;height:90px}
.badge-medal.badge-flat.tiny{width:30px;height:30px;border-radius:10px}.badge-flat.tiny svg{width:26px;height:26px}
.badge-tile.locked .badge-medal{filter:saturate(.65);opacity:.8}.badge-tile.locked{border-style:dashed}.badge-tile.unlocked{background:white;border:2px solid #d9c5f5}

.profile-badge{display:inline-flex;align-items:center;gap:7px}.profile-badge .badge-flat.tiny{width:24px;height:24px;border:0}.profile-badge .badge-flat.tiny svg{width:23px;height:23px}