/* RETRO POP · família game — nível 3 de 4 (PLANO-APLICACAO.md 1.4, etapa 4)
   1.201 páginas de games/*.html, quatro esqueletos:
   · gerada (1.173: GP_AUTOGEN_V1, as 21 do Nintendo DS e as 21 OG_CATALOG_PAGE_V1): game-page.css
     body.gp-nexus-page .bg-animation nav.gp-nav (.gp-brand .gp-navlinks .gp-nav-status pílulas .gp-cta) .gp-breadcrumb
     header.gp-hero (.gp-cover-wrap > img + .gp-hero-info: h1 .gp-tags .gp-tagline .gp-play-row) .gp-section (.gp-meta-grid
     .gp-controls-grid .gp-related-grid .gp-tips) footer.gp-footer. As de catálogo (launcher) têm nav de <a> nus e <main>.
     game-play-modes.js troca o botão Jogar por #gamePlayModes (.og-mode-card ×2) e .gp-cta por .gp-mode-jump.
   · feita à mão (27: pokemon-*, zelda-*, sonic-*, mortal-kombat*, street-fighter-2, super-mario-kart, goldeneye-007,
     fire-emblem, e as cópias "… 2.html"): <style> inline com :root próprio (--neon-* --card-* --bg-dark e os tokens da
     franquia) · nav.navbar .breadcrumb .hero-section (.game-cover-img .badge .game-title .quick-actions
     .related-sidebar) .emulator-section (iframe do jogo) .content-grid (.section-card .feature-card .faq-item .sidebar-card)
     body > footer.
   · portal (games/index.html): games-portal.css + console-library.css + nexus-theme.css, os mesmos .og-game-card,
     .og-hero, .og-stat e .og-footer das páginas de console, mais os cartões de console (.og-hub-card).

   DUAS METADES, como em console.css: (1) VARREDURA DE INVERSÃO nos seletores reais — com JS desligado o classMap não
   roda e a página tem de ficar legível só com esta folha; (2) COMPOSIÇÃO, com a geometria das primitivas que o classMap
   estampa, para o classMap reforçar sem mover nada depois da primeira pintura.
   FORA de propósito: widgets compartilhados (chat, Live, rádio, "N live", cookies, modais de conta/loja/assinatura/
   favoritos/perfil, toasts — retro/_shared.css), slot de anúncio (.gp-ad-banner, [data-ad-slot], rails: zero regra),
   pad de toque e cosmético pago. Na tela do emulador das feitas à mão (.emulator-container, #emulator-frame,
   .play-overlay, .loading-overlay) nada muda: a TV continua preta, é ilha. !important só contra !important ou
   style="" da página (game-page.css:430, FAQ inline, game-play-modes.css). Movimento: 2 loops da família, ambos com
   --rp-play e guarda de reduced-motion própria (seção 4). */

/* ═══════════ 0 · TOKENS DA FAMÍLIA ═══════════ */
html.retro-pop{
  --gm-ink:#17131f; --gm-cream:#f5ebd7; --gm-cream-2:#dccfb2; --gm-white:#fffaf0;
  --gm-dots:radial-gradient(circle,rgba(23,19,31,.28) 1.3px,transparent 1.5px);
  --gm-dots-cream:radial-gradient(circle,rgba(245,235,215,.2) 1.6px,transparent 1.8px);
  --gm-play:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='21.5' fill='%23ff2e4d' stroke='%2317131f' stroke-width='3'/%3E%3Cpath d='M19 15l14 9-14 9z' fill='%2317131f'/%3E%3C/svg%3E");
  /* tokens de franquia que só as feitas à mão declaram (a ponte não os conhece): tinta de PREENCHIMENTO, como a ponte
     faz com --neon-*; todo texto que os lia tem regra própria na seção 1.3 */
  --bond-gold:var(--rp-yellow); --zelda-gold:var(--rp-yellow); --zelda-green:var(--rp-lime);
  --emerald-green:var(--rp-lime); --emerald-dark:var(--rp-cyan); --pokemon-leaf-green:var(--rp-lime);
}


/* ═══════════ 1 · VARREDURA DE INVERSÃO ═══════════ */

/* 1.1 gerada (game-page.css) — céu fixo escuro com um loop de estrelas: some, o papel é do núcleo */
html.retro-pop .bg-animation,
html.retro-pop .bg-grid,
html.retro-pop .game-cover-glow{display:none}

/* tarja (:81-307) */
html.retro-pop .gp-nav,
html.retro-pop .navbar{color:var(--gm-ink);-webkit-backdrop-filter:none;backdrop-filter:none}
html.retro-pop .gp-brand,html.retro-pop .gp-brand-copy strong,html.retro-pop .gp-nav > a:not([class]),html.retro-pop .gp-navlinks a,
html.retro-pop .navbar .logo-text,html.retro-pop .nav-link,html.retro-pop .nav-link:hover{color:var(--gm-ink)}
html.retro-pop .gp-brand-copy small,
html.retro-pop .gp-avatar-copy small{color:var(--rp-ink-2)}
html.retro-pop .gp-og-core{color:var(--gm-cream);background:var(--gm-ink);border-color:var(--gm-ink);text-shadow:none}
html.retro-pop .gp-og-orbit{animation:none;filter:none;background:var(--rp-red)}
html.retro-pop .navbar .logo-text{background:none;-webkit-text-fill-color:currentColor}
html.retro-pop .gp-nav-status,
html.retro-pop .gp-nav-status strong{color:var(--gm-ink);background:var(--rp-lime);border-color:var(--gm-ink)}
html.retro-pop .gp-live-dot{background:var(--gm-ink);box-shadow:none}
html.retro-pop :is(.gp-favorites-pill,.gp-signin,.gp-avatar-btn){color:var(--gm-ink);background:var(--gm-white)}
html.retro-pop .gp-favorites-pill strong{color:var(--gm-ink);background:var(--rp-pink)}
html.retro-pop .gp-pro-pill{color:var(--gm-white);background:var(--rp-purple)}
/* .gp-mode-jump: game-play-modes.css pinta o texto de dourado com !important */
html.retro-pop .gp-cta,
html.retro-pop .gp-mode-jump{color:var(--gm-ink)!important;background:var(--rp-red)}
html.retro-pop .gp-cta::before{content:none}
html.retro-pop .gp-avatar-ring{background:var(--gm-ink)}
html.retro-pop .gp-avatar-ring img{background:var(--rp-paper-3)}
html.retro-pop .gp-user-menu{color:var(--gm-ink);background:var(--gm-white)}
html.retro-pop .gp-user-menu button{color:var(--gm-ink)}
html.retro-pop .gp-user-menu button:hover{color:var(--gm-ink);background:var(--rp-cyan)}

/* migalha (:338-352) */
html.retro-pop .gp-breadcrumb,
html.retro-pop .breadcrumb{color:var(--rp-ink-2)}
html.retro-pop .gp-breadcrumb a,
html.retro-pop .breadcrumb a{color:var(--gm-ink)}
html.retro-pop :is(.gp-breadcrumb a:hover,.breadcrumb a:hover,.breadcrumb .current){color:var(--rp-red-deep)}
html.retro-pop .gp-breadcrumb .gp-sep{color:var(--gm-ink)}

/* capa (:355-498): título em gradiente recortado no texto, etiquetas e botões de vidro */
html.retro-pop .gp-cover-wrap{background:var(--gm-white);border-color:var(--gm-ink)}
html.retro-pop :is(.gp-hero h1,.game-title,.game-title-main){color:var(--rp-ink);background:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:currentColor}
html.retro-pop .gp-tag,
html.retro-pop .badge{color:var(--gm-ink);background:var(--gm-white);border-color:var(--gm-ink)}
html.retro-pop .gp-tag-console,
html.retro-pop .badge.platform{background:var(--rp-cyan)}
html.retro-pop .gp-tag-year,
html.retro-pop .badge.year{background:var(--rp-yellow)}
html.retro-pop .gp-tagline,
html.retro-pop .game-description{color:var(--rp-ink-2)}
html.retro-pop .game-description strong{color:var(--rp-ink)}
html.retro-pop .gp-play-btn,
html.retro-pop .btn-play{color:var(--gm-ink);background:var(--rp-red)}
html.retro-pop .gp-play-btn[href^="/launcher-play"]{background:var(--rp-orange)}
html.retro-pop .gp-play-btn-secondary,
html.retro-pop .btn-secondary{color:var(--gm-ink);background:var(--gm-white)}

