.anillo-historias{isolation:isolate;border-radius:9999px;padding:2px;position:relative}.anillo-historias:before{content:"";z-index:-1;border-radius:inherit;background:conic-gradient(from var(--anillo-giro,0deg), var(--historia-a), var(--historia-b), var(--historia-c), var(--historia-a));animation:3s linear infinite anillo-girar;position:absolute;inset:0}.anillo-historias[data-vistas]:before{background:var(--historia-vista);animation:none}@property --anillo-giro{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes anillo-girar{to{--anillo-giro:360deg}}.barra-historia{background:color-mix(in oklch, var(--sobre-media) 35%, transparent);border-radius:9999px;flex:1;height:3px;overflow:hidden}.barra-historia>span{height:100%;width:calc(var(--avance,0) * 100%);background:var(--sobre-media);display:block}@media (prefers-reduced-motion:reduce){.anillo-historias:before{animation:none}}