Jogo da Mem\u00f3ria STEAM<\/title>\n <style>\n #memory-game-wrapper {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: transparent;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 20px;\n margin: 0;\n #memory-game-wrapper .memory-card.flipped,\n #memory-game-wrapper .memory-card.matched {\n font-size: 0.7em;\n }\n }\n\n #memory-game-wrapper * {\n box-sizing: border-box;\n }\n\n #memory-game-wrapper .memory-container {\n background: white;\n border-radius: 20px;\n padding: 30px;\n box-shadow: 0 20px 60px rgba(0,0,0,0.3);\n max-width: 700px;\n width: 100%;\n }\n\n #memory-game-wrapper .memory-title {\n text-align: center;\n color: #10b981;\n margin: 0 0 10px 0;\n font-size: 2em;\n font-weight: bold;\n }\n\n #memory-game-wrapper .memory-instructions {\n text-align: center;\n color: #6b7280;\n margin: 0 0 20px 0;\n font-size: 1.1em;\n }\n\n #memory-game-wrapper .memory-info {\n display: flex;\n justify-content: space-around;\n margin-bottom: 20px;\n padding: 15px;\n background: #f8f9fa;\n border-radius: 10px;\n }\n\n #memory-game-wrapper .memory-info > div {\n text-align: center;\n }\n\n #memory-game-wrapper .memory-info-label {\n font-size: 0.9em;\n color: #666;\n margin-bottom: 5px;\n }\n\n #memory-game-wrapper .memory-info-value {\n font-size: 1.5em;\n font-weight: bold;\n color: #10b981;\n }\n\n #memory-game-wrapper .memory-grid {\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n gap: 15px;\n margin-bottom: 20px;\n }\n\n #memory-game-wrapper .memory-card {\n aspect-ratio: 1;\n background: #080739;\n border: none;\n border-radius: 15px;\n font-size: 0.95em;\n font-weight: bold;\n color: white;\n cursor: pointer;\n transition: all 0.3s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n padding: 0;\n box-shadow: 0 4px 10px rgba(0,0,0,0.2);\n position: relative;\n transform-style: preserve-3d;\n touch-action: manipulation;\n -webkit-tap-highlight-color: transparent;\n word-wrap: break-word;\n overflow-wrap: break-word;\n hyphens: auto;\n -webkit-hyphens: auto;\n -ms-hyphens: auto;\n overflow: hidden;\n }\n\n #memory-game-wrapper .memory-card img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 15px;\n }\n\n \/* Cores para cada letra *\/\n #memory-game-wrapper .memory-card.pair-0 {\n background: #080739;\n }\n\n #memory-game-wrapper .memory-card.pair-1 {\n background: #080739;\n }\n\n #memory-game-wrapper .memory-card.pair-2 {\n background: #080739;\n }\n\n #memory-game-wrapper .memory-card.pair-3 {\n background: #080739;\n }\n\n #memory-game-wrapper .memory-card.pair-4 {\n background: #080739;\n }\n\n #memory-game-wrapper .memory-card.pair-5 {\n background: #080739;\n }\n\n \/* Cores quando virada - S (Vermelho) *\/\n #memory-game-wrapper .memory-card.flipped.pair-0,\n #memory-game-wrapper .memory-card.matched.pair-0 {\n background: linear-gradient(135deg, #FF6B6B 0%, #FF5252 100%);\n border: none;\n color: #8B0000;\n }\n\n \/* Cores quando virada - T (Amarelo) *\/\n #memory-game-wrapper .memory-card.flipped.pair-1,\n #memory-game-wrapper .memory-card.matched.pair-1 {\n background: linear-gradient(135deg, #FFD93D 0%, #FFC93D 100%);\n border: none;\n color: #8B6F00;\n }\n\n \/* Cores quando virada - E (Verde) *\/\n #memory-game-wrapper .memory-card.flipped.pair-2,\n #memory-game-wrapper .memory-card.matched.pair-2 {\n background: linear-gradient(135deg, #10b981 0%, #059669 100%);\n border: none;\n color: #065F46;\n }\n\n \/* Cores quando virada - A (Azul) *\/\n #memory-game-wrapper .memory-card.flipped.pair-3,\n #memory-game-wrapper .memory-card.matched.pair-3 {\n background: linear-gradient(135deg, #3498DB 0%, #2980B9 100%);\n border: none;\n color: #003A70;\n }\n\n \/* Cores quando virada - M (Roxo) *\/\n #memory-game-wrapper .memory-card.flipped.pair-4,\n #memory-game-wrapper .memory-card.matched.pair-4 {\n background: linear-gradient(135deg, #9B59B6 0%, #8E44AD 100%);\n border: none;\n color: #4A0080;\n }\n\n \/* Cores quando virada - STEAM (Degrad\u00ea) *\/\n #memory-game-wrapper .memory-card.flipped.pair-5,\n #memory-game-wrapper .memory-card.matched.pair-5 {\n background: linear-gradient(135deg, #FF6B6B 0%, #FFD93D 25%, #10b981 50%, #3498DB 75%, #9B59B6 100%);\n border: none;\n color: #080739;\n }\n\n #memory-game-wrapper .memory-card:hover:not(.flipped):not(.matched) {\n transform: scale(1.05);\n box-shadow: 0 6px 15px rgba(0,0,0,0.3);\n }\n\n #memory-game-wrapper .memory-card.flipped {\n background: white;\n color: #1f2937;\n border: 3px solid #10b981;\n font-size: 0.85em;\n line-height: 1.25;\n overflow: hidden;\n }\n\n #memory-game-wrapper .memory-card.matched {\n background: #c6f6d5;\n color: #22543d;\n border: 3px solid #10b981;\n cursor: default;\n font-size: 0.85em;\n line-height: 1.25;\n overflow: hidden;\n }\n\n #memory-game-wrapper .memory-card.wrong {\n animation: shake 0.5s ease;\n background: #fecaca;\n border: 3px solid #dc2626;\n }\n\n #memory-game-wrapper .memory-buttons {\n display: flex;\n gap: 10px;\n margin-bottom: 15px;\n }\n\n #memory-game-wrapper .memory-button {\n flex: 1;\n padding: 15px;\n border: none;\n border-radius: 10px;\n font-size: 1em;\n font-weight: bold;\n cursor: pointer;\n transition: all 0.3s ease;\n background: #10b981;\n color: white;\n }\n\n #memory-game-wrapper .memory-button:hover {\n background: #059669;\n transform: translateY(-2px);\n box-shadow: 0 5px 15px rgba(16, 185, 129, 0.4);\n }\n\n #memory-game-wrapper .memory-message {\n text-align: center;\n padding: 15px;\n border-radius: 10px;\n font-weight: bold;\n display: none;\n }\n\n #memory-game-wrapper .memory-message.show {\n display: block;\n animation: slideIn 0.5s ease;\n }\n\n #memory-game-wrapper .memory-message.success {\n background: #c6f6d5;\n color: #22543d;\n }\n\n @keyframes slideIn {\n from {\n opacity: 0;\n transform: translateY(-20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n @keyframes shake {\n 0%, 100% { transform: translateX(0); }\n 25% { transform: translateX(-10px); }\n 75% { transform: translateX(10px); }\n }\n\n @media (max-width: 600px) {\n #memory-game-wrapper .memory-container {\n padding: 20px;\n }\n\n #memory-game-wrapper .memory-title {\n font-size: 1.5em;\n }\n \n #memory-game-wrapper .memory-instructions {\n font-size: 1em;\n }\n\n #memory-game-wrapper .memory-grid {\n grid-template-columns: repeat(3, 1fr);\n gap: 10px;\n }\n\n #memory-game-wrapper .memory-card {\n font-size: 0.75em;\n padding: 5px;\n min-height: 80px;\n }\n\n #memory-game-wrapper .memory-info {\n flex-direction: column;\n gap: 10px;\n }\n\n #memory-game-wrapper .memory-info > div {\n padding: 5px 0;\n }\n\n #memory-game-wrapper .memory-info-value {\n font-size: 1.3em;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div id=\"memory-game-wrapper\">\n <div class=\"memory-container\">\n \n <p class=\"memory-instructions\">Combine as cartas com seu significado<\/p>\n \n <div class=\"memory-info\">\n <div>\n <div class=\"memory-info-label\">Tentativas<\/div>\n <div class=\"memory-info-value\" id=\"attempts\">0<\/div>\n <\/div>\n <div>\n <div class=\"memory-info-label\">Acertos<\/div>\n <div class=\"memory-info-value\" id=\"matches\">0\/6<\/div>\n <\/div>\n <div>\n <div class=\"memory-info-label\">Tempo<\/div>\n <div class=\"memory-info-value\" id=\"timer\">0min 0s<\/div>\n <\/div>\n <\/div>\n\n <div class=\"memory-grid\" id=\"memoryGrid\"><\/div>\n\n <div class=\"memory-buttons\">\n <button class=\"memory-button\" id=\"newGame\">\ud83c\udfae Novo Jogo<\/button>\n <\/div>\n\n <div class=\"memory-message\" id=\"message\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n (function() {\n const pairs = [\n { \n letter: 'S', \n meaning: 'Ci\u00eancia',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Ciencia.png',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Ciencia-2.jpg'\n },\n { \n letter: 'T', \n meaning: 'Tecnologia',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Tecnologia.png',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Tecnologia-2.png'\n },\n { \n letter: 'E', \n meaning: 'Engenharia',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Engenharia.png',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Engenharia-2.png'\n },\n { \n letter: 'A', \n meaning: 'Artes',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Artes.png',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Artes-2.png'\n },\n { \n letter: 'M', \n meaning: 'Matem\u00e1tica',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Matematica.png',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Matematica-2.png'\n },\n { \n letter: 'STEAM', \n meaning: 'Ensino Interdisciplinar',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/STEAM.jpg',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/STEAM-2-1-1.png'\n }\n ];\n\n let cards = [];\n let flippedCards = [];\n let matchedPairs = 0;\n let attempts = 0;\n let seconds = 0;\n let timerInterval = null;\n let canFlip = true;\n let gameStarted = false;\n\n const gridEl = document.getElementById('memoryGrid');\n const attemptsEl = document.getElementById('attempts');\n const matchesEl = document.getElementById('matches');\n const timerEl = document.getElementById('timer');\n const messageEl = document.getElementById('message');\n const newGameBtn = document.getElementById('newGame');\n\n function initGame() {\n matchedPairs = 0;\n attempts = 0;\n seconds = 0;\n flippedCards = [];\n canFlip = true;\n\n attemptsEl.textContent = '0';\n matchesEl.textContent = '0\/6';\n timerEl.textContent = '0min 0s';\n \n stopTimer();\n gameStarted = false;\n hideMessage();\n createCards();\n renderCards();\n }\n\n function createCards() {\n cards = [];\n pairs.forEach((pair, index) => {\n cards.push({\n id: `letter-${index}`,\n content: pair.letter,\n type: 'letter',\n pairId: index,\n matched: false,\n letterImage: pair.letterImage\n });\n cards.push({\n id: `meaning-${index}`,\n content: pair.meaning,\n type: 'meaning',\n pairId: index,\n matched: false,\n meaningImage: pair.meaningImage\n });\n });\n shuffleArray(cards);\n }\n\n function shuffleArray(array) {\n for (let i = array.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [array[i], array[j]] = [array[j], array[i]];\n }\n }\n\n function renderCards() {\n gridEl.innerHTML = '';\n cards.forEach((card, index) => {\n const cardEl = document.createElement('div');\n cardEl.className = `memory-card pair-${card.pairId}`;\n \n const img = document.createElement('img');\n img.src = 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Verso-Carta-STEAM.png';\n img.alt = 'Verso da carta';\n cardEl.appendChild(img);\n \n cardEl.dataset.index = index;\n cardEl.addEventListener('click', () => flipCard(index));\n gridEl.appendChild(cardEl);\n });\n }\n\n function flipCard(index) {\n if (!canFlip) return;\n \n const card = cards[index];\n const cardEl = gridEl.children[index];\n\n if (card.matched || flippedCards.includes(index)) return;\n\n if (!gameStarted) {\n startTimer();\n gameStarted = true;\n }\n\n cardEl.classList.add('flipped');\n \n if (card.type === 'letter') {\n const img = document.createElement('img');\n img.src = card.letterImage;\n img.alt = card.content;\n cardEl.innerHTML = '';\n cardEl.appendChild(img);\n } else {\n const img = document.createElement('img');\n img.src = card.meaningImage;\n img.alt = card.content;\n cardEl.innerHTML = '';\n cardEl.appendChild(img);\n }\n \n flippedCards.push(index);\n\n if (flippedCards.length === 2) {\n canFlip = false;\n attempts++;\n attemptsEl.textContent = attempts;\n checkMatch();\n }\n }\n\n function checkMatch() {\n const [index1, index2] = flippedCards;\n const card1 = cards[index1];\n const card2 = cards[index2];\n const cardEl1 = gridEl.children[index1];\n const cardEl2 = gridEl.children[index2];\n\n if (card1.pairId === card2.pairId && card1.type !== card2.type) {\n setTimeout(() => {\n card1.matched = true;\n card2.matched = true;\n cardEl1.classList.remove('flipped');\n cardEl1.classList.add('matched');\n \n if (card1.type === 'letter') {\n const img1 = document.createElement('img');\n img1.src = card1.letterImage;\n img1.alt = card1.content;\n cardEl1.innerHTML = '';\n cardEl1.appendChild(img1);\n } else {\n const img1 = document.createElement('img');\n img1.src = card1.meaningImage;\n img1.alt = card1.content;\n cardEl1.innerHTML = '';\n cardEl1.appendChild(img1);\n }\n \n cardEl2.classList.remove('flipped');\n cardEl2.classList.add('matched');\n \n if (card2.type === 'letter') {\n const img2 = document.createElement('img');\n img2.src = card2.letterImage;\n img2.alt = card2.content;\n cardEl2.innerHTML = '';\n cardEl2.appendChild(img2);\n } else {\n const img2 = document.createElement('img');\n img2.src = card2.meaningImage;\n img2.alt = card2.content;\n cardEl2.innerHTML = '';\n cardEl2.appendChild(img2);\n }\n \n matchedPairs++;\n matchesEl.textContent = `${matchedPairs}\/6`;\n \n flippedCards = [];\n canFlip = true;\n\n if (matchedPairs === 6) {\n endGame();\n }\n }, 500);\n } else {\n setTimeout(() => {\n cardEl1.classList.add('wrong');\n cardEl2.classList.add('wrong');\n \n setTimeout(() => {\n cardEl1.classList.remove('flipped', 'wrong');\n cardEl2.classList.remove('flipped', 'wrong');\n cardEl1.innerHTML = '<img decoding=\"async\" src=\"https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Verso-Carta-STEAM.png\" alt=\"Verso da carta\">';\n cardEl2.innerHTML = '<img decoding=\"async\" src=\"https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Verso-Carta-STEAM.png\" alt=\"Verso da carta\">';\n flippedCards = [];\n canFlip = true;\n }, 500);\n }, 1000);\n }\n }\n\n function startTimer() {\n timerInterval = setInterval(() => {\n seconds++;\n const mins = Math.floor(seconds \/ 60);\n const secs = seconds % 60;\n timerEl.textContent = `${mins}min ${secs}s`;\n }, 1000);\n }\n\n function stopTimer() {\n clearInterval(timerInterval);\n }\n\n function endGame() {\n stopTimer();\n showMessage(`\ud83c\udf89 Parab\u00e9ns! Voc\u00ea completou em ${attempts} tentativas e ${timerEl.textContent}!`, 'success');\n }\n\n function showMessage(text, type) {\n messageEl.textContent = text;\n messageEl.className = `memory-message show ${type}`;\n }\n\n function hideMessage() {\n messageEl.className = 'memory-message';\n }\n\n newGameBtn.addEventListener('click', initGame);\n\n initGame();\n })();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>\u2713 Atividade alinhada \u00e0 Base Nacional Comum Curricular (BNCC), BNCC da Computa\u00e7\u00e3o e aos Objetivos de Desenvolvimento Sustent\u00e1vel (ODS) da ONU. <a style=\"background-color: #e6c15a; color: #2f2f2f; padding: 4px 10px; border-radius: 3px; text-decoration: none; font-weight: 500; display: inline-block;\" href=\"https:\/\/siminova.com.br\/blog\/amigos\/alinhamento\/jogo-da-memoria-steam\/\"> \u203a Saiba mais <\/a><\/p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\"><summary>Vis\u00e3o Geral do Alinhamento<\/summary>\n<p class=\"has-small-font-size\">EI03EO02, EI03EF01, EI03ET05, EI03ET07, EF15LP03, EF35LP03, EF02MA12, EF15AR26, EF07CI11, EF06MA23, EF69AR35, EI03CO01, EI03CO06, EI03CO09, EI03CO10, EF01CO01, EF01CO02, EF01CO06, EF02CO01, EF02CO05, EF03CO01, EF03CO03, EF03CO08, EF06CO10, EM13CO15, ODS 4, ODS 9 e ODS 10.<\/p>\n<\/details>\n","protected":false},"excerpt":{"rendered":"<p>Combine as cartas com seu significado!<\/p>\n<p><b> N\u00cdVEL INTERMEDI\u00c1RIO<\/B><\/p>\n","protected":false},"author":8,"featured_media":4473,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rs_blank_template":"","rs_page_bg_color":"","slide_template_v7":"","footnotes":"","_links_to":"","_links_to_target":""},"categories":[77],"tags":[79],"class_list":["post-4071","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-jogos","tag-notts"],"_links":{"self":[{"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts\/4071","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/comments?post=4071"}],"version-history":[{"count":42,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts\/4071\/revisions"}],"predecessor-version":[{"id":5164,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts\/4071\/revisions\/5164"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/media\/4473"}],"wp:attachment":[{"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/media?parent=4071"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/categories?post=4071"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/tags?post=4071"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":4071,"date":"2026-03-01T09:19:17","date_gmt":"2026-03-01T12:19:17","guid":{"rendered":"https:\/\/siminova.com.br\/blog\/?p=4071"},"modified":"2026-03-13T09:43:58","modified_gmt":"2026-03-13T12:43:58","slug":"jogo-da-memoria-steam","status":"publish","type":"post","link":"https:\/\/siminova.com.br\/blog\/2026\/03\/jogo-da-memoria-steam\/","title":{"rendered":"Jogo da Mem\u00f3ria STEAM"},"content":{"rendered":"\n