/* seções (:500-640). O h3 da FAQ traz style="color:#fff" e a folha força #fff !important (:430) */
html.retro-pop .gp-section h2{color:var(--gm-ink)}
html.retro-pop .gp-section h3{color:var(--rp-ink)!important}
html.retro-pop .gp-section :is(p,li){color:var(--rp-ink-2)}
html.retro-pop .gp-section :is(p,li) a,
html.retro-pop .content-main a{color:var(--rp-ink);font-weight:800;text-decoration:underline;text-decoration-color:var(--rp-cyan);text-decoration-thickness:3px;text-underline-offset:3px}
html.retro-pop .gp-meta-item,
html.retro-pop .gp-control-row{color:var(--rp-ink);background:var(--gm-white)}
html.retro-pop .gp-meta-label{color:var(--rp-ink-2)}
html.retro-pop .gp-meta-value{color:var(--rp-ink)}
html.retro-pop .gp-key,
html.retro-pop .key-badge{color:var(--gm-ink);background:var(--gm-white);border-color:var(--gm-ink)}
html.retro-pop .gp-related-card{background:none}
html.retro-pop .gp-related-card img{background:var(--rp-paper-3)}
html.retro-pop .gp-related-info .name{color:var(--rp-ink)}
html.retro-pop .gp-related-info .console{color:var(--rp-ink-2)}
html.retro-pop .gp-tips li::before{background:var(--rp-red)}

/* colofão (:700-715 · inline das feitas à mão): fundo de tinta, texto creme. Literal e não var(--rp-ink): sem JS o
   .rp-colophon não é estampado e os tokens ali dentro continuariam os do papel */
html.retro-pop .gp-footer,
html.retro-pop body > footer{color:var(--gm-cream);background-color:var(--gm-ink)}
html.retro-pop :is(.gp-footer,body > footer) :is(a,p,.footer-link){color:var(--gm-cream)}
html.retro-pop body > footer .footer-text{color:var(--gm-cream-2)}
html.retro-pop body > footer .footer-logo{color:var(--gm-cream);background:none;-webkit-text-fill-color:currentColor}

/* 1.2 modos de jogo (game-play-modes.css, carregada DEPOIS desta folha, com !important em cor e fonte) */
html.retro-pop .og-play-modes h2{color:var(--rp-ink)}
html.retro-pop .og-modes-intro,
html.retro-pop .og-mode-card p,
html.retro-pop .og-mode-card .og-mode-note{color:var(--rp-ink-2)!important}
html.retro-pop .og-mode-card{color:var(--rp-ink);background:var(--gm-white);border-color:var(--gm-ink)}
html.retro-pop .og-mode-online{background:var(--rp-paper-2)}
html.retro-pop .og-mode-card > small:first-child{color:var(--gm-ink)}
html.retro-pop .og-mode-card h3{color:var(--rp-ink)}
html.retro-pop .og-mode-account{color:var(--rp-ink-2)}
html.retro-pop .og-mode-action{color:var(--gm-ink)!important;background:var(--rp-red)!important;border-color:var(--gm-ink)!important}
html.retro-pop .og-mode-lobby{background:var(--rp-cyan)!important}

/* 1.3 feitas à mão (<style> inline das 27). Os acentos de franquia (--neon-pink, --zelda-gold…) eram TEXTO: em
   papel nenhum passa, então cada texto que os lia ganha tinta aqui; os preenchimentos seguem a ponte */
html.retro-pop .related-sidebar,
html.retro-pop .section-card,
html.retro-pop .sidebar-card{color:var(--rp-ink);background:var(--gm-white);border-color:var(--gm-ink);-webkit-backdrop-filter:none;backdrop-filter:none}
html.retro-pop :is(.related-title,.sidebar-title,.section-title,.related-game-card,.feature-title,.faq-question,.info-value,.content-main strong,.content-main h3,.related-see-all,.related-see-all:hover){color:var(--rp-ink)}
html.retro-pop :is(.related-game-platform,.feature-desc,.info-label,.faq-question .chevron,.content-main p,.content-main li,.faq-answer-inner){color:var(--rp-ink-2)}
html.retro-pop .faq-item.active .faq-question .chevron{color:var(--rp-red-deep)}
html.retro-pop .related-game-play,
html.retro-pop .related-game-card:hover .related-game-play{color:var(--gm-ink);background:var(--rp-red)}
html.retro-pop .related-game-card:hover{background:var(--rp-yellow)}
html.retro-pop .feature-card,
html.retro-pop .faq-item{background:var(--rp-paper)}
html.retro-pop .faq-question:hover,
html.retro-pop .feature-card:hover{background:var(--rp-yellow)}
html.retro-pop .share-btn{color:var(--gm-ink);background:var(--gm-white)}
/* emoji decorativos (ícone de título, de botão, de destaque): carimbo de tinta chapada — o glifo colorido sobre papel
   não passa contraste e o conceito só usa ícone monocromático */
html.retro-pop :is(.section-title .icon,.section-title > span:first-child,.emu-btn .icon,.emulator-title .icon,.feature-icon,.og-cta-btn > span,.logo-icon){filter:grayscale(1) brightness(0)}
/* dentro da TV o texto é creme (o rótulo é gradiente recortado no texto; a cor é o que sobra sem ele) */
html.retro-pop .play-label{color:var(--gm-cream)}
html.retro-pop .play-button-large{color:var(--gm-ink);background:var(--rp-red);border:3px solid var(--gm-ink)}
html.retro-pop .sidebar-card [style*="color"]{color:var(--rp-ink-2)!important}
html.retro-pop .sidebar-card [style*="font-weight: 800"]{color:var(--rp-ink)!important;font-family:var(--rp-ff-mono)}
html.retro-pop .sidebar-card [style*="grid-template-columns"] > div{background:var(--rp-paper)!important;border:2px solid var(--gm-ink)!important;border-radius:0!important;box-shadow:var(--rp-sh-1)}
/* cromo do emulador: a tela preta continua (ilha); cabeçalho e barra de teclas viram papel */
html.retro-pop .emulator-section{background:var(--gm-white);border-color:var(--gm-ink)}
html.retro-pop .emulator-header{color:var(--gm-ink);background-color:var(--rp-yellow)}
html.retro-pop .emulator-title{color:var(--gm-ink)}
html.retro-pop .live-indicator{color:var(--gm-ink);background:var(--rp-lime);border-color:var(--gm-ink)}
html.retro-pop .live-dot{background:var(--gm-ink)}
html.retro-pop .emu-btn{color:var(--gm-ink);background:var(--gm-white);border-color:var(--gm-ink)}
html.retro-pop .emu-btn:hover{color:var(--gm-ink);background:var(--rp-cyan)}
html.retro-pop .controls-bar{background:var(--rp-paper-2)}
html.retro-pop .control-hint{color:var(--rp-ink)}

/* 1.4 portal (games/index.html: <style> inline, console-library.css, games-portal.css). nexus-theme.css repinta quase
   tudo com !important em body.nexus-skin — os textos de acento abaixo e a composição da seção 2.7 forçam de volta */
