/* ==========================================================================
   Funil 2.0 (15/10/2026) - abertura da pagina inicial, cadastro simplificado e /jogar.
   Mesma identidade do template jOTa (navy + ouro, Cinzel nos titulos, EB Garamond no texto).
   Tudo com prefixo .f2- para nao tocar nas outras paginas.
   ========================================================================== */

/* ---------- pagina inicial: a abertura e o 1o item da grade (index.php, .grid-inicio) ----------
   Computador: topo da coluna do meio, emendada no painel do conteudo (o cabecalho "Inicio" fica
   so nela). Celular/tablet (1 coluna): vem antes do menu. O miolo se ajusta a largura da COLUNA
   (container query), nao da tela: 760 px a partir de 1280 px de tela, ~500 px em 1024. */
@media (min-width:981px){
  .grid-inicio{grid-template-areas:"nav inicio side" "nav main side";row-gap:0}
  .grid-inicio>.col-nav{grid-area:nav}
  .grid-inicio>.col-side{grid-area:side}
  .grid-inicio>.col-content{grid-area:main}
  .grid-inicio>.f2-inicio{grid-area:inicio;margin-bottom:0;border-bottom:0;border-radius:var(--r) var(--r) 0 0;clip-path:inset(-14px -14px 0 -14px)}
  .grid-inicio>.f2-inicio>.corner.bl,.grid-inicio>.f2-inicio>.corner.br{display:none}
  /* divisor fixo entre a abertura e o resto (sem ele, o arredondamento de pixel deixava uma linha que ia e vinha) */
  .grid-inicio>.col-content>.content-box{border-top:1px solid rgba(201,168,90,.5);border-radius:0 0 var(--r) var(--r);clip-path:inset(0 -14px -40px -14px)}
  .grid-inicio>.col-content>.content-box>.corner.tl,.grid-inicio>.col-content>.content-box>.corner.tr{display:none}
}
.grid-inicio>.col-content>.content-box>.ph{display:none}
.grid-inicio .col-content .jota-home{background:#0b1322;padding-top:14px}

.f2-inicio{container-type:inline-size}
.f2-inicio-corpo{padding:18px 16px 20px;color:#efe3c4;background:radial-gradient(900px 520px at 50% -140px,#1c2a48 0%,#0b1322 62%) #0b1322}
.f2-abertura{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:20px;align-items:start;
  padding:22px 20px;border-radius:4px;overflow:hidden;
  background:radial-gradient(120% 140% at 50% 0%,rgba(22,41,74,.96),rgba(11,19,34,.98) 70%);
  box-shadow:0 0 0 1px var(--gold-deep),0 10px 26px rgba(0,0,0,.4)}
.f2-abertura::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(50% 80% at 12% 0%,rgba(230,198,110,.10),transparent 70%),
             radial-gradient(40% 70% at 95% 100%,rgba(70,200,210,.08),transparent 70%)}
.f2-abertura > *{position:relative;min-width:0}
.f2-kicker{font:600 11px/1.2 Cinzel,serif;letter-spacing:.2em;color:var(--gold-lite);text-transform:uppercase;margin:0 0 8px}
.f2-titulo{font:900 clamp(22px,3.8cqi,29px)/1.1 "Cinzel Decorative",Cinzel,serif;color:#fff1cf;letter-spacing:.02em;
  text-shadow:0 2px 0 #4b360f,0 0 22px rgba(230,198,110,.35);margin:0 0 10px}
.f2-sub{font:500 17px/1.3 "EB Garamond",Georgia,serif;color:#e8d9b4;margin:0 0 10px}
.f2-sub b{color:var(--gold-lite);font-weight:600}
.f2-oque{font-size:14.5px;line-height:1.5;color:#cdbf9f;margin:0 0 18px}
.f2-acoes{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:flex-start}
.f2-cta{display:inline-flex;flex-direction:column;align-items:flex-start;gap:4px}
.f2-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 28px;border-radius:6px;
  font:800 17px/1 Cinzel,serif;letter-spacing:.08em;text-decoration:none;text-transform:uppercase;cursor:pointer;border:0;
  transition:transform .12s ease,box-shadow .12s ease,filter .12s ease}
.f2-btn:focus-visible{outline:3px solid #fff1cf;outline-offset:3px}
.f2-btn-jogar{background:linear-gradient(180deg,#f6dc8b,var(--gold) 55%,var(--gold-deep));color:#241703;
  box-shadow:0 0 0 1px #5a420f,0 8px 22px rgba(199,154,60,.35),inset 0 1px 0 rgba(255,255,255,.6);font-size:19px;min-height:58px;padding:0 34px}
.f2-btn-jogar:hover{transform:translateY(-1px);filter:brightness(1.05);box-shadow:0 0 0 1px #5a420f,0 12px 28px rgba(199,154,60,.45),inset 0 1px 0 rgba(255,255,255,.6)}
.f2-btn-jogar svg{width:20px;height:20px}
.f2-btn-windows{background:rgba(11,19,34,.6);color:#eadfc6;box-shadow:inset 0 0 0 1px rgba(230,198,110,.55);font-size:14.5px;min-height:46px;padding:0 20px}
.f2-btn-windows:hover{background:rgba(22,41,74,.85);color:#fff}
.f2-btn-windows svg{width:18px;height:18px;color:var(--gold-lite)}
.f2-apoio{font:italic 500 14px/1.3 "EB Garamond",Georgia,serif;color:#d8c9a6;margin-left:2px}
.f2-apoio-dl{font-size:12.5px;color:#a99a7a;font-style:normal}
.f2-inicio .f2-btn-jogar{font-size:14.5px;min-height:44px;padding:0 16px;gap:8px}
.f2-inicio .f2-btn-jogar svg{width:17px;height:17px}
.f2-inicio .f2-btn-windows{font-size:11px;letter-spacing:.05em;min-height:44px;padding:0 11px;gap:7px}
.f2-inicio .f2-btn-windows svg{width:15px;height:15px}
.f2-inicio .f2-acoes{gap:10px 12px}
/* a legenda quebra na largura do proprio botao: os dois botoes cabem lado a lado na coluna
   (1.25fr da abertura = ~416 px na coluna de 760; os dois botoes + vao pedem ~407) */
.f2-inicio .f2-cta{width:min-content;gap:6px}
.f2-inicio .f2-btn{white-space:nowrap}
.f2-inicio .f2-apoio{font-size:13px}
.f2-inicio .f2-apoio-dl{font-size:11.5px}
.f2-inicio .f2-so-celular{margin:10px 0 0}

/* "Noticias do Reino": a noticia mais recente do banco (saiu do topo do conteudo, nao repete).
   16/10 (dono: "confuso, espremido"): linha inteira da abertura, embaixo do texto E das imagens. */
.f2-noticias{grid-column:1 / -1;margin-top:4px;padding-top:22px;border-top:1px solid rgba(201,168,90,.22)}
.f2-noticias-eb{font:600 11px/1 Cinzel,serif;letter-spacing:.26em;text-transform:uppercase;color:#c9a85a;text-align:center;margin:0 0 7px}
.f2-noticias-t{font:700 19px/1.2 Cinzel,serif;letter-spacing:.12em;text-transform:uppercase;color:#f1e3bf;text-align:center;margin:0 0 16px}
.f2-noticia{display:grid;grid-template-columns:200px minmax(0,1fr);background:#131e36;border:1px solid rgba(201,168,90,.22);border-radius:4px;
  overflow:hidden;text-decoration:none;color:#f1e3bf;transition:border-color .2s ease,transform .2s ease}
.f2-noticia:hover{border-color:#c9a85a;transform:translateY(-1px)}
.f2-noticia:focus-visible{outline:2px solid #efd58a;outline-offset:2px}
.f2-noticia-img{position:relative;display:grid;place-items:center;min-height:170px;background:linear-gradient(135deg,#5d141c 0%,#1c2a48 55%,#131e36 100%)}
.f2-noticia-ic{width:64px;height:64px;color:#c9a85a;opacity:.55;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5));transition:opacity .2s ease}
.f2-noticia:hover .f2-noticia-ic{opacity:.85}
.f2-noticia-img span{position:absolute;top:12px;left:12px;font:700 10px/1 Cinzel,serif;letter-spacing:.2em;text-transform:uppercase;
  padding:5px 8px;background:rgba(11,19,34,.72);color:#efd58a;border:1px solid rgba(201,168,90,.4)}
.f2-noticia-corpo{display:flex;flex-direction:column;gap:9px;padding:18px 22px;min-width:0}
.f2-noticia-data{font:12.5px/1 "JetBrains Mono",ui-monospace,monospace;color:rgba(241,227,191,.55);letter-spacing:.05em}
.f2-noticia-titulo{font:700 21px/1.2 Cinzel,serif;letter-spacing:.04em;color:#f1e3bf}
.f2-noticia:hover .f2-noticia-titulo{color:#efd58a}
.f2-noticia-resumo{font-size:16px;line-height:1.55;color:rgba(241,227,191,.72)}
.f2-noticia-mais{font:700 11px/1 Cinzel,serif;letter-spacing:.2em;text-transform:uppercase;color:#c9a85a;margin-top:4px}
.f2-noticia-vazia{font-style:italic;color:rgba(241,227,191,.6);text-align:center;margin:6px 0}

.f2-galeria{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.f2-galeria figure{margin:0;border-radius:4px;overflow:hidden;box-shadow:0 0 0 1px rgba(230,198,110,.45),0 8px 20px rgba(0,0,0,.4);background:#0b1322}
.f2-galeria figure:first-child{grid-column:1 / span 2}
.f2-galeria img{display:block;width:100%;height:auto;aspect-ratio:676 / 424;object-fit:cover}
.f2-galeria figcaption{font:600 10px/1 Cinzel,serif;letter-spacing:.03em;color:#cdbf9f;padding:5px 6px;background:rgba(11,19,34,.9);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* diferenciais e beta, logo abaixo da abertura */
.f2-faixa{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:20px 0 0}
.f2-item{background:linear-gradient(180deg,var(--parch),var(--parch-2));border-radius:4px;padding:15px 15px 14px;
  box-shadow:0 0 0 1px var(--parch-edge),0 6px 16px rgba(0,0,0,.35);color:var(--ink);min-width:0}
.f2-item h3{font:700 12.5px/1.2 Cinzel,serif;letter-spacing:.04em;color:#3b2a12;margin:0 0 8px;display:flex;gap:6px;align-items:center}
.f2-item h3 svg{width:15px;height:15px;flex:none;color:var(--gold-deep)}
.f2-item p{font-size:13.5px;line-height:1.45;margin:0;color:#4a3a22}
.f2-item p + p{margin-top:5px}
.f2-beta{display:flex;gap:14px;align-items:flex-start;margin-top:16px;background:rgba(11,19,34,.85);color:#e8dcc0;
  box-shadow:0 0 0 1px rgba(230,198,110,.4);border-radius:4px;padding:14px 18px}
.f2-beta b{font:700 12px/1.4 Cinzel,serif;letter-spacing:.1em;color:var(--gold-lite);text-transform:uppercase;white-space:nowrap}
.f2-beta p{margin:0;font-size:14px;line-height:1.42}
.f2-historia{font-style:italic;color:#bfb08c;font-size:13.5px;margin-top:3px}

@container (max-width:620px){
  .f2-abertura{grid-template-columns:1fr}
  .f2-galeria{grid-template-columns:repeat(3,minmax(0,1fr))}
  .f2-galeria figure:first-child{grid-column:auto}
  .f2-faixa{grid-template-columns:1fr 1fr}
  .f2-noticia{grid-template-columns:150px minmax(0,1fr)}
}
@container (max-width:440px){
  .f2-inicio-corpo{padding:14px 10px 12px}
  .f2-abertura{padding:18px 14px;gap:14px}
  .f2-acoes{flex-direction:column;align-items:stretch}
  .f2-inicio .f2-cta,.f2-inicio .f2-btn{width:100%}
  .f2-galeria{grid-template-columns:1fr 1fr}
  .f2-galeria figure:nth-child(3){display:none}
  .f2-faixa{grid-template-columns:1fr}
  .f2-beta{flex-direction:column;gap:4px}
  .f2-noticia{grid-template-columns:1fr}
  .f2-noticia-img{min-height:84px}
  .f2-noticia-ic{width:40px;height:40px}
  .f2-noticia-corpo{padding:14px 16px}
  .f2-noticia-titulo{font-size:18px}
}
.f2-so-celular{display:none}
@media (max-width:820px),(pointer:coarse){.f2-so-celular{display:block}}

/* ---------- cadastro simplificado ---------- */
.f2-cadastro{max-width:620px;margin:0 auto}
.f2-cadastro-topo{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 16px;margin:2px 0 14px}
.f2-cadastro-topo h2{font:800 22px/1.2 Cinzel,serif;color:#3b2a12;margin:0}
.f2-cadastro-topo p{margin:0;font-size:15.5px;color:#5b4a2e}
.f2-tem-conta{font-size:15.5px}
.f2-tem-conta a{font-weight:700}
.f2-form{display:grid;gap:14px}
.f2-campo{display:grid;gap:5px;border:0;padding:0;margin:0;min-width:0}
.f2-campo > label,.f2-campo > legend{font:700 13.5px/1.2 Cinzel,serif;letter-spacing:.05em;color:#3b2a12;padding:0}
.f2-campo input[type=email],.f2-campo input[type=text],.f2-campo input[type=password]{
  width:100%;min-height:46px;padding:10px 12px;border-radius:5px;border:1px solid #b9a479;background:#fffaf0;color:#24180a;
  font:500 17px/1.2 "EB Garamond",Georgia,serif;box-shadow:inset 0 1px 2px rgba(0,0,0,.08)}
.f2-campo input:focus{outline:none;border-color:var(--gold-deep);box-shadow:0 0 0 3px rgba(199,154,60,.28)}
.f2-campo.ok input{border-color:#4f8a3f}
.f2-campo.erro input{border-color:#b33a2f;background:#fff4f1}
.f2-dica{margin:0;font-size:14px;color:#6c5a3a}
.f2-erro{margin:0;font-size:14.5px;color:#a3281d;font-weight:600;min-height:0}
.f2-erro:empty{display:none}
.f2-erro a{color:#7a1a12;text-decoration:underline}
.f2-ok-msg{margin:0;font-size:14px;color:#3f6e34;font-weight:600}
.f2-ok-msg:empty{display:none}
.f2-senha{display:flex;gap:8px}
.f2-senha input{flex:1;min-width:0}
.f2-mostrar{flex:none;min-width:84px;min-height:46px;border-radius:5px;border:1px solid #b9a479;background:#efe2c2;color:#3b2a12;
  font:700 13px/1 Cinzel,serif;letter-spacing:.04em;cursor:pointer}
.f2-mostrar:focus-visible{outline:3px solid var(--gold-deep);outline-offset:2px}
.f2-forca{display:flex;gap:10px;flex-wrap:wrap;margin:0;padding:0;list-style:none;font-size:13.5px;color:#7a6542}
.f2-forca li::before{content:"\25CB  ";color:#a9946b}
.f2-forca li.ok{color:#3f6e34}
.f2-forca li.ok::before{content:"\2713  ";color:#3f6e34}
.f2-nome-linha{display:flex;gap:8px;flex-wrap:wrap}
.f2-nome-linha input{flex:1 1 240px;min-width:0}
.f2-sugestoes{display:flex;flex-wrap:wrap;gap:8px}
.f2-sugestoes[hidden]{display:none}
.f2-sugestao{min-height:38px;padding:0 14px;border-radius:999px;border:1px solid #b9a479;background:#fff6e2;color:#3b2a12;cursor:pointer;
  font:600 15px/1 "EB Garamond",Georgia,serif}
.f2-sugestao:hover,.f2-sugestao:focus-visible{background:#f6e4b8;border-color:var(--gold-deep)}
.f2-vocacoes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.f2-vocacoes legend{grid-column:1 / -1;margin-bottom:5px}
.f2-voc{position:relative;display:grid;justify-items:center;gap:4px;padding:10px 6px 10px;border-radius:6px;cursor:pointer;text-align:center;
  background:linear-gradient(180deg,#1b2b47,#0e1a30);box-shadow:0 0 0 1px #3a4a68;color:#e9dcbd;transition:box-shadow .12s ease,transform .12s ease}
.f2-voc:hover{box-shadow:0 0 0 1px var(--gold);transform:translateY(-1px)}
.f2-voc input{position:absolute;opacity:0;width:1px;height:1px}
.f2-voc img{height:92px;width:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 4px 6px rgba(0,0,0,.5))}
.f2-voc b{font:800 14.5px/1.1 Cinzel,serif;letter-spacing:.05em;color:#fff1cf}
.f2-voc span{font-size:13px;line-height:1.25;color:#c9bb98}
.f2-voc:has(input:checked){box-shadow:0 0 0 2px var(--gold-lite),0 0 18px rgba(230,198,110,.35);background:linear-gradient(180deg,#2a3d61,#16294a)}
.f2-voc:has(input:focus-visible){outline:3px solid var(--gold-lite);outline-offset:2px}
.f2-sexo{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.f2-sexo legend{width:100%;margin-bottom:5px}
.f2-sexo label{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid #b9a479;
  background:#fff6e2;cursor:pointer;font:600 15.5px/1 "EB Garamond",Georgia,serif;color:#3b2a12}
.f2-sexo label:has(input:checked){background:#f2dfae;border-color:var(--gold-deep);box-shadow:0 0 0 2px rgba(199,154,60,.25)}
.f2-sexo input{accent-color:var(--gold-deep);width:16px;height:16px}
.f2-enviar{width:100%;min-height:56px}
.f2-enviar[disabled]{filter:grayscale(.35);cursor:progress;transform:none}
.f2-enviar .f2-giro{display:none;width:18px;height:18px;border-radius:50%;border:3px solid rgba(36,23,3,.25);border-top-color:#241703;animation:f2giro .8s linear infinite}
.f2-enviar.enviando .f2-giro{display:inline-block}
@keyframes f2giro{to{transform:rotate(360deg)}}
.f2-aceite{margin:0;font-size:14px;color:#5b4a2e;text-align:center}
.f2-isca{position:absolute !important;left:-10000px !important;top:auto;width:1px;height:1px;overflow:hidden}
.f2-resumo-erros{background:#fbe9e5;border:1px solid #d9a197;color:#7a1a12;border-radius:5px;padding:10px 14px}
.f2-resumo-erros p{margin:0 0 4px;font-weight:700}
.f2-resumo-erros ul{margin:0;padding-left:18px}
.f2-aviso-celular{background:#13223c;color:#e7dbbf;border-radius:5px;padding:10px 14px;font-size:14.5px;line-height:1.4;box-shadow:0 0 0 1px rgba(230,198,110,.35)}
@media (max-width:620px){
  .f2-vocacoes{grid-template-columns:1fr 1fr}
  .f2-voc img{height:78px}
  .f2-cadastro-topo h2{font-size:20px}
}

/* ---------- /jogar (celular e "conta pronta") ---------- */
.f2-pronto{max-width:640px;margin:0 auto;display:grid;gap:14px;text-align:left}
.f2-pronto h2{font:800 22px/1.25 Cinzel,serif;color:#3b2a12;margin:0}
.f2-pronto p{margin:0;font-size:16.5px;line-height:1.5;color:#3d2f1a}
.f2-pronto .f2-acoes{margin-top:4px}
.f2-pronto .f2-btn-windows{background:#132240;color:#efe3c4}
.f2-pronto .f2-conta-box{background:#fff8e8;border:1px dashed #c9b07a;border-radius:5px;padding:10px 14px}
.f2-pronto .f2-conta-box code{font:700 16px/1.3 ui-monospace,Consolas,monospace;color:#3b2a12}
.f2-pronto .f2-titulo-sec{font:700 16px/1.3 Cinzel,serif;color:#3b2a12;margin:10px 0 0}
.f2-pronto ul{margin:0;padding-left:20px;display:grid;gap:6px;font-size:16px;line-height:1.5;color:#3d2f1a}

/* precedencia sobre as regras genericas de .content-box (jota.css: h2 azul, img auto, botao dourado) */
.content-box .pb .f2-cadastro-topo h2,.content-box .pb .f2-pronto h2{color:#3b2a12;margin:0}
.content-box .pb .f2-voc img{height:92px;width:auto;max-width:100%}
.content-box .f2-voc span{font:500 13.5px/1.3 "EB Garamond",Georgia,serif;text-transform:none;letter-spacing:0;color:#cdbf9f}
.content-box button.f2-mostrar{background:#efe2c2;color:#3b2a12;box-shadow:none;border:1px solid #b9a479;padding:0 10px;margin:0;font:700 13px/1 Cinzel,serif}
.content-box button.f2-mostrar:hover{filter:none;background:#f5e9cc}
.content-box button.f2-sugestao{background:#fff6e2;color:#3b2a12;box-shadow:none;border:1px solid #b9a479;padding:0 14px;margin:0;font:600 15px/1 "EB Garamond",Georgia,serif}
.content-box button.f2-enviar{font:800 18px/1 Cinzel,serif;letter-spacing:.08em;padding:0 28px;margin:0;border-radius:6px;
  background:linear-gradient(180deg,#f6dc8b,var(--gold) 55%,var(--gold-deep));color:#241703;
  box-shadow:0 0 0 1px #5a420f,0 8px 22px rgba(199,154,60,.3),inset 0 1px 0 rgba(255,255,255,.6)}
.content-box .f2-sexo input[type=radio]{accent-color:var(--gold-deep);width:16px;height:16px}
.content-box .f2-form input[type=email],.content-box .f2-form input[type=text],.content-box .f2-form input[type=password]{
  width:100%;min-height:46px;padding:10px 12px;font:500 17px/1.2 "EB Garamond",Georgia,serif}
.content-box .f2-form input:focus{border-color:var(--gold-deep);box-shadow:0 0 0 3px rgba(199,154,60,.28)}

/* [SITE-CELULAR 22/10] so celular (toque ou tela estreita); o PC nao muda.
   - "Baixar client Windows" some (o cliente e so para Windows);
   - contador de personagens some quando baixo (< 100, classe .stat--baixo do index.php);
   - celular deitado (altura <= 500 px + toque): barra fixa embaixo com Jogar agora e Criar conta
     visiveis na 1a tela, sem rolar (o banner sozinho ocupava a tela). */
.f2-barra-celular{display:none}
@media (max-width:820px),(pointer:coarse){
  .f2-inicio .f2-cta:has(.f2-btn-windows),.f2-inicio .f2-btn-windows{display:none}
  .stat--baixo{display:none!important}
}
@media (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  .f2-barra-celular{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:900;gap:10px;justify-content:center;
    padding:6px max(12px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
    background:rgba(11,19,34,.94);box-shadow:0 -1px 0 rgba(230,198,110,.45),0 -6px 16px rgba(0,0,0,.45)}
  .f2-barra-celular .f2-btn{min-height:44px;padding:0 18px;font-size:14px;gap:8px;white-space:nowrap}
  .f2-barra-celular .f2-btn svg{width:16px;height:16px}
  .f2-barra-celular .f2-barra-conta{background:transparent;color:#efd58a;box-shadow:inset 0 0 0 1px #c9a85a}
  body:has(.f2-barra-celular){padding-bottom:calc(60px + env(safe-area-inset-bottom))}
}

/* ---------- [PESQ01 24/10] pesquisa de expectativas (tela "Conta criada" e convite do Minha Conta) ----------
   Mesmos cards da vocacao (navy + aro dourado ao marcar). Tudo opcional: o JOGAR AGORA fica sempre a
   um toque (no celular, barra presa no rodape da tela). Sem animacao alem da transicao do aro. */
.pq{display:grid;gap:14px;margin:0}
.pq-intro{font:500 16.5px/1.4 "EB Garamond",Georgia,serif;color:#3d2f1a;margin:0}
.pq-q{border:0;padding:0;margin:0;min-width:0;display:grid;gap:6px}
.pq-q legend{font:700 15.5px/1.25 Cinzel,serif;letter-spacing:.03em;color:#3b2a12;padding:0;margin:0 0 2px}
.pq-ajuda{margin:0;font-size:14px;line-height:1.3;color:#6b5634}
.pq-ajuda.pq-limite{color:#8a3a12;font-weight:600}
.pq-ops{display:grid;gap:8px}
.pq-ops--cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.pq-ops--chips{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.pq-op{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:8px;row-gap:2px;align-items:center;
  min-height:46px;padding:8px 26px 8px 10px;border-radius:6px;cursor:pointer;text-align:left;-webkit-tap-highlight-color:transparent;
  background:linear-gradient(180deg,#1b2b47,#0e1a30);box-shadow:0 0 0 1px #3a4a68;color:#e9dcbd;transition:box-shadow .12s ease,background .12s ease}
.pq-op:hover{box-shadow:0 0 0 1px var(--gold)}
.pq-op input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.pq-ic{font-size:19px;line-height:1;grid-row:span 2}
.pq-op b{font:700 14px/1.15 Cinzel,serif;letter-spacing:.03em;color:#fff1cf}
.pq-op small{font:500 13px/1.25 "EB Garamond",Georgia,serif;color:#c9bb98}
.pq-ops--chips .pq-op b{font:600 15px/1.2 "EB Garamond",Georgia,serif;letter-spacing:0}
.pq-ops--chips .pq-ic{grid-row:auto}
.pq-op:has(input:checked),.pq-op.pq-sel{box-shadow:0 0 0 2px var(--gold-lite),0 0 16px rgba(230,198,110,.45);background:linear-gradient(180deg,#4a3d1c,#2a2412 55%,#1c2a44)}
.pq-op:has(input:checked)::after,.pq-op.pq-sel::after{content:"\2713";position:absolute;top:4px;right:6px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;
  background:var(--gold-lite);color:#241703;font:800 12px/1 sans-serif}
.pq-op:has(input:focus-visible){outline:3px solid var(--gold-deep);outline-offset:2px}
.pq-op:has(input:disabled){opacity:.5;cursor:not-allowed}
/* pergunta extra: so para quem marcou "Ja conhecia o servidor" (CSS puro; o JS repete com .pq--veterano) */
.pq-q3{display:none}
.pq:has(input[name=motivo][value=ja_conhecia]:checked) .pq-q3,.pq.pq--veterano .pq-q3{display:grid}
.pq-barra{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:2px}
.pq-barra .f2-btn-jogar svg{width:20px;height:20px}
.pq-pular{background:none;border:0;padding:8px 4px;min-height:44px;cursor:pointer;font:600 15px/1.2 "EB Garamond",Georgia,serif;color:#5b4a2e;text-decoration:underline;text-underline-offset:3px}
.pq-pular:hover{color:#3b2a12}
.pq-alt{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.pq-alt .f2-btn-windows{background:#132240;color:#efe3c4}
/* precedencia sobre o dourado generico de .content-box button:not(.btn) (jota.css) */
.content-box .pq button.f2-btn-jogar{font:800 19px/1 Cinzel,serif;letter-spacing:.08em;min-height:58px;padding:0 34px;margin:0;border-radius:6px;border:0;
  background:linear-gradient(180deg,#f6dc8b,var(--gold) 55%,var(--gold-deep));color:#241703;
  box-shadow:0 0 0 1px #5a420f,0 8px 22px rgba(199,154,60,.35),inset 0 1px 0 rgba(255,255,255,.6)}
.content-box .pq button.f2-btn-windows{font:800 14.5px/1 Cinzel,serif;letter-spacing:.08em;min-height:46px;padding:0 20px;margin:0;border-radius:6px;border:0;
  background:#132240;color:#efe3c4;box-shadow:inset 0 0 0 1px rgba(230,198,110,.55)}
.content-box .pq button.pq-pular{background:none;border:0;box-shadow:none;margin:0;padding:8px 4px;border-radius:0;
  font:600 15px/1.2 "EB Garamond",Georgia,serif;letter-spacing:0;text-transform:none;color:#5b4a2e}
.content-box .pq button.pq-pular:hover{filter:none;color:#3b2a12}
@media (max-width:820px),(pointer:coarse){
  .pq-ops--cards{grid-template-columns:1fr 1fr}
  .pq-ops--chips{grid-template-columns:1fr 1fr}
  .pq-alt{display:none} /* cliente so para Windows: no celular fica so o jogo no navegador */
  /* JOGAR AGORA sempre a um toque: presa no rodape da tela enquanto as perguntas rolam */
  .pq-barra{position:sticky;bottom:0;z-index:5;margin:0 -14px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    background:linear-gradient(180deg,rgba(236,224,194,.9),#ece0c2 30%);box-shadow:0 -1px 0 rgba(138,102,32,.35);justify-content:center}
  .content-box .pq button.f2-btn-jogar{flex:1 1 100%;min-height:54px;font-size:18px;padding:0 16px}
  .content-box .pq button.pq-pular{min-height:40px;padding:4px 8px}
}
@media (max-width:480px){
  .pq-op small{display:none} /* celular estreito: so o rotulo curto */
  .pq-op{min-height:48px;padding:8px}
  .pq-op b{font-size:13px}
  .pq-ops--chips .pq-op b{font-size:14.5px}
  .pq-q legend{font-size:14.5px}
  .pq-intro{font-size:15.5px}
}
@media (max-width:340px){.pq-ops--cards,.pq-ops--chips{grid-template-columns:1fr}}
/* convite do Minha Conta (contas que entraram pelo Jogar Agora e nao passaram pela tela "Conta criada") */
.pq-convite{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.pa-pesq{display:block;padding:12px 16px}
.pa-pesq summary{cursor:pointer;font-size:15.5px;line-height:1.4;list-style-position:inside;min-height:28px}
.pa-pesq summary b{font-family:Cinzel,serif;font-size:15px}
.pa-pesq-s{color:#6b5634}
.pa-pesq[open] summary{margin-bottom:12px}
.pa-pesq .pq-barra{position:static;margin:0;padding:0;background:none;box-shadow:none;justify-content:flex-start}
.pa-pesq .pq button.f2-btn-jogar{flex:0 1 auto;min-height:48px;font-size:16px;padding:0 24px}
.pa-alert.pa-pesq form.pq{display:grid} /* conta-jota.css poe todo form de .pa-alert em display:contents */
.pa-pesq .pq-intro{display:none} /* o resumo do convite ja diz o mesmo */

/* [POS01 30/10] tela de embarque (/jogar/pronto): o JOGAR AGORA e o elemento dominante; nada antes dele alem da confirmacao */
.f2-emb{display:grid;gap:14px;max-width:560px;margin:0 auto}
.f2-emb-heroi{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:center}
.f2-emb-av{width:68px;height:68px;border-radius:12px;background:linear-gradient(#24406f,#0f1b33);border:2px solid var(--gold);display:grid;place-items:center;color:#f6dc8b}
.f2-emb-av svg{width:34px;height:34px}
.f2-emb-tag{display:inline-block;font:700 12px/1.6 Signika,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#2f6b35;background:#e3f1df;border-radius:999px;padding:1px 10px}
.f2-pronto .f2-emb h2{font:800 26px/1.2 Cinzel,serif;margin:4px 0 2px}
.f2-pronto .f2-emb-mini{font-size:15.5px;color:#5b4a2e}
.f2-emb-jogar{width:100%;min-height:62px;font-size:20px;letter-spacing:.04em}
.f2-emb-jogar svg{width:22px;height:22px}
.f2-emb-jogar[aria-busy=true]{filter:saturate(.6);cursor:progress}
.f2-pronto .f2-emb-apoio{text-align:center;font-size:14.5px;color:#5b4a2e;margin-top:-6px}
.f2-emb-dados{margin:0;display:grid;gap:6px;font-size:15px;color:#3d2f1a}
.f2-emb-dados div{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.f2-emb-dados dt{min-width:58px;color:#6b5838}
.f2-emb-dados dd{margin:0;display:flex;align-items:center;gap:8px}
.f2-emb-dados code{font:700 16px/1.3 ui-monospace,Consolas,monospace;background:#fff;border:1px solid #e0cfa6;border-radius:5px;padding:2px 8px;color:#3b2a12}
.f2-emb-cp{font:600 13px Signika,sans-serif;border:1px solid #c9b07a;background:#fff;color:#3b2a12;border-radius:5px;padding:4px 10px;min-height:34px;cursor:pointer}
.f2-emb-cp:hover{background:#fff4d6}
.f2-emb-win{display:inline-flex;align-items:center;gap:8px;justify-self:center;min-height:44px;font:600 15px Signika,sans-serif;color:#132240;text-decoration:underline;text-underline-offset:3px}
.f2-emb-win svg{width:16px;height:16px}



.f2-emb a:focus-visible,.f2-emb button:focus-visible{outline:3px solid #2b6fd6;outline-offset:2px}
@media (max-width:480px){
  .f2-pronto .f2-emb h2{font-size:22px}
  .f2-emb-av{width:56px;height:56px}
  .f2-emb-jogar{min-height:58px;font-size:18px}
  .f2-emb-win{display:none}
}