JSFiddle - React, Tailwind, and code Playground

HTML

<div class="line">
    <div class="block"></div>
    <div class="txt block">☺</div>
    <div class="block">Ставка по умолчанию:</div>
    <input type="text" value="20" id="defbet" />
</div>

<div class="line">
<div class="block">Карты дилера:</div>   
<div id="dcards" class="card block"></div> 
 
    <div class="block"></div> 
<div id="ds" class="card"></div>  
    
</div>    

<div class="line">
    <div class="block">Ваш счет:</div>  
    <div id="money" class="block">10000</div>
    <div class="block">Ваша ставка:</div>  
    <div id="bet">0</div>
</div>
<div class="line">
    
</div>

<div class="line">
    <div class="block">Ваши карты:</div>  
    <div id="mcards" class="card block"></div>
        <div class="block"></div> 
    <div id="ms" class="card"></div>  
</div>
<div class="line">
    <button id="g" class="but block" onclick="window.give();document.getElementById('ds').innerHTML=s(dca);document.getElementById('ms').innerHTML=s(mca)">Раздать</button>
    <button id="d" class="but block" onclick="window.dub();document.getElementById('ds').innerHTML=s(dca);document.getElementById('ms').innerHTML=s(mca)">Удвоить</button>
    <button id="m" class="but block" onclick="window.more();document.getElementById('ds').innerHTML=s(dca);document.getElementById('ms').innerHTML=s(mca)">Ещё</button>
    <button id="e" class="but" onclick="window.enough();document.getElementById('ds').innerHTML=s(dca);document.getElementById('ms').innerHTML=s(mca)">Хватит</button>
    
</div>

<div id="log"></div>

CSS

.txt{
    font-size:75px;
}
.card{
    font-size:30px;   
}
.block{
    width:130px;
    height:75px;
    float:left;
}
.line{
    clear:both;
}
.but{
    height:45px;
    width:85px;
    
}

JavaScript

// Generated by LiveScript 1.2.0
(function(){
  var cards, deck, sdeck, shuffle, gid, mc, dc, defbet, m, bet, mch, dch, l, tod, log, tom, clear, summ, betbet;
  cards = [['🂡', '🂢', '🂣', '🂤', '🂥', '🂦', '🂧', '🂨', '🂩', '🂪', '🂫', '🂭', '🂮'], ['🂱', '🂲', '🂳', '🂴', '🂵', '🂶', '🂷', '🂸', '🂹', '🂺', '🂻', '🂽', '🂾'], ['🃁', '🃂', '🃃', '🃄', '🃅', '🃆', '🃇', '🃈', '🃉', '🃊', '🃋', '🃍', '🃎'], ['🃑', '🃒', '🃓', '🃔', '🃕', '🃖', '🃗', '🃘', '🃙', '🃚', '🃛', '🃝', '🃞']];
  deck = [[0, 0, false], [0, 1, 2], [0, 2, 3], [0, 3, 4], [0, 4, 5], [0, 5, 6], [0, 6, 7], [0, 7, 8], [0, 8, 9], [0, 9, 10], [0, 10, 10], [0, 11, 10], [0, 12, 10], [1, 0, false], [1, 1, 2], [1, 2, 3], [1, 3, 4], [1, 4, 5], [1, 5, 6], [1, 6, 7], [1, 7, 8], [1, 8, 9], [1, 9, 10], [1, 10, 10], [1, 11, 10], [1, 12, 10], [2, 0, false], [2, 1, 2], [2, 2, 3], [2, 3, 4], [2, 4, 5], [2, 5, 6], [2, 6, 7], [2, 7, 8], [2, 8, 9], [2, 9, 10], [2, 10, 10], [2, 11, 10], [2, 12, 10], [3, 0, false], [3, 1, 2], [3, 2, 3], [3, 3, 4], [3, 4, 5], [3, 5, 6], [3, 6, 7], [3, 7, 8], [3, 8, 9], [3, 9, 10], [3, 10, 10], [3, 11, 10], [3, 12, 10]];
  sdeck = JSON.parse(JSON.stringify(deck));
  shuffle = function(){
    var i$, ref$, len$, i, x, ref1$;
    for (i$ = 0, len$ = (ref$ = deck).length; i$ < len$; ++i$) {
      i = i$;
      x = ref$[i$];
      if (x = Math.floor(Math.random() * (i + 1)), true) {
        ref1$ = [deck[x], deck[i]], deck[i] = ref1$[0], deck[x] = ref1$[1];
      }
    }
  };
  gid = function(id){
    return document.getElementById(id);
  };
  window.mca = mc = [];
  window.dca = dc = [];
  defbet = gid("defbet");
  m = gid("money");
  bet = gid("bet");
  mch = gid("mcards");
  dch = gid("dcards");
  l = gid("log");
  tod = function(){
    var c;
    dc.push(c = deck.pop());
    dch.innerHTML += cards[c[0]][c[1]];
  };
  log = function(msg){
    l.innerHTML = msg;
  };
  window.more = tom = function(){
    var c;
    mc.push(c = deck.pop());
    mch.innerHTML += cards[c[0]][c[1]];
    summ(mc) > 21 && (log("Перебор"), gid("d").disabled =...