html.retro-pop :is(.cyber-bg,.grid-overlay,.nexus-bg,.nexus-aurora){background:none}
html.retro-pop .glow-orb{display:none}
html.retro-pop .logo-icon{animation:none}
html.retro-pop :is(.logo-link,.logo-text){color:var(--gm-ink)}
html.retro-pop body :is(.logo-text span,.og-stat-num,.og-nav-chip em,.og-console-header .og-count,.og-hub-link,.og-hub-count,.og-section-title span,.og-library-mode,.og-game-card:hover .og-card-title,.ogp-library-status strong){color:var(--gm-ink)!important}
html.retro-pop .og-search-input{background-color:var(--gm-white)}
html.retro-pop .og-search-input::placeholder{color:var(--rp-ink-3);opacity:1}
html.retro-pop .og-nav-chip-img{color:var(--gm-cream);background:var(--gm-ink)}
html.retro-pop body .og-section-title,
html.retro-pop .og-console-header h2,
html.retro-pop body .og-hub-card h3{color:var(--gm-ink)}
html.retro-pop .og-hub-info p,
html.retro-pop .og-library-intro{color:var(--rp-ink-2)}
html.retro-pop .og-hub-media,
html.retro-pop .og-console-icon{background:var(--gm-ink)}
html.retro-pop body .og-console-header{color:var(--rp-ink);background:var(--gm-white)}
html.retro-pop body .og-play-text{color:var(--gm-ink)!important;background:var(--rp-yellow)}
html.retro-pop body :is(.og-library-empty,.og-empty-state){color:var(--rp-ink-2);background:var(--rp-paper-2)}
html.retro-pop .og-about,
html.retro-pop .og-cta{color:var(--rp-ink-2);background:var(--gm-white)}
html.retro-pop .og-about h2,
html.retro-pop .og-cta h2{color:var(--rp-ink);background:none;-webkit-text-fill-color:currentColor}
html.retro-pop .og-about a{color:var(--rp-ink)}
html.retro-pop .og-cta p{color:var(--rp-ink-2)}
html.retro-pop .og-cta-btn{color:var(--gm-ink);background:var(--rp-red)}
html.retro-pop body .ogp-front-nav :is(.nav-active-users-pill,.nav-favorites-btn,.auth-btn,.user-btn){color:var(--gm-ink)!important;background:var(--gm-white)!important;border:3px solid var(--gm-ink)!important;border-radius:var(--rp-r-1)!important;box-shadow:var(--rp-sh-1)!important}
html.retro-pop body .ogp-front-nav .nav-active-users-pill{background:var(--rp-lime)!important}
html.retro-pop body .ogp-front-nav :is(.nav-active-count,.nav-fav-icon,.auth-btn-icon){color:var(--gm-ink)!important;text-shadow:none}
html.retro-pop body .ogp-front-nav .nav-active-dot{background:var(--gm-ink);box-shadow:none}
html.retro-pop body .ogp-library-status,
html.retro-pop .ogp-nds-wifi-panel{color:var(--rp-ink);background:var(--gm-white)}
html.retro-pop :is(.ogp-soft,.ogp-nds-wifi-kicker,.ogp-nds-wifi-status,.ogp-nds-wifi-copy p,.ogp-nds-wifi-action small){color:var(--rp-ink-2)}
html.retro-pop .ogp-nds-wifi-note{color:var(--rp-ink-2)!important}
html.retro-pop .ogp-nds-wifi-heading h2{color:var(--rp-ink)}
html.retro-pop .ogp-nds-wifi-toggle{color:var(--gm-ink);background:var(--gm-white)}
html.retro-pop .ogp-nds-wifi-toggle[aria-checked="true"],
html.retro-pop .ogp-nds-wifi-status[data-state="ready"]{color:var(--gm-ink);background:var(--rp-lime)}
html.retro-pop body .ogp-show-all{color:var(--gm-ink)!important;background:var(--rp-cyan)}
html.retro-pop body .ogp-card-fav{color:var(--gm-ink);background:var(--gm-white)!important}
html.retro-pop .og-online-beta-announcement{color:var(--rp-ink);background:var(--gm-white)}
html.retro-pop .og-online-beta-kicker{color:var(--gm-ink);background:var(--rp-lime)}
html.retro-pop .og-online-beta-announcement h2{color:var(--rp-ink)}
html.retro-pop .og-online-beta-announcement p{color:var(--rp-ink-2)}
html.retro-pop .og-online-beta-action{color:var(--gm-ink);background:var(--rp-red)}
html.retro-pop .og-online-beta-action.secondary{color:var(--gm-white);background:var(--rp-purple)}
html.retro-pop :is(.og-online-beta-dismiss,.og-online-beta-dismiss:hover,.og-online-beta-dismiss:focus-visible){color:var(--gm-ink);background:var(--gm-white)}

/* 1.5 diálogo do launcher (launcher-play.css, por launcher-play-gate.js nos sistemas só-launcher; carrega DEPOIS) */
html.retro-pop .og-launcher-dialog{color-scheme:light;color:var(--gm-ink);background:var(--gm-white)}
html.retro-pop .og-launcher-dialog::backdrop{background:rgba(23,19,31,.72);-webkit-backdrop-filter:none;backdrop-filter:none}
html.retro-pop :is(.og-launcher-dialog p,.og-launcher-dialog .og-launcher-note,.og-launcher-identity small){color:var(--rp-ink-2)}
html.retro-pop .og-launcher-status{color:var(--rp-ink-2)!important}
html.retro-pop .og-launcher-close,
html.retro-pop .og-launcher-open{color:var(--gm-ink);background:var(--gm-white)}
html.retro-pop .og-launcher-download{color:var(--gm-ink)!important;background:var(--rp-orange)}
html.retro-pop .og-launcher-identity img{background:var(--rp-paper-2)}


/* ═══════════ 2 · COMPOSIÇÃO ═══════════ */

/* 2.1 tarja amarela com retícula e corte diagonal em camada de fundo (pseudo-elemento mataria o sticky) */
html.retro-pop .gp-nav,
html.retro-pop .navbar{
  padding-top:10px;padding-bottom:22px;border-bottom:0;
  background-color:var(--rp-yellow);
  background-image:linear-gradient(179.4deg,transparent 0 calc(100% - 12px),var(--gm-ink) calc(100% - 12px)),var(--gm-dots);
  background-size:auto,8px 8px;box-shadow:0 4px 0 rgba(23,19,31,.18)}
/* logotipo: etiqueta de papel colada na tarja (a nav das de catálogo é só <a>: o primeiro é a marca) */
html.retro-pop .gp-brand,html.retro-pop .gp-nav > a:not([class]):first-child,html.retro-pop .navbar .logo{
  display:inline-flex;align-items:center;gap:9px;min-width:0;min-height:44px;padding:4px 14px 5px 7px;
  border:3px solid var(--gm-ink);background:var(--gm-white);box-shadow:var(--rp-sh-2);
  transform:rotate(-1.6deg);text-decoration:none}
html.retro-pop .gp-nav > a:not([class]):first-child{padding-left:14px}
html.retro-pop .gp-brand-mark{width:34px;height:34px}
html.retro-pop .gp-og-orbit{border:3px solid var(--gm-ink)}
html.retro-pop .gp-og-core{width:24px;height:24px;border:0;font:400 10px/1 var(--rp-ff-display)}
html.retro-pop .gp-brand-copy strong,html.retro-pop .gp-nav > a:not([class]):first-child,html.retro-pop .navbar .logo-text{
  display:inline-block;font:400 clamp(16px,1.5vw,21px)/1 var(--rp-ff-display);letter-spacing:-.01em;text-transform:uppercase;
  transform:skewX(var(--rp-skew));text-shadow:3px 3px 0 var(--rp-red)}
html.retro-pop .gp-brand-copy small{margin-top:3px;font:700 9px/1 var(--rp-ff-mono);letter-spacing:.14em;opacity:1}
html.retro-pop .navbar .logo-icon{font-size:1.5rem}
html.retro-pop .gp-navlinks a,html.retro-pop .gp-nav > a:not([class]) ~ a,html.retro-pop .nav-link{
  display:inline-flex;align-items:center;min-height:44px;padding:0 10px;border:0;border-bottom:4px solid transparent;border-radius:0;background:none;
  font:800 var(--rp-fs-small)/1 var(--rp-ff-body);text-transform:uppercase;letter-spacing:.03em;text-decoration:none;
  transition:border-color var(--rp-t-fast) linear,background-color var(--rp-t-fast) linear}
html.retro-pop .gp-navlinks a:hover,html.retro-pop .gp-nav > a:not([class]) ~ a:hover,html.retro-pop .nav-link:hover,
html.retro-pop .nav-link[aria-current="page"]{border-color:var(--rp-cyan);background:rgba(255,250,240,.55)}
html.retro-pop .nav-link[aria-current="page"]{border-color:var(--rp-red)}
html.retro-pop .gp-nav > a:not([class]){margin-right:4px}
/* "N online": lima é o estado ao vivo */
html.retro-pop .gp-nav-status{height:auto;min-height:40px;padding:0 11px;border:3px solid;border-radius:0;box-shadow:var(--rp-sh-1);
  font:800 var(--rp-fs-micro)/1 var(--rp-ff-body);text-transform:uppercase;letter-spacing:var(--rp-tr-sticker)}
html.retro-pop .gp-nav-status strong{background:none;font:700 14px/1 var(--rp-ff-mono)}
html.retro-pop .gp-live-dot{animation:rpDot 1.6s ease-in-out infinite;animation-play-state:var(--rp-play)}
html.retro-pop :is(.gp-favorites-pill,.gp-pro-pill,.gp-signin,.gp-cta,.gp-mode-jump,.gp-avatar-btn){
  min-height:44px;height:auto;border:3px solid var(--gm-ink);border-radius:var(--rp-r-1);box-shadow:var(--rp-sh-1);
  font:800 12px/1 var(--rp-ff-body);text-transform:uppercase;letter-spacing:var(--rp-tr-sticker);text-decoration:none;
  transition:var(--rp-pop),background-color var(--rp-t-fast) linear}
html.retro-pop :is(.gp-favorites-pill,.gp-pro-pill,.gp-signin,.gp-cta,.gp-mode-jump,.gp-avatar-btn):hover{transform:translate(-2px,-2px);box-shadow:var(--rp-sh-2)}
html.retro-pop .gp-favorites-pill strong{border:2px solid var(--gm-ink);border-radius:0;font:700 11px/1 var(--rp-ff-mono)}
html.retro-pop .gp-avatar-ring{padding:2px}
html.retro-pop .gp-avatar-copy b{font:800 12px/1.1 var(--rp-ff-body)}
html.retro-pop .gp-user-menu{border:3px solid var(--gm-ink);border-radius:0;box-shadow:var(--rp-sh-2)}
html.retro-pop .gp-user-menu button{border-radius:0;font:800 14px/1 var(--rp-ff-body)}

