.zr-badge{display:inline-block;position:relative;vertical-align:middle;width:20px;height:20px;margin-inline-start:4px;overflow:hidden;border-radius:50%}.zr-badge img{width:20px;height:20px;display:block}.zr-shine{position:relative;overflow:hidden}.zr-shine::after{content:"";position:absolute;inset:-40% auto -40% -60%;width:40%;background:linear-gradient(100deg,transparent,#fff6dd88,transparent);transform:skewX(-20deg);animation:zr-shine 3.6s ease-in-out infinite;pointer-events:none}@keyframes zr-shine{0%,60%{left:-60%}100%{left:130%}}@media (prefers-reduced-motion:reduce){.zr-shine::after{animation:none}}
.zr-badge.zr-faced{overflow:visible}.zr-badge .zr-face{position:absolute;left:50%;top:56%;width:42%;height:42%;transform:translate(-50%,-50%);border-radius:50%;object-fit:cover;border:1px solid #ffe08a;pointer-events:none}
.zr-badge.zr-owner{overflow:visible;width:24px;height:24px}.zr-badge.zr-owner img:not(.zr-face){width:24px;height:24px}
.zr-badge.zr-owner::before{content:"";position:absolute;inset:-4px;z-index:-1;border-radius:50%;background:conic-gradient(#9cc4ff,#fff6d6,#ffd977,#1238b8,#9cc4ff);filter:blur(3px);animation:zr-spin 5s linear infinite}
@keyframes zr-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.zr-badge.zr-owner::before{animation:none}}