em modo separate-containers: * • background: #fff → aparece como "borda branca" ao redor do jogo * • box-shadow → sombra visível * • border-radius → arredondamento que contrasta com o fundo * • overflow: hidden → CORTA o título e sombras do .game * * Regras anteriores dependiam de .separate-containers no pai e não cobriam * o elemento

diretamente — por isso não sobrescreviam. * ─────────────────────────────────────────────────────────────────────── */ body.page-id-270 article, body.page-id-270 .type-page, body.page-id-270 .hentry { background: transparent !important; box-shadow: none !important; border: none !important; border-radius: 0 !important; padding: 0 !important; margin: 0 !important; overflow: visible !important; /* impede corte do .title-area e sombras */ } /* ── 5. Containers intermediários — sem padding, sem clipping ────────────── */ /* * Sem dependência de .separate-containers — cobre todos os modos de layout * e qualquer versão do GeneratePress. */ body.page-id-270 .inside-article { padding: 0 !important; margin: 0 !important; background: transparent !important; border: none !important; overflow: visible !important; } /* ── Zera padding/margin do grid-container do GeneratePress ────────────────── * O #page.grid-container tem padding lateral (≈28px cada lado) que reduz o * clientWidth do .game-outer, fazendo o JS calcular uma escala menor que a * necessária. Ex.: iPhone 375px → 375-56 = 319px → scale 0.33 (muito pequeno). * Com padding 0, o .game-outer mede 375px → scale 0.39 (muito melhor). */ body.page-id-270 #page, body.page-id-270 .grid-container, body.page-id-270 .container, body.page-id-270 .site-content, body.page-id-270 #content, body.page-id-270 #main, body.page-id-270 .site-main, body.page-id-270 .content-area, body.page-id-270 .entry-content { padding: 0 !important; margin: 0 !important; max-width: none !important; width: 100% !important; } /* .game-outer precisa de width:100% para medir corretamente via clientWidth */ body.page-id-270 .game-outer { width: 100% !important; max-width: none !important; } /* ── 6. Overrides de padding/background específicos por layout ───────────── */ /* * Mantidos por compatibilidade — cobrem casos onde regras * acima possam não atingir os seletores compostos do tema. */ body.page-id-270 .separate-containers .comments-area, body.page-id-270 .separate-containers .inside-article, body.page-id-270 .separate-containers .page-header, body.page-id-270 .one-container .container, body.page-id-270 .separate-containers .paging-navigation, body.page-id-270 .inside-page-header { padding: 0 !important; background-color: transparent !important; } /* ── 7. Fundo da página ─────────────────────────────────────────────────── */ /* Cor igual ao --c-game-bg do jogo: elimina o contraste entre o tema e o .game */ body.page-id-270 { background-color: #EEF2F5 !important; overflow-x: hidden !important; /* evita scroll horizontal ao escalonar */ overflow-y: auto !important; /* scroll vertical liberado */ /* padding/margin zero para o jogo ocupe toda a tela */ padding: 0 !important; margin: 0 !important; } /* ── 8. Reset de margens do tema dentro do container do jogo ──────────────── * * GeneratePress e plugins WordPress comumente adicionam margens em h1/h2/p * via regras como ".entry-content h2 { margin-top: 1.5em }". * Essas regras têm especificidade (0,1,1) — superam o reset * { margin:0 } * de game.css (0,0,0) — e podem empurrar o .title-password para fora do * .title-area, onde é cortado pelo overflow:hidden do .game. * * Fix: override com !important nos elementos tipográficos dentro de .game. * ─────────────────────────────────────────────────────────────────────── */ body.page-id-270 .game h1, body.page-id-270 .game h2, body.page-id-270 .game h3, body.page-id-270 .game p { margin: 0 !important; padding: 0 !important; border: none !important; /* alguns temas adicionam border-bottom em h2 */ } /* ── 9. Reset do estilo padrão de botões do GeneratePress ─────────────────── * O tema injeta: button { background-color: #55555e; color: #fff } * Usamos :not() para excluir os botões do jogo — eles têm seus próprios * estilos em game.css e NÃO devem ser resetados aqui. */ body.page-id-270 button:not(.tut-btn):not(.tut-skip):not(.cards-start-btn):not(.vb-next-btn), body.page-id-270 input[type="button"], body.page-id-270 input[type="reset"], body.page-id-270 input[type="submit"] { background-color: transparent !important; color: inherit !important; border: none !important; font-family: inherit !important; font-size: inherit !important; font-weight: inherit !important; padding: 0 !important; cursor: pointer !important; } /* Remove o foco escuro do tema em todos os elementos (exceto os que o jogo já define com estilo próprio: .card, .password-input e .tut-btn) */ body.page-id-270 *:focus:not(.card):not(.password-input):not(.tut-btn) { outline: none !important; box-shadow: none !important; }