/* migalha: sobretítulo em mono */
html.retro-pop .gp-breadcrumb,
html.retro-pop .breadcrumb{font:700 var(--rp-fs-micro)/1.6 var(--rp-ff-mono);letter-spacing:.1em;text-transform:uppercase}
html.retro-pop .gp-breadcrumb a,
html.retro-pop .breadcrumb a{text-decoration:underline;text-decoration-color:var(--rp-cyan);text-decoration-thickness:2px;text-underline-offset:3px}

/* 2.2 capa de revista: chamada à esquerda, a CAPA DO JOGO à direita como recorte colado — moldura de papel, sombra
   dura vermelha, fita no topo e selo estourado no canto, sobre raios estáticos (59/41 do conceito) */
html.retro-pop .gp-hero{grid-template-columns:minmax(0,1fr) minmax(220px,340px);column-gap:clamp(30px,5vw,80px);align-items:start;
  padding-top:clamp(26px,3.4vw,46px);padding-bottom:clamp(44px,5vw,76px)}
html.retro-pop .gp-hero > .gp-cover-wrap{order:2;margin-top:34px}
/* o vão sob a migalha é o slot de anúncio do topo (90px reservados, vazio sem anúncio): a capa encosta nele em vez de somar
   o próprio respiro. Regra no hero, nenhuma no slot; o celular segue com o padding dele (seção 3) */
