/* Só do jogo de verdade: tela cheia no celular e o formulário de entrada. O resto vem de app.css. */
html,body{height:100%;margin:0;background:#020203;color:var(--g-text);font-family:var(--body);-webkit-text-size-adjust:100%}
body{overscroll-behavior:none}
#app{height:100%;max-width:480px;margin:0 auto;position:relative}
#app .p-screen{border-radius:0;height:100%;font-size:14px}
#app .p-top{padding-top:calc(12px + env(safe-area-inset-top,0px))}
#app .p-tabs button{padding-bottom:calc(15px + env(safe-area-inset-bottom,0px))}
#app .p-scene{height:clamp(160px,28vh,270px)}
#app .p-alt{padding-bottom:24px}
#app .p-feed{font-size:12px}
@media (min-width:481px){#app{box-shadow:0 0 0 1px #2C3038}}

.auth{height:100%;overflow:auto;display:flex;flex-direction:column;justify-content:center;gap:18px;padding:calc(28px + env(safe-area-inset-top,0px)) 22px calc(28px + env(safe-area-inset-bottom,0px));
  background:linear-gradient(rgba(5,6,8,.78),rgba(5,6,8,.94)),url("/img/f2.jpg") center/cover no-repeat}
.auth .logo{font:400 30px/1 var(--display);letter-spacing:.03em;text-transform:uppercase;display:flex;align-items:center;gap:10px}
.auth .logo i{width:34px;height:34px;border-radius:6px;background:repeating-linear-gradient(135deg,#FFD400 0 7px,#121418 7px 14px);flex:none}
.auth .logo b{font-weight:400;color:var(--g-btc)}
.auth p{font-size:15px;line-height:1.45;color:var(--g-dim);max-width:34ch}
.auth form{display:flex;flex-direction:column;gap:12px}
.auth label{display:flex;flex-direction:column;gap:6px;font:500 11px/1 var(--mono);text-transform:uppercase;letter-spacing:.07em;color:var(--g-dim)}
.auth input,.auth select{font:500 16px/1.2 var(--body);padding:13px 12px;border-radius:9px;border:1px solid var(--g-rule);background:rgba(11,12,14,.85);color:var(--g-text);width:100%}
.auth input:focus-visible,.auth select:focus-visible{outline:2px solid var(--g-haz);outline-offset:1px}
.auth .go{all:unset;box-sizing:border-box;text-align:center;font:400 17px/1 var(--display);letter-spacing:.05em;text-transform:uppercase;padding:15px;border-radius:9px;background:var(--g-btc);color:#1B0F00;cursor:pointer}
.auth .go:disabled{opacity:.5;cursor:default}
.auth .alt{all:unset;text-align:center;font:600 14px/1.2 var(--body);color:var(--g-text);cursor:pointer;padding:8px;text-decoration:underline;text-underline-offset:3px}
.auth .err{font:600 13.5px/1.35 var(--body);color:var(--g-red);min-height:18px}
.auth :focus-visible{outline:2px solid var(--g-haz);outline-offset:2px}
.linha-teste{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.scr .sair{background:transparent;color:var(--g-dim);text-decoration:underline;text-underline-offset:3px}
/* aviso fora da Fazenda (compra recusada porque o preço mudou): faixa no alto da aba. Um toque fecha. */
.aviso-alt{margin:0 0 10px;padding:10px 12px;border-radius:9px;border:1px solid var(--g-red);color:var(--g-red);background:rgba(11,12,14,.85);font:600 13.5px/1.4 var(--body);cursor:pointer}
/* barra de línguas da tela de entrada (o jogo em si não tem: lá o idioma vem do país da conta). Fica no alto, encostada
   à direita, discreta: é atalho para quem chegou na língua errada, não a primeira coisa que se lê. */
.auth .idiomas{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;margin-bottom:-6px}
.auth .idiomas button{all:unset;box-sizing:border-box;cursor:pointer;padding:6px 10px;border-radius:999px;border:1px solid transparent;
  font:600 12px/1 var(--body);color:var(--g-dim);white-space:nowrap}
.auth .idiomas button[aria-pressed="true"]{color:var(--g-text);border-color:var(--g-rule);background:rgba(11,12,14,.85)}
/* o slogan e o aviso, no pé da tela de entrada. O aviso é o texto miúdo de sempre — e o dono pediu: não é promessa de
   rendimento, não é investimento. Fica na entrada e no manual, os dois lugares em que se decide entrar. */
.auth .manual{color:var(--g-dim)}
.auth .jogo-slogan,.auth .jogo-aviso{align-self:center;max-width:36ch;margin:0;text-align:center}
.auth .jogo-slogan{font:600 13px/1.4 var(--body);color:var(--g-text)}
.auth .jogo-aviso{font:500 11px/1.5 var(--body);color:var(--g-dim);opacity:.85}
/* UM scroll só na entrada: o #app cresce com o conteúdo e quem rola é a página, levando junto o texto de baixo.
   Antes o .auth rolava por dentro e o #sobre rolava por fora — dois scrolls na mesma tela, e o dono viu. */
#app.na-entrada{height:auto;min-height:0}
/* altura do CONTEÚDO, não da tela: com min-height:100% e o conteúdo centralizado sobrava um buraco preto entre o
   formulário e o texto de baixo. Agora o texto começa onde o formulário acaba. */
#app.na-entrada .auth{height:auto;min-height:0;overflow:visible;padding-bottom:calc(42px + env(safe-area-inset-bottom,0px))}
/* Tela de vídeo: o título e a frase sobem para logo abaixo do logotipo, e o pé fica livre para a citação.
   O 13% é o MESMO do .v-marca (13% da largura), então o logotipo e o título andam juntos em qualquer tamanho. */
#app .p-video .v-ph[data-real]{justify-content:flex-start;gap:6px;
  padding:calc(13% + 62px + env(safe-area-inset-top,0px)) 20px 24px;
  background:linear-gradient(rgba(0,0,0,.84) 0,rgba(0,0,0,.36) 30%,transparent 48%,transparent 56%,rgba(0,0,0,.5) 78%,rgba(0,0,0,.9) 100%)!important}
/* a citação, sorteada a cada vídeo. Fica ACIMA da barra do "pular", e não recebe toque: um toque em qualquer
   lugar da tela de vídeo pula, e a citação não pode roubar esse toque. */
#app .p-video .v-cit{position:relative;z-index:3;padding:0 18px 2px;text-align:center;pointer-events:none}
#app .p-video .v-cit p{margin:0;font:500 13.5px/1.5 var(--body);color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.9)}
#app .p-video .v-cit small{display:block;margin-top:5px;font:500 10.5px/1.2 var(--mono);color:rgba(255,255,255,.66);
  text-transform:uppercase;letter-spacing:.06em}
#app .p-video .v-cit p:empty,#app .p-video .v-cit small:empty{display:none}
/* Etapa A: o campo da senha (pedida de novo no saque e na troca de carteira) e o aviso das 24 h no bloco da carteira USDT.
   Reusa a grade .sq-f do app.css (congelado), com uma coluna só. */
.sq-f.sq-senha{grid-template-columns:minmax(0,1fr)}
.sq-f.sq-senha input{font:500 14px/1.2 var(--body)}
.p-jan .sq .sq-senha{margin:0 0 10px}
.scr .sq-24h{color:var(--g-haz)}
/* Parte 1: a tela sem TH/s, fase, bloco, ciclo e aba Rede. O molde (phoneTpl) é congelado: some por aqui o que ele ainda desenha
   (KPIs, barra da fase, cartão do ciclo, relógio e cubo 3D, a tag da fase, mês e ano, o "≈ US$" do saldo) e a barra fica com 3 abas */
#app .p-kpi,#app .p-phase,#app .p-ciclo,#app .p-relogio,#app .p-hash,#app .p-cubo-pct,#app .p-scene .tag.l,#app .p-day .net,#app .p-mined em{display:none}
#app .p-tabs{grid-template-columns:repeat(3,1fr)}
#app .p-tabs button[data-tab="rede"]{display:none}
/* a loja tem um par só no lugar dos três: "1 % ao dia" escrito como está (o dt do app.css é miúdo e em caixa alta) e, embaixo,
   "rende 0,18 USDT por dia". Na Fazenda, sem a % da conta, "por dia" é a última linha visível do bloco */
#app .item dl{grid-template-columns:1fr}
#app .item dt{text-transform:none;letter-spacing:0;font:600 12px/1.2 var(--body);color:var(--g-text)}
#app .p-day i:empty{display:none}
#app .p-day div:nth-child(3){border-bottom:0;color:var(--g-text);font-weight:700}
/* o botão "Minha conta é do Brasil (Pix)", só da conta que não é em real: a linha inteira, sem quebrar o texto em dois botões de largura */
#app .packs button[data-conta-br]{grid-column:1/-1}
/* Parte 2 (2.23): a caixa "Tenho 18 anos ou mais" do cadastro (o label do .auth é coluna em caixa alta: aqui é linha, com o texto
   como se lê) e os avisos da Carteira (e-mail sem confirmar, 18+ sem declarar), cada um com o botão dele */
.auth label.chk{flex-direction:row;align-items:center;gap:10px;font:600 14px/1.35 var(--body);text-transform:none;letter-spacing:0;color:var(--g-text);cursor:pointer}
.auth label.chk input{width:20px;height:20px;padding:0;margin:0;flex:none;accent-color:var(--g-btc)}
.scr .conta-aviso{margin:10px 0;padding:10px 12px;border-radius:9px;border:1px solid var(--g-haz);background:rgba(11,12,14,.85);display:flex;flex-direction:column;gap:8px}
.scr .conta-aviso p{margin:0;font:600 13.5px/1.4 var(--body);color:var(--g-haz);overflow-wrap:anywhere}
.scr .conta-aviso button{align-self:flex-start;background:var(--g-haz);color:#121418}
/* M6: a compra de item de um jogo do portal diz o jogo numa linha miúda embaixo do rótulo, na Carteira */
.ext small.ext-jogo{display:block;margin-top:3px;font-size:10px;color:var(--g-dim);opacity:.85}
/* O histórico da Fazenda no celular: o app.css (congelado) deixa cada linha numa linha só e corta o FIM com reticências, e o fim é o
   valor. Com "Compra · <nome do item>" o valor sumia ("Purchase · Flanela de microfibra …" sem os − 6,00 USDT). Aqui a linha do
   extrato (li.ext-l, do app.js) é flex: o rótulo encolhe com reticências e o valor fica sempre inteiro. Os avisos (li.aviso) não mudam */
#app .p-feed li.ext-l{display:flex;align-items:baseline;gap:.6ch}
#app .p-feed li.ext-l b{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#app .p-feed li.ext-l span{flex:none}