.cui-badge-ring { position:relative; display:inline-block; vertical-align:middle; width:var(--badge-size,162px); max-width:100%; aspect-ratio:1; border-radius:50%; background:var(--badge-background,#2e338c); color:#fff; isolation:isolate; }
.cui-badge-ring .cui-badge-ring__ring { position:absolute; inset:0; display:block; width:100%; height:100%; margin:0; transform-origin:center; animation:cui-badge-ring-spin var(--badge-duration,10s) linear infinite; animation-direction:var(--badge-direction,normal); }
.cui-badge-ring__center { position:absolute; inset:28%; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.cui-badge-ring__center img { display:block; width:100%; height:100%; object-fit:contain; margin:0; }
.cui-badge-ring__center span { font-size:clamp(10px,calc(var(--badge-size,162px) * .148),72px); font-weight:700; color:inherit; line-height:1.2; overflow-wrap:anywhere; }
@keyframes cui-badge-ring-spin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { .cui-badge-ring .cui-badge-ring__ring { animation:none; } }