@media (min-width:761px){html.retro-pop .gp-ad-banner + .gp-hero{padding-top:6px}}
html.retro-pop .gp-hero > .gp-hero-info{position:relative;z-index:1}
html.retro-pop .gp-hero::before{
  left:auto;right:0;top:-10px;bottom:auto;width:min(48%,560px);height:auto;aspect-ratio:1;z-index:0;pointer-events:none;
  background:var(--rp-pat-rays);opacity:.7;
  -webkit-mask-image:radial-gradient(circle,#000 58%,transparent 71%);mask-image:radial-gradient(circle,#000 58%,transparent 71%)}
html.retro-pop .gp-cover-wrap{
  --rp-tilt:2.4deg;z-index:1;aspect-ratio:auto;overflow:visible;padding:10px;border:3px solid var(--gm-ink);border-radius:0;
  box-shadow:9px 10px 0 0 var(--rp-red),9px 10px 0 3px var(--gm-ink);transform:rotate(var(--rp-tilt));transition:var(--rp-pop)}
html.retro-pop .gp-hero .gp-cover-wrap:hover{transform:rotate(var(--rp-tilt)) translate(-3px,-4px);box-shadow:12px 14px 0 0 var(--rp-red),12px 14px 0 3px var(--gm-ink)}
html.retro-pop .gp-hero .gp-cover-wrap img{aspect-ratio:3/4;height:auto;padding:0;border:2px solid var(--gm-ink);box-shadow:none;object-fit:cover}
/* a faixa de vidro (::after, mix-blend) vira a fita adesiva; ::before é o selo */
html.retro-pop .gp-cover-wrap::after{
  inset:auto;left:50%;top:-18px;width:118px;height:36px;margin-left:-59px;z-index:3;mix-blend-mode:normal;
  transform:rotate(-4deg);background:var(--rp-art-tape) center/100% 100% no-repeat}
html.retro-pop .gp-cover-wrap::before{
  content:"PLAY\A FREE!";white-space:pre;position:absolute;z-index:4;right:-36px;top:-34px;
  display:grid;place-items:center;width:100px;height:100px;padding:12px;pointer-events:none;
  background:var(--rp-art-burst) center/100% 100% no-repeat;color:var(--gm-ink);
  font:400 14px/1.05 var(--rp-ff-sticker);letter-spacing:var(--rp-tr-sticker);text-align:center;
  transform:rotate(-8deg);animation:rpWobble3 6.5s ease-in-out infinite;animation-play-state:var(--rp-play)}
/* só-launcher (PS2, PS3, GameCube, Wii, 3DS): o selo vira etiqueta laranja — laranja é o launcher */
html.retro-pop .gp-hero:has(.gp-play-btn[href^="/launcher-play"]) .gp-cover-wrap::before{
  content:"WINDOWS\A LAUNCHER";width:auto;height:auto;padding:8px 12px;right:-26px;top:-24px;
  background:var(--rp-orange);border:3px solid var(--gm-ink);box-shadow:var(--rp-sh-2);font-size:12px;animation:none;transform:rotate(6deg)}
/* chamada */
html.retro-pop .gp-hero-info::before{
  content:"\2605  Cover story" / "";display:inline-block;margin-bottom:16px;padding:5px 10px;border:2px solid var(--gm-ink);
  background:var(--gm-ink);color:var(--gm-white);font:700 var(--rp-fs-micro)/1.2 var(--rp-ff-mono);letter-spacing:.16em;text-transform:uppercase;
  transform:rotate(-1.5deg)}
html.retro-pop .gp-hero h1{
  max-width:none;margin:0 0 20px;font:400 clamp(34px,4.6vw,68px)/.92 var(--rp-ff-display);letter-spacing:var(--rp-tr-display);
  text-transform:uppercase;text-shadow:4px 4px 0 var(--rp-red);transform:skewX(-5deg);transform-origin:0 100%;overflow-wrap:anywhere}
html.retro-pop .gp-tags{gap:10px;margin-bottom:20px}
html.retro-pop .gp-tag{
  min-height:30px;padding:0 10px;border:2px solid var(--gm-ink);border-radius:0;box-shadow:var(--rp-sh-1);
  font:800 var(--rp-fs-micro)/1.25 var(--rp-ff-body);letter-spacing:var(--rp-tr-sticker);text-transform:uppercase;transform:rotate(var(--rp-tilt))}
html.retro-pop :is(.gp-tag,.badge):nth-child(odd){--rp-tilt:-1.6deg}
html.retro-pop :is(.gp-tag,.badge):nth-child(even){--rp-tilt:.9deg}
html.retro-pop .gp-tagline{max-width:62ch;margin-bottom:28px;font:500 clamp(16px,1.2vw,19px)/1.55 var(--rp-ff-body)}
html.retro-pop .gp-hero-info > p:not([class]){color:var(--rp-ink-2);font:500 clamp(16px,1.2vw,19px)/1.55 var(--rp-ff-body);margin-bottom:24px}

/* botões da capa: tinta de banca, borda de 3px, sombra de papel; o Jogar é o único vermelho grande */
html.retro-pop .gp-play-row{gap:14px;align-items:center}
html.retro-pop :is(.gp-play-btn,.gp-play-btn-secondary,.btn-play,.btn-secondary){
  min-height:54px;border:3px solid var(--gm-ink);border-radius:var(--rp-r-1);box-shadow:var(--rp-sh-2);
  font:800 15px/1.15 var(--rp-ff-body);text-transform:uppercase;letter-spacing:var(--rp-tr-sticker);text-decoration:none;filter:none;
  transition:var(--rp-pop),background-color var(--rp-t-fast) linear}
html.retro-pop .gp-play-btn,
html.retro-pop .btn-play{padding:0 30px;box-shadow:var(--rp-sh-3);font-size:17px}
html.retro-pop :is(.gp-play-btn,.gp-play-btn-secondary,.btn-play,.btn-secondary):hover{transform:translate(-2px,-3px);box-shadow:var(--rp-sh-3);filter:none}
html.retro-pop :is(.gp-play-btn,.gp-play-btn-secondary,.btn-play,.btn-secondary):active{transform:translate(3px,4px);box-shadow:1px 1px 0 var(--gm-ink)}
/* o texto do botão vira "Play solo"/"Play in launcher" (game-play-modes.js) e perde o ▶ da página */
html.retro-pop .gp-play-btn[data-og-play-mode]::before{content:"";flex:none;border-left:12px solid currentColor;border-top:8px solid transparent;border-bottom:8px solid transparent}

/* "Como você quer jogar?": dois cupons lado a lado — o solo em papel couché, o online em papel pardo */
html.retro-pop .og-play-modes{margin:28px 0 24px}
html.retro-pop .og-play-modes h2{margin-bottom:8px;font:400 clamp(20px,1.9vw,26px)/1.1 var(--rp-ff-display);text-transform:uppercase;letter-spacing:0}
html.retro-pop .og-modes-intro{font:500 15px/1.5 var(--rp-ff-body)!important}
html.retro-pop .og-mode-grid{gap:22px}
html.retro-pop .og-mode-card{padding:20px 20px 18px;border:3px solid;border-radius:0;box-shadow:var(--rp-sh-2);transform:rotate(var(--rp-tilt))}
html.retro-pop .og-mode-solo{--rp-tilt:-.8deg}
html.retro-pop .og-mode-online{--rp-tilt:.7deg}
html.retro-pop .og-mode-card > small:first-child{align-self:flex-start;padding:4px 8px;border:2px solid var(--gm-ink);background:var(--rp-yellow);font:800 10px/1.2 var(--rp-ff-body);letter-spacing:.12em}
html.retro-pop .og-mode-online > small:first-child{background:var(--rp-lime)}
html.retro-pop .og-mode-card h3{margin:12px 0 10px;font:400 clamp(19px,1.6vw,22px)/1.1 var(--rp-ff-display);text-transform:uppercase}
html.retro-pop .og-mode-card p{font:500 14px/1.55 var(--rp-ff-body)!important}
html.retro-pop .og-mode-action{min-height:52px;padding:12px 16px!important;border:3px solid!important;border-radius:var(--rp-r-1)!important;box-shadow:var(--rp-sh-2);
  font:800 14px/1.3 var(--rp-ff-body)!important;text-transform:uppercase;letter-spacing:var(--rp-tr-sticker);gap:10px}
html.retro-pop .og-mode-action:hover{filter:none;transform:translate(-2px,-3px);box-shadow:var(--rp-sh-3)}
html.retro-pop .og-mode-account{margin-top:12px;font:600 12px/1.45 var(--rp-ff-body)}
html.retro-pop .gp-mode-jump{padding:0 16px;border-color:var(--gm-ink)}

/* 2.3 matérias: cartões de papel com sombra dura; título em faixa de banca. O papel gira de leve, os cartões não
   giram no celular. O relacionado é a página aberta (sem cartão) */
html.retro-pop .gp-section{position:relative;max-width:1180px}
html.retro-pop .gp-section + .gp-section{border-top:0}
html.retro-pop .gp-section:not(:has(> .gp-related-grid)){
  width:calc(100% - 2*clamp(16px,4vw,58px));margin:0 auto 46px;padding:clamp(26px,3.4vw,42px) clamp(20px,3.6vw,46px);
  border:5px solid var(--gm-ink);background:var(--gm-white);box-shadow:var(--rp-sh-3);transform:rotate(var(--rp-tilt))}
html.retro-pop .gp-section:nth-of-type(odd){--rp-tilt:-.35deg}
html.retro-pop .gp-section:nth-of-type(even){--rp-tilt:.3deg}
html.retro-pop .gp-hero + .gp-section::before,
html.retro-pop .gp-content > .gp-section:first-child::before{
  content:"";position:absolute;left:-18px;top:-16px;width:118px;height:36px;z-index:3;pointer-events:none;
  transform:rotate(-14deg);background:var(--rp-art-tape) center/100% 100% no-repeat}
html.retro-pop .gp-section > h2{
  display:inline-block;max-width:100%;margin:0 0 22px -6px;padding:12px 26px 12px 36px;
  border-top:4px solid var(--gm-ink);border-bottom:4px solid var(--gm-ink);
  background:var(--rp-red) var(--rp-art-ribcap) no-repeat left center/22px 100%;
  font:400 clamp(20px,2.2vw,30px)/1.15 var(--rp-ff-display);letter-spacing:var(--rp-tr-display);text-transform:uppercase;
  /* .6°: com a faixa girada, a caixa do texto sobe pelas pontas; em título longo (PSP, ~860px) 1° deixava papel atrás das letras */
  transform:rotate(-.6deg)}
html.retro-pop .gp-section:has(> .gp-controls-grid) > h2{background-color:var(--rp-cyan)}
html.retro-pop .gp-section:has(> h3:not(.gp-sub)) > h2{background-color:var(--rp-yellow)}
html.retro-pop #launcherRequirements > h2{background-color:var(--rp-orange)}
html.retro-pop .gp-section p{max-width:72ch;font-family:var(--rp-ff-body)}
html.retro-pop .gp-section :is(ul,ol):not([class]){margin:0 0 14px;padding-left:22px}
html.retro-pop .gp-section :is(ul,ol):not([class]) li{margin-bottom:6px}
/* FAQ: cada pergunta leva um "Q" de selo amarelo; a resposta alinha com o texto da pergunta */
html.retro-pop .gp-section > h3:not(.gp-sub){display:flex;align-items:baseline;gap:10px;font-family:var(--rp-ff-body);font-weight:800;line-height:1.35}
html.retro-pop .gp-section > h3:not(.gp-sub)::before{
  content:"Q";flex:none;display:inline-grid;place-items:center;width:26px;height:26px;border:2px solid var(--gm-ink);
  background:var(--rp-yellow);color:var(--gm-ink);box-shadow:var(--rp-sh-1);font:400 13px/1 var(--rp-ff-display);transform:rotate(-5deg) translateY(4px)}
html.retro-pop .gp-section > h3:not(.gp-sub) + p{padding-left:36px}
html.retro-pop .gp-section h3.gp-sub{font-family:var(--rp-ff-display);font-weight:400;text-transform:uppercase;letter-spacing:0}
html.retro-pop .gp-tips li::before{top:.5em;width:9px;height:9px;border:2px solid var(--gm-ink);border-radius:0;transform:rotate(45deg)}

/* ficha técnica: etiquetas de preço (furo de tinta, giro alternado) */
html.retro-pop .gp-meta-grid{gap:18px 16px;margin:26px 0 6px}
html.retro-pop .gp-meta-item{
  display:block;min-height:0;padding:12px 16px 12px 34px;border:3px solid var(--gm-ink);border-radius:var(--rp-r-1);
  background:var(--gm-white) radial-gradient(circle 5px at 16px 50%,var(--gm-ink) 97%,transparent) no-repeat;
  box-shadow:var(--rp-sh-2);transform:rotate(var(--rp-tilt))}
html.retro-pop .gp-meta-item:nth-child(4n+1){--rp-tilt:-1.8deg}
html.retro-pop .gp-meta-item:nth-child(4n+2){--rp-tilt:1.2deg}
html.retro-pop .gp-meta-item:nth-child(4n+3){--rp-tilt:-.7deg}
html.retro-pop .gp-meta-item:nth-child(4n){--rp-tilt:1.6deg}
html.retro-pop .gp-meta-label{margin-bottom:4px;font:700 var(--rp-fs-micro)/1.2 var(--rp-ff-mono);letter-spacing:.1em;text-transform:uppercase}
html.retro-pop .gp-meta-value{font:800 17px/1.25 var(--rp-ff-body)}

/* controles: quadro de teclas — teclas de verdade (capa de tecla com sombra embaixo), linhas alternadas */
html.retro-pop .gp-controls-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:0;margin:22px 0 6px;padding:6px;
  border:3px solid var(--gm-ink);background:var(--gm-white);box-shadow:var(--rp-sh-2);overflow:visible}
html.retro-pop .gp-control-row{min-height:54px;gap:12px;padding:8px 12px;border:0;border-bottom:2px dashed var(--rp-ink-soft);border-radius:0;font:700 15px/1.3 var(--rp-ff-body)}
html.retro-pop .gp-control-row:nth-child(odd){background:var(--rp-paper)}
html.retro-pop .gp-key,
html.retro-pop .key-badge{display:inline-grid;place-items:center;min-width:44px;min-height:34px;padding:4px 9px;border:2px solid var(--gm-ink);border-radius:var(--rp-r-1);
  box-shadow:0 3px 0 var(--gm-ink);font:700 13px/1 var(--rp-ff-mono)}

/* 2.4 relacionados: recortes destacáveis (capa em moldura de papel, giro alternado, play vermelho na capa) sobre a
   página aberta; no celular, trilho com snap */
html.retro-pop .gp-section:has(> .gp-related-grid){max-width:1240px;padding-top:clamp(20px,3vw,34px);padding-bottom:clamp(36px,5vw,64px)}
html.retro-pop .gp-section:has(> .gp-related-grid)::before{
  content:"";display:block;height:12px;margin:0 0 30px;opacity:.5;pointer-events:none;background:var(--rp-pat-zig) repeat-x 0 0/40px 12px}
html.retro-pop .gp-related-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:34px 26px;margin-top:26px}
html.retro-pop .gp-related-card{position:relative;overflow:visible;border:0;border-radius:0;box-shadow:none;
  transform:rotate(var(--rp-tilt));transition:transform var(--rp-t) var(--rp-e-out)}
html.retro-pop .gp-related-card:nth-child(odd){--rp-tilt:-2deg}
html.retro-pop .gp-related-card:nth-child(even){--rp-tilt:1.6deg}
html.retro-pop .gp-related-card:hover,
html.retro-pop .gp-related-card:focus-visible{transform:rotate(var(--rp-tilt)) translate(-2px,-4px);border-color:transparent;box-shadow:none}
html.retro-pop .gp-related-card img{padding:4px;border:3px solid var(--gm-ink);box-shadow:var(--rp-sh-2);transition:box-shadow var(--rp-t) var(--rp-e-out)}
html.retro-pop .gp-related-card:hover img{box-shadow:var(--rp-sh-3)}
html.retro-pop .gp-related-card::after{
  content:"";position:absolute;left:0;right:0;top:0;aspect-ratio:3/4;pointer-events:none;
  background:var(--gm-play) no-repeat right 10px bottom 10px/42px 42px;opacity:.85;transition:opacity var(--rp-t) linear}
