/* atributo hidden vence qualquer display de classe (cookie bar, earn, etc.) */
[hidden]{display:none !important}
/* trc_games — arcade escuro, mobile-first */
*{margin:0;padding:0;box-sizing:border-box}
:root{--fundo:#0B0F1A;--card:#121828;--borda:#1E2A44;--texto:#E6EBF7;--fraco:#8794B3;--neon:#22D3EE}
body.tg{background:var(--fundo);color:var(--texto);font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;min-height:100vh;display:flex;flex-direction:column}
.tg-top{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--borda)}
.tg-logo{color:var(--texto);text-decoration:none;font-size:17px}
.tg-logo span{color:var(--neon);font-weight:900;letter-spacing:.12em;font-size:12px}
.tg-sair{color:var(--fraco);text-decoration:none;font-size:20px;padding:4px 10px}
.tg-main{flex:1;width:100%;max-width:860px;margin:0 auto;padding:18px 14px 40px}
.tg-hero{text-align:center;margin:10px 0 22px}
.tg-hero h1{font-size:24px;font-weight:900}
.tg-hero p{color:var(--fraco);font-size:13.5px;margin-top:4px}
.tg-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.tg-card{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--card);
  border:1px solid var(--borda);border-radius:16px;padding:20px 12px 14px;text-decoration:none;
  color:var(--texto);transition:.15s;position:relative;overflow:hidden}
