.badge-three-grid{grid-template-columns:repeat(3,minmax(0,1fr));justify-items:center;gap:8px 2px;display:grid}.badge-section-heading{text-transform:uppercase;color:var(--muted-foreground);margin-bottom:10px;font-size:11px;font-weight:800}.badge-flip{perspective:750px;flex-shrink:1;max-width:100%;position:relative}.badge-flip-inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .5s;position:relative}.badge-flip--open .badge-flip-inner{transform:rotateY(180deg)}.badge-flip-front,.badge-flip-back{backface-visibility:hidden;position:absolute;inset:0}.badge-flip-front{cursor:pointer;background:0 0;border:0;justify-content:center;align-items:flex-end;width:100%;height:100%;padding:0;display:flex}.badge-flip-front svg{width:auto;max-width:100%;height:auto}.badge-flip-back-hit{cursor:pointer;background:0 0;border:0;padding:0;position:absolute;inset:0}.badge-flip-back{color:#fff;text-align:center;background:linear-gradient(155deg,#10254d,#1b3a74);border:2px solid #c98650;border-radius:9px;flex-direction:column;justify-content:center;align-items:stretch;display:flex;overflow:hidden;transform:rotateY(180deg)}.badge-flip--s .badge-flip-back{border-color:#a9b4c2}.badge-flip--g .badge-flip-back{border-color:#e3bb4a}.badge-flip--l .badge-flip-back{background:linear-gradient(155deg,#10254d,#1b3a74) padding-box padding-box,linear-gradient(120deg,#50dcb4,#38b6ff,#9b6bff,#ff6fb1,#ffc440) border-box;border:2px solid #0000}.badge-flip--x .badge-flip-back{border-color:#a8b4bf}.badge-flip-copy{z-index:1;overflow-wrap:anywhere;flex-direction:column;align-items:center;gap:3px;padding:4px 4px 0;font-size:8px;line-height:1.18;display:flex;position:relative}.badge-flip-copy strong{font-size:9px;line-height:1.1}.badge-flip-track{background:#395077;border-radius:5px;width:85%;height:4px;overflow:hidden}.badge-flip-track>div{border-radius:inherit;background:linear-gradient(90deg,#50dcb4,#38b6ff);height:100%}.badge-flip-rarity{background:#fff2;border-radius:10px;padding:2px 4px}.badge-flip-save{z-index:2;color:#fff;white-space:normal;flex-shrink:0;align-self:center;max-width:100%;height:20px;padding:0 2px;font-size:8px;font-weight:700;line-height:1;position:relative}@media(prefers-reduced-motion:reduce){.badge-flip-inner{transition:none}}.badge-showcase{perspective:750px;width:100%;min-width:0;overflow:hidden}.badge-showcase-row{justify-content:center;align-items:flex-end;gap:2px;min-height:98px;display:flex}.badge-showcase-badge{background:0 0;border-radius:0;flex-shrink:1;align-items:flex-end;min-width:0;padding:0;display:flex}.badge-showcase-badge:hover{background:0 0}.badge-showcase-badge svg{width:auto;max-width:100%;height:auto}.badge-showcase-back{border:1px solid var(--border);background:var(--card);width:100%;min-width:0;color:var(--card-foreground);border-radius:8px;flex-direction:column;align-items:stretch;gap:8px;padding:12px;display:flex}.badge-showcase-details{white-space:normal;overflow-wrap:anywhere;text-align:center;width:100%;min-width:0;height:auto;color:inherit;flex-direction:column;gap:8px;padding:0;font-size:12px;font-weight:400;line-height:1.5;display:flex}.badge-showcase-details:hover{color:inherit;background:0 0}.badge-showcase-details strong{font-size:14px}.badge-showcase-track{background:var(--muted);border-radius:4px;width:85%;height:4px;display:block;overflow:hidden}.badge-showcase-track>span{background:var(--primary);height:100%;display:block}.badge-showcase-rarity{background:var(--muted);border-radius:4px;padding:2px 8px}.badge-showcase-save{white-space:normal;overflow-wrap:anywhere;align-self:center;max-width:100%;height:auto;min-height:36px}.badge-showcase-turn{transform-origin:50%;animation:.5s cubic-bezier(.22,1,.36,1) badge-showcase-turn}@keyframes badge-showcase-turn{0%{opacity:0;transform:rotateY(-90deg)}to{opacity:1;transform:rotateY(0)}}@media(prefers-reduced-motion:reduce){.badge-showcase-turn{animation:none}}
