In order to implement some CSS functions in WebGL, I am trying to understand precisely their implementations.
Currently my problem concerns the mix-blend-mode.

take this example where I apply the following style for an element :

background-blend-mode: difference;
background-image:
  linear-gradient(
    rgba(0,255,153,0.7),
    rgba(0,255,153,0.7)),
  linear-gradient(
    rgba(255,0,51,0.4),
    rgba(255,0,51,0.4));
background-color: rgba(0,0,0,1);

now I read the color obtained with a color picker :

my goal is to find this result (102/255 , 179/255 , 99/255) = (0.4 , 0.7 , 0.388...) by applying the formulas :
https://drafts.fxtf.org/compositing/#blending

Cb = (1,0,0.2) and ab = 0.4
Cs = (0,1,0.6) and as = 0.7

Cm = | Cb - Cs | = (1,1,0.4) .... I'm not sure at all
we replace Cs by Cm :
Cs = (1,1,0.4)

co = Cs x as + (0,0,0) x ab x (1-as)
co = (1,1,0.4) x 0.7
co = (0.7 , 0.7 , 0.28)

ao = as + ab x (1-as)
ao = 0.7 + 0.4 x (1-0.7)
ao = 0.82

Am I applying the theory correctly up to this point? How to continue to find the screenshot result :
(102/255 , 179/255 , 99/255) = (0.4 , 0.7 , 0.388...) ?