html.retro-pop .gp-related-card:hover::after{opacity:1}
html.retro-pop .gp-related-info{padding:12px 2px 0}
html.retro-pop .gp-related-info .name{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  font:400 15px/1.1 var(--rp-ff-display);text-transform:uppercase;letter-spacing:0}
html.retro-pop .gp-related-info .console{margin-top:6px;font:700 var(--rp-fs-micro)/1.2 var(--rp-ff-mono);letter-spacing:.1em;text-transform:uppercase}

/* 2.5 colofão: tinta com retícula, borda rasgada em cima, faixa de bala embaixo */
html.retro-pop .gp-footer,
html.retro-pop body > footer{
  position:relative;margin-top:72px;padding:46px 22px 50px;border-top:0;
  background-image:var(--rp-pat-candy),var(--gm-dots-cream);background-size:100% 10px,10px 10px;
  background-position:left bottom,0 0;background-repeat:no-repeat,repeat;font:600 14px/1.7 var(--rp-ff-body)}
html.retro-pop .gp-footer::before,
html.retro-pop body > footer::before{
  content:"";position:absolute;left:0;right:0;top:-19px;height:20px;pointer-events:none;
  background:var(--rp-edge-torn) repeat-x 0 0/240px 20px;transform:scaleY(-1)}
html.retro-pop :is(.gp-footer,body > footer) a{display:inline-block;padding:6px 0;border-bottom:2px solid transparent;text-decoration:none;transition:border-color var(--rp-t-fast) linear}
html.retro-pop :is(.gp-footer,body > footer) a:hover{color:var(--rp-yellow);border-bottom-color:var(--rp-yellow)}
html.retro-pop body > footer .footer-logo{font:400 clamp(24px,2vw,30px)/1.1 var(--rp-ff-display);text-transform:uppercase;text-shadow:3px 3px 0 var(--rp-red)}

/* 2.6 feitas à mão: o mesmo vocabulário nos seletores delas */
html.retro-pop .navbar{padding-left:24px;padding-right:24px}
html.retro-pop .nav-links{gap:4px;align-items:center}
html.retro-pop .breadcrumb .current{font-weight:700}
html.retro-pop .game-cover-wrapper{z-index:1}
html.retro-pop .game-cover-img{padding:8px;border:3px solid var(--gm-ink);border-radius:0;background:var(--gm-white);
  box-shadow:8px 9px 0 0 var(--rp-red),8px 9px 0 3px var(--gm-ink);transform:rotate(2deg)}
html.retro-pop .game-cover-wrapper:hover .game-cover-img{transform:rotate(2deg) translate(-3px,-4px)}
html.retro-pop .game-cover-wrapper::after{content:"";position:absolute;left:50%;top:-16px;width:104px;height:32px;margin-left:-52px;z-index:3;pointer-events:none;
  transform:rotate(-4deg);background:var(--rp-art-tape) center/100% 100% no-repeat}
html.retro-pop .badge{padding:5px 11px;border:2px solid;border-radius:0;box-shadow:var(--rp-sh-1);font:800 var(--rp-fs-micro)/1.25 var(--rp-ff-body);text-transform:uppercase;letter-spacing:var(--rp-tr-sticker);transform:rotate(var(--rp-tilt))}
html.retro-pop :is(.game-title,.game-title-main){font-family:var(--rp-ff-display);font-weight:400;text-transform:uppercase;line-height:.95;letter-spacing:var(--rp-tr-display);
  text-shadow:4px 4px 0 var(--rp-red);transform:skewX(-5deg);transform-origin:0 100%}
