JSFiddle - React, Tailwind, and code Playground

JavaScript

e=[13,14,15,4,5,12,6,13,18,7,14,19,1,10,18,1,11,19,2,10,15,3,11,15,9,13,16,8,14,17,4,6,11,5,7,10,1,16,17,0,2,8,0,3,9,0,6,7,8,12,18,9,12,19,2,4,16,3,5,17];
X=[392,107,250,338,107,161,250,382,294,321,36,117,178,338,392,463,205,250,161,250];
Y=[296,203,400,128,296,128,475,67,310,226,319,67,226,371,203,319,310,175,371,100];
A='appendChild';
C='createElement';
W='width';
H='height';
G='background-color';
L='disabled';
I='innerHTML';
N='className';
D=document;
R=Math.random;
B=D.body;
E=[];
F=1<0;
T=!F;
Z=['&#9760;','B','&#9808;','&#9823;'];
s=D[C]('style');
s.type='text/css';
t='.A{position:absolute;left:25px;top:25px}.D{'+W+':50px;'+H+':50px}.D button{'+W+':25px;'+H+':25px;float:left}.R{'+G+':red}.G{'+G+':green}.B{'+G+':blue}';
for(i in X)t+='#D'+i+'{left:'+X[i]+'px;top:'+Y[i]+'px}';
s[A](D.createTextNode(t));
D.head[A](s);
c=D[C]('canvas');
c[N]='A';
c[W]=c[H]=500;
B[A](c);
x=c.getContext('2d');
x.beginPath();
d=(i,b,v)=>{for(j=0;j<3;j++){E[e[3*i+j]][b][L]=v}}
a=(i,l,v)=>{
	t=F;
	for(j=0;j<3;j++)t=e[3*i+j]==l?T:t;
	if(t)M[v]++;
	b=E[i][v];
	b.c=-1;
	for(j=0;j<3;j++)E[e[3*i+j]][v].c+=t?1:-1;
	for(j in E){
		b=E[j][v];
		b[N]=b.c==M[v]?'R':'G';
	}
}
M=[0,0,0];
S=v=>{M[v]=0;for(i in E){E[i][v][N]='';E[i][v].c=0}}
for(i in X){
	for(j=3*i;j<3*i+3;j++){
		x.moveTo(X[i],Y[i]);
		x.lineTo(X[e[j]],Y[e[j]]);
	}
	B[A](v=D[C]('div'));
	v[N]='A D';
	v.id='D'+i
	E[i]=[];
	for(j=0;j<4;j++){
		b=E[i][j]=v[A](D[C]('button'));
		b[L] = true;
		b.i=i;
		b.c=0;
		b[I]=Z[j];
	}
	E[i][2].onclick=function(){
		d(P,2,T);
		d(P,3,T);
		if(this.i==W){
			c[N]+=' G';
		} else {
			S(2);
			W=e[3*W+R()*3|0];
			if(W==P){
				c[N]+=' R';
			} else {
				a(P,W,2);
				d(P,2,F);
				d(P,3,F);
			}
		}
   };
   E[i][3].onclick=function(){
		d(P,2,T);
		d(P,3,T);
		E[P][3][N]='';
		P=this.i;
		if(W==P||Q==P){
			c[N]+=' R';
			return;
		} else...