/* RETRO POP · família blog — nível 3 de 4 (PLANO-APLICACAO.md 1.4, etapa 5)
   12 páginas em QUATRO esqueletos, cada um com a sua folha própria:
   · índice  blog/index.html — <style> inline: nav.nav, .layout (2 trilhos de anúncio + main), header.hero,
             .articles > a.article-card (.tag h2 p .meta .read-more), <footer> nu;
   · artigo  6 páginas com blog/article.css — mesma nav/.layout, <article> (.article-tag h1 .article-meta .lede
             h2 h3 p ul/ol blockquote .pullquote .info-box hr a.play-link), nav.article-nav, footer.site-footer;
   · nexus   4 páginas "best of" com blog/nexus-article.css — .nx-bg .nx-nav (.nx-mark animado) .nx-hero (.gl com
             glitch) main.nx-wrap (.nx-tag h1 .nx-meta .nx-lede h2 .rank .nx-genre .nx-infobox a.nx-play) .nx-foot;
   · guia    blog/oldgames-launcher-dlss5-ia-emuladores.html — body.neural-page com
             assets/css/launcher-neural-guide.css (header.site-nav, .hero, .guide-sidebar, .article-body,
             .system-card, .ps2-feature, tabela, passos, FAQ, .download-panel, footer.site-footer).
             Escopo SEMPRE em body.neural-page: .hero, .article-meta e .site-footer existem nos outros esqueletos.

   DUAS METADES: 1. varredura de inversão (os 63 pontos de theme-inversion-audit + todo texto em acento, que a
   ponte leva a tinta de banca e reprova no papel); 2. composição "página de revista": a matéria é uma folha de
   papel couché colada na mesa creme, medida de leitura ~68ch, capitular na abertura, intertítulo em faixa,
   citação em balão, box com fita adesiva, divisor em zigue-zague, colofão escuro.
   Anúncios: só a moldura do slot vazio (borda, raio, cor do rótulo "Advertisement"); slot carregado, trilho e
   [data-ad-slot="mobile-top"] ficam intocados. Widgets de site inteiro: retro/_shared.css. Movimento: os 4
   loops próprios do nexus (órbita, 2 glitches, varredura) saem — zero loop desta folha. */

/* ═══════════ 0 · TOKENS DA FAMÍLIA ═══════════ */
html.retro-pop{
  --bl-ink:#17131f; --bl-ink2:#3b3348; --bl-ink3:#5d5470; --bl-cream:#f5ebd7; --bl-cream2:#dccfb2; --bl-white:#fffaf0;
  --bl-dots:radial-gradient(circle,rgba(23,19,31,.28) 1.3px,transparent 1.5px);
  --bl-dots-cream:radial-gradient(circle,rgba(245,235,215,.2) 1.6px,transparent 1.8px);
  --bl-rule:3px dashed rgba(23,19,31,.28);
  --bl-link:var(--rp-cyan);
}


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

/* 1.1 índice (<style> inline) + artigo (article.css): nav, logo em gradiente recortado, links */
html.retro-pop body > .nav{color:var(--bl-ink);-webkit-backdrop-filter:none;backdrop-filter:none}
html.retro-pop body > .nav .logo{color:var(--bl-ink);background:var(--bl-white);-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:currentColor}
html.retro-pop .nav-links a,
html.retro-pop .nav-links a:hover,
html.retro-pop .nav-links a.active{color:var(--bl-ink)}
/* moldura do slot VAZIO: borda e rótulo; o slot carregado não recebe nada */
html.retro-pop .ad-slot:not([data-loaded="true"]){color:var(--bl-ink3);border-color:rgba(23,19,31,.3);border-radius:0}
/* índice */
html.retro-pop .layout .hero h1{color:var(--bl-ink);background:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:currentColor}
html.retro-pop .layout .hero p{color:var(--bl-ink2)}
html.retro-pop .article-card{color:var(--bl-ink);background:var(--bl-white)}
html.retro-pop .article-card .tag{color:var(--bl-ink);background:var(--rp-yellow)}
html.retro-pop .article-card h2{color:var(--bl-ink)}
html.retro-pop .article-card p{color:var(--bl-ink2)}
html.retro-pop .article-card .meta{color:var(--bl-ink2)}
html.retro-pop .article-card .read-more{color:var(--bl-ink)}
html.retro-pop body > footer,
html.retro-pop .site-footer{color:var(--bl-cream);background-color:var(--bl-ink)}
html.retro-pop body > footer a,
html.retro-pop .site-footer a{color:var(--bl-cream)}
html.retro-pop body > footer a:hover,
html.retro-pop .site-footer a:hover{color:var(--rp-yellow)}
/* artigo */
html.retro-pop .layout article{color:var(--bl-ink);background:var(--bl-white)}
html.retro-pop .layout article .article-tag{color:var(--bl-ink);background:var(--rp-yellow)}
html.retro-pop .layout article h1,
html.retro-pop .layout article h2,
html.retro-pop .layout article h3{color:var(--bl-ink)}
html.retro-pop .layout article .article-meta{color:var(--bl-ink2)}
html.retro-pop .layout article .lede{color:var(--bl-ink)}
html.retro-pop .layout article p,
html.retro-pop .layout article li{color:var(--bl-ink2)}
html.retro-pop .layout article p strong,
html.retro-pop .layout article li strong{color:var(--bl-ink)}
html.retro-pop .layout article em{color:inherit}
html.retro-pop .layout article a{color:var(--bl-ink)}
html.retro-pop .layout article blockquote{color:var(--bl-ink);background:var(--bl-white)}
html.retro-pop .layout article .pullquote{color:var(--bl-ink);background:var(--rp-yellow)}
html.retro-pop .layout article .info-box{color:var(--bl-ink);background:var(--rp-paper-2)}
html.retro-pop .layout article .info-box h4{color:var(--bl-white);background:var(--bl-ink)}
html.retro-pop .article-nav .back{color:var(--bl-ink);background:var(--bl-white)}
/* article.css:231 escreve `color:#fff !important` e `border-bottom:0 !important` no CTA: só !important vence */
html.retro-pop .play-link{color:var(--bl-ink)!important;background:var(--rp-red)}

