/* OddsIQ V2 · MARCA DA BANCA (30/10/2026, frente v2-marca-betshow) — folha de PRODUÇÃO (fora da cópia do protótipo). Tudo preso a html[data-marca] / html[data-marca-l~=""] (que só o v2_marca.js põe, e só com V2_CFG.marca) ou a classes .marca-* que só existem com a marca: banca sem marca = nenhuma regra daqui casa. As CORES vêm da config (v2_marca.js põe as variáveis no ); aqui só o "onde". Odd/placar seguem amarelos e o cupom não muda (decisão do dono, PROPOSTA.md seção 5). Prefixo .marca- (o .bs- da v2.css já é da busca). */ /* ── topo: filete vermelho da faixa embaixo; ação em ouro (o verde/amarelo do topo são fixos na v2.css) ── */ html[data-marca] .tp{box-shadow:inset 0 -2px 0 var(--marca-vinho)} html[data-marca] .tp-saldo{border-color:rgba(214,175,120,.6)} html[data-marca] .tp-dep{background:var(--marca-ouro);color:var(--marca-ouro-ink)} html[data-marca] .tp-dep:hover{background:var(--marca-ouro2)} html[data-marca] .tp-conta{box-shadow:inset 0 0 0 1.5px var(--marca-ouro);color:var(--marca-ouro)} @media (min-width:901px){ html[data-marca] .tp-areas a[aria-current="true"]::after{background:var(--marca-ouro)} html[data-marca] .tp-areas .novo{background:var(--marca-ouro);color:var(--marca-ouro-ink)} } /* ── a faixa da marca no canto superior esquerdo (exceção à regra "topo sem marca", só com a marca — dono 30/10) ── */ html[data-marca-l~="topo"] a.tp-marca{display:flex;align-items:center;min-width:0;border-radius:3px} html[data-marca-l~="topo"] a.tp-marca img{display:block;width:100%;max-width:166px;height:auto} @media (min-width:901px){html[data-marca-l~="topo"] a.tp-marca{width:176px}html[data-marca-l~="topo"] a.tp-marca img{max-width:176px}} @media (max-width:520px){ /* celular: em 390 px o Depositar fica só com o "+" (como a produção já faz até 374 px) e a faixa ganha ~100 px. O nome continua para o leitor de tela (texto escondido só da vista). O "Cadastre-se" do visitante e o Depositar sem o "+" ficam como estão. Aprovado pelo dono em 30/10 */ html[data-marca-l~="topo"] .tp-dep:not([data-v2p-cad]):has(>.ic){padding:0 9px} html[data-marca-l~="topo"] .tp-dep:not([data-v2p-cad]):has(>.ic)>span:not(.ic){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap} html[data-marca-l~="topo"] .tp-in{column-gap:6px} } /* ── lâmina da marca na home (1ª do carrossel): o mascote animado pousa no chão, sem caixa ── */ .fly.fly-marca .fimg{mix-blend-mode:normal} .marca-masc{position:absolute;right:4%;bottom:26px;height:calc(100% - 34px);width:auto;max-width:48%;object-fit:contain;object-position:right bottom;z-index:-1;pointer-events:none;user-select:none} .fly-marca .ft{max-width:15ch} @media (min-width:901px){.marca-masc{right:9%;bottom:28px;height:calc(100% - 40px)}} /* acima da linha dos pontinhos */ /* ── carregando: o mascote no lugar da rodinha (só o .carrega das telas; o "cotando" do cupom é

e não muda) ── */ html[data-marca-l~="carregando"] div.carrega{flex-direction:column;gap:6px} html[data-marca-l~="carregando"] div.carrega::before{width:112px;height:95px;border:0;border-radius:0;animation:none;background:var(--marca-carrega) center/contain no-repeat} /* ── abertura (1ª pintura): o mascote no chão enquanto a V2 lê o catálogo; some sozinha. ACIMA do véu do PIN (.v2p-veu 9000) e da conta (.v2c-veu 9100), que entram no DOM depois; abaixo da manutenção (.v2p-manut 9999) ── */ .marca-abre{position:fixed;inset:0;z-index:9500;display:grid;place-items:center;background:var(--bg);transition:opacity .35s ease,visibility .35s} .marca-abre img{width:min(300px,64vw);height:auto} .marca-abre.fora{opacity:0;visibility:hidden;pointer-events:none} /* ── entrada/criar conta (v2_conta.js) e tela do PIN do link (v2_producao.js): o mascote no alto ── */ /* 31/10 (r187): 180 px empurrava o formulário para fora do quadro no iPhone — o mascote fica pequeno e encolhe na tela baixa */ .v2c-marca-img,.marca-pin{display:block;width:128px;max-width:40%;height:auto;margin:-6px auto 8px} @media (max-height:740px){.v2c-marca-img,.marca-pin{width:96px}} @media (prefers-reduced-motion:reduce){ .marca-abre{transition:none} } /* ══ APOSTADOR (02/11/2026, frente v2-marca-apostador) — o que a config (cores) não alcança. Tudo preso a html[data-marca="apostador"] (ou .marca-* dentro dele): a Betshow e as bancas sem marca não mudam. Valores do protótipo aprovado (_prototipo_apostador/v2/site/apostador.css, PROPOSTA.md §3-4): preto da Blaze, vermelho de ação, odds e placar brancos (vêm do --preco da config), topo de 02/11 sem sobreposição de 901 a 1279 px. 05/11 (frente aptd-marca): a banca virou APTD — a logo nova do dono (o "A" vermelho 3D, sem a palavra, parada) no topo, abertura, entrada, PIN e carregando; a lâmina da marca saiu da home. Cores e botões como antes. ══ */ html[data-marca="apostador"] .tp-saldo{border-color:rgba(229,9,20,.65)} html[data-marca="apostador"] .tp-conta{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55);color:#fff} /* o topo é preto nos dois temas: a ação dele fica no vermelho forte também no claro (o --marca-ouro do claro é o #B8000B do papel) */ html[data-marca="apostador"] .tp-dep{background:#E50914;color:#fff} html[data-marca="apostador"] .tp-dep:hover{background:#C70812} @media (min-width:901px){ html[data-marca="apostador"] .tp-areas a[aria-current="true"]::after{background:#E50914} html[data-marca="apostador"] .tp-areas .novo{background:#E50914;color:#fff} } html[data-marca="apostador"] .tk{--tk-preco:#FFFFFF} /* placar do tracker (campo escuro nos dois temas); o cartão amarelo fica */ /* botões cheios no vermelho forte (o --acc #FF4040 fica para texto, ícone e filete; branco sobre ele = 3,6:1) — inclusive o "Entrar" da tela do PIN (.v2p-bt) e o "Jogar" do cassino (.v2c-jogar; revisão 02/11: ficava no #FF4040) */ html[data-marca="apostador"] .v2c-bt,html[data-marca="apostador"] .v2p-bt,html[data-marca="apostador"] .jca-add,html[data-marca="apostador"] .ap-pl.ganhou,html[data-marca="apostador"] .ap-ac.enc,html[data-marca="apostador"] .ct-ok,html[data-marca="apostador"] .v2c-jogar{background:var(--marca-ouro);color:#fff} html[data-marca="apostador"] .fcta:hover,html[data-marca="apostador"] .v2c-bt:hover,html[data-marca="apostador"] .v2p-bt:hover{background:var(--marca-ouro2)} /* topo (05/11, aptd-marca): SÓ o "A" novo do dono (aptd_topo.webp, 184×175), sem a palavra — 40 px no celular, 46 px no computador (~38/44 px de altura, longe do filete) */ html[data-marca="apostador"][data-marca-l~="topo"] a.tp-marca{flex:none;width:40px} html[data-marca="apostador"][data-marca-l~="topo"] a.tp-marca img{max-width:46px} @media (min-width:901px){ html[data-marca="apostador"][data-marca-l~="topo"] a.tp-marca{width:46px} html[data-marca="apostador"][data-marca-l~="topo"] a.tp-marca img{max-width:46px} html[data-marca="apostador"][data-marca-l~="topo"] .tp-areas{justify-content:safe center;min-width:0} } /* computador estreito (901–1279 px): o aperto das áreas de 02/11 FICA como na produção (a marca agora é só o "A"); até 1099 px o Depositar fica só "+" e o saldo só com o valor (texto só fora da vista) */ @media (min-width:901px) and (max-width:1279px){ html[data-marca="apostador"][data-marca-l~="topo"] .tp-in{column-gap:10px} html[data-marca="apostador"][data-marca-l~="topo"] .tp-areas{gap:0} html[data-marca="apostador"][data-marca-l~="topo"] .tp-areas a{padding:0 10px;font-size:14px} html[data-marca="apostador"][data-marca-l~="topo"] .tp-areas a[aria-current="true"]::after{left:10px;right:10px} } @media (min-width:901px) and (max-width:1099px){ html[data-marca="apostador"][data-marca-l~="topo"] .tp-in{column-gap:8px} html[data-marca="apostador"][data-marca-l~="topo"] .tp-areas a{padding:0 8px} html[data-marca="apostador"][data-marca-l~="topo"] .tp-areas a[aria-current="true"]::after{left:8px;right:8px} html[data-marca="apostador"][data-marca-l~="topo"] .tp-saldo small{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap} html[data-marca="apostador"][data-marca-l~="topo"] .tp-dep:not([data-v2p-cad]):has(>.ic){padding:0 11px} html[data-marca="apostador"][data-marca-l~="topo"] .tp-dep:not([data-v2p-cad]):has(>.ic)>span:not(.ic){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap} } /* lâmina da home: desligada desde 05/11 ("remover primeiro baner"); as regras dela voltam pelo git se o dono pedir */ /* carregando: o "A" novo (img.carrega da config) respirando no lugar da rodinha — pelo tk-pulso da v2_tracker.css (sempre carregada; .55↔1): um @keyframes aqui teria quadros (from/to) fora da cerca "toda regra presa à marca" */ html[data-marca="apostador"][data-marca-l~="carregando"] div.carrega::before{width:56px;height:53px;animation:tk-pulso 2.2s ease-in-out infinite} /* abertura, entrada e PIN: o "A" novo parado (05/11 — sem a palavra embaixo, pede menos que a logo antiga) */ html[data-marca="apostador"] .marca-abre img{width:min(200px,46vw)} html[data-marca="apostador"] .v2c-marca-img,html[data-marca="apostador"] .marca-pin{width:104px;max-width:34%} @media (max-height:740px){html[data-marca="apostador"] .v2c-marca-img,html[data-marca="apostador"] .marca-pin{width:84px}} @media (prefers-reduced-motion:reduce){ html[data-marca="apostador"][data-marca-l~="carregando"] div.carrega::before{animation:none} } /* ══ BET REAL (02/11/2026, frente v2-marca-betreal) — a logo NEON (metade vermelha, metade azul) e o vídeo do fogo. Tudo preso a html[data-marca="betreal"]: Betshow, Apostador e as bancas sem marca não mudam. Valores do protótipo aprovado (_prototipo_betreal/v2/site/betreal.css, PROPOSTA.md §1-3): chão azul-noite, vermelho #E10D15 = ação, azul #0F6EE3 = escolhido, odd e placar BRANCOS (vêm do --preco da config, dono 02/11). PRIMEIRA marca com vídeo: o v2_marca.js troca a imagem dos ganchos por