.lat-link.falta{opacity:.5}
.lat-link.falta:hover{opacity:.85}
.pagina{
display:grid; grid-template-columns:minmax(0,1fr) 210px; gap:48px;
max-width:1120px; padding:34px 40px 64px;
}
.pagina.sem-indice{grid-template-columns:minmax(0,1fr)}
.artigo{min-width:0; max-width:820px}
.migalha{font-size:13px; color:var(--texto-3); margin:0 0 10px}
.migalha a{color:var(--texto-3)}
.migalha a:hover{color:var(--ciano)}
.titulo-pagina{display:flex; align-items:center; gap:12px; margin-bottom:8px}
.titulo-pagina .selo-ic{
width:42px; height:42px; border-radius:11px; flex:none; display:grid; place-items:center;
color:var(--cor,var(--ciano));
background:color-mix(in srgb,var(--cor,var(--ciano)) 16%,transparent);
border:2px solid color-mix(in srgb,var(--cor,var(--ciano)) 40%,transparent);
}
.titulo-pagina .selo-ic svg{width:23px; height:23px}
.artigo h1{font-size:clamp(28px,3.4vw,36px); font-weight:800; line-height:1.1}
.lead{font-size:16.5px; color:var(--texto-2); margin:0 0 22px; max-width:66ch; line-height:1.6}
.artigo h2{
font-size:22px; font-weight:800; margin:38px 0 12px; padding-top:4px;
scroll-margin-top:calc(var(--topo) + 16px);
display:flex; align-items:center; gap:10px;
}
.artigo h2::before{
content:""; width:5px; height:20px; border-radius:3px; flex:none;
background:var(--cor,var(--ciano));
}
.artigo h3{font-size:17px; font-weight:700; margin:24px 0 6px; scroll-margin-top:calc(var(--topo) + 16px)}
.artigo p{margin:0 0 14px; max-width:68ch}
.artigo ul:not([class]), .artigo ol:not([class]){margin:0 0 16px; padding-left:22px; max-width:68ch}
.artigo li{margin:4px 0}
.artigo b, .artigo strong{color:var(--texto); font-weight:600}
kbd.tecla{
display:inline-block; font-family:var(--mono); font-size:13px; font-weight:600; line-height:1;
padding:4px 8px 5px; border-radius:7px; color:var(--texto);
background:var(--alto); border:1px solid var(--borda-forte); box-shadow:0 2px 0 var(--borda-forte);
vertical-align:1px;
}
.passos{list-style:none; margin:14px 0 22px; padding:0; counter-reset:passo; display:flex; flex-direction:column; gap:14px}
.passos > li{
counter-increment:passo; display:grid; grid-template-columns:30px minmax(0,1fr); gap:14px; align-items:start;
}
.passos > li::before{
content:counter(passo);
width:30px; height:30px; border-radius:50%; display:grid; place-items:center; margin-top:1px;
font-family:var(--serif); font-size:16px; font-weight:800; line-height:1;
color:var(--cor,var(--ciano)); background:color-mix(in srgb,var(--cor,var(--ciano)) 15%,transparent);
}
.passos > li > div > b{display:block; font-weight:600; font-size:16px; margin:3px 0 2px}
.passos p{margin:0; color:var(--texto-2); font-size:15px}
.passos p + p{margin-top:6px}
.passos.tutorial > li{
grid-template-columns:44px minmax(0,1fr); gap:16px; padding:16px 18px; border-radius:var(--raio);
background:var(--painel); border:1px solid var(--borda);
}
.passos.tutorial > li::before{
width:44px; height:44px; border-radius:12px; font-size:22px; margin:0;
color:#241A00; background:var(--ouro); border:2px solid var(--tinta); box-shadow:0 3px 0 var(--tinta);
}
.passos.tutorial > li > div > b{font-family:var(--serif); font-size:18px; font-weight:700}
.aviso{
--ac:var(--ciano);
display:grid; grid-template-columns:22px minmax(0,1fr); gap:10px; align-items:start;
margin:16px 0; padding:10px 14px; border-radius:10px;
background:color-mix(in srgb,var(--ac) 7%,transparent);
border-left:3px solid var(--ac);
}
.aviso .aviso-ic{color:var(--ac); width:22px; height:22px; display:grid; place-items:center; margin-top:1px}
.aviso .aviso-ic svg{width:18px; height:18px}
.aviso p{margin:0; font-size:15px; max-width:none}
.aviso p + p{margin-top:5px}
.aviso b:first-child{color:var(--ac)}
.aviso.atencao{--ac:#F07818}
.aviso.shiny{--ac:var(--ouro)}
.aviso.ok{--ac:#0AE85C}
.regras{list-style:none; margin:10px 0 20px; padding:0; display:grid; gap:6px 24px; grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.regras li{display:flex; gap:10px; align-items:flex-start; margin:0; font-size:15px; line-height:1.45}
.regras li::before{
content:"→"; flex:none; width:18px; height:18px; margin-top:2px; border-radius:5px; display:grid; place-items:center;
font-size:12px; font-weight:700; line-height:1; color:var(--cor,var(--ciano)); background:color-mix(in srgb,var(--cor,var(--ciano)) 14%,transparent);
}
.emoji-gif{display:inline-grid; place-items:center; width:56px; height:48px}
.emoji-gif img{display:block; image-rendering:pixelated}
.tabela{
margin:16px 0 10px; border-radius:var(--raio); overflow-x:auto;
border:1px solid var(--borda); background:var(--painel);
}
table.dados{width:100%; border-collapse:collapse; font-size:14.5px}
table.dados caption{
text-align:left; padding:14px 16px 12px; font-family:var(--serif); font-size:17px; font-weight:700;
border-bottom:1px solid var(--borda);
}
table.dados caption span{display:block; font-family:var(--sans); font-size:13px; font-weight:400; color:var(--texto-3); margin-top:1px}
table.dados th{
text-align:left; font-family:var(--mono); font-size:10.5px; font-weight:600; letter-spacing:.1em;
text-transform:uppercase; color:var(--texto-3); padding:10px 16px; white-space:nowrap;
border-bottom:1px solid var(--borda); background:color-mix(in srgb,var(--alto) 55%,transparent);
}
table.dados td{padding:13px 16px; border-bottom:1px solid var(--borda); vertical-align:middle}
table.dados tbody tr:last-child td{border-bottom:0}
table.dados tbody tr{transition:background .12s}
table.dados tbody tr:hover{background:color-mix(in srgb,var(--cor,var(--ciano)) 7%,transparent)}
table.dados .num{font-family:var(--mono); font-variant-numeric:tabular-nums; white-space:nowrap}
table.dados .forte{font-weight:600; color:var(--texto)}
.nome-isca{font-family:var(--serif); font-size:16px; font-weight:700; white-space:nowrap}
.skill{
display:inline-block; min-width:38px; text-align:center; font-family:var(--mono); font-weight:600; font-size:13.5px;
padding:3px 8px; border-radius:7px; color:var(--ciano); background:color-mix(in srgb,var(--ciano) 14%,transparent);
}
.preco{font-family:var(--mono); font-weight:600; color:var(--ouro); white-space:nowrap}
.faixas{display:flex; flex-direction:column; gap:3px; font-size:13px; color:var(--texto-2); white-space:nowrap}
.faixas span b{font-family:var(--mono); font-weight:600; color:var(--texto)}
.nota-tabela{font-size:13.5px; color:var(--texto-3); margin:8px 2px 0}
.pokes{display:flex; flex-wrap:wrap; gap:8px}
.poke{
position:relative; display:flex; flex-direction:column; align-items:center; gap:2px;
width:64px; padding:6px 4px 5px; border-radius:11px;
background:var(--alto); border:1px solid transparent;
transition:transform .16s ease, border-color .16s, background .16s;
}
.poke img{width:44px; height:44px; object-fit:contain; image-rendering:auto; transition:transform .2s ease}
.poke span{font-size:11px; line-height:1.15; color:var(--texto-2); text-align:center; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.poke:hover{transform:translateY(-3px); border-color:color-mix(in srgb,var(--cor,var(--ciano)) 55%,transparent); background:var(--painel)}
.poke:hover img{transform:scale(1.14)}
.poke:hover span{color:var(--texto)}
.poke[data-shiny]::after{
content:"✦"; position:absolute; top:-6px; right:-6px; width:18px; height:18px; border-radius:50%;
display:grid; place-items:center; font-size:10px; font-weight:700;
color:#241A00; background:var(--ouro); border:2px solid var(--tinta);
}
.poke .qtd{
position:absolute; top:3px; left:4px; font-family:var(--mono); font-size:9.5px; font-weight:600;
color:var(--texto-3);
}
.proximos{display:grid; gap:12px; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); margin:16px 0}
.indice{position:sticky; top:calc(var(--topo) + 28px); align-self:start; font-size:13.5px}
.indice h4{
font-family:var(--mono); font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
color:var(--texto-3); margin:0 0 10px;
}
.indice a{
display:block; padding:5px 0 5px 13px; color:var(--texto-3); border-left:2px solid var(--borda);
transition:color .13s, border-color .13s;
}
.indice a:hover{color:var(--texto); text-decoration:none}
.indice a.ativo{color:var(--ciano); border-left-color:var(--ciano); font-weight:600}
.em-breve{max-width:none}
.em-breve-caixa{
margin:30px auto 0; max-width:520px; text-align:center; padding:44px 30px;
border-radius:20px; background:var(--painel); border:1px solid var(--borda);
}
.em-breve-ic{
width:76px; height:76px; margin:0 auto 18px; border-radius:20px; display:grid; place-items:center;
color:var(--cor); background:color-mix(in srgb,var(--cor) 16%,transparent);
}
.em-breve-ic svg{width:40px; height:40px}
.em-breve-caixa h1{font-size:34px; margin-bottom:8px}
.em-breve-caixa p{color:var(--texto-2); margin:0 auto 22px; max-width:none}
@media (max-width:1180px){
.pagina{grid-template-columns:minmax(0,1fr)}
.indice{display:none}
}
@media (max-width:900px){
.pagina{padding:26px 22px 52px}
}
@media (max-width:680px){
.pagina{padding:22px 16px 48px}
.artigo h2{font-size:23px; margin-top:38px}
.lead{font-size:16.5px}
.passos > li{grid-template-columns:36px minmax(0,1fr); gap:12px; padding:14px}
.passos > li::before{width:36px; height:36px; font-size:18px}
table.dados thead{display:none}
table.dados, table.dados tbody, table.dados tr, table.dados td{display:block; width:100%}
table.dados tr{padding:12px 14px; border-bottom:1px solid var(--borda)}
table.dados tbody tr:last-child{border-bottom:0}
table.dados td{border:0; padding:5px 0; display:grid; grid-template-columns:96px minmax(0,1fr); gap:10px; align-items:center}
table.dados td::before{
content:attr(data-rotulo); font-family:var(--mono); font-size:10px; font-weight:600;
letter-spacing:.1em; text-transform:uppercase; color:var(--texto-3);
}
table.dados td.cabeca{grid-template-columns:minmax(0,1fr); padding-bottom:8px}
table.dados td.cabeca::before{display:none}
}
.res .ic svg{width:16px; height:16px}
.res .breve{
font-style:normal; font-family:var(--mono); font-size:9.5px; font-weight:600; letter-spacing:.06em;
text-transform:uppercase; color:var(--texto-3); background:var(--alto); border-radius:4px;
padding:1px 5px; margin-left:6px; vertical-align:2px;
}
.atalho .emoji svg{width:26px; height:26px}
.atalho .emoji{color:var(--cor,var(--ciano))}
.lat-link .ico svg{width:15px; height:15px}
.lat-link .ico{color:var(--cor,var(--texto-3))}
.poke .qtd{position:static; font-family:var(--mono); font-size:10px; font-weight:600; color:var(--ciano); line-height:1.2}
.poke{width:72px}
@media (max-width:680px){
table.dados td > *{justify-self:start}
}
.degraus{display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; margin:18px 0 8px}
.degrau{
display:flex; flex-direction:column; align-items:center; gap:4px; padding:10px 4px 8px;
border-top:3px solid var(--tc); border-radius:4px 4px 8px 8px;
background:color-mix(in srgb,var(--tc) 6%,transparent);
}
.degrau .tier{font-family:var(--serif); font-weight:800; font-size:20px; line-height:1; color:var(--tc)}
.degrau img{width:48px; height:48px; object-fit:contain; transition:transform .2s ease}
.degrau:hover img{transform:scale(1.14) translateY(-2px)}
.degrau span{font-size:11.5px; color:var(--texto-2); text-align:center; line-height:1.2}
.escala-legenda{display:flex; justify-content:space-between; font-size:12.5px; color:var(--texto-3); margin:0 2px 18px}
.selo-tier{
display:inline-grid; place-items:center; min-width:30px; height:24px; padding:0 7px; border-radius:6px;
font-family:var(--serif); font-weight:800; font-size:14px; line-height:1;
color:var(--tc,var(--texto)); background:color-mix(in srgb,var(--tc,var(--texto)) 14%,transparent);
}
.cadeia{display:flex; flex-wrap:wrap; align-items:center; gap:6px 4px; margin:14px 0 18px}
.elo{display:flex; flex-direction:column; align-items:center; gap:3px; width:96px}
.elo img{width:72px; height:72px; object-fit:contain; transition:transform .2s ease}
.elo:hover img{transform:scale(1.1)}
.elo b{font-size:13px; font-weight:600; text-align:center; line-height:1.2}
.elo small{font-size:11.5px; color:var(--texto-3)}
.elo.shiny b{color:var(--ouro)}
.seta-evo{
display:flex; flex-direction:column; align-items:center; gap:3px; min-width:110px; max-width:150px;
color:var(--texto-3); font-size:11.5px; text-align:center; line-height:1.3;
}
.seta-evo svg{width:22px; height:22px; color:var(--cor,var(--ciano))}
.seta-evo b{color:var(--texto-2); font-weight:600}
@media (max-width:680px){
.degraus{grid-template-columns:repeat(4,minmax(0,1fr))}
.elo{width:78px}
.elo img{width:58px; height:58px}
.seta-evo{min-width:84px}
}
.artigo p.escala-legenda{max-width:none}
.poke{width:80px}
.item{display:inline-flex; align-items:center; gap:7px; vertical-align:middle}
.item img{width:32px; height:32px; object-fit:contain; image-rendering:pixelated; flex:none}
.item b{font-family:var(--serif); font-size:16px; font-weight:700; white-space:nowrap}
.item-col{display:flex; flex-direction:column; align-items:center; gap:2px; width:78px}
.item-col img{width:32px; height:32px; object-fit:contain; image-rendering:pixelated}
.item-col span{font-size:11.5px; color:var(--texto-2); text-align:center; line-height:1.2}
.itens-grade{display:grid; grid-template-columns:repeat(auto-fill,minmax(132px,1fr)); gap:8px; margin:14px 0 18px}
.itens-grade .item{
padding:8px 10px; border-radius:10px; background:var(--alto);
border:1px solid transparent; transition:border-color .16s, background .16s;
}
.itens-grade .item:hover{border-color:color-mix(in srgb,var(--cor,var(--ciano)) 55%,transparent); background:var(--painel)}
.itens-grade .item b{font-size:14px; white-space:normal}
.seta-evo img{width:32px; height:32px; object-fit:contain; image-rendering:pixelated}
.seta-evo .par{display:flex; align-items:center; justify-content:center; gap:3px}
.vira{display:flex; align-items:center; gap:6px; flex-wrap:nowrap}
.vira + .vira{margin-top:8px}
.vira .obs{font-size:12.5px; color:var(--texto-3); white-space:nowrap; margin-left:4px}
.vira .obs b{color:var(--texto-2); font-weight:600}
.tabela.justa{display:inline-block; max-width:100%}
.tabela.justa table.dados{width:auto; min-width:min(420px,100%)}
.tabela.justa table.dados th:last-child,
.tabela.justa table.dados td:last-child{padding-right:28px}
@media (max-width:680px){
.tabela.justa{display:block}
.tabela.justa table.dados{width:100%}
}
.vira .lado{display:flex; align-items:center; gap:7px; min-width:0}
.vira img{width:40px; height:40px; object-fit:contain; flex:none}
.vira .nome{font-size:14.5px; line-height:1.2; white-space:nowrap}
.vira .seta{
flex:none; display:grid; place-items:center; width:20px;
color:var(--cor,var(--ciano)); opacity:.75;
}
.vira .seta svg{width:18px; height:18px}
.vira .nome.alvo{font-weight:600; color:var(--texto)}
@media (max-width:680px){
.vira{flex-wrap:wrap; gap:4px}
.vira img{width:34px; height:34px}
.vira .nome{font-size:13.5px}
}
.sumario{
margin:0 0 30px; border-radius:14px; background:var(--painel);
border:1px solid var(--borda); border-left:3px solid var(--cor,var(--ciano));
padding:16px 20px 18px; max-width:640px;
}
.sumario h2{
font-family:var(--mono); font-size:10.5px; font-weight:600; letter-spacing:.14em;
text-transform:uppercase; color:var(--texto-3); margin:0 0 10px; padding:0; border:0;
}
.sumario ol{list-style:none; margin:0; padding:0; counter-reset:s1}
.sumario > ol > li{counter-increment:s1; margin:0}
.sumario ol ol{counter-reset:s2; margin:2px 0 4px}
.sumario ol ol li{counter-increment:s2}
.sumario a{
display:flex; gap:9px; align-items:baseline; padding:4px 0;
color:var(--texto); font-weight:600; font-size:15px; line-height:1.35;
}
.sumario a::before{
content:counter(s1); font-family:var(--mono); font-size:12px; font-weight:600;
color:var(--cor,var(--ciano)); min-width:16px; flex:none;
}
.sumario ol ol a{padding:3px 0 3px 22px; font-weight:500; font-size:14px; color:var(--texto-2)}
.sumario ol ol a::before{content:counter(s1) "." counter(s2); color:var(--texto-3); min-width:24px}
.sumario a:hover{color:var(--cor,var(--ciano)); text-decoration:none}
.sumario a:hover::before{color:var(--cor,var(--ciano))}
@media (max-width:680px){
.sumario{padding:14px 16px 16px; margin-bottom:24px}
.sumario a{font-size:14.5px}
}
.item img.ic-podex{width:42px; height:38px; image-rendering:auto}
.item img.ic-insignia{width:20px; height:20px; object-fit:none}
.itens-grade .item img.ic-podex{width:38px; height:34px}
.rar-ic{width:44px; height:38px; object-fit:contain; vertical-align:middle}
.item img.ic-sinal{width:21px; height:21px; image-rendering:auto}
.receitas{display:flex; flex-direction:column; gap:8px; margin:14px 0 22px}
.receita{border:1px solid var(--borda); border-radius:var(--raio); background:var(--painel); overflow:hidden}
.receita > summary{
list-style:none; cursor:pointer; user-select:none;
display:flex; align-items:center; gap:12px; padding:8px 16px 8px 12px;
transition:background .12s;
}
.receita > summary::-webkit-details-marker{display:none}
.receita > summary:hover{background:color-mix(in srgb,var(--cor,var(--ciano)) 7%,transparent)}
.receita > summary img.ic-podex{width:38px; height:34px; object-fit:contain; flex:none}
.receita > summary b{font-family:var(--serif); font-size:16.5px; font-weight:700; line-height:1.25}
.receita > summary .rc-max{margin-left:auto; font-family:var(--mono); font-size:12.5px; color:var(--texto-2); white-space:nowrap}
.receita > summary::after{
content:""; flex:none; width:8px; height:8px; margin:0 4px 4px 2px;
border-right:2px solid var(--texto-3); border-bottom:2px solid var(--texto-3);
transform:rotate(45deg); transition:transform .16s;
}
.receita[open] > summary::after{transform:rotate(-135deg); margin-bottom:-4px}
.receita[open] > summary{border-bottom:1px solid var(--borda)}
.receita .tabela{margin:0; border:0; border-radius:0; background:transparent}
.receita table.dados td{vertical-align:top}
.receita table.dados tr.rc-ini td{border-top:2px solid var(--borda-forte)}
.receita table.dados tbody tr.rc-ini:first-child td{border-top:0}
.rc-nv{display:inline-flex; align-items:center; gap:8px; white-space:nowrap}
.rc-nv b{font-family:var(--mono); font-size:14px}
.ings{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:8px 14px}
.ing{display:flex; align-items:center; gap:8px; min-width:0}
.ing img{width:32px; height:32px; object-fit:contain; image-rendering:pixelated; flex:none}
.ing-txt{display:flex; flex-direction:column; min-width:0; line-height:1.25}
.ing-txt b{font-size:14px; font-weight:600; color:var(--texto)}
.ing-txt .qt{font-family:var(--mono); font-size:12.5px; color:var(--cor,var(--ciano)); margin-right:6px}
.ing-txt small{font-size:12px; color:var(--texto-3)}
@media (max-width:680px){
.receita > summary{padding:8px 12px 8px 10px; gap:10px}
.receita > summary b{font-size:15.5px}
.ings{grid-template-columns:minmax(0,1fr)}
}
.pedido{display:flex; flex-direction:column; gap:4px; min-width:0}
.pedido .alvo{display:flex; align-items:center; gap:8px; min-width:0}
.pedido .alvo img{width:38px; height:38px; object-fit:contain; flex:none}
.pedido .qt{
font-family:var(--mono); font-size:13px; font-weight:600; color:var(--cor,var(--ciano));
flex:none; min-width:42px; text-align:right;
}
.pedido .esp{font-size:14.5px; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.premio{display:flex; flex-direction:column; gap:3px; align-items:flex-start}
.premio .xp{font-family:var(--mono); font-size:14px; font-weight:600; color:var(--texto); white-space:nowrap}
.premio .xp small{font-family:var(--sans); font-size:11.5px; font-weight:400; color:var(--texto-3); margin-left:3px}
.premio .extra{
display:inline-flex; align-items:center; gap:6px;
font-size:13px; color:var(--texto-2); white-space:nowrap;
}
.premio .extra img{width:32px; height:32px; object-fit:contain; image-rendering:pixelated; flex:none}
.premio .regional{
font-family:var(--mono); font-size:12px; color:var(--texto-3); white-space:nowrap;
}
.nivel{
display:inline-grid; place-items:center; min-width:38px; height:26px; padding:0 8px; border-radius:7px;
font-family:var(--serif); font-weight:800; font-size:15px; line-height:1;
color:var(--cor,var(--ciano)); background:color-mix(in srgb,var(--cor,var(--ciano)) 13%,transparent);
}
.nivel.reg{
color:var(--ouro); background:color-mix(in srgb,var(--ouro) 13%,transparent);
font-size:13px; letter-spacing:.02em;
}
.nivel.reg small{font-family:var(--mono); font-size:9px; font-weight:600; display:block; letter-spacing:.06em}
.npc{display:flex; flex-direction:column; gap:0; min-width:0}
.npc b{font-family:var(--serif); font-size:16px; font-weight:700; line-height:1.25; white-space:nowrap}
.npc small{font-size:11.5px; color:var(--texto-3); line-height:1.3}
.regiao{
display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;
margin:30px 0 4px; padding-bottom:10px;
border-bottom:2px solid color-mix(in srgb,var(--rc,var(--cor)) 45%,transparent);
}
.regiao h2{margin:0; font-size:26px; color:var(--rc,var(--texto))}
.regiao .conta{
font-family:var(--mono); font-size:11.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
color:var(--texto-3);
}
.regiao p{margin:0; font-size:14px; color:var(--texto-2); flex-basis:100%}
.numeros{display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; margin:18px 0 22px}
.numero{
padding:14px 16px; border-radius:var(--raio);
background:var(--painel); border:1px solid var(--borda);
border-top:3px solid color-mix(in srgb,var(--nc,var(--cor)) 70%,transparent);
}
.numero b{
display:block; font-family:var(--serif); font-size:30px; font-weight:800; line-height:1;
color:var(--nc,var(--cor));
}
.numero span{display:block; font-size:12.5px; color:var(--texto-2); margin-top:3px; line-height:1.3}
@media (max-width:680px){
.npc b{font-size:17px}
.pedido .esp{white-space:normal}
.pedido .qt{min-width:38px}
.regiao h2{font-size:22px}
.regiao{margin-top:26px}
.numeros{grid-template-columns:repeat(2,minmax(0,1fr))}
.numero b{font-size:25px}
}
.janela-jogo{
width:100%; max-width:450px; margin:20px auto 6px;
background:#111312; border:1px solid #2b2f2d; border-radius:10px;
padding:16px 14px 22px; color:#f5f5f5;
font-family:var(--sans); box-shadow:0 10px 30px #0008;
}
.janela-jogo .jg-topo{
display:flex; align-items:center; justify-content:space-between;
font-size:12.5px; color:#cfd4d1; padding:0 2px 10px;
border-bottom:1px solid #ffffff12; margin-bottom:12px;
}
.janela-jogo .jg-topo span:last-child{color:#7d8480; font-weight:700}
.janela-jogo .jg-banner{display:block; width:100%; border-radius:4px}
.janela-jogo .jg-marca{
text-align:center; font-family:var(--serif); font-weight:800;
font-size:27px; line-height:1.1; color:#ffdf5f; margin:8px 0 6px;
}
.janela-jogo .jg-linha{height:1px; background:#ffdf5f66; margin:0 34px}
.janela-jogo .jg-linha.branca{background:#ffffff40; margin-top:10px}
.janela-jogo .jg-intro{
text-align:center; font-size:12.5px; line-height:1.5;
color:#e8e8e8; margin:9px 22px 2px;
}
.janela-jogo .jg-bonus{
text-align:center; font-family:var(--serif); font-weight:800;
font-size:20px; color:#fff; margin:11px 0 0;
}
.janela-jogo .jg-rotulo{text-align:center; font-size:12px; color:#c7ccc9; margin:2px 0 4px}
.janela-jogo .jg-rotulo.forte{
font-family:var(--serif); font-weight:800; font-size:19px; color:#fff; margin-top:11px;
}
.janela-jogo .jg-barra{
position:relative; height:21px; border-radius:11px;
background:#000000a6; border:1px solid #ffffff1f; overflow:hidden;
}
.janela-jogo .jg-barra i{
position:absolute; inset:0 auto 0 0; display:block; border-radius:11px;
}
.janela-jogo .jg-barra.amarela i{background:linear-gradient(#ffd75e,#e0a81b)}
.janela-jogo .jg-barra.verde i{background:linear-gradient(#5fe07a,#22a844)}
.janela-jogo .jg-barra b{
position:relative; display:block; text-align:center; line-height:21px;
font-size:12.5px; font-weight:600; color:#fff; text-shadow:0 1px 2px #000a;
}
.janela-jogo .jg-tempo{text-align:center; font-size:12px; color:#c7ccc9; margin-top:9px}
.janela-jogo .jg-acesso{text-align:center; font-size:12.5px; color:#ffd86b; margin:6px 0 2px}
.janela-jogo .jg-acesso.ok{color:#7CFF8A}
.janela-jogo .jg-contrib{
font-family:var(--serif); font-weight:800; font-size:16px;
text-align:center; color:#ffd641; margin:10px 0 6px;
}
.janela-jogo .jg-lista{
background:#00000059; border:1px solid #ffffff14; border-radius:8px;
padding:7px; display:flex; flex-direction:column; gap:3px;
}
.janela-jogo .jg-lista span{
display:grid; grid-template-columns:34px 1fr auto; align-items:center;
background:#ffffff0d; border-radius:5px; padding:6px 10px; font-size:12.5px;
}
.janela-jogo .jg-lista span i{font-style:normal; color:#ffd641; font-weight:700}
.janela-jogo .jg-lista span b{font-weight:500; color:#f5f5f5}
.janela-jogo .jg-lista span em{font-style:normal; color:#7CFF8A; font-weight:600}
.janela-jogo .jg-botao{
display:block; width:132px; margin:16px auto 0; padding:9px 0;
text-align:center; font-size:14px; font-weight:600; color:#fff;
background:linear-gradient(#18c268,#07a34f); border-radius:14px;
}
.janela-legenda{
text-align:center; font-size:13px; color:var(--texto-2);
margin:0 auto 22px; max-width:450px;
}
.janela-jogo .jg-doar{max-width:275px; margin:0 auto}
.janela-jogo .jg-campo{
background:#00000073; border:1px solid #ffffff26; border-radius:6px;
padding:9px 11px; font-family:var(--mono); font-size:14px; color:#fff; margin:10px 0;
}
.janela-jogo .jg-saldo{display:flex; justify-content:space-between; font-size:12.5px; color:#c7ccc9; margin-top:5px}
.janela-jogo .jg-saldo b{color:#7CFF8A; font-weight:600}
.janela-jogo .jg-campo .jg-max{float:right; font-family:var(--sans); font-size:12px; font-weight:700; color:#ffd641}
.janela-jogo .jg-aviso{font-size:12px; line-height:1.45; color:#ffb020; margin:8px 0 0}
.janela-jogo.larga{max-width:720px}
.janela-jogo .jg-colunas{display:grid; grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); gap:12px; align-items:start}
.janela-jogo .jg-coluna{display:flex; flex-direction:column; gap:10px; min-width:0}
.janela-jogo .jg-painel{background:#00000059; border:1px solid #ffffff14; border-radius:8px; padding:10px 11px}
.janela-jogo .jg-faixa{text-align:center; font-size:12px; color:#ffb020; margin:6px 0 0}
.janela-jogo .jg-cab{display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin:10px 0 2px}
.janela-jogo .jg-cab b{font-family:var(--serif); font-weight:800; font-size:18px; color:#fff}
.janela-jogo .jg-cab small{font-size:12px; color:#c7ccc9; white-space:nowrap}
.janela-jogo .jg-painel .jg-rotulo{display:flex; justify-content:space-between; gap:8px; text-align:left; margin:8px 0 4px}
.janela-jogo .jg-rodape{display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:12px; flex-wrap:wrap}
.janela-jogo .jg-rodape .jg-acesso{margin:0; text-align:left}
.janela-jogo .jg-rodape .jg-botao{display:inline-block; width:auto; margin:0; padding:7px 24px; font-size:13px}
.janela-jogo .jg-titulo{display:flex; justify-content:space-between; align-items:baseline; gap:8px}
.janela-jogo .jg-titulo b{font-family:var(--serif); font-weight:800; font-size:15px; color:#ffd641}
.janela-jogo .jg-titulo small{font-size:12px; color:#c7ccc9}
.janela-jogo .jg-votos{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:8px}
.janela-jogo .jg-voto{display:flex; align-items:center; gap:8px; min-width:0; background:#ffffff0d; border:1px solid #ffffff14; border-radius:6px; padding:6px 8px}
.janela-jogo .jg-voto.sel{border-color:#ffd641}
.janela-jogo .jg-voto img{width:40px; height:40px; flex:none}
.janela-jogo .jg-voto b{display:block; font-size:13px; font-weight:600; color:#fff}
.janela-jogo .jg-voto small{display:block; font-size:11.5px; color:#9aa1ad}
.janela-jogo .jg-abas{display:flex; gap:4px; margin-bottom:6px}
.janela-jogo .jg-abas span{flex:1; text-align:center; font-size:12px; padding:5px 0; border-radius:5px; background:#ffffff0d; color:#c7ccc9}
.janela-jogo .jg-abas span.ativa{background:#ffd64124; color:#ffd641; font-weight:600}
.janela-jogo .jg-coluna .jg-contrib{margin-top:0}
@media (max-width:680px){
.janela-jogo .jg-colunas{grid-template-columns:minmax(0,1fr)}
.janela-jogo .jg-votos{grid-template-columns:minmax(0,1fr)}
.janela-jogo{padding:13px 11px 18px}
.janela-jogo .jg-marca{font-size:22px}
.janela-jogo .jg-intro{margin-left:6px; margin-right:6px}
.janela-jogo .jg-linha{margin:0 14px}
}
.ponte{
display:grid; grid-template-columns:44px minmax(0,1fr) auto; gap:14px; align-items:center;
margin:22px 0; padding:14px 16px; border-radius:12px; text-decoration:none; color:inherit;
background:color-mix(in srgb,var(--pc,var(--cor,var(--ciano))) 9%,transparent);
border:1px solid color-mix(in srgb,var(--pc,var(--cor,var(--ciano))) 32%,transparent);
transition:background .15s, border-color .15s, transform .15s;
}
.ponte:hover{
text-decoration:none; transform:translateY(-1px);
background:color-mix(in srgb,var(--pc,var(--cor,var(--ciano))) 15%,transparent);
border-color:color-mix(in srgb,var(--pc,var(--cor,var(--ciano))) 55%,transparent);
}
.ponte:focus-visible{outline:2px solid var(--pc,var(--ciano)); outline-offset:2px}
.ponte-ic{
width:44px; height:44px; border-radius:11px; display:grid; place-items:center; flex:none;
color:var(--pc,var(--cor,var(--ciano)));
background:color-mix(in srgb,var(--pc,var(--cor,var(--ciano))) 20%,transparent);
}
.ponte-ic svg{width:23px; height:23px}
.ponte-txt{min-width:0}
.ponte-txt b{
display:block; font-family:var(--serif); font-weight:700; font-size:17px;
line-height:1.25; color:var(--texto);
}
.ponte-txt span{display:block; font-size:13.5px; color:var(--texto-2); line-height:1.45}
.ponte-seta{color:var(--pc,var(--cor,var(--ciano))); font-size:19px; font-weight:700; line-height:1; flex:none}
@media (max-width:680px){
.ponte{grid-template-columns:38px minmax(0,1fr); gap:11px; padding:13px 14px}
.ponte-ic{width:38px; height:38px; border-radius:10px}
.ponte-ic svg{width:20px; height:20px}
.ponte-txt b{font-size:16px}
.ponte-seta{display:none}
}
td .obs{display:block; font-size:12.5px; color:var(--texto-3); line-height:1.4; margin-top:2px}
.cmd{
display:inline-block; font-family:var(--mono); font-size:13.5px; font-weight:600;
line-height:1.3; white-space:nowrap; color:var(--texto);
padding:3px 8px; border-radius:6px;
border:1px solid color-mix(in srgb,var(--cor,var(--ciano)) 32%,var(--borda));
background:color-mix(in srgb,var(--cor,var(--ciano)) 9%,transparent);
}
.cmd .arg{font-weight:400; color:var(--texto-3)}
td .cmd + .cmd{margin-left:5px}
.uso{display:block; font-family:var(--mono); font-size:12px; color:var(--texto-3); margin-top:5px}
.exige{
display:inline-block; font-family:var(--mono); font-size:10.5px; font-weight:700;
letter-spacing:.08em; text-transform:uppercase; white-space:nowrap;
padding:2px 7px; border-radius:999px; margin-top:6px;
color:var(--ouro); background:color-mix(in srgb,var(--ouro) 16%,transparent);
border:1px solid color-mix(in srgb,var(--ouro) 42%,transparent);
}
.secreta{
display:inline-block; font-family:var(--mono); font-size:10.5px; font-weight:700;
letter-spacing:.08em; text-transform:uppercase; white-space:nowrap;
padding:2px 7px; border-radius:999px; margin-left:7px; vertical-align:2px;
color:var(--texto-3); background:color-mix(in srgb,var(--texto-3) 12%,transparent);
border:1px solid color-mix(in srgb,var(--texto-3) 34%,transparent);
}
.modos{display:grid; grid-template-columns:repeat(auto-fit,minmax(196px,1fr)); gap:12px; margin:18px 0 22px}
.modo{
padding:15px 17px 16px; border-radius:var(--raio);
background:var(--painel); border:1px solid var(--borda);
border-top:3px solid color-mix(in srgb,var(--mc,var(--cor)) 72%,transparent);
}
.modo .nome{
display:block; font-family:var(--mono); font-size:11px; font-weight:700;
letter-spacing:.1em; text-transform:uppercase; color:var(--mc,var(--cor));
}
.modo b{display:block; font-family:var(--serif); font-size:25px; font-weight:800; line-height:1.15; margin:5px 0 1px}
.modo .teto{display:block; font-size:13.5px; color:var(--texto-2); line-height:1.4}
.modo .fim{
display:block; margin-top:9px; padding-top:9px; border-top:1px solid var(--borda);
font-size:12.5px; color:var(--texto-3);
}
.modo .fim b{display:inline; font-family:var(--sans); font-size:12.5px; font-weight:600; color:var(--texto-2); margin:0}
.torre{display:flex; flex-direction:column; gap:7px; margin:18px 0 8px}
.piso{
display:grid; grid-template-columns:64px minmax(0,1fr); gap:16px; align-items:center;
padding:11px 16px; border-radius:var(--raio);
background:var(--painel); border:1px solid var(--borda);
border-left:3px solid color-mix(in srgb,var(--pc,var(--cor)) 65%,transparent);
}
.piso-n{
font-family:var(--serif); font-weight:800; font-size:17px; line-height:1.1;
color:var(--pc,var(--cor)); text-align:center; white-space:nowrap;
}
.piso-txt{font-size:14px; color:var(--texto-2); line-height:1.45}
.piso-txt b{color:var(--texto); font-weight:600}
.comp{display:flex; flex-wrap:wrap; align-items:center; gap:6px 13px}
.cq{display:inline-flex; align-items:center; gap:5px; white-space:nowrap}
.cq b{font-family:var(--mono); font-size:13px; font-weight:600; color:var(--texto-2)}
.cq i{font-style:normal; font-size:11.5px; color:var(--ouro); letter-spacing:.02em}
.piso.chefe{
border-left-width:3px; border-color:color-mix(in srgb,var(--pc) 42%,var(--borda));
background:color-mix(in srgb,var(--pc) 9%,var(--painel));
}
.piso.chefe .piso-txt b{font-family:var(--serif); font-size:17px; font-weight:800; color:var(--pc)}
.piso.chefe .piso-txt span{display:block; font-size:13px; color:var(--texto-2)}
.tycoon,.duelo{
margin:16px 0 22px; padding:18px 20px 16px; border-radius:var(--raio);
background:color-mix(in srgb,var(--tyc,var(--cor)) 7%,var(--painel));
border:1px solid color-mix(in srgb,var(--tyc,var(--cor)) 30%,var(--borda));
}
.tycoon-topo,.duelo-topo{display:flex; align-items:baseline; gap:11px; flex-wrap:wrap; margin-bottom:8px}
.tycoon-topo .andar,.duelo-topo .onde{
font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
color:var(--tyc,var(--cor)); padding:3px 9px; border-radius:999px;
background:color-mix(in srgb,var(--tyc,var(--cor)) 15%,transparent);
border:1px solid color-mix(in srgb,var(--tyc,var(--cor)) 40%,transparent);
}
.tycoon-topo b,.duelo-topo b{font-family:var(--serif); font-size:25px; font-weight:800; line-height:1}
.tycoon-topo .titulo,.duelo-topo .titulo{font-size:13.5px; color:var(--texto-2)}
.tycoon p,.duelo p{margin:0 0 12px; max-width:62ch}
.tycoon .pokes,.duelo .pokes{margin-bottom:2px}
.trofeus{display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr)); gap:12px; margin:18px 0 22px}
.trofeu{
display:flex; align-items:center; gap:13px; padding:12px 15px; border-radius:var(--raio);
background:var(--painel); border:1px solid var(--borda);
border-left:3px solid color-mix(in srgb,var(--fc,var(--cor)) 70%,transparent);
}
.trofeu img{width:64px; height:64px; object-fit:contain; image-rendering:pixelated; flex:none}
.trofeu b{display:block; font-size:15px; font-weight:700; line-height:1.2}
.trofeu span{display:block; font-size:13px; color:var(--texto-2); margin-top:2px}
@media (max-width:680px){
.piso{grid-template-columns:50px minmax(0,1fr); gap:11px; padding:12px 14px}
.comp{gap:6px 10px}
.tycoon-topo b,.duelo-topo b{font-size:22px}
}
.conquista{display:flex; align-items:center; gap:10px}
.conquista img{width:50px; height:50px; object-fit:contain; flex:none}
.conquista .cq-txt{display:flex; flex-direction:column; gap:3px; align-items:flex-start; min-width:0}
.conquista .cq-txt b{line-height:1.25}
.conquista .secreta{margin-left:0}
.sem-arte{
width:50px; height:50px; flex:none; border-radius:8px;
border:1px dashed var(--borda-forte); background:var(--alto);
}
.secreta-dica{
display:flex; align-items:center; gap:14px; margin:14px 0 4px;
padding:14px 16px; border:1px solid var(--borda); border-radius:var(--raio);
background:var(--alto);
}
.secreta-dica img{flex:none}
.secreta-dica p{margin:0}
@media (max-width:560px){
.secreta-dica{flex-direction:column; align-items:flex-start; gap:10px}
}
.premio .ganho{font-size:13px; color:var(--texto-2); line-height:1.45; white-space:normal}
.exigencia{font-size:13px; color:var(--texto-2); line-height:1.35}
.exigencia.livre{color:var(--texto-3)}
.ficha{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:10px; margin:6px 0 26px; padding:0}
.ficha > div{
padding:12px 15px 13px; border-radius:var(--raio); background:var(--painel);
border:1px solid var(--borda); border-top:3px solid color-mix(in srgb,var(--cor,var(--ciano)) 75%,transparent);
}
.ficha dt{
font-family:var(--mono); font-size:10.5px; font-weight:700; letter-spacing:.12em;
text-transform:uppercase; color:var(--texto-3); margin:0 0 5px;
}
.ficha dd{margin:0; display:flex; flex-direction:column; gap:3px}
.ficha dd b{font-family:var(--serif); font-size:19px; font-weight:800; line-height:1.15}
.ficha dd small{font-size:13px; color:var(--texto-2); line-height:1.35}
.lore{
margin:10px 0 18px; padding:3px 0 3px 16px; max-width:68ch;
border-left:3px solid color-mix(in srgb,var(--cor,var(--ciano)) 55%,transparent);
font-size:15.5px; line-height:1.62; font-style:italic; color:var(--texto-2);
}
p.lore{margin:10px 0 18px}
.lore p{margin:0}
.lore p + p{margin-top:8px}
.lore b{font-style:normal; font-weight:600; color:var(--texto)}
.pos{
display:inline-block; margin-left:6px; padding:0 7px; border-radius:6px; vertical-align:1px;
font-family:var(--mono); font-size:11.5px; font-weight:600; line-height:1.7; white-space:nowrap;
color:var(--texto-2); background:var(--alto); border:1px solid var(--borda);
}
.ficha .pos{margin:3px 0 0; align-self:flex-start}
.ficha dd .item b{font-size:16px}
.item img.ic-gear{width:49px; height:49px; object-fit:contain; image-rendering:auto}
.item img.ic-aba{width:35px; height:34px; object-fit:none; image-rendering:auto}
.item img.ic-honra{width:48px; height:48px; object-fit:contain; image-rendering:auto}
.item img.ic-nativo{width:auto; height:auto}
.vantagens{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin:14px 0 22px}
.vantagem{
display:flex; flex-direction:column; gap:6px; padding:14px 16px;
border:1px solid var(--borda); border-top:3px solid var(--cor); border-radius:var(--raio);
background:var(--alto); color:inherit; text-decoration:none;
}
.vantagem:hover{border-color:color-mix(in srgb,var(--cor) 55%,transparent); border-top-color:var(--cor); background:var(--painel)}
.vantagem .vt-num{font-size:11.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--cor)}
.vantagem b{font-family:var(--serif); font-size:18px; line-height:1.2}
.vantagem .vt-cond{font-size:14px; color:var(--texto-2); line-height:1.35}
.vantagem .chips{margin-top:4px}
.chips{display:flex; flex-wrap:wrap; gap:6px}
.chips > span{
font-size:12.5px; font-weight:600; padding:3px 9px; border-radius:999px; white-space:nowrap;
background:color-mix(in srgb,var(--cor) 16%,transparent); color:var(--texto);
border:1px solid color-mix(in srgb,var(--cor) 35%,transparent);
}
.chips.grande{margin:10px 0 14px}
.chips.grande > span{font-size:14.5px; padding:5px 12px}
div.vantagem:hover{border-color:var(--borda); border-top-color:var(--cor); background:var(--alto)}
.tipos{display:inline-flex; gap:4px; vertical-align:middle}
.tipos img{width:auto; height:auto; image-rendering:auto; flex:none}
.vantagens.duas{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}