@charset "utf-8";
/* CSS Document */
	/*Code obtained from: share.google/aimode/nQMVMinl68h71l53M*/
        /* CSS: Styles the board and flip animations */
       
      .stats { margin: 20px; font-size: 1.2rem; }
        .game-board { 
            display: grid; 
            grid-template-columns: repeat(4, 100px); 
            gap: 10px; 
            perspective: 1000px; 
        }
        .card { 
            width: 100px; height: 100px; 
            cursor: pointer; position: relative; 
            transform-style: preserve-3d; transition: transform 0.6s; 
        }
        .card.flipped { transform: rotateY(180deg); }
        .card.matched { cursor: default; visibility: hidden; transition: visibility 0s 0.6s; }
        .front, .back {
            position: absolute; width: 100%; height: 100%;
            backface-visibility: hidden; display: flex;
            align-items: center; justify-content: center;
            font-size: 2rem; border-radius: 8px; box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        }
        .back { background-color: #ffdf00; color: #000; } /* Face down */
        .front { background-color: #ffffff; transform: rotateY(180deg); } /* Face up */
        button { margin-top: 20px; padding: 10px 20px; font-size: 1rem; cursor: pointer; }