body {
    font-family: Arial, sans-serif;
    text-align: center;
    background-color: #f0f8ff;
  }
  
  h1 {
    margin: 20px 0;
  }
  
  .controls {
    margin: 10px;
  }
  
  .game-board {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    max-width: 600px;
    margin: 20px auto;
    gap: 10px;
  }
  
  .card {
    width: 100px;
    height: 100px;
    background-color: #3498db;
    border-radius: 8px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  
  .card img {
    width: 100%;
    height: 100%;
    display: none;
    object-fit: cover;
    border-radius: 8px;
  }
  
  .card.flipped img,
  .card.matched img {
    display: block;
  }
  
  .card.flipped,
  .card.matched {
    background-color: transparent;
  }