STEAM \u00e9 a sigla (em ingl\u00eas) para
Ci\u00eancias<\/strong> (S), Tecnologia <\/strong>(T), Engenharia<\/strong> (E), Artes <\/strong>(A) e Matem\u00e1tica<\/strong> (M).
Saiba mais<\/a>!<\/p>\n\n\n\n\n\n\n \n \n Jogo da Mem\u00f3ria STEAM<\/title>\n <style>\n #memory-game-wrapper {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: transparent;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 20px;\n margin: 0;\n #memory-game-wrapper .memory-card.flipped,\n #memory-game-wrapper .memory-card.matched {\n font-size: 0.7em;\n }\n }\n\n #memory-game-wrapper * {\n box-sizing: border-box;\n }\n\n #memory-game-wrapper .memory-container {\n background: white;\n border-radius: 20px;\n padding: 30px;\n box-shadow: 0 20px 60px rgba(0,0,0,0.3);\n max-width: 700px;\n width: 100%;\n }\n\n #memory-game-wrapper .memory-title {\n text-align: center;\n color: #10b981;\n margin: 0 0 10px 0;\n font-size: 2em;\n font-weight: bold;\n }\n\n #memory-game-wrapper .memory-instructions {\n text-align: center;\n color: #6b7280;\n margin: 0 0 20px 0;\n font-size: 1.1em;\n }\n\n #memory-game-wrapper .memory-info {\n display: flex;\n justify-content: space-around;\n margin-bottom: 20px;\n padding: 15px;\n background: #f8f9fa;\n border-radius: 10px;\n }\n\n #memory-game-wrapper .memory-info > div {\n text-align: center;\n }\n\n #memory-game-wrapper .memory-info-label {\n font-size: 0.9em;\n color: #666;\n margin-bottom: 5px;\n }\n\n #memory-game-wrapper .memory-info-value {\n font-size: 1.5em;\n font-weight: bold;\n color: #10b981;\n }\n\n #memory-game-wrapper .memory-grid {\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n gap: 15px;\n margin-bottom: 20px;\n }\n\n #memory-game-wrapper .memory-card {\n aspect-ratio: 1;\n background: #080739;\n border: none;\n border-radius: 15px;\n font-size: 0.95em;\n font-weight: bold;\n color: white;\n cursor: pointer;\n transition: all 0.3s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n padding: 0;\n box-shadow: 0 4px 10px rgba(0,0,0,0.2);\n position: relative;\n transform-style: preserve-3d;\n touch-action: manipulation;\n -webkit-tap-highlight-color: transparent;\n word-wrap: break-word;\n overflow-wrap: break-word;\n hyphens: auto;\n -webkit-hyphens: auto;\n -ms-hyphens: auto;\n overflow: hidden;\n }\n\n #memory-game-wrapper .memory-card img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 15px;\n }\n\n \/* Cores para cada letra *\/\n #memory-game-wrapper .memory-card.pair-0 {\n background: #080739;\n }\n\n #memory-game-wrapper .memory-card.pair-1 {\n background: #080739;\n }\n\n #memory-game-wrapper .memory-card.pair-2 {\n background: #080739;\n }\n\n #memory-game-wrapper .memory-card.pair-3 {\n background: #080739;\n }\n\n #memory-game-wrapper .memory-card.pair-4 {\n background: #080739;\n }\n\n #memory-game-wrapper .memory-card.pair-5 {\n background: #080739;\n }\n\n \/* Cores quando virada - S (Vermelho) *\/\n #memory-game-wrapper .memory-card.flipped.pair-0,\n #memory-game-wrapper .memory-card.matched.pair-0 {\n background: linear-gradient(135deg, #FF6B6B 0%, #FF5252 100%);\n border: none;\n color: #8B0000;\n }\n\n \/* Cores quando virada - T (Amarelo) *\/\n #memory-game-wrapper .memory-card.flipped.pair-1,\n #memory-game-wrapper .memory-card.matched.pair-1 {\n background: linear-gradient(135deg, #FFD93D 0%, #FFC93D 100%);\n border: none;\n color: #8B6F00;\n }\n\n \/* Cores quando virada - E (Verde) *\/\n #memory-game-wrapper .memory-card.flipped.pair-2,\n #memory-game-wrapper .memory-card.matched.pair-2 {\n background: linear-gradient(135deg, #10b981 0%, #059669 100%);\n border: none;\n color: #065F46;\n }\n\n \/* Cores quando virada - A (Azul) *\/\n #memory-game-wrapper .memory-card.flipped.pair-3,\n #memory-game-wrapper .memory-card.matched.pair-3 {\n background: linear-gradient(135deg, #3498DB 0%, #2980B9 100%);\n border: none;\n color: #003A70;\n }\n\n \/* Cores quando virada - M (Roxo) *\/\n #memory-game-wrapper .memory-card.flipped.pair-4,\n #memory-game-wrapper .memory-card.matched.pair-4 {\n background: linear-gradient(135deg, #9B59B6 0%, #8E44AD 100%);\n border: none;\n color: #4A0080;\n }\n\n \/* Cores quando virada - STEAM (Degrad\u00ea) *\/\n #memory-game-wrapper .memory-card.flipped.pair-5,\n #memory-game-wrapper .memory-card.matched.pair-5 {\n background: linear-gradient(135deg, #FF6B6B 0%, #FFD93D 25%, #10b981 50%, #3498DB 75%, #9B59B6 100%);\n border: none;\n color: #080739;\n }\n\n #memory-game-wrapper .memory-card:hover:not(.flipped):not(.matched) {\n transform: scale(1.05);\n box-shadow: 0 6px 15px rgba(0,0,0,0.3);\n }\n\n #memory-game-wrapper .memory-card.flipped {\n background: white;\n color: #1f2937;\n border: 3px solid #10b981;\n font-size: 0.85em;\n line-height: 1.25;\n overflow: hidden;\n }\n\n #memory-game-wrapper .memory-card.matched {\n background: #c6f6d5;\n color: #22543d;\n border: 3px solid #10b981;\n cursor: default;\n font-size: 0.85em;\n line-height: 1.25;\n overflow: hidden;\n }\n\n #memory-game-wrapper .memory-card.wrong {\n animation: shake 0.5s ease;\n background: #fecaca;\n border: 3px solid #dc2626;\n }\n\n #memory-game-wrapper .memory-buttons {\n display: flex;\n gap: 10px;\n margin-bottom: 15px;\n }\n\n #memory-game-wrapper .memory-button {\n flex: 1;\n padding: 15px;\n border: none;\n border-radius: 10px;\n font-size: 1em;\n font-weight: bold;\n cursor: pointer;\n transition: all 0.3s ease;\n background: #10b981;\n color: white;\n }\n\n #memory-game-wrapper .memory-button:hover {\n background: #059669;\n transform: translateY(-2px);\n box-shadow: 0 5px 15px rgba(16, 185, 129, 0.4);\n }\n\n #memory-game-wrapper .memory-message {\n text-align: center;\n padding: 15px;\n border-radius: 10px;\n font-weight: bold;\n display: none;\n }\n\n #memory-game-wrapper .memory-message.show {\n display: block;\n animation: slideIn 0.5s ease;\n }\n\n #memory-game-wrapper .memory-message.success {\n background: #c6f6d5;\n color: #22543d;\n }\n\n @keyframes slideIn {\n from {\n opacity: 0;\n transform: translateY(-20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n @keyframes shake {\n 0%, 100% { transform: translateX(0); }\n 25% { transform: translateX(-10px); }\n 75% { transform: translateX(10px); }\n }\n\n @media (max-width: 600px) {\n #memory-game-wrapper .memory-container {\n padding: 20px;\n }\n\n #memory-game-wrapper .memory-title {\n font-size: 1.5em;\n }\n \n #memory-game-wrapper .memory-instructions {\n font-size: 1em;\n }\n\n #memory-game-wrapper .memory-grid {\n grid-template-columns: repeat(3, 1fr);\n gap: 10px;\n }\n\n #memory-game-wrapper .memory-card {\n font-size: 0.75em;\n padding: 5px;\n min-height: 80px;\n }\n\n #memory-game-wrapper .memory-info {\n flex-direction: column;\n gap: 10px;\n }\n\n #memory-game-wrapper .memory-info > div {\n padding: 5px 0;\n }\n\n #memory-game-wrapper .memory-info-value {\n font-size: 1.3em;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div id=\"memory-game-wrapper\">\n <div class=\"memory-container\">\n \n <p class=\"memory-instructions\">Combine as cartas com seu significado<\/p>\n \n <div class=\"memory-info\">\n <div>\n <div class=\"memory-info-label\">Tentativas<\/div>\n <div class=\"memory-info-value\" id=\"attempts\">0<\/div>\n <\/div>\n <div>\n <div class=\"memory-info-label\">Acertos<\/div>\n <div class=\"memory-info-value\" id=\"matches\">0\/6<\/div>\n <\/div>\n <div>\n <div class=\"memory-info-label\">Tempo<\/div>\n <div class=\"memory-info-value\" id=\"timer\">0min 0s<\/div>\n <\/div>\n <\/div>\n\n <div class=\"memory-grid\" id=\"memoryGrid\"><\/div>\n\n <div class=\"memory-buttons\">\n <button class=\"memory-button\" id=\"newGame\">\ud83c\udfae Novo Jogo<\/button>\n <\/div>\n\n <div class=\"memory-message\" id=\"message\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n (function() {\n const pairs = [\n { \n letter: 'S', \n meaning: 'Ci\u00eancia',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Ciencia.png',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Ciencia-2.jpg'\n },\n { \n letter: 'T', \n meaning: 'Tecnologia',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Tecnologia.png',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Tecnologia-2.png'\n },\n { \n letter: 'E', \n meaning: 'Engenharia',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Engenharia.png',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Engenharia-2.png'\n },\n { \n letter: 'A', \n meaning: 'Artes',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Artes.png',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Artes-2.png'\n },\n { \n letter: 'M', \n meaning: 'Matem\u00e1tica',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Matematica.png',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Matematica-2.png'\n },\n { \n letter: 'STEAM', \n meaning: 'Ensino Interdisciplinar',\n letterImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/STEAM.jpg',\n meaningImage: 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/STEAM-2-1-1.png'\n }\n ];\n\n let cards = [];\n let flippedCards = [];\n let matchedPairs = 0;\n let attempts = 0;\n let seconds = 0;\n let timerInterval = null;\n let canFlip = true;\n let gameStarted = false;\n\n const gridEl = document.getElementById('memoryGrid');\n const attemptsEl = document.getElementById('attempts');\n const matchesEl = document.getElementById('matches');\n const timerEl = document.getElementById('timer');\n const messageEl = document.getElementById('message');\n const newGameBtn = document.getElementById('newGame');\n\n function initGame() {\n matchedPairs = 0;\n attempts = 0;\n seconds = 0;\n flippedCards = [];\n canFlip = true;\n\n attemptsEl.textContent = '0';\n matchesEl.textContent = '0\/6';\n timerEl.textContent = '0min 0s';\n \n stopTimer();\n gameStarted = false;\n hideMessage();\n createCards();\n renderCards();\n }\n\n function createCards() {\n cards = [];\n pairs.forEach((pair, index) => {\n cards.push({\n id: `letter-${index}`,\n content: pair.letter,\n type: 'letter',\n pairId: index,\n matched: false,\n letterImage: pair.letterImage\n });\n cards.push({\n id: `meaning-${index}`,\n content: pair.meaning,\n type: 'meaning',\n pairId: index,\n matched: false,\n meaningImage: pair.meaningImage\n });\n });\n shuffleArray(cards);\n }\n\n function shuffleArray(array) {\n for (let i = array.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [array[i], array[j]] = [array[j], array[i]];\n }\n }\n\n function renderCards() {\n gridEl.innerHTML = '';\n cards.forEach((card, index) => {\n const cardEl = document.createElement('div');\n cardEl.className = `memory-card pair-${card.pairId}`;\n \n const img = document.createElement('img');\n img.src = 'https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Verso-Carta-STEAM.png';\n img.alt = 'Verso da carta';\n cardEl.appendChild(img);\n \n cardEl.dataset.index = index;\n cardEl.addEventListener('click', () => flipCard(index));\n gridEl.appendChild(cardEl);\n });\n }\n\n function flipCard(index) {\n if (!canFlip) return;\n \n const card = cards[index];\n const cardEl = gridEl.children[index];\n\n if (card.matched || flippedCards.includes(index)) return;\n\n if (!gameStarted) {\n startTimer();\n gameStarted = true;\n }\n\n cardEl.classList.add('flipped');\n \n if (card.type === 'letter') {\n const img = document.createElement('img');\n img.src = card.letterImage;\n img.alt = card.content;\n cardEl.innerHTML = '';\n cardEl.appendChild(img);\n } else {\n const img = document.createElement('img');\n img.src = card.meaningImage;\n img.alt = card.content;\n cardEl.innerHTML = '';\n cardEl.appendChild(img);\n }\n \n flippedCards.push(index);\n\n if (flippedCards.length === 2) {\n canFlip = false;\n attempts++;\n attemptsEl.textContent = attempts;\n checkMatch();\n }\n }\n\n function checkMatch() {\n const [index1, index2] = flippedCards;\n const card1 = cards[index1];\n const card2 = cards[index2];\n const cardEl1 = gridEl.children[index1];\n const cardEl2 = gridEl.children[index2];\n\n if (card1.pairId === card2.pairId && card1.type !== card2.type) {\n setTimeout(() => {\n card1.matched = true;\n card2.matched = true;\n cardEl1.classList.remove('flipped');\n cardEl1.classList.add('matched');\n \n if (card1.type === 'letter') {\n const img1 = document.createElement('img');\n img1.src = card1.letterImage;\n img1.alt = card1.content;\n cardEl1.innerHTML = '';\n cardEl1.appendChild(img1);\n } else {\n const img1 = document.createElement('img');\n img1.src = card1.meaningImage;\n img1.alt = card1.content;\n cardEl1.innerHTML = '';\n cardEl1.appendChild(img1);\n }\n \n cardEl2.classList.remove('flipped');\n cardEl2.classList.add('matched');\n \n if (card2.type === 'letter') {\n const img2 = document.createElement('img');\n img2.src = card2.letterImage;\n img2.alt = card2.content;\n cardEl2.innerHTML = '';\n cardEl2.appendChild(img2);\n } else {\n const img2 = document.createElement('img');\n img2.src = card2.meaningImage;\n img2.alt = card2.content;\n cardEl2.innerHTML = '';\n cardEl2.appendChild(img2);\n }\n \n matchedPairs++;\n matchesEl.textContent = `${matchedPairs}\/6`;\n \n flippedCards = [];\n canFlip = true;\n\n if (matchedPairs === 6) {\n endGame();\n }\n }, 500);\n } else {\n setTimeout(() => {\n cardEl1.classList.add('wrong');\n cardEl2.classList.add('wrong');\n \n setTimeout(() => {\n cardEl1.classList.remove('flipped', 'wrong');\n cardEl2.classList.remove('flipped', 'wrong');\n cardEl1.innerHTML = '<img decoding=\"async\" src=\"https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Verso-Carta-STEAM.png\" alt=\"Verso da carta\">';\n cardEl2.innerHTML = '<img decoding=\"async\" src=\"https:\/\/siminova.com.br\/blog\/wp-content\/uploads\/Verso-Carta-STEAM.png\" alt=\"Verso da carta\">';\n flippedCards = [];\n canFlip = true;\n }, 500);\n }, 1000);\n }\n }\n\n function startTimer() {\n timerInterval = setInterval(() => {\n seconds++;\n const mins = Math.floor(seconds \/ 60);\n const secs = seconds % 60;\n timerEl.textContent = `${mins}min ${secs}s`;\n }, 1000);\n }\n\n function stopTimer() {\n clearInterval(timerInterval);\n }\n\n function endGame() {\n stopTimer();\n showMessage(`\ud83c\udf89 Parab\u00e9ns! Voc\u00ea completou em ${attempts} tentativas e ${timerEl.textContent}!`, 'success');\n }\n\n function showMessage(text, type) {\n messageEl.textContent = text;\n messageEl.className = `memory-message show ${type}`;\n }\n\n function hideMessage() {\n messageEl.className = 'memory-message';\n }\n\n newGameBtn.addEventListener('click', initGame);\n\n initGame();\n })();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>\u2713 Atividade alinhada \u00e0 Base Nacional Comum Curricular (BNCC), BNCC da Computa\u00e7\u00e3o e aos Objetivos de Desenvolvimento Sustent\u00e1vel (ODS) da ONU. <a style=\"background-color: #e6c15a; color: #2f2f2f; padding: 4px 10px; border-radius: 3px; text-decoration: none; font-weight: 500; display: inline-block;\" href=\"https:\/\/siminova.com.br\/blog\/amigos\/alinhamento\/jogo-da-memoria-steam\/\"> \u203a Saiba mais <\/a><\/p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\"><summary>Vis\u00e3o Geral do Alinhamento<\/summary>\n<p class=\"has-small-font-size\">EI03EO02, EI03EF01, EI03ET05, EI03ET07, EF15LP03, EF35LP03, EF02MA12, EF15AR26, EF07CI11, EF06MA23, EF69AR35, EI03CO01, EI03CO06, EI03CO09, EI03CO10, EF01CO01, EF01CO02, EF01CO06, EF02CO01, EF02CO05, EF03CO01, EF03CO03, EF03CO08, EF06CO10, EM13CO15, ODS 4, ODS 9 e ODS 10.<\/p>\n<\/details>\n","protected":false},"excerpt":{"rendered":"<p>Combine as cartas com seu significado!<\/p>\n<p><b> N\u00cdVEL INTERMEDI\u00c1RIO<\/B><\/p>\n","protected":false},"author":8,"featured_media":4473,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rs_blank_template":"","rs_page_bg_color":"","slide_template_v7":"","footnotes":"","_links_to":"","_links_to_target":""},"categories":[77],"tags":[79],"class_list":["post-4071","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-jogos","tag-notts"],"_links":{"self":[{"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts\/4071","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/comments?post=4071"}],"version-history":[{"count":42,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts\/4071\/revisions"}],"predecessor-version":[{"id":5164,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts\/4071\/revisions\/5164"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/media\/4473"}],"wp:attachment":[{"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/media?parent=4071"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/categories?post=4071"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/tags?post=4071"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}