/* 1.2 nexus (nexus-article.css) */
html.retro-pop .nx-bg{background:none}
html.retro-pop .nx-nav{color:var(--bl-ink);-webkit-backdrop-filter:none;backdrop-filter:none}
html.retro-pop .nx-brand{color:var(--bl-ink)}
html.retro-pop .nx-mark .core{color:var(--bl-ink);background:var(--bl-white);text-shadow:none}
html.retro-pop .nx-brand-copy strong{color:var(--bl-ink)}
html.retro-pop .nx-brand-copy small{color:var(--bl-ink2)}
html.retro-pop .nx-navlinks a,
html.retro-pop .nx-navlinks a:hover{color:var(--bl-ink)}
html.retro-pop .nx-cta{color:var(--bl-ink);background:var(--rp-red)}
html.retro-pop .nx-hero .gl{color:var(--bl-ink)}
html.retro-pop .nx-hero-sub{color:var(--bl-ink2)}
html.retro-pop .nx-wrap{color:var(--bl-ink);background:var(--bl-white)}
html.retro-pop .nx-tag{color:var(--bl-ink);background:var(--rp-yellow)}
html.retro-pop .nx-wrap h1,
html.retro-pop .nx-wrap h2,
html.retro-pop .nx-wrap h2 .rank{color:var(--bl-ink)}
html.retro-pop .nx-meta{color:var(--bl-ink2)}
html.retro-pop .nx-wrap .nx-lede{color:var(--bl-ink)}
html.retro-pop .nx-wrap p{color:var(--bl-ink2)}
html.retro-pop .nx-wrap em{color:inherit}
html.retro-pop .nx-wrap strong{color:var(--bl-ink)}
html.retro-pop .nx-wrap a:not(.nx-play){color:var(--bl-ink)}
html.retro-pop .nx-wrap .nx-genre{color:var(--rp-red-deep)}
html.retro-pop .nx-infobox{color:var(--bl-ink);background:var(--rp-paper-2)}
html.retro-pop .nx-infobox h4{color:var(--bl-white);background:var(--bl-ink)}
html.retro-pop .nx-wrap .nx-play{color:var(--bl-ink);background:var(--rp-red)}
html.retro-pop .nx-back{color:var(--bl-ink);background:var(--bl-white)}
html.retro-pop .nx-foot{color:var(--bl-cream);background-color:var(--bl-ink)}
html.retro-pop .nx-foot a{color:var(--bl-cream)}
html.retro-pop .nx-foot a:hover{color:var(--rp-yellow)}

