gameboard-medium.html

@@ -56,6 +56,7 @@ body {
   box-shadow: 0 3px 6px rgba(0,0,0,0.2), inset 0 0 6px rgba(255,255,255,0.6);
 }
 
+/* === 4×4 GRID === */
 .gameboard {
   flex: 1;
   display: grid;
@@ -66,6 +67,7 @@ body {
   box-sizing: border-box;
 }
 
+/* === CARDS === */
 .card {
   width: 100%;
   height: 100%;
@@ -82,6 +84,7 @@ body {
   border-radius: 10px;
 }
 
+/* Face */
 .front, .back {
   position: absolute;
   width: 100%;
@@ -113,6 +116,7 @@ body {
   filter: drop-shadow(0 3px 4px rgba(0,0,0,0.45));
 }
 
+/* Hover & Flip */
 .card:not(.flipped):hover .front {
   transform: scale(1.05);
   transition: 0.25s;
@@ -120,12 +124,14 @@ body {
 
 .card.flipped .inner { transform: rotateY(180deg); }
 
+/* Match Shine */
 .card.matched .front,
 .card.matched .back {
   border-color: #7affd6;
   box-shadow: 0 0 15px #7affd6, 0 0 30px rgba(122,255,214,0.8);
 }
 
+/* === COMBO POPUP === */
 .combo-popup {
   position: absolute;
   padding: 12px 20px;
@@ -242,6 +248,7 @@ body {
   <div class="end-box">
     <div class="end-title">🎉 Selamat!</div>
     <p>Anda berhasil menyelesaikan permainan!</p>
+
     <div class="score-row"><span>Skor Base:</span> <span id="baseScoreEnd">0</span></div>
     <div class="score-row"><span>Time Bonus:</span> <span id="timeBonusEnd">0</span></div>
     <div class="score-row"><span>Move Bonus:</span> <span id="moveBonusEnd">0</span></div>