.tg-card:active{transform:scale(.97)}
.tg-card::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--c,#22D3EE)}
.tg-card-ico{font-size:44px;line-height:1;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}
.tg-card-tit{font-weight:800;font-size:15px;text-align:center}
.tg-card-sub{color:var(--fraco);font-size:11.5px;text-align:center}
.tg-card-play{margin-top:6px;background:var(--c,#22D3EE);color:#06121f;font-weight:900;font-size:12.5px;
  padding:7px 16px;border-radius:999px}
.tg-vazio{text-align:center;color:var(--fraco);padding:50px 0}
.tg-rodape{text-align:center;color:var(--fraco);font-size:11.5px;padding:18px;border-top:1px solid var(--borda)}
.tg-leitura h1{font-size:22px;margin-bottom:12px}
.tg-conteudo{color:#cdd6ea;font-size:16px}
.tg-conteudo p{margin:12px 0}
.tg-conteudo img{max-width:100%;height:auto;border-radius:10px}
.tg-volta{margin-top:26px}
.tg-volta a{color:var(--neon);text-decoration:none}
.tg-lista{list-style:none}
.tg-lista li{padding:9px 0;border-bottom:1px solid var(--borda)}
.tg-lista a{color:var(--texto);text-decoration:none}

/* ── palco do jogo (página cheia) ── */
body.tg-full .tg-top{border-bottom-color:transparent}
.tg-palco{flex:1;width:100%;max-width:640px;margin:0 auto;padding:6px 12px 30px;position:relative}

/* ── UI compartilhada dos jogos ── */
.tgj{user-select:none;-webkit-user-select:none;touch-action:manipulation}
.tgj-hud{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:6px 0 12px}
.tgj-hud .tit{font-weight:900;font-size:18px}
.tgj-hud .pontos{display:flex;gap:8px}
.tgj-hud .box{background:var(--card);border:1px solid var(--borda);border-radius:10px;
  padding:5px 12px;text-align:center;min-width:64px}
.tgj-hud .box small{display:block;color:var(--fraco);font-size:9.5px;text-transform:uppercase;letter-spacing:.06em}
.tgj-hud .box b{font-size:15px}
.tgj-overlay{position:absolute;inset:0;z-index:50;background:rgba(4,8,18,.9);backdrop-filter:blur(3px);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  border-radius:16px;text-align:center;padding:24px}
.tgj-overlay h2{font-size:22px;font-weight:900}
.tgj-overlay p{color:var(--fraco);font-size:14px;max-width:300px}
.tgj-overlay .pontuacao{font-size:34px;font-weight:900;color:var(--neon)}
.tgj-btn{border:0;border-radius:14px;padding:15px 26px;font-size:16px;font-weight:900;cursor:pointer;
  background:linear-gradient(135deg,#22D3EE,#3B82F6);color:#06121f;box-shadow:0 10px 26px rgba(34,211,238,.35)}
.tgj-btn:active{transform:scale(.96)}
.tgj-btn.aviso{background:var(--card);color:var(--fraco);box-shadow:none;border:1px solid var(--borda);
  font-size:12.5px;font-weight:600;padding:10px 18px}
.tgj-nota{color:var(--fraco);font-size:11.5px}

/* ── topo com logo + hambúrguer ── */
.tg-top{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:8px}
.tg-logo{justify-self:center;display:flex;align-items:center}
.tg-logo img{height:40px;display:block}
.tg-top-vazio{width:44px}
.tg-burger{width:44px;height:44px;border:0;background:transparent;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.tg-burger span{display:block;width:22px;height:2.5px;border-radius:2px;background:var(--texto)}

/* ── menu lateral ── */
.tg-menu-bk{position:fixed;inset:0;z-index:190;background:rgba(3,7,18,.6);backdrop-filter:blur(2px);
  opacity:0;pointer-events:none;transition:.2s}
.tg-menu-bk.aberto{opacity:1;pointer-events:auto}
.tg-menu{position:fixed;top:0;bottom:0;left:0;z-index:200;width:min(300px,84vw);
  background:var(--card);border-right:1px solid var(--borda);transform:translateX(-102%);
  transition:transform .22s ease-out;display:flex;flex-direction:column;overflow-y:auto}
.tg-menu.aberto{transform:none}
.tg-menu-topo{display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px;border-bottom:1px solid var(--borda)}
.tg-menu-x{border:0;background:transparent;color:var(--fraco);font-size:20px;cursor:pointer;padding:4px 8px}
.tg-menu-nav{display:flex;flex-direction:column;padding:10px 0 24px}
.tg-menu-sec{padding:16px 18px 6px;color:var(--fraco);font-size:10.5px;font-weight:800;
  text-transform:uppercase;letter-spacing:.12em}
.tg-menu-nav a{padding:11px 18px;color:var(--texto);text-decoration:none;font-size:15px}
.tg-menu-nav a:active{background:rgba(34,211,238,.08)}

/* ── card com capa ── */
.tg-card.tem-capa{padding:0 0 14px}
.tg-card-capa{display:block;width:100%;aspect-ratio:16/9;overflow:hidden;
  border-radius:15px 15px 0 0;margin-bottom:8px}
.tg-card-capa img{width:100%;height:100%;object-fit:cover;display:block}

/* ── rodapé institucional + cookies ── */
.tg-rodape-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin-bottom:10px}
.tg-rodape-links a{color:var(--fraco);text-decoration:none;font-size:12px}
.tg-rodape-links a:hover{color:var(--neon)}
.tg-cookies{position:fixed;left:12px;right:12px;bottom:12px;z-index:180;background:var(--card);
  border:1px solid var(--borda);border-radius:12px;padding:12px 14px;font-size:12.5px;
  color:var(--texto);display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  box-shadow:0 10px 30px rgba(0,0,0,.5)}
.tg-cookies a{color:var(--neon);text-decoration:none}
.tg-cookies button{margin-left:auto;border:0;border-radius:8px;background:var(--neon);
  color:#06121f;font-weight:800;padding:8px 16px;cursor:pointer;font-size:12.5px}

/* ── layout knowadx (nossa paleta): topo do jogo, gate no tabuleiro, earn, guia ── */
.tgj-topo{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:4px 0 12px;flex-wrap:wrap}
.tgj-topo .tit{font-weight:900;font-size:17px;letter-spacing:.06em;color:var(--neon);text-transform:uppercase}
.tgj-topo .hud{display:flex;gap:8px}
.tgj-topo .box{background:var(--card);border:1px solid var(--borda);border-radius:12px;
  padding:6px 14px;text-align:center;min-width:64px}
.tgj-topo .box small{display:block;color:var(--fraco);font-size:9px;text-transform:uppercase;letter-spacing:.08em}
.tgj-topo .box b{font-size:16px}
.tgj-board{position:relative;background:var(--card);border:1px solid var(--borda);
  border-radius:16px;padding:10px;min-height:280px}
.tgj-overlay .gate-ico{font-size:46px;line-height:1;filter:drop-shadow(0 6px 16px rgba(34,211,238,.35))}
.tgj-overlay .gate-sub{color:#F59E0B;font-weight:800;font-size:14.5px}
.tgj-btn-grande{border:0;border-radius:16px;padding:16px 30px;font-size:17px;font-weight:900;cursor:pointer;
  color:#fff;background:linear-gradient(90deg,#22D3EE,#8B5CF6);
  box-shadow:0 0 26px rgba(139,92,246,.55),0 10px 30px rgba(34,211,238,.3);
  display:inline-flex;align-items:center;gap:9px}
.tgj-btn-grande:active{transform:scale(.96)}
.tgj-btn-grande .ad,.tgj-earn .ad{background:rgba(255,255,255,.22);border-radius:7px;
  padding:2px 7px;font-size:10.5px;font-style:normal;font-weight:800;letter-spacing:.06em}
.tgj-earn-wrap{margin:12px 0}
.tgj-earn{width:100%;border:0;border-radius:13px;padding:13px;font-size:14px;font-weight:800;cursor:pointer;
  color:#E6EBF7;background:linear-gradient(90deg,#1c2749,#3b2d6e);border:1px solid #3a3f77;
  display:flex;align-items:center;justify-content:center;gap:8px;transition:.2s}
.tgj-earn.ganhou{background:linear-gradient(90deg,#0d3a2e,#10B981);border-color:#10B981}
.tgj-earn b{color:#F59E0B}
.tgj-guia{margin-top:14px;background:var(--card);border:1px solid var(--borda);border-radius:14px;overflow:hidden}
.tgj-guia summary{cursor:pointer;padding:13px 16px;font-weight:800;font-size:14px;list-style:none;
  display:flex;align-items:center;justify-content:space-between}
.tgj-guia summary::after{content:"▾";color:var(--fraco)}
.tgj-guia[open] summary::after{content:"▴"}
.tgj-guia ul{padding:0 18px 14px 34px;color:#cdd6ea;font-size:13.5px}
.tgj-guia li{margin:7px 0}
.tgj-guia b{color:var(--texto)}
.tgj-rotulo-guia{margin:16px 0 6px;color:var(--neon);font-weight:900;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase}

/* ── rush blocks (grade DOM 8x8 + bandeja) ── */
.rb-grade{display:grid;grid-template-columns:repeat(8,1fr);gap:3px}
.rb-cel{aspect-ratio:1;border-radius:5px;background:#0d1424;border:1px solid #16203a}
.rb-cel.cheia{border:0}
.rb-cel.previa{background:rgba(34,211,238,.25);border-color:var(--neon)}
.rb-cel.ruim{background:rgba(239,68,68,.22);border-color:#EF4444}
.rb-bandeja{display:flex;justify-content:space-around;align-items:center;gap:8px;
  background:var(--card);border:1px solid var(--borda);border-radius:14px;
  padding:12px;margin-top:12px;min-height:86px}
.rb-peca{display:grid;gap:2px;cursor:grab;touch-action:none}
.rb-peca.usada{visibility:hidden}
.rb-peca i{width:17px;height:17px;border-radius:4px;display:block}
.rb-fantasma{position:fixed;z-index:300;pointer-events:none;display:grid;gap:2px;opacity:.85}
.rb-fantasma i{width:24px;height:24px;border-radius:5px;display:block}

/* ── runtime ActiveView: o loader de interstitial (#av-loader__wrapper) é um
   véu fixed z-9999 que fica 2,5-10s na tela; SEM isto ele engole todo toque
   (cookies, gate do jogo, menu). Vira só visual — clique atravessa. ── */
#av-loader__wrapper{pointer-events:none !important}

/* ── jogo de verdade: dentro da área de jogo o dedo NUNCA vira rolagem/zoom/seleção.
   touch-action:none no tabuleiro E na bandeja (dedo 2mm fora da peça caía na bandeja
   sem trava e o navegador rolava a página no meio do arrasto). ── */
.tgj-board,.rb-bandeja{touch-action:none;overscroll-behavior:contain}
.tgj{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.tgj-guia,.tgj-guia *{-webkit-user-select:text;user-select:text}

/* ── ranking dos jogos ── */
.tg-rank{margin:18px 0 6px;background:var(--card);border:1px solid var(--borda);border-radius:14px;padding:14px 16px}
.tg-rank-topo{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.tg-rank-topo .tit{font-weight:900;letter-spacing:.06em;color:var(--neon);text-transform:uppercase;font-size:14px}
.tg-rank-nick{background:none;border:1px solid var(--borda);border-radius:8px;color:var(--fraco);
  padding:4px 10px;font-size:12px;cursor:pointer}
.tg-rank-edita{display:flex;gap:6px}
.tg-rank-edita input{background:var(--fundo);border:1px solid var(--borda);border-radius:8px;
  color:var(--texto);padding:5px 10px;font-size:13px;width:130px}
.tg-rank-edita button{background:var(--neon);border:0;border-radius:8px;color:#06121f;
  font-weight:800;padding:5px 12px;font-size:12px;cursor:pointer}
.tg-rank ol{list-style:none;margin:0;padding:0}
.tg-rank li{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:9px;font-size:14px}
.tg-rank li:nth-child(even){background:rgba(255,255,255,.025)}
.tg-rank li.eu{background:rgba(34,211,238,.12);border:1px solid rgba(34,211,238,.35)}
.tg-rank .pos{min-width:34px;text-align:center;font-weight:800}
.tg-rank .nome{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tg-rank li b{font-variant-numeric:tabular-nums}
.tg-rank-minha{margin-top:8px;padding:7px 8px;font-size:13.5px;color:var(--fraco);
  background:rgba(34,211,238,.07);border-radius:9px}
.tg-rank-carrega{color:var(--fraco);font-size:13px}
.tg-rank-flash{margin:6px 0 2px;padding:8px 12px;border-radius:10px;font-size:13.5px;font-weight:700;
  background:rgba(245,158,11,.14);border:1px solid rgba(245,158,11,.4);color:#FCD34D}