.badge{--hex:polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);width:var(--s);height:calc(var(--s) * 1.1);filter:drop-shadow(0 0 calc(var(--s) * .09) color-mix(in srgb, var(--rar) 65%, transparent)) drop-shadow(0 calc(var(--s) * .04) calc(var(--s) * .05) #0000008c);flex-shrink:0;display:inline-block;position:relative}.badge-rim{clip-path:var(--hex);background:conic-gradient(from 200deg, color-mix(in srgb, var(--rar) 35%, #fff), var(--rar), color-mix(in srgb, var(--rar) 45%, #05070c), color-mix(in srgb, var(--rar) 60%, #fff), var(--rar), color-mix(in srgb, var(--rar) 50%, #05070c), color-mix(in srgb, var(--rar) 35%, #fff));position:absolute;inset:0}.badge-core{clip-path:var(--hex);background:radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--tone) 70%, #fff) 0%, var(--tone) 42%, color-mix(in srgb, var(--tone) 35%, #05070c) 100%);box-shadow:inset 0 0 calc(var(--s) * .12) #0000008c;justify-content:center;align-items:center;display:flex;position:absolute;inset:9%;overflow:hidden}.badge-core:before{content:"";z-index:1;pointer-events:none;background:linear-gradient(#ffffff80,#ffffff0d);border-radius:50%;height:72%;position:absolute;top:-38%;left:-15%;right:-15%}.badge-icon{color:#fff;filter:drop-shadow(0 1px 1px #0000008c) drop-shadow(0 0 4px color-mix(in srgb, var(--tone) 70%, #fff));position:relative}.badge-shine .badge-core:after{content:"";z-index:2;pointer-events:none;background:linear-gradient(115deg,#0000 38%,#ffffffb3 50%,#0000 62%);animation:3.6s ease-in-out infinite badge-sweep;position:absolute;inset:-30%;transform:translate(-130%)}@keyframes badge-sweep{0%,55%{transform:translate(-130%)}to{transform:translate(130%)}}.badge-legendary:before{content:"";z-index:-1;background:radial-gradient(circle, color-mix(in srgb, var(--rar) 60%, transparent) 30%, transparent 70%);opacity:.25;pointer-events:none;border-radius:50%;animation:2.6s ease-in-out infinite badge-halo;position:absolute;inset:-18%}@keyframes badge-halo{0%,to{opacity:.25}50%{opacity:.85}}.badge-image{height:var(--s)}.badge-image.badge-shine:after{content:"";-webkit-mask:var(--mask) center / contain no-repeat;-webkit-mask:var(--mask) center / contain no-repeat;mask:var(--mask) center / contain no-repeat;pointer-events:none;background:linear-gradient(115deg,#0000 40%,#ffffffa6 50%,#0000 60%) 150% 0/300% 100% no-repeat;animation:3.6s ease-in-out infinite badge-sweep-image;position:absolute;inset:0}@keyframes badge-sweep-image{0%,55%{background-position:150% 0}to{background-position:-50% 0}}.badge-art{height:var(--s)}.badge-art-svg,.badge-art-rank,.badge-art-rank .lvl-art{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.badge-shine .sb-shine{animation:3.6s ease-in-out infinite sb-sweep}@keyframes sb-sweep{0%,55%{transform:translate(0)}to{transform:translate(400px)}}