用HTML+CSS+JS写一个翻牌游戏，要求精简

好的，下面是一个简单的翻牌游戏的HTML、CSS和JS代码：

HTML代码：

<div class="card">
  <div class="card-inner">
    <div class="card-front"></div>
    <div class="card-back"></div>
  </div>
</div>

CSS代码：

.card {
  width: 100px;
  height: 100px;
  perspective: 600px;
}

.card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.card:hover .card-inner {
  transform: rotateY(180deg);
}

.card-front,
.card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}

.card-front {
  background-color: #333;
}

.card-back {
  background-color: #999;
  transform: rotateY(180deg);
}

JS代码：

// 可以根据需求动态生成多个卡牌
var card = document.querySelector('.card');

card.addEventListener( 'click', function() {
  card.classList.toggle('is-flipped');
});

这个翻牌游戏只有一个卡牌，点击卡牌即可翻转。你可以根据需求动态生成多个卡牌，让游戏更加丰富。