html.retro-pop :is(.btn-play,.btn-secondary){display:inline-flex;align-items:center;gap:10px;padding:0 24px}
/* coluna de relacionados e cartões de matéria: papel couché com borda de tinta */
html.retro-pop :is(.related-sidebar,.section-card,.sidebar-card,.emulator-section){border:3px solid var(--gm-ink);border-radius:0;box-shadow:var(--rp-sh-3)}
html.retro-pop .related-sidebar{transform:rotate(.6deg)}
html.retro-pop :is(.related-header,.section-title,.sidebar-title){border-bottom:3px solid var(--gm-ink)}
html.retro-pop :is(.related-title,.section-title,.sidebar-title){font-family:var(--rp-ff-display);font-weight:400;text-transform:uppercase;letter-spacing:0}
html.retro-pop .related-see-all{padding:6px 10px;border:2px solid var(--gm-ink);background:var(--rp-cyan);box-shadow:var(--rp-sh-1);font-weight:800;text-transform:uppercase}
html.retro-pop .related-game-card{border:2px solid transparent;border-radius:0}
html.retro-pop .related-game-card:hover{border-color:var(--gm-ink);transform:translateX(4px)}
html.retro-pop .related-game-cover{border:2px solid var(--gm-ink);border-radius:0}
html.retro-pop .related-game-play{border:3px solid var(--gm-ink);box-shadow:var(--rp-sh-1)}
html.retro-pop .emulator-header{background-image:var(--gm-dots);background-size:8px 8px;border-bottom:3px solid var(--gm-ink)}
html.retro-pop .emulator-title{font-family:var(--rp-ff-display);font-weight:400;text-transform:uppercase;letter-spacing:0}
html.retro-pop .live-indicator{border:2px solid;border-radius:0}
html.retro-pop .emu-btn{min-height:44px;border:3px solid;border-radius:var(--rp-r-1);box-shadow:var(--rp-sh-1);font-weight:800}
html.retro-pop .controls-bar{border-top:3px solid var(--gm-ink)}
html.retro-pop .feature-card{border:2px solid var(--gm-ink);border-radius:0;box-shadow:var(--rp-sh-1)}
html.retro-pop .feature-card:hover{border-color:var(--gm-ink);transform:translate(-2px,-3px)}
html.retro-pop .faq-item{border:2px solid var(--gm-ink);border-radius:0}
html.retro-pop .info-list li{border-bottom:2px dashed var(--rp-ink-soft)}
html.retro-pop .info-value{font-weight:800}
html.retro-pop .share-btn{border:3px solid var(--gm-ink);border-radius:var(--rp-r-1);box-shadow:var(--rp-sh-1);font-weight:800;text-transform:uppercase;letter-spacing:var(--rp-tr-sticker)}
html.retro-pop .share-btn.twitter{border-left:12px solid #1da1f2}
html.retro-pop .share-btn.facebook{border-left:12px solid #4267b2}
html.retro-pop .share-btn.reddit{border-left:12px solid #ff4500}


/* 2.7 portal: o vocabulário de console.css (tarja, capa, etiquetas de preço, card de papel com faixa de tinta) mais os
   cartões de console. O que nexus-theme.css força com !important (vidro, pílula, raio, ciano) é forçado de volta aqui */
html.retro-pop body .top-navbar{padding-top:10px;padding-bottom:24px;color:var(--gm-ink);max-width:none;margin:0!important;border:0!important;border-radius:0!important;
  background:linear-gradient(179.4deg,transparent 0 calc(100% - 13px),var(--gm-ink) calc(100% - 13px)),var(--gm-dots) 0 0/8px 8px var(--rp-yellow)!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:0 4px 0 rgba(23,19,31,.18)!important}
html.retro-pop body .top-navbar .nav-link{border:0!important;border-bottom:4px solid transparent!important;border-radius:0!important;background:none!important;color:var(--gm-ink)!important;box-shadow:none!important}
html.retro-pop body .top-navbar .nav-link:is(:hover,[aria-current="page"]){border-bottom-color:var(--rp-red)!important;background:rgba(255,250,240,.55)!important}
html.retro-pop body .top-navbar .logo-icon{border:0!important;box-shadow:none!important}
html.retro-pop .logo-link{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 7px;border:3px solid var(--gm-ink);background:var(--gm-white);
  box-shadow:var(--rp-sh-2);transform:rotate(-1.6deg);text-decoration:none}
html.retro-pop .logo-text{display:inline-block;font:400 clamp(17px,1.7vw,23px)/1 var(--rp-ff-display);text-transform:uppercase;transform:skewX(var(--rp-skew));text-shadow:3px 3px 0 var(--rp-red)}
html.retro-pop .og-hero{position:relative;text-align:left;max-width:1240px;padding:clamp(40px,5vw,64px) 24px clamp(30px,4vw,48px)}
html.retro-pop .og-hero::before{content:"";position:absolute;right:0;top:0;width:min(42%,480px);aspect-ratio:1;pointer-events:none;background:var(--rp-pat-rays);opacity:.7;
  -webkit-mask-image:radial-gradient(circle,#000 58%,transparent 71%);mask-image:radial-gradient(circle,#000 58%,transparent 71%)}
html.retro-pop .og-hero > *{position:relative}
html.retro-pop body .og-hero h1{max-width:16ch;margin:0 0 20px;color:var(--rp-ink)!important;background:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:currentColor;filter:none;
  font:400 clamp(34px,5.4vw,72px)/.92 var(--rp-ff-display);font-weight:400!important;letter-spacing:var(--rp-tr-display);text-transform:uppercase;
  text-shadow:4px 4px 0 var(--rp-red)!important;transform:skewX(-5deg);transform-origin:0 100%}
html.retro-pop body .og-hero h1 span{display:block;color:var(--rp-cyan-deep);text-shadow:4px 4px 0 var(--gm-ink)!important}
html.retro-pop .og-hero p.lead{max-width:60ch;margin:0;font:500 var(--rp-fs-body)/var(--rp-lh-body) var(--rp-ff-body)}
html.retro-pop .og-hero-stats{justify-content:flex-start;gap:18px 20px;margin-top:30px}
html.retro-pop body .og-stat{position:relative;align-items:flex-start;min-width:146px;padding:12px 18px 12px 30px;box-shadow:var(--rp-sh-2);transform:rotate(var(--rp-tilt));
  background:var(--gm-white) linear-gradient(90deg,var(--gm-ink) 0 10px,transparent 10px) no-repeat!important;border:3px solid var(--gm-ink)!important;border-radius:0!important}
html.retro-pop .og-stat:nth-child(odd){--rp-tilt:-1.6deg}
html.retro-pop .og-stat:nth-child(even){--rp-tilt:1.2deg}
html.retro-pop body .og-stat-num{font:700 clamp(24px,2.4vw,36px)/.95 var(--rp-ff-mono);font-family:var(--rp-ff-mono)!important;letter-spacing:-.02em;text-shadow:none}
html.retro-pop .og-stat-lbl{margin-top:5px;font:700 var(--rp-fs-micro)/1.2 var(--rp-ff-mono);letter-spacing:.1em}
html.retro-pop body .og-search-wrap{max-width:600px;margin:30px 0 0;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important}
html.retro-pop .og-search-input{min-height:52px;padding:0 18px 0 48px;border:3px solid var(--gm-ink);border-radius:var(--rp-r-pill);box-shadow:var(--rp-sh-2);font:600 15px/1 var(--rp-ff-body)}
html.retro-pop .og-search-input:focus{border-color:var(--gm-ink);background-color:#fff;box-shadow:4px 5px 0 var(--rp-cyan),4px 5px 0 3px var(--gm-ink)}
html.retro-pop .og-search-icon{opacity:1}
html.retro-pop :is(.og-console-nav,.og-filter-bar){gap:10px;justify-content:flex-start}
html.retro-pop body :is(.og-nav-chip,.og-filter-chip){min-height:44px;padding:5px 12px;font:800 var(--rp-fs-small)/1 var(--rp-ff-body);text-transform:uppercase;letter-spacing:var(--rp-tr-sticker);transition:var(--rp-pop);
  background:var(--gm-white)!important;border:3px solid var(--gm-ink)!important;border-radius:0!important;color:var(--gm-ink)!important;box-shadow:var(--rp-sh-1)!important}
html.retro-pop body :is(.og-nav-chip,.og-filter-chip):hover,
html.retro-pop body .og-filter-chip.active{transform:translate(-2px,-2px);background:var(--rp-cyan)!important;color:var(--gm-ink)!important;box-shadow:var(--rp-sh-2)!important}
html.retro-pop .og-nav-chip-img{width:34px;height:22px;border-radius:0;font:700 8px/1 var(--rp-ff-mono)}
html.retro-pop .og-nav-chip em{padding:2px 6px;border:2px solid var(--gm-ink);border-radius:0;background:var(--rp-yellow);font:700 11px/1 var(--rp-ff-mono)}
html.retro-pop .og-section-title{display:table;margin:0 auto 24px;padding:9px 30px 9px 40px;border-top:4px solid var(--gm-ink);border-bottom:4px solid var(--gm-ink);
  background:var(--rp-red) var(--rp-art-ribcap) no-repeat left center/26px 100%;font:400 clamp(20px,2.4vw,32px)/1.15 var(--rp-ff-display);transform:rotate(-1deg)}
html.retro-pop .og-hub-grid{gap:20px}
html.retro-pop body :is(.og-hub-card,.og-game-card){transform:rotate(var(--rp-tilt));transition:var(--rp-pop);background:var(--gm-white)!important;border:3px solid var(--gm-ink)!important;border-radius:0!important;box-shadow:var(--rp-sh-2)!important}
html.retro-pop body :is(.og-hub-card,.og-game-card):hover{transform:rotate(var(--rp-tilt)) translate(-3px,-4px);border-color:var(--gm-ink)!important;box-shadow:var(--rp-sh-3)!important}
html.retro-pop body .og-hub-card:hover{background:var(--rp-yellow)!important}
html.retro-pop :is(.og-hub-card,.og-game-card):nth-child(4n+1){--rp-tilt:-.7deg}
html.retro-pop :is(.og-hub-card,.og-game-card):nth-child(4n+3){--rp-tilt:.6deg}
html.retro-pop :is(.og-hub-media,.og-console-icon){border:0;border-radius:0}
html.retro-pop :is(.og-hub-media,.og-console-icon) img{filter:none}
html.retro-pop .og-hub-info h3{font:400 15px/1.15 var(--rp-ff-display);text-transform:uppercase;letter-spacing:0}
html.retro-pop .og-hub-count{font:700 var(--rp-fs-micro)/1.3 var(--rp-ff-mono);letter-spacing:.08em;text-transform:uppercase}
/* menu do portal no celular (console-library.css:25-27): botão e gaveta escuros */
html.retro-pop body .og-library-menu{color:var(--gm-ink);background:var(--gm-white);border:3px solid var(--gm-ink);border-radius:0;box-shadow:var(--rp-sh-1)}
html.retro-pop body .top-navbar.og-library-menu-open .nav-links{background:var(--gm-white);border:3px solid var(--gm-ink);border-radius:0;box-shadow:var(--rp-sh-3)}
html.retro-pop body .og-library-eyebrow{color:var(--gm-ink);font:700 10px/1.4 var(--rp-ff-mono);letter-spacing:.08em}
html.retro-pop body .og-console-header{border:3px solid var(--gm-ink);border-left-width:14px;border-left-color:var(--rp-c-raw);border-bottom:3px solid var(--gm-ink)!important;border-radius:0;box-shadow:var(--rp-sh-2)}
html.retro-pop .og-console-header h2{font:400 clamp(19px,2vw,26px)/1.15 var(--rp-ff-display);text-transform:uppercase;letter-spacing:0}
html.retro-pop .og-count{padding:4px 9px;border:2px solid var(--gm-ink);border-radius:0;background:var(--rp-yellow);font:700 12px/1 var(--rp-ff-mono);letter-spacing:0;vertical-align:middle}
html.retro-pop .og-hub-link{min-height:44px;display:inline-flex;align-items:center;border:3px solid var(--gm-ink);border-radius:var(--rp-r-1);background:var(--rp-cyan);box-shadow:var(--rp-sh-1);
  font:800 var(--rp-fs-small)/1 var(--rp-ff-body);text-transform:uppercase;letter-spacing:var(--rp-tr-sticker)}
html.retro-pop .og-games-grid{gap:24px 20px}
html.retro-pop .og-card-cover{border-bottom:3px solid var(--gm-ink);background-color:var(--gm-ink);background-image:var(--gm-dots-cream);background-size:10px 10px}
html.retro-pop .og-game-card:hover .og-card-cover img{transform:none}
html.retro-pop body .og-card-play{inset:0;flex-direction:row-reverse;justify-content:flex-start;align-items:flex-end;gap:6px;padding:8px;opacity:1;pointer-events:none;background:none!important}
html.retro-pop body .og-play-icon{width:38px;height:38px;border:3px solid var(--gm-ink);font-size:13px;color:var(--gm-ink)!important;background:var(--rp-red)!important;box-shadow:var(--rp-sh-1)!important}
html.retro-pop body .og-play-text{max-width:0;padding:3px 0;border:solid var(--gm-ink);border-width:2px 0;overflow:hidden;white-space:nowrap;opacity:0;
  font:800 var(--rp-fs-micro)/1 var(--rp-ff-body);letter-spacing:var(--rp-tr-sticker);text-transform:uppercase;transition:max-width var(--rp-t) var(--rp-e-out),opacity var(--rp-t-fast) linear}
html.retro-pop body .og-game-card:hover .og-play-text{max-width:160px;padding:3px 7px;border-width:2px;opacity:1}
html.retro-pop body .og-card-tag{left:8px;right:auto;padding:4px 8px;border:2px solid var(--gm-ink);box-shadow:var(--rp-sh-1);text-shadow:none;letter-spacing:var(--rp-tr-sticker);
  border-radius:0!important;color:var(--gm-ink)!important;background:var(--rp-cyan)!important;font:800 10px/1.2 var(--rp-ff-body)!important}
html.retro-pop .og-card-meta{padding:11px 12px 13px}
html.retro-pop .og-card-title{font:800 14px/1.25 var(--rp-ff-body)}
html.retro-pop :is(.og-library-empty,.og-empty-state){border:3px dashed rgba(23,19,31,.4);border-radius:0}
html.retro-pop :is(.og-about,.og-cta){position:relative;border:5px solid var(--gm-ink);border-radius:0;box-shadow:var(--rp-sh-3);transform:rotate(-.5deg)}
html.retro-pop .og-about::before{content:"";position:absolute;left:-18px;top:-16px;width:118px;height:36px;pointer-events:none;transform:rotate(-14deg);background:var(--rp-art-tape) center/100% 100% no-repeat}
html.retro-pop :is(.og-about,.og-cta) h2{font:400 clamp(20px,2.2vw,28px)/1.1 var(--rp-ff-display);text-transform:uppercase;letter-spacing:0}
html.retro-pop .og-about a{font-weight:800;text-decoration-color:var(--rp-cyan);text-decoration-thickness:3px;text-underline-offset:3px}
html.retro-pop .og-cta{transform:rotate(.6deg);background-image:var(--gm-dots);background-size:10px 10px}
html.retro-pop .og-cta-btn{min-height:54px;border:3px solid var(--gm-ink);border-radius:var(--rp-r-1);box-shadow:var(--rp-sh-3);font:800 17px/1 var(--rp-ff-body);text-transform:uppercase;letter-spacing:var(--rp-tr-sticker)}
html.retro-pop body .og-footer{position:relative;margin-top:64px;padding:46px 22px 50px;border-top:0!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;color:var(--gm-cream)!important;
  background:var(--rp-pat-candy) left bottom/100% 10px no-repeat,var(--gm-dots-cream) 0 0/10px 10px var(--gm-ink)!important;font:600 14px/1.7 var(--rp-ff-body)}
html.retro-pop body .og-footer :is(a,strong,.logo){color:var(--gm-cream)!important}
html.retro-pop body .og-footer a:hover{color:var(--rp-yellow)!important}
html.retro-pop .og-footer::before{content:"";position:absolute;left:0;right:0;top:-19px;height:20px;pointer-events:none;background:var(--rp-edge-torn) repeat-x 0 0/240px 20px;transform:scaleY(-1)}
html.retro-pop .og-footer .logo{font:400 clamp(24px,2vw,30px)/1.1 var(--rp-ff-display);text-transform:uppercase;text-shadow:3px 3px 0 var(--rp-red)}
html.retro-pop .ad-container{border-color:var(--rp-ink-soft);border-radius:0;box-shadow:none}
html.retro-pop :is(.ogp-library-status,.ogp-nds-wifi-panel){border:3px solid var(--gm-ink);border-radius:0;box-shadow:var(--rp-sh-2)}
html.retro-pop .og-online-beta-announcement{border:5px solid var(--gm-ink);border-radius:0;box-shadow:var(--rp-sh-3)}
html.retro-pop .og-online-beta-announcement::before{content:none}
html.retro-pop .og-online-beta-action{border:3px solid var(--gm-ink);border-radius:var(--rp-r-1);box-shadow:var(--rp-sh-2)}
html.retro-pop .og-online-beta-announcement h2{font:400 clamp(17px,1.6vw,22px)/1.15 var(--rp-ff-display);text-transform:uppercase;letter-spacing:0}
html.retro-pop .og-online-beta-announcement p{font:600 15px/1.5 var(--rp-ff-body)}
html.retro-pop .og-online-beta-kicker{padding:5px 10px;border:2px solid var(--gm-ink);font:800 var(--rp-fs-micro)/1.25 var(--rp-ff-body);letter-spacing:var(--rp-tr-sticker)}
html.retro-pop .og-online-beta-kicker::before{background:var(--gm-ink);box-shadow:none}
html.retro-pop .og-online-beta-action{min-height:44px;padding:0 16px;font:800 var(--rp-fs-small)/1.15 var(--rp-ff-body);text-transform:uppercase;letter-spacing:var(--rp-tr-sticker)}
html.retro-pop .ogp-library-status strong{font-family:var(--rp-ff-display);font-weight:400;text-transform:uppercase}


/* ═══════════ 3 · LARGURAS ═══════════ */
@media (max-width:1160px){
  html.retro-pop .gp-nav{row-gap:6px}
  html.retro-pop .gp-navlinks{padding-bottom:0}
}
@media (max-width:900px){
  html.retro-pop .gp-hero{grid-template-columns:minmax(0,1fr) minmax(180px,250px)}
}
@media (max-width:760px){
  /* tarja: a diagonal vira filete reto, e cada pixel da barra sticky é tela perdida */
  html.retro-pop .gp-nav,
  html.retro-pop .navbar{padding:8px 12px;background-image:var(--gm-dots);background-size:8px 8px;border-bottom:5px solid var(--gm-ink)}
  html.retro-pop :is(.gp-brand,.navbar .logo,.gp-nav > a:not([class]):first-child){padding:3px 10px 4px 6px}
  html.retro-pop :is(.gp-brand-copy strong,.gp-nav > a:not([class]):first-child,.navbar .logo-text){font-size:15px;text-shadow:2px 2px 0 var(--rp-red)}
  html.retro-pop .gp-brand-mark{width:30px;height:30px}
  html.retro-pop .gp-navlinks a{min-height:40px;padding:0 8px;font-size:var(--rp-fs-micro)}
  html.retro-pop .gp-hero{grid-template-columns:minmax(0,1fr);padding:22px 16px 36px;text-align:left}
  html.retro-pop .gp-brand{flex:0 0 auto;margin-right:auto}
  html.retro-pop :is(.gp-cta,.gp-mode-jump,.gp-signin){min-height:44px;padding:0 10px;font-size:11px}
  html.retro-pop .gp-hero > .gp-cover-wrap{order:0;width:min(190px,52vw);margin:14px auto 22px}
  html.retro-pop .gp-hero::before{width:340px;right:50%;margin-right:-170px;top:0}
  html.retro-pop .gp-cover-wrap::before{width:82px;height:82px;font-size:12px;right:-30px;top:-28px}
  html.retro-pop .gp-hero h1{font-size:clamp(28px,9vw,40px);text-shadow:3px 3px 0 var(--rp-red)}
  html.retro-pop .gp-tags,
  html.retro-pop .gp-play-row{justify-content:flex-start}
  html.retro-pop .gp-hero-info::before{margin-bottom:12px}
  html.retro-pop :is(.gp-play-btn,.gp-play-btn-secondary){width:100%}
  html.retro-pop .og-mode-card,
  html.retro-pop .gp-section:not(:has(> .gp-related-grid)),
  html.retro-pop .related-sidebar{transform:none}
  html.retro-pop .gp-section:not(:has(> .gp-related-grid)){width:auto;margin:0 16px 34px;padding:24px 18px}
  html.retro-pop .gp-section > h2{margin-left:-4px;padding:7px 16px 7px 28px;font-size:20px;transform:none}
  html.retro-pop .gp-section > h3:not(.gp-sub) + p{padding-left:0}
  html.retro-pop .gp-meta-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}
  html.retro-pop .gp-controls-grid{grid-template-columns:1fr}
  /* relacionados: trilho horizontal com snap (o carrossel é intencional e não rola a página) */
  html.retro-pop .gp-related-grid{display:flex;gap:20px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
    margin:18px -16px 0;padding:12px 16px 22px;scroll-padding-inline:16px}
  html.retro-pop .gp-related-card{flex:0 0 150px;scroll-snap-align:start}
  html.retro-pop .game-cover-img{width:170px}
  html.retro-pop .emulator-section{box-shadow:none}
  html.retro-pop :is(.og-about,.og-cta,.og-online-beta-announcement){transform:none}
  html.retro-pop body .og-hero h1{font-size:clamp(30px,9vw,42px)}
  html.retro-pop body .og-stat{flex:1 1 140px;min-width:0}
  html.retro-pop body .top-navbar{padding:8px 12px;background:var(--gm-dots) 0 0/8px 8px var(--rp-yellow)!important;border-bottom:5px solid var(--gm-ink)!important}
}

@media (max-width:480px){
  html.retro-pop .gp-brand-copy{display:none}
}

/* ═══════════ 4 · MOVIMENTO — os 2 loops daqui ficam fora da guarda de retro-pop.css (carregam depois) ═══════════ */
@media (prefers-reduced-motion:reduce){
  html.retro-pop .gp-cover-wrap::before,
  html.retro-pop .gp-live-dot{animation:none}
  html.retro-pop :is(.gp-cover-wrap,.gp-related-card,.gp-related-card img,.gp-play-btn,.gp-play-btn-secondary,.btn-play,.btn-secondary,.og-mode-action,.gp-favorites-pill,.gp-pro-pill,.gp-signin,.gp-cta,.gp-mode-jump,.gp-navlinks a,.nav-link){transition-duration:1ms}
}