Ca\u00e7a-Palavras<\/title>\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n .caca-palavras-container {\n max-width: 920px;\n margin: 10px auto;\n padding: 20px 10px;\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n }\n\n .titulo {\n text-align: center;\n background: linear-gradient(135deg, #0066cc, #00cc66);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n font-size: 1.8em;\n margin-bottom: 5px;\n font-weight: bold;\n }\n\n .subtitulo {\n text-align: center;\n color: #333;\n font-size: 0.9em;\n margin-bottom: 15px;\n }\n\n .instrucoes {\n background: #f8f9fa;\n padding: 10px;\n border-radius: 8px;\n box-shadow: 0 4px 10px rgba(0,0,0,0.1);\n border-left: 3px solid #0066cc;\n }\n\n .instrucoes h3 {\n background: linear-gradient(135deg, #0066cc, #00cc66);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n margin-bottom: 6px;\n font-size: 0.95em;\n display: flex;\n align-items: center;\n gap: 5px;\n text-align: left;\n }\n\n .instrucoes ol {\n margin-left: 15px;\n line-height: 1.3;\n color: #333;\n }\n\n .instrucoes li {\n margin: 4px 0;\n font-size: 0.75em;\n }\n\n .instrucoes .destaque {\n background: linear-gradient(135deg, #0066cc, #00cc66);\n padding: 2px 8px;\n border-radius: 4px;\n font-weight: bold;\n color: white;\n }\n\n .contador {\n text-align: center;\n background: linear-gradient(135deg, #0066cc, #00cc66);\n color: white;\n font-size: 0.9em;\n padding: 10px;\n border-radius: 8px;\n font-weight: bold;\n box-shadow: 0 4px 10px rgba(0,102,204,0.3);\n }\n\n .conteudo {\n display: flex;\n gap: 15px;\n justify-content: center;\n align-items: flex-start;\n }\n\n .lado-esquerdo {\n flex: 0 0 auto;\n width: 100%;\n max-width: 550px;\n }\n\n .lado-direito {\n flex: 0 0 300px;\n width: 300px;\n display: flex;\n flex-direction: column;\n gap: 10px;\n }\n\n .grade-container {\n background: #f8f9fa;\n padding: 12px;\n border-radius: 10px;\n box-shadow: 0 4px 10px rgba(0,0,0,0.1);\n max-width: 100%;\n margin: 0 auto;\n overflow-x: auto;\n }\n\n .grade {\n display: grid;\n grid-template-columns: repeat(15, 1fr);\n gap: 3px;\n user-select: none;\n max-width: 100%;\n }\n\n .celula {\n width: 32px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: linear-gradient(145deg, #ffffff, #f0f0f0);\n border: 2px solid #ddd;\n border-radius: 6px;\n font-weight: bold;\n font-size: 15px;\n cursor: pointer;\n transition: all 0.3s;\n color: #333;\n box-shadow: 2px 2px 4px rgba(0,0,0,0.1);\n }\n\n .celula:hover {\n background: linear-gradient(145deg, #e6f2ff, #cce6ff);\n transform: scale(1.15);\n border-color: #0066cc;\n z-index: 10;\n }\n\n .celula.selecionada {\n background: linear-gradient(135deg, #0066cc, #00cc66) !important;\n color: white !important;\n border-color: #0066cc !important;\n transform: scale(1.1);\n box-shadow: 0 0 15px rgba(0, 102, 204, 0.6) !important;\n animation: pulsar 0.5s ease-in-out;\n }\n\n .celula.encontrada {\n background: linear-gradient(145deg, #4CAF50, #45a049) !important;\n color: white !important;\n border-color: #2e7d32 !important;\n animation: achou 0.6s ease-in-out;\n }\n\n @keyframes achou {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.3) rotate(5deg); }\n 100% { transform: scale(1); }\n }\n\n .lista-palavras {\n background: #f8f9fa;\n padding: 10px;\n border-radius: 8px;\n box-shadow: 0 4px 10px rgba(0,0,0,0.1);\n }\n\n .lista-palavras h3 {\n background: linear-gradient(135deg, #0066cc, #00cc66);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n margin-bottom: 8px;\n font-size: 0.95em;\n text-align: left;\n border-bottom: 2px solid transparent;\n border-image: linear-gradient(135deg, #0066cc, #00cc66) 1;\n padding-bottom: 5px;\n }\n\n .palavra-item {\n padding: 5px 7px;\n margin: 3px 0;\n background: linear-gradient(145deg, #ffffff, #f0f0f0);\n border-radius: 4px;\n transition: all 0.3s;\n font-weight: 600;\n font-size: 0.72em;\n color: #333;\n border-left: 3px solid #0066cc;\n box-shadow: 1px 1px 3px rgba(0,0,0,0.1);\n cursor: pointer;\n user-select: none;\n }\n\n .palavra-item:hover {\n transform: translateX(5px);\n box-shadow: 3px 3px 8px rgba(0,0,0,0.15);\n border-left-color: #00cc66;\n }\n\n .palavra-item.encontrada {\n background: linear-gradient(145deg, #4CAF50, #45a049);\n color: white;\n text-decoration: line-through;\n border-left-color: #2e7d32;\n animation: palavraEncontrada 0.5s ease-in-out;\n }\n\n @keyframes palavraEncontrada {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.1); }\n 100% { transform: scale(1); }\n }\n\n .mensagem {\n text-align: center;\n margin-top: 25px;\n padding: 20px;\n background: linear-gradient(135deg, #0066cc, #00cc66);\n border-radius: 12px;\n font-size: 1.4em;\n color: white;\n font-weight: bold;\n display: none;\n box-shadow: 0 8px 20px rgba(0, 102, 204, 0.4);\n border: 3px solid #0066cc;\n }\n\n .mensagem.visivel {\n display: block;\n animation: surgir 0.5s ease-in-out, pulsar 1.5s infinite;\n }\n\n .botao-novo-jogo {\n background: linear-gradient(135deg, #0066cc, #00cc66);\n color: white;\n border: none;\n padding: 10px 20px;\n border-radius: 8px;\n font-size: 0.9em;\n font-weight: bold;\n cursor: pointer;\n box-shadow: 0 4px 10px rgba(0, 102, 204, 0.3);\n transition: all 0.3s;\n width: 100%;\n margin-top: 8px;\n }\n\n .botao-novo-jogo:hover {\n transform: translateY(-2px);\n box-shadow: 0 6px 15px rgba(0, 102, 204, 0.5);\n }\n\n .botao-novo-jogo:active {\n transform: translateY(0);\n }\n\n @keyframes surgir {\n 0% { \n opacity: 0;\n transform: scale(0.5) translateY(-50px);\n }\n 100% { \n opacity: 1;\n transform: scale(1) translateY(0);\n }\n }\n\n @keyframes pulsar {\n 0%, 100% { transform: scale(1); }\n 50% { transform: scale(1.05); }\n }\n\n @media (max-width: 920px) {\n .conteudo {\n flex-direction: column;\n align-items: center;\n }\n\n .lado-esquerdo {\n width: 100%;\n max-width: 100%;\n }\n\n .lado-direito {\n width: 100%;\n max-width: 100%;\n }\n \n .grade-container {\n padding: 8px;\n }\n }\n\n @media (max-width: 768px) {\n .caca-palavras-container {\n padding: 15px 5px;\n }\n\n .lado-esquerdo,\n .lado-direito {\n max-width: 100%;\n }\n\n .celula {\n width: 18px;\n height: 18px;\n font-size: 9px;\n border-radius: 3px;\n border-width: 1px;\n }\n\n .titulo {\n font-size: 1.5em;\n }\n\n .subtitulo {\n font-size: 0.85em;\n }\n\n .instrucoes {\n padding: 8px;\n }\n\n .instrucoes h3 {\n font-size: 0.9em;\n }\n\n .instrucoes li {\n font-size: 0.7em;\n }\n\n .mensagem {\n font-size: 1em;\n padding: 12px;\n }\n \n .grade {\n gap: 2px;\n }\n \n .grade-container {\n padding: 6px;\n }\n }\n\n @media (max-width: 480px) {\n .celula {\n width: 16px;\n height: 16px;\n font-size: 8px;\n }\n \n .grade {\n gap: 1px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"caca-palavras-container\">\n <h1 class=\"titulo\">\u2705 Vamos jogar!<\/h1>\n <p class=\"subtitulo\">Encontre todas as palavras escondidas no tabuleiro!<\/p>\n \n <div class=\"conteudo\">\n <div class=\"lado-esquerdo\">\n <div class=\"grade-container\">\n <div class=\"grade\" id=\"grade\"><\/div>\n <\/div>\n <\/div>\n \n <div class=\"lado-direito\">\n <div class=\"instrucoes\">\n <h3>\ud83d\udcd6 Como Jogar<\/h3>\n <ol>\n <li>Clique na <span class=\"destaque\">1\u00aa letra<\/span> da palavra<\/li>\n <li>Clique na <span class=\"destaque\">\u00faltima letra<\/span><\/li>\n <li>Se correto, ficar\u00e1 <span class=\"destaque\" style=\"background: #00cc66; color: white;\">verde<\/span><\/li>\n <li>Todas as dire\u00e7\u00f5es poss\u00edveis: <span class=\"destaque\">\u2192 \u2190 \u2193 \u2191 \u2198 \u2196 \u2199 \u2197<\/span><\/li>\n <\/ol>\n <\/div>\n\n <button class=\"botao-novo-jogo\" onclick=\"novoJogo()\">\ud83d\udd04 Novo Jogo<\/button>\n\n <div class=\"contador\" id=\"contador\">\n Encontradas: <span id=\"numEncontradas\">0<\/span> \/ <span id=\"totalPalavras\">9<\/span>\n <\/div>\n \n <div class=\"lista-palavras\">\n <h3>\ud83d\udcdd Palavras<\/h3>\n <div id=\"listaPalavras\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"mensagem\" id=\"mensagem\">\n \ud83c\udf89 Parab\u00e9ns! Voc\u00ea encontrou todas as palavras! \ud83c\udf89\n <\/div>\n <\/div>\n\n <script>\n const TAMANHO = 15;\n const palavras = [\n 'CONSTRUTOR',\n 'PROGRAMADOR',\n 'ADMINISTRADOR',\n 'L\u00cdDER',\n 'DESCOBRIR',\n 'CRIAR',\n 'MULTIPLICAR',\n 'ORION',\n 'ESTELAR'\n ];\n\n let grade = [];\n let palavrasEncontradas = new Set();\n let celulaSelecionada = null;\n let palavrasPosicoes = [];\n let cliquesNaPalavra = {};\n\n function inicializarGrade() {\n for (let i = 0; i < TAMANHO; i++) {\n grade[i] = [];\n for (let j = 0; j < TAMANHO; j++) {\n grade[i][j] = '';\n }\n }\n }\n\n function colocarPalavra(palavra) {\n const direcoes = [\n { dx: 0, dy: 1 },\n { dx: 0, dy: -1 },\n { dx: 1, dy: 0 },\n { dx: -1, dy: 0 },\n { dx: 1, dy: 1 },\n { dx: -1, dy: -1 },\n { dx: 1, dy: -1 },\n { dx: -1, dy: 1 }\n ];\n\n const maxTentativas = 100;\n \n for (let tentativa = 0; tentativa < maxTentativas; tentativa++) {\n const dir = direcoes[Math.floor(Math.random() * direcoes.length)];\n const linha = Math.floor(Math.random() * TAMANHO);\n const coluna = Math.floor(Math.random() * TAMANHO);\n\n if (podeColocar(palavra, linha, coluna, dir.dx, dir.dy)) {\n const posicoes = [];\n for (let i = 0; i < palavra.length; i++) {\n const l = linha + i * dir.dx;\n const c = coluna + i * dir.dy;\n grade[l][c] = palavra[i];\n posicoes.push({ linha: l, coluna: c });\n }\n palavrasPosicoes.push({\n palavra: palavra,\n posicoes: posicoes\n });\n return true;\n }\n }\n return false;\n }\n\n function podeColocar(palavra, linha, coluna, dx, dy) {\n for (let i = 0; i < palavra.length; i++) {\n const l = linha + i * dx;\n const c = coluna + i * dy;\n \n if (l < 0 || l >= TAMANHO || c < 0 || c >= TAMANHO) {\n return false;\n }\n \n if (grade[l][c] !== '' && grade[l][c] !== palavra[i]) {\n return false;\n }\n }\n return true;\n }\n\n function preencherVazios() {\n const letras = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';\n for (let i = 0; i < TAMANHO; i++) {\n for (let j = 0; j < TAMANHO; j++) {\n if (grade[i][j] === '') {\n grade[i][j] = letras[Math.floor(Math.random() * letras.length)];\n }\n }\n }\n }\n\n function renderizarGrade() {\n const gradeElement = document.getElementById('grade');\n gradeElement.innerHTML = '';\n \n for (let i = 0; i < TAMANHO; i++) {\n for (let j = 0; j < TAMANHO; j++) {\n const celula = document.createElement('div');\n celula.className = 'celula';\n celula.textContent = grade[i][j];\n celula.dataset.linha = i;\n celula.dataset.coluna = j;\n celula.addEventListener('click', clicarCelula);\n gradeElement.appendChild(celula);\n }\n }\n }\n\n function renderizarListaPalavras() {\n const lista = document.getElementById('listaPalavras');\n lista.innerHTML = '';\n \n palavras.forEach(palavra => {\n const item = document.createElement('div');\n item.className = 'palavra-item';\n item.id = `palavra-${palavra}`;\n item.textContent = palavra;\n \n if (!cliquesNaPalavra[palavra]) {\n cliquesNaPalavra[palavra] = 0;\n }\n \n item.addEventListener('click', function() {\n if (palavrasEncontradas.has(palavra)) return;\n \n cliquesNaPalavra[palavra]++;\n \n item.style.opacity = '0.6';\n setTimeout(() => { item.style.opacity = '1'; }, 100);\n \n if (cliquesNaPalavra[palavra] >= 5) {\n revelarPalavra(palavra);\n cliquesNaPalavra[palavra] = 0;\n }\n });\n \n lista.appendChild(item);\n });\n }\n\n function clicarCelula(e) {\n const linha = parseInt(e.target.dataset.linha);\n const coluna = parseInt(e.target.dataset.coluna);\n\n if (!celulaSelecionada) {\n celulaSelecionada = { linha, coluna };\n e.target.classList.add('selecionada');\n } else {\n verificarPalavra(celulaSelecionada, { linha, coluna });\n document.querySelectorAll('.celula.selecionada').forEach(c => {\n c.classList.remove('selecionada');\n });\n celulaSelecionada = null;\n }\n }\n\n function verificarPalavra(inicio, fim) {\n for (let palavraInfo of palavrasPosicoes) {\n if (palavrasEncontradas.has(palavraInfo.palavra)) continue;\n\n const posicoes = palavraInfo.posicoes;\n const primeira = posicoes[0];\n const ultima = posicoes[posicoes.length - 1];\n\n if ((inicio.linha === primeira.linha && inicio.coluna === primeira.coluna &&\n fim.linha === ultima.linha && fim.coluna === ultima.coluna) ||\n (inicio.linha === ultima.linha && inicio.coluna === ultima.coluna &&\n fim.linha === primeira.linha && fim.coluna === primeira.coluna)) {\n \n marcarPalavraEncontrada(palavraInfo);\n return;\n }\n }\n }\n\n function revelarPalavra(palavra) {\n const palavraInfo = palavrasPosicoes.find(p => p.palavra === palavra);\n if (!palavraInfo) return;\n \n palavraInfo.posicoes.forEach((pos, index) => {\n setTimeout(() => {\n const celula = document.querySelector(`[data-linha=\"${pos.linha}\"][data-coluna=\"${pos.coluna}\"]`);\n \n if (!celula.classList.contains('encontrada')) {\n celula.style.background = 'linear-gradient(135deg, #ffd700, #ffed4e)';\n celula.style.transform = 'scale(1.2)';\n celula.style.boxShadow = '0 0 20px rgba(255, 215, 0, 0.8)';\n \n setTimeout(() => {\n if (!celula.classList.contains('encontrada')) {\n celula.style.transform = 'scale(1)';\n }\n }, 300);\n }\n }, index * 100);\n });\n \n setTimeout(() => {\n palavraInfo.posicoes.forEach(pos => {\n const celula = document.querySelector(`[data-linha=\"${pos.linha}\"][data-coluna=\"${pos.coluna}\"]`);\n if (!celula.classList.contains('encontrada')) {\n celula.style.background = 'linear-gradient(145deg, #ffffff, #f0f0f0)';\n celula.style.boxShadow = '2px 2px 4px rgba(0,0,0,0.1)';\n }\n });\n }, palavraInfo.posicoes.length * 100 + 2000);\n }\n\n function marcarPalavraEncontrada(palavraInfo) {\n palavrasEncontradas.add(palavraInfo.palavra);\n \n palavraInfo.posicoes.forEach(pos => {\n const celula = document.querySelector(`[data-linha=\"${pos.linha}\"][data-coluna=\"${pos.coluna}\"]`);\n celula.classList.add('encontrada');\n });\n\n document.getElementById(`palavra-${palavraInfo.palavra}`).classList.add('encontrada');\n document.getElementById('numEncontradas').textContent = palavrasEncontradas.size;\n\n if (palavrasEncontradas.size === palavras.length) {\n setTimeout(() => {\n document.getElementById('mensagem').classList.add('visivel');\n }, 500);\n }\n }\n\n function iniciarJogo() {\n inicializarGrade();\n \n palavras.forEach(palavra => {\n if (!colocarPalavra(palavra)) {\n console.log('N\u00e3o foi poss\u00edvel colocar:', palavra);\n }\n });\n \n preencherVazios();\n renderizarGrade();\n renderizarListaPalavras();\n }\n\n function novoJogo() {\n grade = [];\n palavrasEncontradas = new Set();\n celulaSelecionada = null;\n palavrasPosicoes = [];\n cliquesNaPalavra = {};\n \n document.getElementById('numEncontradas').textContent = '0';\n document.getElementById('mensagem').classList.remove('visivel');\n \n iniciarJogo();\n }\n\n iniciarJogo();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<center><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\/caca-palavras\/\"> \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\">EF12LP01, EF12LP02, EF12LP03, EF02MA12, EF67LP32, EF06MA23, EI03CO01, EI03CO02, EI03CO03, EF01CO01, EF01CO02, EF02CO01, EF02CO02, EF02CO05, EF05CO01, EF15CO01, EF15CO02, EF15CO04, EF06CO01, EF69CO01, ODS 4, ODS 8 e ODS 9.<\/p>\n<\/details>\n","protected":false},"excerpt":{"rendered":"<p>Encontre as palavras no tabuleiro!<br \/>\n<\/br><\/br><br \/>\n<b>N\u00cdVEL MUITO DIF\u00cdCIL<\/b><\/p>\n","protected":false},"author":8,"featured_media":4896,"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-4329","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\/4329","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=4329"}],"version-history":[{"count":38,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts\/4329\/revisions"}],"predecessor-version":[{"id":5179,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts\/4329\/revisions\/5179"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/media\/4896"}],"wp:attachment":[{"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/media?parent=4329"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/categories?post=4329"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/tags?post=4329"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":4329,"date":"2026-03-01T19:26:00","date_gmt":"2026-03-01T22:26:00","guid":{"rendered":"https:\/\/siminova.com.br\/blog\/?p=4329"},"modified":"2026-03-13T11:57:11","modified_gmt":"2026-03-13T14:57:11","slug":"caca-palavras","status":"publish","type":"post","link":"https:\/\/siminova.com.br\/blog\/2026\/03\/caca-palavras\/","title":{"rendered":"Ca\u00e7a-palavras SIMROB\u00d3TICA\u00ae"},"content":{"rendered":"\n\n\n\n \n \n Ca\u00e7a-Palavras<\/title>\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n .caca-palavras-container {\n max-width: 920px;\n margin: 10px auto;\n padding: 20px 10px;\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n }\n\n .titulo {\n text-align: center;\n background: linear-gradient(135deg, #0066cc, #00cc66);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n font-size: 1.8em;\n margin-bottom: 5px;\n font-weight: bold;\n }\n\n .subtitulo {\n text-align: center;\n color: #333;\n font-size: 0.9em;\n margin-bottom: 15px;\n }\n\n .instrucoes {\n background: #f8f9fa;\n padding: 10px;\n border-radius: 8px;\n box-shadow: 0 4px 10px rgba(0,0,0,0.1);\n border-left: 3px solid #0066cc;\n }\n\n .instrucoes h3 {\n background: linear-gradient(135deg, #0066cc, #00cc66);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n margin-bottom: 6px;\n font-size: 0.95em;\n display: flex;\n align-items: center;\n gap: 5px;\n text-align: left;\n }\n\n .instrucoes ol {\n margin-left: 15px;\n line-height: 1.3;\n color: #333;\n }\n\n .instrucoes li {\n margin: 4px 0;\n font-size: 0.75em;\n }\n\n .instrucoes .destaque {\n background: linear-gradient(135deg, #0066cc, #00cc66);\n padding: 2px 8px;\n border-radius: 4px;\n font-weight: bold;\n color: white;\n }\n\n .contador {\n text-align: center;\n background: linear-gradient(135deg, #0066cc, #00cc66);\n color: white;\n font-size: 0.9em;\n padding: 10px;\n border-radius: 8px;\n font-weight: bold;\n box-shadow: 0 4px 10px rgba(0,102,204,0.3);\n }\n\n .conteudo {\n display: flex;\n gap: 15px;\n justify-content: center;\n align-items: flex-start;\n }\n\n .lado-esquerdo {\n flex: 0 0 auto;\n width: 100%;\n max-width: 550px;\n }\n\n .lado-direito {\n flex: 0 0 300px;\n width: 300px;\n display: flex;\n flex-direction: column;\n gap: 10px;\n }\n\n .grade-container {\n background: #f8f9fa;\n padding: 12px;\n border-radius: 10px;\n box-shadow: 0 4px 10px rgba(0,0,0,0.1);\n max-width: 100%;\n margin: 0 auto;\n overflow-x: auto;\n }\n\n .grade {\n display: grid;\n grid-template-columns: repeat(15, 1fr);\n gap: 3px;\n user-select: none;\n max-width: 100%;\n }\n\n .celula {\n width: 32px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: linear-gradient(145deg, #ffffff, #f0f0f0);\n border: 2px solid #ddd;\n border-radius: 6px;\n font-weight: bold;\n font-size: 15px;\n cursor: pointer;\n transition: all 0.3s;\n color: #333;\n box-shadow: 2px 2px 4px rgba(0,0,0,0.1);\n }\n\n .celula:hover {\n background: linear-gradient(145deg, #e6f2ff, #cce6ff);\n transform: scale(1.15);\n border-color: #0066cc;\n z-index: 10;\n }\n\n .celula.selecionada {\n background: linear-gradient(135deg, #0066cc, #00cc66) !important;\n color: white !important;\n border-color: #0066cc !important;\n transform: scale(1.1);\n box-shadow: 0 0 15px rgba(0, 102, 204, 0.6) !important;\n animation: pulsar 0.5s ease-in-out;\n }\n\n .celula.encontrada {\n background: linear-gradient(145deg, #4CAF50, #45a049) !important;\n color: white !important;\n border-color: #2e7d32 !important;\n animation: achou 0.6s ease-in-out;\n }\n\n @keyframes achou {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.3) rotate(5deg); }\n 100% { transform: scale(1); }\n }\n\n .lista-palavras {\n background: #f8f9fa;\n padding: 10px;\n border-radius: 8px;\n box-shadow: 0 4px 10px rgba(0,0,0,0.1);\n }\n\n .lista-palavras h3 {\n background: linear-gradient(135deg, #0066cc, #00cc66);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n margin-bottom: 8px;\n font-size: 0.95em;\n text-align: left;\n border-bottom: 2px solid transparent;\n border-image: linear-gradient(135deg, #0066cc, #00cc66) 1;\n padding-bottom: 5px;\n }\n\n .palavra-item {\n padding: 5px 7px;\n margin: 3px 0;\n background: linear-gradient(145deg, #ffffff, #f0f0f0);\n border-radius: 4px;\n transition: all 0.3s;\n font-weight: 600;\n font-size: 0.72em;\n color: #333;\n border-left: 3px solid #0066cc;\n box-shadow: 1px 1px 3px rgba(0,0,0,0.1);\n cursor: pointer;\n user-select: none;\n }\n\n .palavra-item:hover {\n transform: translateX(5px);\n box-shadow: 3px 3px 8px rgba(0,0,0,0.15);\n border-left-color: #00cc66;\n }\n\n .palavra-item.encontrada {\n background: linear-gradient(145deg, #4CAF50, #45a049);\n color: white;\n text-decoration: line-through;\n border-left-color: #2e7d32;\n animation: palavraEncontrada 0.5s ease-in-out;\n }\n\n @keyframes palavraEncontrada {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.1); }\n 100% { transform: scale(1); }\n }\n\n .mensagem {\n text-align: center;\n margin-top: 25px;\n padding: 20px;\n background: linear-gradient(135deg, #0066cc, #00cc66);\n border-radius: 12px;\n font-size: 1.4em;\n color: white;\n font-weight: bold;\n display: none;\n box-shadow: 0 8px 20px rgba(0, 102, 204, 0.4);\n border: 3px solid #0066cc;\n }\n\n .mensagem.visivel {\n display: block;\n animation: surgir 0.5s ease-in-out, pulsar 1.5s infinite;\n }\n\n .botao-novo-jogo {\n background: linear-gradient(135deg, #0066cc, #00cc66);\n color: white;\n border: none;\n padding: 10px 20px;\n border-radius: 8px;\n font-size: 0.9em;\n font-weight: bold;\n cursor: pointer;\n box-shadow: 0 4px 10px rgba(0, 102, 204, 0.3);\n transition: all 0.3s;\n width: 100%;\n margin-top: 8px;\n }\n\n .botao-novo-jogo:hover {\n transform: translateY(-2px);\n box-shadow: 0 6px 15px rgba(0, 102, 204, 0.5);\n }\n\n .botao-novo-jogo:active {\n transform: translateY(0);\n }\n\n @keyframes surgir {\n 0% { \n opacity: 0;\n transform: scale(0.5) translateY(-50px);\n }\n 100% { \n opacity: 1;\n transform: scale(1) translateY(0);\n }\n }\n\n @keyframes pulsar {\n 0%, 100% { transform: scale(1); }\n 50% { transform: scale(1.05); }\n }\n\n @media (max-width: 920px) {\n .conteudo {\n flex-direction: column;\n align-items: center;\n }\n\n .lado-esquerdo {\n width: 100%;\n max-width: 100%;\n }\n\n .lado-direito {\n width: 100%;\n max-width: 100%;\n }\n \n .grade-container {\n padding: 8px;\n }\n }\n\n @media (max-width: 768px) {\n .caca-palavras-container {\n padding: 15px 5px;\n }\n\n .lado-esquerdo,\n .lado-direito {\n max-width: 100%;\n }\n\n .celula {\n width: 18px;\n height: 18px;\n font-size: 9px;\n border-radius: 3px;\n border-width: 1px;\n }\n\n .titulo {\n font-size: 1.5em;\n }\n\n .subtitulo {\n font-size: 0.85em;\n }\n\n .instrucoes {\n padding: 8px;\n }\n\n .instrucoes h3 {\n font-size: 0.9em;\n }\n\n .instrucoes li {\n font-size: 0.7em;\n }\n\n .mensagem {\n font-size: 1em;\n padding: 12px;\n }\n \n .grade {\n gap: 2px;\n }\n \n .grade-container {\n padding: 6px;\n }\n }\n\n @media (max-width: 480px) {\n .celula {\n width: 16px;\n height: 16px;\n font-size: 8px;\n }\n \n .grade {\n gap: 1px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"caca-palavras-container\">\n <h1 class=\"titulo\">\u2705 Vamos jogar!<\/h1>\n <p class=\"subtitulo\">Encontre todas as palavras escondidas no tabuleiro!<\/p>\n \n <div class=\"conteudo\">\n <div class=\"lado-esquerdo\">\n <div class=\"grade-container\">\n <div class=\"grade\" id=\"grade\"><\/div>\n <\/div>\n <\/div>\n \n <div class=\"lado-direito\">\n <div class=\"instrucoes\">\n <h3>\ud83d\udcd6 Como Jogar<\/h3>\n <ol>\n <li>Clique na <span class=\"destaque\">1\u00aa letra<\/span> da palavra<\/li>\n <li>Clique na <span class=\"destaque\">\u00faltima letra<\/span><\/li>\n <li>Se correto, ficar\u00e1 <span class=\"destaque\" style=\"background: #00cc66; color: white;\">verde<\/span><\/li>\n <li>Todas as dire\u00e7\u00f5es poss\u00edveis: <span class=\"destaque\">\u2192 \u2190 \u2193 \u2191 \u2198 \u2196 \u2199 \u2197<\/span><\/li>\n <\/ol>\n <\/div>\n\n <button class=\"botao-novo-jogo\" onclick=\"novoJogo()\">\ud83d\udd04 Novo Jogo<\/button>\n\n <div class=\"contador\" id=\"contador\">\n Encontradas: <span id=\"numEncontradas\">0<\/span> \/ <span id=\"totalPalavras\">9<\/span>\n <\/div>\n \n <div class=\"lista-palavras\">\n <h3>\ud83d\udcdd Palavras<\/h3>\n <div id=\"listaPalavras\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"mensagem\" id=\"mensagem\">\n \ud83c\udf89 Parab\u00e9ns! Voc\u00ea encontrou todas as palavras! \ud83c\udf89\n <\/div>\n <\/div>\n\n <script>\n const TAMANHO = 15;\n const palavras = [\n 'CONSTRUTOR',\n 'PROGRAMADOR',\n 'ADMINISTRADOR',\n 'L\u00cdDER',\n 'DESCOBRIR',\n 'CRIAR',\n 'MULTIPLICAR',\n 'ORION',\n 'ESTELAR'\n ];\n\n let grade = [];\n let palavrasEncontradas = new Set();\n let celulaSelecionada = null;\n let palavrasPosicoes = [];\n let cliquesNaPalavra = {};\n\n function inicializarGrade() {\n for (let i = 0; i < TAMANHO; i++) {\n grade[i] = [];\n for (let j = 0; j < TAMANHO; j++) {\n grade[i][j] = '';\n }\n }\n }\n\n function colocarPalavra(palavra) {\n const direcoes = [\n { dx: 0, dy: 1 },\n { dx: 0, dy: -1 },\n { dx: 1, dy: 0 },\n { dx: -1, dy: 0 },\n { dx: 1, dy: 1 },\n { dx: -1, dy: -1 },\n { dx: 1, dy: -1 },\n { dx: -1, dy: 1 }\n ];\n\n const maxTentativas = 100;\n \n for (let tentativa = 0; tentativa < maxTentativas; tentativa++) {\n const dir = direcoes[Math.floor(Math.random() * direcoes.length)];\n const linha = Math.floor(Math.random() * TAMANHO);\n const coluna = Math.floor(Math.random() * TAMANHO);\n\n if (podeColocar(palavra, linha, coluna, dir.dx, dir.dy)) {\n const posicoes = [];\n for (let i = 0; i < palavra.length; i++) {\n const l = linha + i * dir.dx;\n const c = coluna + i * dir.dy;\n grade[l][c] = palavra[i];\n posicoes.push({ linha: l, coluna: c });\n }\n palavrasPosicoes.push({\n palavra: palavra,\n posicoes: posicoes\n });\n return true;\n }\n }\n return false;\n }\n\n function podeColocar(palavra, linha, coluna, dx, dy) {\n for (let i = 0; i < palavra.length; i++) {\n const l = linha + i * dx;\n const c = coluna + i * dy;\n \n if (l < 0 || l >= TAMANHO || c < 0 || c >= TAMANHO) {\n return false;\n }\n \n if (grade[l][c] !== '' && grade[l][c] !== palavra[i]) {\n return false;\n }\n }\n return true;\n }\n\n function preencherVazios() {\n const letras = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';\n for (let i = 0; i < TAMANHO; i++) {\n for (let j = 0; j < TAMANHO; j++) {\n if (grade[i][j] === '') {\n grade[i][j] = letras[Math.floor(Math.random() * letras.length)];\n }\n }\n }\n }\n\n function renderizarGrade() {\n const gradeElement = document.getElementById('grade');\n gradeElement.innerHTML = '';\n \n for (let i = 0; i < TAMANHO; i++) {\n for (let j = 0; j < TAMANHO; j++) {\n const celula = document.createElement('div');\n celula.className = 'celula';\n celula.textContent = grade[i][j];\n celula.dataset.linha = i;\n celula.dataset.coluna = j;\n celula.addEventListener('click', clicarCelula);\n gradeElement.appendChild(celula);\n }\n }\n }\n\n function renderizarListaPalavras() {\n const lista = document.getElementById('listaPalavras');\n lista.innerHTML = '';\n \n palavras.forEach(palavra => {\n const item = document.createElement('div');\n item.className = 'palavra-item';\n item.id = `palavra-${palavra}`;\n item.textContent = palavra;\n \n if (!cliquesNaPalavra[palavra]) {\n cliquesNaPalavra[palavra] = 0;\n }\n \n item.addEventListener('click', function() {\n if (palavrasEncontradas.has(palavra)) return;\n \n cliquesNaPalavra[palavra]++;\n \n item.style.opacity = '0.6';\n setTimeout(() => { item.style.opacity = '1'; }, 100);\n \n if (cliquesNaPalavra[palavra] >= 5) {\n revelarPalavra(palavra);\n cliquesNaPalavra[palavra] = 0;\n }\n });\n \n lista.appendChild(item);\n });\n }\n\n function clicarCelula(e) {\n const linha = parseInt(e.target.dataset.linha);\n const coluna = parseInt(e.target.dataset.coluna);\n\n if (!celulaSelecionada) {\n celulaSelecionada = { linha, coluna };\n e.target.classList.add('selecionada');\n } else {\n verificarPalavra(celulaSelecionada, { linha, coluna });\n document.querySelectorAll('.celula.selecionada').forEach(c => {\n c.classList.remove('selecionada');\n });\n celulaSelecionada = null;\n }\n }\n\n function verificarPalavra(inicio, fim) {\n for (let palavraInfo of palavrasPosicoes) {\n if (palavrasEncontradas.has(palavraInfo.palavra)) continue;\n\n const posicoes = palavraInfo.posicoes;\n const primeira = posicoes[0];\n const ultima = posicoes[posicoes.length - 1];\n\n if ((inicio.linha === primeira.linha && inicio.coluna === primeira.coluna &&\n fim.linha === ultima.linha && fim.coluna === ultima.coluna) ||\n (inicio.linha === ultima.linha && inicio.coluna === ultima.coluna &&\n fim.linha === primeira.linha && fim.coluna === primeira.coluna)) {\n \n marcarPalavraEncontrada(palavraInfo);\n return;\n }\n }\n }\n\n function revelarPalavra(palavra) {\n const palavraInfo = palavrasPosicoes.find(p => p.palavra === palavra);\n if (!palavraInfo) return;\n \n palavraInfo.posicoes.forEach((pos, index) => {\n setTimeout(() => {\n const celula = document.querySelector(`[data-linha=\"${pos.linha}\"][data-coluna=\"${pos.coluna}\"]`);\n \n if (!celula.classList.contains('encontrada')) {\n celula.style.background = 'linear-gradient(135deg, #ffd700, #ffed4e)';\n celula.style.transform = 'scale(1.2)';\n celula.style.boxShadow = '0 0 20px rgba(255, 215, 0, 0.8)';\n \n setTimeout(() => {\n if (!celula.classList.contains('encontrada')) {\n celula.style.transform = 'scale(1)';\n }\n }, 300);\n }\n }, index * 100);\n });\n \n setTimeout(() => {\n palavraInfo.posicoes.forEach(pos => {\n const celula = document.querySelector(`[data-linha=\"${pos.linha}\"][data-coluna=\"${pos.coluna}\"]`);\n if (!celula.classList.contains('encontrada')) {\n celula.style.background = 'linear-gradient(145deg, #ffffff, #f0f0f0)';\n celula.style.boxShadow = '2px 2px 4px rgba(0,0,0,0.1)';\n }\n });\n }, palavraInfo.posicoes.length * 100 + 2000);\n }\n\n function marcarPalavraEncontrada(palavraInfo) {\n palavrasEncontradas.add(palavraInfo.palavra);\n \n palavraInfo.posicoes.forEach(pos => {\n const celula = document.querySelector(`[data-linha=\"${pos.linha}\"][data-coluna=\"${pos.coluna}\"]`);\n celula.classList.add('encontrada');\n });\n\n document.getElementById(`palavra-${palavraInfo.palavra}`).classList.add('encontrada');\n document.getElementById('numEncontradas').textContent = palavrasEncontradas.size;\n\n if (palavrasEncontradas.size === palavras.length) {\n setTimeout(() => {\n document.getElementById('mensagem').classList.add('visivel');\n }, 500);\n }\n }\n\n function iniciarJogo() {\n inicializarGrade();\n \n palavras.forEach(palavra => {\n if (!colocarPalavra(palavra)) {\n console.log('N\u00e3o foi poss\u00edvel colocar:', palavra);\n }\n });\n \n preencherVazios();\n renderizarGrade();\n renderizarListaPalavras();\n }\n\n function novoJogo() {\n grade = [];\n palavrasEncontradas = new Set();\n celulaSelecionada = null;\n palavrasPosicoes = [];\n cliquesNaPalavra = {};\n \n document.getElementById('numEncontradas').textContent = '0';\n document.getElementById('mensagem').classList.remove('visivel');\n \n iniciarJogo();\n }\n\n iniciarJogo();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<center><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\/caca-palavras\/\"> \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\">EF12LP01, EF12LP02, EF12LP03, EF02MA12, EF67LP32, EF06MA23, EI03CO01, EI03CO02, EI03CO03, EF01CO01, EF01CO02, EF02CO01, EF02CO02, EF02CO05, EF05CO01, EF15CO01, EF15CO02, EF15CO04, EF06CO01, EF69CO01, ODS 4, ODS 8 e ODS 9.<\/p>\n<\/details>\n","protected":false},"excerpt":{"rendered":"<p>Encontre as palavras no tabuleiro!<br \/>\n<\/br><\/br><br \/>\n<b>N\u00cdVEL MUITO DIF\u00cdCIL<\/b><\/p>\n","protected":false},"author":8,"featured_media":4896,"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-4329","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\/4329","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=4329"}],"version-history":[{"count":38,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts\/4329\/revisions"}],"predecessor-version":[{"id":5179,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/posts\/4329\/revisions\/5179"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/media\/4896"}],"wp:attachment":[{"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/media?parent=4329"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/categories?post=4329"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/siminova.com.br\/blog\/wp-json\/wp\/v2\/tags?post=4329"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}