/* 1.3 guia do launcher (launcher-neural-guide.css): tudo escopado em body.neural-page */
html.retro-pop body.neural-page :where(main) a{color:var(--bl-ink)}
html.retro-pop body.neural-page :where(main) a:hover{color:var(--rp-red-deep)}
html.retro-pop body.neural-page .skip-link{color:var(--bl-ink);background:var(--rp-yellow)}
html.retro-pop body.neural-page .site-nav{color:var(--bl-ink);-webkit-backdrop-filter:none;backdrop-filter:none}
html.retro-pop body.neural-page .brand{color:var(--bl-ink)}
html.retro-pop body.neural-page .brand small{color:var(--bl-ink2)}
html.retro-pop body.neural-page .brand-icon{color:var(--bl-ink);background:var(--rp-red)}
html.retro-pop body.neural-page .site-nav nav a{color:var(--bl-ink)}
html.retro-pop body.neural-page .site-nav nav .nav-download{color:var(--bl-ink);background:var(--rp-orange)}
html.retro-pop body.neural-page .guide-language{color:var(--bl-ink2)}
html.retro-pop body.neural-page .guide-language select{color:var(--bl-ink);background:var(--bl-white)}
html.retro-pop body.neural-page .breadcrumbs{color:var(--bl-ink3)}
html.retro-pop body.neural-page .breadcrumbs a{color:var(--bl-ink)}
html.retro-pop body.neural-page :where(#guideContent) h1,
html.retro-pop body.neural-page :where(#guideContent) h2,
html.retro-pop body.neural-page :where(#guideContent) h3{color:var(--bl-ink)}
html.retro-pop body.neural-page :where(#guideContent) h1 em{color:var(--bl-ink);background:var(--rp-cyan)}
html.retro-pop body.neural-page .eyebrow,
html.retro-pop body.neural-page .section-label{color:var(--rp-red-deep)}
html.retro-pop body.neural-page .eyebrow span:last-child{color:var(--bl-ink2)}
html.retro-pop body.neural-page .status-dot{background:var(--rp-red);box-shadow:none}
html.retro-pop body.neural-page .lead{color:var(--bl-ink2)}
html.retro-pop body.neural-page .button.primary,
html.retro-pop body.neural-page .primary:hover{color:var(--bl-ink);background:var(--rp-orange)}
html.retro-pop body.neural-page .hero-note{color:var(--bl-ink2)}
html.retro-pop body.neural-page .hero-visual{background:var(--bl-white)}
html.retro-pop body.neural-page .hero-visual figcaption{color:var(--bl-ink2)}
html.retro-pop body.neural-page .visual-spec{color:var(--bl-ink2);background:var(--rp-paper-2)}
html.retro-pop body.neural-page .visual-spec strong{color:var(--bl-ink)}
html.retro-pop body.neural-page .article-meta{color:var(--bl-ink2)}
html.retro-pop body.neural-page .article-meta a{color:var(--bl-ink)}
html.retro-pop body.neural-page .guide-sidebar{color:var(--bl-ink)}
html.retro-pop body.neural-page .guide-sidebar ol{color:var(--bl-ink3)}
html.retro-pop body.neural-page .guide-sidebar a{color:var(--bl-ink2)}
html.retro-pop body.neural-page .guide-sidebar a:hover{color:var(--bl-ink)}
html.retro-pop body.neural-page .sidebar-note{color:var(--bl-ink2)}
html.retro-pop body.neural-page .article-body p,
html.retro-pop body.neural-page .article-body li{color:var(--bl-ink2)}
html.retro-pop body.neural-page .article-body strong{color:var(--bl-ink)}
html.retro-pop body.neural-page .callout,
html.retro-pop body.neural-page .test-note{color:var(--bl-ink);background:var(--bl-white)}
html.retro-pop body.neural-page .callout h3{color:var(--bl-ink)}
html.retro-pop body.neural-page .system-card{color:var(--bl-ink);background:var(--bl-white)}
html.retro-pop body.neural-page .badge{color:var(--bl-ink);background:var(--rp-cyan)}
html.retro-pop body.neural-page .badge.secondary{color:var(--bl-ink);background:var(--rp-paper-2)}
html.retro-pop body.neural-page .game-number{color:var(--rp-red-deep)}
html.retro-pop body.neural-page .game-system{color:var(--bl-ink2)}
html.retro-pop body.neural-page :where(#guideContent) caption{color:var(--bl-ink2);background:var(--rp-paper-2)}
html.retro-pop body.neural-page :where(#guideContent) thead th{color:var(--bl-ink);background:var(--rp-paper-2)}
html.retro-pop body.neural-page :where(#guideContent) tbody th{color:var(--bl-ink)}
html.retro-pop body.neural-page :where(#guideContent) td{color:var(--bl-ink2)}
html.retro-pop body.neural-page .steps li:before{color:var(--bl-ink);background:var(--rp-yellow)}
html.retro-pop body.neural-page :where(#guideContent) kbd{color:var(--bl-ink);background:var(--bl-white)}
html.retro-pop body.neural-page :where(#guideContent) summary{color:var(--bl-ink)}
html.retro-pop body.neural-page :where(#guideContent) summary:after{color:var(--rp-red-deep)}
html.retro-pop body.neural-page .article-body .download-panel{color:var(--bl-ink);background:var(--rp-orange)}
html.retro-pop body.neural-page .download-panel h2,
html.retro-pop body.neural-page .download-panel p,
html.retro-pop body.neural-page .download-panel .eyebrow,
html.retro-pop body.neural-page .download-caption{color:var(--bl-ink)}
html.retro-pop body.neural-page .download-panel .button.primary{color:var(--bl-white);background:var(--bl-ink)}
html.retro-pop body.neural-page .ps2-feature{color:var(--bl-ink);background:var(--bl-white)}
html.retro-pop body.neural-page .ps2-feature figure figcaption{color:var(--bl-ink2)}
html.retro-pop body.neural-page .ps2-gallery img{background:var(--rp-paper-3)}
/* launcher-neural-guide.css escreve `color:#a99c83 !important` no crédito: só !important vence */
html.retro-pop body.neural-page .image-credit{color:var(--bl-ink2)!important}
html.retro-pop body.neural-page .site-footer .brand{color:var(--bl-cream)}
html.retro-pop body.neural-page .site-footer .brand small{color:var(--bl-cream2)}
html.retro-pop body.neural-page .site-footer nav a,
html.retro-pop body.neural-page .site-footer > span{color:var(--bl-cream2)}


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

/* 2.1 tarjas amarelas (as três barras: .nav, .nx-nav flutuante, .site-nav do guia). Sticky, top e z-index
   das páginas ficam; o corte diagonal é camada de fundo para não matar o sticky. */
html.retro-pop body > .nav,
html.retro-pop body.neural-page .site-nav{
  padding-top:12px;padding-bottom:24px;border-bottom:0;
  background-color:var(--rp-yellow);
  background-image:linear-gradient(179.4deg,transparent 0 calc(100% - 13px),var(--bl-ink) calc(100% - 13px)),var(--bl-dots);
  background-size:auto,8px 8px;box-shadow:0 4px 0 rgba(23,19,31,.18)}
html.retro-pop .nx-nav{
  border:3px solid var(--bl-ink);border-radius:0;box-shadow:var(--rp-sh-2);
  background-color:var(--rp-yellow);background-image:var(--bl-dots);background-size:8px 8px}
/* logotipo: etiqueta de papel colada torta */
html.retro-pop body > .nav .logo,
html.retro-pop body.neural-page .site-nav > .brand{
  display:inline-flex;align-items:center;gap:8px;padding:6px 14px 7px;border:3px solid var(--bl-ink);
  box-shadow:var(--rp-sh-2);transform:rotate(-1.6deg);text-decoration:none;
  font:400 clamp(16px,1.5vw,21px)/1 var(--rp-ff-display);letter-spacing:-.01em;text-transform:uppercase}
html.retro-pop body.neural-page .site-nav > .brand{background:var(--bl-white)}
html.retro-pop .nav-links{gap:4px;align-items:center}
html.retro-pop .nav-links a,
html.retro-pop .nx-navlinks a,
html.retro-pop body.neural-page .site-nav nav > a:not(.nav-download){
  display:inline-flex;align-items:center;min-height:44px;padding:0 10px;border-radius:0;border-bottom:4px solid transparent;background:none;
  font:800 var(--rp-fs-small)/1 var(--rp-ff-body);letter-spacing:.03em;text-transform:uppercase;text-decoration:none;
  transition:border-color var(--rp-t-fast) linear,background-color var(--rp-t-fast) linear}
html.retro-pop .nav-links a:hover,
html.retro-pop .nx-navlinks a:hover,
html.retro-pop body.neural-page .site-nav nav > a:not(.nav-download):hover{border-bottom-color:var(--rp-cyan);background:rgba(255,250,240,.55)}
html.retro-pop .nav-links a.active{border-bottom-color:var(--rp-red);background:rgba(255,250,240,.55)}

/* 2.2 índice: capa da seção e cards de matéria colados */
html.retro-pop .layout .hero{margin-bottom:46px}
html.retro-pop .layout .hero h1{
  font:400 clamp(38px,5.6vw,76px)/.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)}
html.retro-pop .layout .hero p{font:400 clamp(16px,1.2vw,19px)/1.6 var(--rp-ff-body)}
html.retro-pop .layout .hero::after{
  content:"";display:block;height:12px;max-width:480px;margin:34px auto 0;opacity:.5;pointer-events:none;
  background:var(--rp-pat-zig) repeat-x 0 0/40px 12px}
html.retro-pop .articles{gap:30px 26px}
html.retro-pop .article-card{
  padding:24px 24px 20px;border:3px solid var(--bl-ink);border-radius:0;box-shadow:var(--rp-sh-2);
  transform:rotate(var(--rp-tilt));transition:var(--rp-pop)}
html.retro-pop .article-card:nth-child(3n+1){--rp-tilt:-.7deg}
html.retro-pop .article-card:nth-child(3n+2){--rp-tilt:.5deg}
html.retro-pop .article-card:nth-child(3n){--rp-tilt:-.3deg}
html.retro-pop .article-card:hover{transform:rotate(var(--rp-tilt)) translate(-3px,-4px);border-color:var(--bl-ink);box-shadow:var(--rp-sh-3)}
html.retro-pop .article-card .tag,
html.retro-pop .layout article .article-tag,
html.retro-pop .nx-tag{
  padding:5px 10px;border:2px solid var(--bl-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(-1.5deg)}
html.retro-pop .article-card h2{margin-bottom:10px;font:400 clamp(18px,1.5vw,21px)/1.15 var(--rp-ff-display);text-transform:uppercase;letter-spacing:var(--rp-tr-display)}
html.retro-pop .article-card p{font:400 15px/1.6 var(--rp-ff-body)}
html.retro-pop .article-card .meta{gap:10px;padding-top:12px;border-top:2px dashed rgba(23,19,31,.25);font:700 var(--rp-fs-micro)/1.3 var(--rp-ff-mono);letter-spacing:.06em}
html.retro-pop .article-card .read-more{font:800 var(--rp-fs-small)/1.2 var(--rp-ff-body);text-transform:uppercase;text-decoration:underline;text-decoration-color:var(--rp-red);text-decoration-thickness:3px;text-underline-offset:3px}

/* 2.3 matéria: a folha de papel couché colada na mesa, medida de leitura de revista */
html.retro-pop .layout article,
html.retro-pop main.nx-wrap{
  position:relative;max-width:820px;margin-inline:auto;border:3px solid var(--bl-ink);border-radius:0;box-shadow:var(--rp-sh-3)}
html.retro-pop main.nx-wrap{padding:clamp(26px,4vw,52px)}
/* fita adesiva prendendo a folha */
html.retro-pop .layout article::before,
html.retro-pop main.nx-wrap::before{
  content:"";position:absolute;right:28px;top:-16px;width:118px;height:36px;z-index:3;pointer-events:none;
  transform:rotate(8deg);background:var(--rp-art-tape) center/100% 100% no-repeat}
html.retro-pop .layout article h1,
html.retro-pop .nx-wrap h1{
  margin:10px 0 16px;font:400 clamp(30px,4vw,52px)/.98 var(--rp-ff-display);letter-spacing:var(--rp-tr-display);text-transform:uppercase;
  text-shadow:3px 3px 0 var(--rp-red)}
html.retro-pop .layout article .article-meta,
html.retro-pop .nx-meta{
  gap:8px 18px;padding-bottom:18px;border-bottom:var(--bl-rule);font:700 12px/1.4 var(--rp-ff-mono);letter-spacing:.04em}
/* abertura: chamada em corpo maior, com capitular gorda */
html.retro-pop .layout article .lede,
html.retro-pop .nx-wrap .nx-lede{font:600 clamp(18px,1.5vw,21px)/1.55 var(--rp-ff-body);font-style:normal}
html.retro-pop .layout article .lede::first-letter,
html.retro-pop .nx-wrap .nx-lede::first-letter{
  float:left;margin:4px 10px 0 0;padding:4px 10px;border:3px solid var(--bl-ink);background:var(--rp-yellow);box-shadow:var(--rp-sh-1);
  font:400 3.1em/.9 var(--rp-ff-display);color:var(--bl-ink)}
/* corpo de leitura longa: Figtree 17px/1,72, tinta suave 10:1 */
html.retro-pop .layout article p,
html.retro-pop .nx-wrap p{font-family:var(--rp-ff-body);font-size:clamp(16px,1.1vw,17.5px);line-height:1.72}
html.retro-pop .layout article li{font:400 clamp(16px,1.1vw,17px)/1.65 var(--rp-ff-body)}
html.retro-pop .layout article ul,
html.retro-pop .layout article ol{padding-left:4px}
html.retro-pop .layout article li::marker{color:var(--rp-red-deep);font-weight:800}
/* intertítulo em faixa vermelha, sem giro (prosa); a âncora e o scroll-margin da página ficam */
html.retro-pop .layout article h2,
html.retro-pop .nx-wrap h2{
  display:inline-block;margin:40px 0 16px -8px;padding:8px 22px 8px 34px;border-top:4px solid var(--bl-ink);border-bottom:4px solid var(--bl-ink);
  background:var(--rp-red) var(--rp-art-ribcap) no-repeat left center/22px 100%;
  font:400 clamp(19px,1.9vw,25px)/1.2 var(--rp-ff-display);letter-spacing:var(--rp-tr-display);text-transform:uppercase}
html.retro-pop .nx-wrap h2.nx-mini{background-color:var(--rp-cyan);font-size:clamp(16px,1.5vw,19px)}
html.retro-pop .layout article h3{
  margin:28px 0 12px;font:400 clamp(17px,1.4vw,20px)/1.2 var(--rp-ff-display);text-transform:uppercase;
  background:linear-gradient(transparent 62%,var(--rp-yellow) 62% 92%,transparent 92%);display:table}
/* links de texto: tinta com sublinhado ciano grosso (cor de navegação) */
html.retro-pop .layout article a:not(.play-link),
html.retro-pop .nx-wrap a:not(.nx-play){
  font-weight:700;border-bottom:3px solid var(--bl-link);text-decoration:none;transition:background-color var(--rp-t-fast) linear}
html.retro-pop .layout article a:not(.play-link):hover,
html.retro-pop .nx-wrap a:not(.nx-play):hover{border-bottom-color:var(--bl-ink);background:var(--rp-yellow)}
html.retro-pop .nx-wrap .nx-genre{font:700 12px/1.4 var(--rp-ff-mono);font-style:normal;letter-spacing:.08em;text-transform:uppercase}
/* citação: balão de quadrinho (rp-balloon) */
html.retro-pop .layout article blockquote{
  position:relative;margin:30px 0 44px;padding:20px 24px;border:5px solid var(--bl-ink);border-radius:0;box-shadow:var(--rp-sh-3);
  font:600 clamp(16px,1.2vw,18px)/1.55 var(--rp-ff-body);font-style:normal}
html.retro-pop .layout article blockquote::after{
  content:"";position:absolute;left:34px;bottom:-26px;width:46px;height:28px;pointer-events:none;
  background:var(--bl-white);border-right:5px solid var(--bl-ink);border-bottom:5px solid var(--bl-ink);clip-path:polygon(0 0,100% 0,42% 100%)}
/* olho: recorte amarelo girado */
html.retro-pop .layout article .pullquote{
  margin:38px auto;padding:20px 24px;max-width:92%;border:3px solid var(--bl-ink);box-shadow:var(--rp-sh-2);
  font:400 clamp(20px,2.2vw,28px)/1.2 var(--rp-ff-display);text-transform:uppercase;transform:rotate(-1.2deg)}
/* box: papel pardo com fita adesiva, título em bloco de tinta */
html.retro-pop .layout article .info-box,
html.retro-pop .nx-infobox{
  position:relative;margin:30px 0;padding:24px 24px 20px;border:3px solid var(--bl-ink);border-radius:0;box-shadow:var(--rp-sh-2);transform:rotate(-.4deg)}
html.retro-pop .layout article .info-box::before,
html.retro-pop .nx-infobox::before{
  content:"";position:absolute;left:-16px;top:-14px;width:104px;height:32px;z-index:3;pointer-events:none;
  transform:rotate(-14deg);background:var(--rp-art-tape) center/100% 100% no-repeat}
html.retro-pop .layout article .info-box h4,
html.retro-pop .nx-infobox h4{
  display:inline-block;margin:0 0 12px;padding:5px 12px;box-shadow:3px 4px 0 var(--rp-red);
  font:400 var(--rp-fs-small)/1.1 var(--rp-ff-display);letter-spacing:.02em;text-transform:uppercase;transform:skewX(var(--rp-skew))}
html.retro-pop .layout article .info-box p,
html.retro-pop .nx-infobox p{color:var(--bl-ink)}
/* divisor: zigue-zague */
html.retro-pop .layout article hr,
html.retro-pop .nx-wrap hr{height:12px;margin:36px 0;border:0;opacity:.5;background:var(--rp-pat-zig) repeat-x 0 0/40px 12px}
/* CTA de jogo dentro do texto: botão vermelho de banca */
html.retro-pop .play-link,
html.retro-pop .nx-wrap .nx-play,
html.retro-pop .nx-cta{
  display:inline-flex;align-items:center;min-height:44px;padding:8px 18px;
  border:3px solid var(--bl-ink)!important;border-radius:var(--rp-r-1);box-shadow:var(--rp-sh-2);
  font:800 var(--rp-fs-small)/1.2 var(--rp-ff-body);letter-spacing:var(--rp-tr-sticker);text-transform:uppercase;text-decoration:none;
  transition:var(--rp-pop)}
html.retro-pop .play-link:hover,
html.retro-pop .nx-wrap .nx-play:hover,
html.retro-pop .nx-cta:hover{transform:translate(-2px,-3px);box-shadow:var(--rp-sh-3)}
html.retro-pop .article-nav .back,
html.retro-pop .nx-back{
  display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:3px solid var(--bl-ink);border-radius:var(--rp-r-1);
  box-shadow:var(--rp-sh-2);font:800 var(--rp-fs-small)/1 var(--rp-ff-body);text-transform:uppercase;letter-spacing:var(--rp-tr-sticker);text-decoration:none}
html.retro-pop .nx-wrap a.nx-back{border-bottom:3px solid var(--bl-ink)}

/* 2.4 nexus: marca e letreiro sem neon nem glitch (a desregistro ciano/vermelho do kit substitui o glitch) */
html.retro-pop .nx-mark .orbit{animation:none;filter:none;background:var(--rp-red);border:3px solid var(--bl-ink)}
html.retro-pop .nx-mark .core{z-index:1;border:2px solid var(--bl-ink);background-image:none;font:400 11px/1 var(--rp-ff-display)}
html.retro-pop .nx-brand-copy strong{font:400 15px/1 var(--rp-ff-display);letter-spacing:.02em;text-transform:uppercase;text-shadow:2px 2px 0 var(--rp-red)}
html.retro-pop .nx-brand-copy small{font:700 9px/1.2 var(--rp-ff-mono);letter-spacing:.2em}
html.retro-pop .nx-navlinks a{border-radius:0}
html.retro-pop .nx-hero .gl{
  font:400 clamp(38px,8vw,92px)/1 var(--rp-ff-display);letter-spacing:.02em;text-transform:uppercase;
  text-shadow:-4px -3px 0 var(--rp-cyan),5px 4px 0 var(--rp-red)}
html.retro-pop .nx-hero .gl::before,
html.retro-pop .nx-hero .gl::after{content:none;animation:none}
html.retro-pop .nx-hero-sub{font:700 var(--rp-fs-micro)/1.3 var(--rp-ff-mono);letter-spacing:.3em}
html.retro-pop .nx-hero-scan{height:10px;animation:none;background:var(--rp-pat-candy);border:2px solid var(--bl-ink)}

/* 2.5 guia do launcher: laranja é a tinta do launcher (plano 2.5) */
html.retro-pop body.neural-page .brand-icon{border:0;font:400 15px/1 var(--rp-ff-display)}
html.retro-pop body.neural-page .brand small{font:700 9px/1.6 var(--rp-ff-mono)}
html.retro-pop body.neural-page .site-nav nav .nav-download,
html.retro-pop body.neural-page .button{
  border:3px solid var(--bl-ink);border-radius:var(--rp-r-1);box-shadow:var(--rp-sh-2);clip-path:none;
  font:800 var(--rp-fs-small)/1.2 var(--rp-ff-body);text-transform:uppercase;letter-spacing:var(--rp-tr-sticker);text-decoration:none;transition:var(--rp-pop)}
html.retro-pop body.neural-page .site-nav nav .nav-download:hover,
html.retro-pop body.neural-page .button:hover{transform:translate(-2px,-3px);box-shadow:var(--rp-sh-3)}
html.retro-pop body.neural-page .guide-language select{min-height:44px;border:3px solid var(--bl-ink);border-radius:var(--rp-r-1);box-shadow:var(--rp-sh-1);font:600 13px/1 var(--rp-ff-body)}
html.retro-pop body.neural-page .breadcrumbs{font:700 var(--rp-fs-micro)/1.4 var(--rp-ff-mono);letter-spacing:.08em;text-transform:uppercase}
html.retro-pop body.neural-page .breadcrumbs a{text-decoration:underline;text-decoration-color:var(--rp-cyan);text-decoration-thickness:2px}
html.retro-pop body.neural-page .eyebrow,
html.retro-pop body.neural-page .section-label{font:700 11px/1.6 var(--rp-ff-mono);letter-spacing:.16em}
html.retro-pop body.neural-page :where(#guideContent) h1{
  font:400 clamp(34px,4.4vw,60px)/1.14 var(--rp-ff-display);letter-spacing:var(--rp-tr-display);text-transform:uppercase;text-shadow:3px 3px 0 var(--rp-red)}
html.retro-pop body.neural-page :where(#guideContent) h1 em{padding:0 8px;text-shadow:none;-webkit-box-decoration-break:clone;box-decoration-break:clone;outline:3px solid var(--bl-ink)}
html.retro-pop body.neural-page .lead{font:400 clamp(16px,1.2vw,18px)/1.65 var(--rp-ff-body)}
html.retro-pop body.neural-page .text-link{font-weight:800;text-decoration:underline;text-decoration-color:var(--rp-cyan);text-decoration-thickness:3px}
html.retro-pop body.neural-page .hero-note{font:700 12px/1.5 var(--rp-ff-mono)}
html.retro-pop body.neural-page .hero-visual{padding:8px;border:3px solid var(--bl-ink);box-shadow:var(--rp-sh-3);transform:rotate(1deg)}
html.retro-pop body.neural-page .hero-visual:before,
html.retro-pop body.neural-page .hero-visual:after{content:none}
html.retro-pop body.neural-page .hero-visual img{border:2px solid var(--bl-ink)}
html.retro-pop body.neural-page .visual-spec{border-top:3px dashed rgba(23,19,31,.35);font:700 10px/1.6 var(--rp-ff-mono)}
html.retro-pop body.neural-page .visual-spec strong{font:800 13px/1.6 var(--rp-ff-body)}
html.retro-pop body.neural-page .article-meta{border-block:var(--bl-rule);font:700 12px/1.5 var(--rp-ff-mono)}
html.retro-pop body.neural-page .guide-sidebar a{font:600 14px/1.4 var(--rp-ff-body)}
html.retro-pop body.neural-page .guide-sidebar ol{font:700 12px/1.6 var(--rp-ff-mono)}
html.retro-pop body.neural-page .sidebar-note{border-top:var(--bl-rule)}
html.retro-pop body.neural-page .article-body{max-width:760px}
html.retro-pop body.neural-page .article-body p,
html.retro-pop body.neural-page .article-body li{font-family:var(--rp-ff-body);line-height:1.72}
html.retro-pop body.neural-page .article-body section + section{border-top:0;background:var(--rp-pat-zig) repeat-x 0 0/40px 12px}
html.retro-pop body.neural-page :where(#guideContent) h2{font:400 clamp(24px,2.6vw,34px)/1.08 var(--rp-ff-display);text-transform:uppercase;letter-spacing:var(--rp-tr-display)}
html.retro-pop body.neural-page :where(#guideContent) h3{font-family:var(--rp-ff-display);font-weight:400;text-transform:uppercase;letter-spacing:0}
html.retro-pop body.neural-page .callout,
html.retro-pop body.neural-page .test-note{
  position:relative;border:3px solid var(--bl-ink);border-left:12px solid var(--rp-yellow);box-shadow:var(--rp-sh-2)}
html.retro-pop body.neural-page .systems-grid{gap:18px}
html.retro-pop body.neural-page .system-card{border:3px solid var(--bl-ink);box-shadow:var(--rp-sh-2)}
html.retro-pop body.neural-page .system-card:nth-child(odd){transform:rotate(-.5deg)}
html.retro-pop body.neural-page .system-card:nth-child(even){transform:rotate(.5deg)}
/* logos claros (feitos para fundo escuro): cada um numa chapinha de tinta, como nas páginas de console */
html.retro-pop body.neural-page .system-card img{box-sizing:content-box;width:120px;height:38px;padding:8px 12px;opacity:1;background:var(--bl-ink);object-position:center}
html.retro-pop body.neural-page .badge{display:inline-flex;padding:5px 10px;border:2px solid var(--bl-ink);font:700 10px/1.4 var(--rp-ff-mono)}
html.retro-pop body.neural-page .game-list > div{border-top:var(--bl-rule)}
html.retro-pop body.neural-page .game-number,
html.retro-pop body.neural-page .game-system{font-family:var(--rp-ff-mono);font-weight:700}
html.retro-pop body.neural-page .table-scroll{border:3px solid var(--bl-ink);box-shadow:var(--rp-sh-2);background:var(--bl-white)}
html.retro-pop body.neural-page :where(#guideContent) th,
html.retro-pop body.neural-page :where(#guideContent) td{border-top:1px solid rgba(23,19,31,.18)}
html.retro-pop body.neural-page :where(#guideContent) thead th{border-bottom:3px solid var(--bl-ink);font:400 12px/1.4 var(--rp-ff-display)}
html.retro-pop body.neural-page :where(#guideContent) tbody tr:nth-child(even){background:var(--rp-paper-2)}
html.retro-pop body.neural-page .steps li:before{border:2px solid var(--bl-ink);font:700 12px var(--rp-ff-mono)}
html.retro-pop body.neural-page :where(#guideContent) kbd{border:2px solid var(--bl-ink);border-bottom-width:4px;font:700 12px var(--rp-ff-mono)}
html.retro-pop body.neural-page .check-list li::marker{color:var(--rp-red-deep)}
html.retro-pop body.neural-page :where(#guideContent) .faq,
html.retro-pop body.neural-page :where(#guideContent) details{border-color:rgba(23,19,31,.3)}
html.retro-pop body.neural-page :where(#guideContent) summary{font:800 16px/1.5 var(--rp-ff-body)}
html.retro-pop body.neural-page .article-body .download-panel{
  position:relative;border:5px solid var(--bl-ink);box-shadow:var(--rp-sh-3);
  background-image:var(--bl-dots);background-size:8px 8px}
html.retro-pop body.neural-page .ps2-feature{border:3px solid var(--bl-ink);box-shadow:var(--rp-sh-2)}
html.retro-pop body.neural-page .ps2-feature figure img{padding:4px;border:3px solid var(--bl-ink);background:var(--bl-white);box-shadow:var(--rp-sh-1)}
html.retro-pop body.neural-page .ps2-feature figure figcaption,
html.retro-pop body.neural-page .image-credit{font-family:var(--rp-ff-mono)}
html.retro-pop body.neural-page .ps2-gallery img{border:2px solid var(--bl-ink)}

/* 2.6 colofão: tinta com retícula creme, borda rasgada em cima, faixa de bala embaixo */
html.retro-pop body > footer,
html.retro-pop .site-footer,
html.retro-pop .nx-foot{
  position:relative;margin-top:60px;padding-bottom:calc(36px + 10px);border-top:0;
  background-image:var(--rp-pat-candy),var(--bl-dots-cream);background-size:100% 10px,10px 10px;
  background-position:left bottom,0 0;background-repeat:no-repeat,repeat;font:500 14px/1.6 var(--rp-ff-body)}
html.retro-pop .nx-foot{max-width:none}
html.retro-pop body > footer::before,
html.retro-pop .site-footer::before,
html.retro-pop .nx-foot::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 body > footer a,
html.retro-pop .site-footer a,
html.retro-pop .nx-foot a{display:inline-flex;align-items:center;min-height:32px;border-bottom:2px solid transparent;font-weight:700;text-decoration:none}
html.retro-pop body > footer a:hover,
html.retro-pop .site-footer a:hover,
html.retro-pop .nx-foot a:hover{border-bottom-color:var(--rp-yellow)}


/* ═══════════ 3 · LARGURAS ═══════════ */
@media (max-width:1080px){
  html.retro-pop .layout article,
  html.retro-pop main.nx-wrap{max-width:none}
}
@media (max-width:760px){
  /* launcher-neural-guide.css esconde os links de texto aqui; o display da regra 2.1 não pode reabri-los */
  html.retro-pop body.neural-page .site-nav nav > a:not(.nav-download){display:none}
  /* launcher-neural-guide.css:5 pinta o sumário de #1a160f aqui: vira cartão de papel */
  html.retro-pop body.neural-page .guide-sidebar{background:var(--bl-white);border:3px solid var(--bl-ink);box-shadow:var(--rp-sh-2)}
}
@media (max-width:767px){
  html.retro-pop body > .nav,
  html.retro-pop body.neural-page .site-nav{padding-bottom:14px;background-image:var(--bl-dots);background-size:8px 8px;border-bottom:5px solid var(--bl-ink)}
  /* logo + 4 links não cabem em 390px: a tarja quebra em duas linhas centradas em vez de cortar o "Contact" */
  html.retro-pop body > .nav{flex-wrap:wrap;justify-content:center;gap:4px 10px;padding-left:12px;padding-right:12px}
  html.retro-pop body > .nav .logo{font-size:15px;padding:5px 9px}
  html.retro-pop body > .nav .nav-links{flex-wrap:wrap;justify-content:center;gap:0}
  html.retro-pop .nav-links a{padding:0 7px;font-size:12px}
  html.retro-pop .article-card,
  html.retro-pop body.neural-page .system-card:nth-child(n),
  html.retro-pop .layout article .info-box,
  html.retro-pop .nx-infobox,
  html.retro-pop body.neural-page .hero-visual{transform:none}
  html.retro-pop .article-card:hover{transform:translate(-2px,-3px)}
  html.retro-pop .layout article::before,
  html.retro-pop main.nx-wrap::before{right:14px;width:90px;height:28px}
  html.retro-pop main.nx-wrap{margin-inline:12px}
  html.retro-pop .layout article h2,
  html.retro-pop .nx-wrap h2{margin-left:-4px;padding:7px 14px 7px 26px}
  html.retro-pop .layout article .pullquote{max-width:none;transform:none}
}
@media (prefers-reduced-motion:reduce){
  html.retro-pop .article-card,html.retro-pop .play-link,html.retro-pop .nx-play,html.retro-pop .nx-cta,
  html.retro-pop body.neural-page .button,html.retro-pop body.neural-page .nav-download{transition-duration:1ms}
}
