/* Site do Vellor: proposta visual (prancha). Cores do kit do jogo
   (cliente/telas/kit.gd): madeira com chanfro claro em cima e escuro
   embaixo, contorno preto, pergaminho para o texto longo, ouro nos títulos.
   Fontes do jogo: MedievalSharp (títulos), Silkscreen (números),
   IBM Plex Sans (texto). */
@font-face{font-family:"MedievalSharp";src:url(fontes/MedievalSharp.ttf);font-display:swap}
@font-face{font-family:"Silkscreen";src:url(fontes/Silkscreen-Regular.ttf);font-display:swap}
@font-face{font-family:"Silkscreen";src:url(fontes/Silkscreen-Bold.ttf);font-weight:700;font-display:swap}
@font-face{font-family:"Plex";src:url(fontes/IBMPlexSans.ttf);font-display:swap}

:root{
  --noite:#0c0805; --painel:#2b2119; --cabecalho:#3a2c1e; --linha:#4a3826;
  --texto:#f0e2c0; --rotulo:#c8b890; --discreto:#a89878; --titulo:#f0d890;
  --logo:#f0c840; --ouro:#e8b820; --ouro-claro:#f8d870; --ouro-escuro:#5a3c08;
  --vida:#c0281c; --mana:#2a52c8; --ok:#8ad04a; --erro:#ff8a70;
  --pergaminho:#e8d4a8; --pergaminho-claro:#f2e4bf; --tinta:#3a2414; --tinta-fraca:#6a4a2a;
  --madeira:#5a3e24; --madeira-clara:#b08850; --madeira-escura:#2a1a0c;
  --r-comum:#c8c2b0; --r-incomum:#6ad04a; --r-raro:#5ab0e8; --r-epico:#b07ae8; --r-lendario:#f0a040;
}
*{box-sizing:border-box}
html{background:var(--noite)}
body{margin:0;color:var(--texto);font:15px/1.55 "Plex",system-ui,sans-serif;background:var(--noite)}
a{color:var(--titulo);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%}
.px{image-rendering:pixelated}
.num,.sk{font-family:"Silkscreen",monospace;letter-spacing:.02em}
h1,h2,h3,.med{font-family:"MedievalSharp",serif;font-weight:400;color:var(--titulo);margin:0}

/* Moldura de madeira (o "quadro" do HUD). */
.madeira{background:var(--painel);border:2px solid #000;box-shadow:inset 2px 2px 0 var(--madeira-clara),inset -2px -2px 0 var(--madeira-escura),inset 0 0 0 4px var(--madeira)}
.quadro{background:var(--painel);border:2px solid #000;box-shadow:inset 0 0 0 2px var(--madeira),inset 3px 3px 0 2px var(--madeira-clara),inset -3px -3px 0 2px var(--madeira-escura);padding:6px;margin-bottom:18px}
.quadro>.cab{display:flex;align-items:center;gap:10px;background:var(--cabecalho);border-bottom:2px solid #000;padding:8px 12px;margin:-2px -2px 0}
.quadro>.cab h2{font-size:21px;line-height:1.1}
.quadro>.cab .mais{margin-left:auto;font:12px "Silkscreen";color:var(--rotulo)}
.quadro>.corpo{padding:14px}
.perg{background:var(--pergaminho) linear-gradient(180deg,var(--pergaminho-claro),var(--pergaminho) 30%,#dcc394);color:var(--tinta);border:2px solid #000;box-shadow:inset 0 0 0 2px #b8986a}
.perg h1,.perg h2,.perg h3{color:var(--tinta)}
.perg a{color:#7a3a10;text-decoration:underline}

/* Botões do jogo: ouro (principal) e madeira. */
.bt{display:inline-flex;align-items:center;gap:8px;font:16px "MedievalSharp";padding:9px 18px;border:2px solid #000;cursor:pointer;color:var(--texto);background:var(--madeira);box-shadow:inset 2px 2px 0 var(--madeira-clara),inset -2px -2px 0 var(--madeira-escura);text-decoration:none!important;white-space:nowrap}
.bt.ouro{background:#b8861c;color:#2a1606;box-shadow:inset 2px 2px 0 #f8d870,inset -2px -2px 0 #5a3c08}
.bt.ouro:hover{background:#c8961c}
.bt.peq{font-size:14px;padding:5px 12px}
.bt.ativo{background:#5a3a10;color:#f0d890;box-shadow:inset 2px 2px 0 #3a2408,inset -2px -2px 0 #f0d060}

/* Topo */
.topo-faixa{background:#000;border-bottom:1px solid #2a1a0c;font:12px "Silkscreen";color:var(--rotulo)}
.topo-faixa .in{max-width:1180px;margin:0 auto;padding:6px 16px;display:flex;gap:16px;align-items:center}
.topo-faixa .on{color:var(--ok)}
.topo-faixa .dir{margin-left:auto;display:flex;gap:14px}
.cabecalho{position:relative;background:#120c07 url(img/mapa_fundo.png) center/cover;border-bottom:2px solid #000;overflow:hidden}
.cabecalho::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,8,5,.92),rgba(12,8,5,.55) 50%,rgba(12,8,5,.92))}
.cabecalho .in{position:relative;max-width:1180px;margin:0 auto;padding:18px 16px;display:flex;align-items:center;gap:18px}
.marca{display:flex;align-items:center;gap:14px;color:inherit;text-decoration:none!important}
.marca svg{width:60px;height:60px;filter:drop-shadow(3px 3px 0 #000)}
.palavra{font:44px/1 "MedievalSharp";letter-spacing:.06em;background:linear-gradient(180deg,#fff3c0 0%,#f8d870 35%,#e8b820 60%,#a8740c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(2px 0 0 #000) drop-shadow(-2px 0 0 #000) drop-shadow(0 2px 0 #000) drop-shadow(0 -2px 0 #000) drop-shadow(3px 4px 0 #2a1606)}
.lema{font:11px "Silkscreen";color:var(--rotulo);letter-spacing:.12em;margin-top:6px}
.cabecalho .acoes{margin-left:auto;display:flex;gap:10px}

.menu{background:var(--madeira);border-top:2px solid var(--madeira-clara);border-bottom:2px solid #000;box-shadow:inset 0 -2px 0 var(--madeira-escura);position:sticky;top:0;z-index:5}
.menu .in{max-width:1180px;margin:0 auto;padding:0 10px;display:flex;align-items:stretch}
.menu a{font:17px "MedievalSharp";color:var(--texto);padding:11px 14px;border-right:1px solid var(--madeira-escura);box-shadow:1px 0 0 var(--madeira-clara);text-decoration:none!important}
.menu a:hover{background:#6a4a2c}
.menu a.ativo{background:#3a2814;color:var(--titulo);box-shadow:inset 0 3px 0 var(--ouro)}
.menu .busca{margin-left:auto;display:flex;align-items:center;padding:0 6px}
.menu .busca input{font:14px "Plex";background:#1a110a;color:var(--texto);border:2px solid #000;box-shadow:inset 1px 1px 0 #000;padding:6px 10px;width:200px}
.menu .hamb{display:none}

/* Corpo */
.pagina{max-width:1180px;margin:0 auto;padding:22px 16px 30px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px}
.pagina.cheia{grid-template-columns:minmax(0,1fr)}
.migalha{font:12px "Silkscreen";color:var(--discreto);margin:0 0 12px}
.migalha a{color:var(--rotulo)}
.titulo-pag{display:flex;align-items:end;gap:14px;margin:0 0 16px}
.titulo-pag h1{font-size:34px;line-height:1}
.titulo-pag p{margin:0;color:var(--rotulo)}

/* Lateral */
.lado .quadro .corpo{padding:12px}
.baixar{text-align:center}
.baixar .bt{width:100%;justify-content:center;font-size:19px;padding:12px}
.baixar small{display:block;color:var(--discreto);margin-top:8px;font-size:12px}
.relogio{display:flex;gap:6px;justify-content:center;margin:8px 0}
.relogio span{font:22px "Silkscreen";background:#000;color:var(--ouro-claro);padding:4px 8px;border:2px solid var(--madeira)}
.lista-mini{list-style:none;margin:0;padding:0}
.lista-mini li{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--linha)}
.lista-mini li:last-child{border:0}
.lista-mini .pos{font:12px "Silkscreen";color:var(--ouro);width:18px}
.lista-mini .val{margin-left:auto;font:12px "Silkscreen";color:var(--rotulo)}
.taxas{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.taxas div{background:#1a110a;border:1px solid #000;padding:6px 8px}
.taxas b{display:block;font:16px "Silkscreen";color:var(--ouro-claro)}
.taxas span{font-size:12px;color:var(--rotulo)}
.vitrine-mini{display:flex;flex-direction:column;align-items:center;gap:6px;background:radial-gradient(circle at 50% 70%,#3a2c1e,#1a110a 70%);border:2px solid #000;padding:12px}

/* Sprites animados: a folha do jogo (cliente/animacoes), uma linha por
   animação, quadros lado a lado; steps() troca o quadro como o Godot. */
.spr{display:inline-block;flex:none;width:calc(var(--w)*var(--s)*1px);height:calc(var(--h)*var(--s)*1px);background-repeat:no-repeat;background-size:calc(var(--cols)*var(--w)*var(--s)*1px) auto;background-position:0 calc(var(--row)*var(--h)*var(--s)*-1px);image-rendering:pixelated;animation:spr calc(var(--n)/var(--fps)*1s) steps(var(--n)) infinite}
@keyframes spr{from{background-position-x:0}to{background-position-x:calc(var(--n)*var(--w)*var(--s)*-1px)}}

/* Hero */
.hero{position:relative;border:2px solid #000;box-shadow:inset 0 0 0 2px var(--madeira),0 0 0 2px var(--madeira-escura);overflow:hidden;min-height:330px;background:#000 url(img/hero.png) center/cover;image-rendering:pixelated;margin-bottom:18px}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,6,3,.88) 0%,rgba(10,6,3,.55) 48%,rgba(10,6,3,0) 75%)}
.hero .txt{position:relative;z-index:1;padding:34px 30px;max-width:470px}
.hero h1{font-size:40px;line-height:1.05;text-shadow:3px 3px 0 #000}
.hero p{font-size:16px;color:var(--texto);text-shadow:1px 1px 0 #000}
.hero .acoes{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.hero .selo{display:inline-block;font:12px "Silkscreen";background:var(--vida);color:#fff;padding:3px 8px;border:2px solid #000;margin-bottom:12px}

.desfile{position:relative;height:118px;overflow:hidden;background:#2a2016 url(img/chao.png) repeat-x left bottom/auto 100%;border:2px solid #000;image-rendering:pixelated}
.desfile .fila{position:absolute;bottom:8px;display:flex;gap:26px;align-items:flex-end;animation:desfile 60s linear infinite;left:0}
@keyframes desfile{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Notícias */
.noticias{display:grid;gap:14px}
.noticia{display:grid;grid-template-columns:230px minmax(0,1fr);gap:0;color:var(--tinta)}
.noticia .img{background:#000 center/cover;image-rendering:pixelated;border-right:2px solid #000;min-height:150px}
.noticia .txt{padding:12px 16px}
.noticia h3{font-size:22px;line-height:1.1;margin:4px 0 6px}
.noticia p{margin:0 0 6px}
.data{font:11px "Silkscreen";color:var(--tinta-fraca);display:flex;gap:8px;align-items:center}
.tag{font:11px "Silkscreen";padding:1px 6px;border:1px solid #000;background:#3a2c1e;color:var(--titulo)}
.tag.evento{background:#5a1a10;color:#ffd0b0}.tag.novo{background:#1e4a1a;color:#c8f0a8}.tag.breve{background:#1e3a6a;color:#cfe0ff}.tag.quest{background:#4a2a6a;color:#e8d0ff}
.numeros{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.numeros div,.numeros a{background:#1a110a;border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira);text-align:center;padding:10px 4px}
.numeros b{display:block;font:24px "Silkscreen";color:var(--ouro-claro)}
.numeros span{font-size:12px;color:var(--rotulo)}

/* Artigo */
.artigo{padding:22px 26px}
.artigo h1{font-size:36px;line-height:1.05;margin:6px 0 10px}
.artigo .lead{font-size:18px}
.artigo h2{font-size:24px;margin:22px 0 8px}
.artigo figure{margin:14px 0}
.artigo figure img{display:block;width:100%;border:2px solid #000;image-rendering:pixelated}
.artigo figcaption{font-size:13px;color:var(--tinta-fraca);margin-top:4px}
.grade-img{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.grade-img img{display:block;width:100%;aspect-ratio:5/3;object-fit:cover;border:2px solid #000;image-rendering:pixelated}
table.tab{border-collapse:collapse;width:100%}
.tab th,.tab td{padding:7px 10px;text-align:left;border-bottom:1px solid var(--linha);vertical-align:middle}
.tab th{font:12px "Silkscreen";color:var(--rotulo);background:#1a110a;border-bottom:2px solid #000}
.perg .tab th{background:#d4bb88;color:var(--tinta);border-bottom:2px solid #8a6a40}
.perg .tab td{border-bottom:1px solid #c8ac78}
.tab .num{text-align:right}
.tab tr:hover td{background:rgba(240,216,144,.05)}

/* Wiki */
.wiki-menu{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.filtros{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.filtros input{font:15px "Plex";background:#1a110a;color:var(--texto);border:2px solid #000;padding:8px 10px;flex:1 1 220px;min-width:0}
.cartas{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.carta{background:#1a110a;border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira);display:flex;flex-direction:column;align-items:center;padding:0 0 10px;color:var(--texto);text-decoration:none!important;position:relative}
.carta:hover{box-shadow:inset 0 0 0 2px var(--ouro)}
.carta .palco{width:100%;height:118px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;background:radial-gradient(ellipse at 50% 88%,rgba(0,0,0,.55) 0 18%,transparent 19%),linear-gradient(#2a2016,#3a2c1e)}
.carta b{font:16px/1.15 "MedievalSharp";color:var(--titulo);text-align:center;margin-top:6px;padding:0 6px}
.carta small{font:11px "Silkscreen";color:var(--rotulo)}
.carta .chefe{position:absolute;top:6px;left:6px;font:10px "Silkscreen";background:var(--vida);color:#fff;padding:1px 5px;border:1px solid #000}
.paginacao{display:flex;gap:6px;justify-content:center;margin-top:14px}

.ficha{display:grid;grid-template-columns:340px minmax(0,1fr);gap:18px}
.palco-grande{height:300px;display:flex;align-items:center;justify-content:center;background:url(img/chao_pedra.png) center/128px;image-rendering:pixelated;border:2px solid #000;position:relative}
.palco-grande::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 55%,transparent 30%,rgba(0,0,0,.6))}
.palco-grande .spr{position:relative;z-index:1}
.controles{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.controles .bt{font-size:13px;padding:4px 10px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.stats div{background:#1a110a;border:2px solid #000;padding:8px 10px}
.stats b{display:block;font:20px "Silkscreen";color:var(--ouro-claro)}
.stats span{font-size:12px;color:var(--rotulo)}
.stats .vida b{color:#ff6a50}
.historia{font:italic 15px/1.6 "Plex";padding:12px 16px;margin:0 0 14px}
.loot td:first-child{width:44px}
.ic{width:32px;height:32px;image-rendering:pixelated;vertical-align:middle;background:#1a110a;border:1px solid #000}
.ic.grande{width:64px;height:64px}
.r-comum{color:var(--r-comum)}.r-incomum{color:var(--r-incomum)}.r-raro{color:var(--r-raro)}.r-epico{color:var(--r-epico)}.r-lendario{color:var(--r-lendario)}
.barra{height:8px;background:#000;border:1px solid #000;min-width:60px}
.barra i{display:block;height:100%;background:var(--ouro)}
.elem{display:flex;gap:6px;flex-wrap:wrap}
.elem span{font:12px "Silkscreen";padding:3px 8px;border:2px solid #000}
.elem .forte{background:#1e3a1a;color:#b0f090}.elem .fraco{background:#5a1a10;color:#ffc0a0}

.mapa-vista{position:relative;height:340px;overflow:hidden;border:2px solid #000;background:#2a52c8}
.mapa-vista img{position:absolute;image-rendering:pixelated;max-width:none}
.marcador{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;border:3px solid #fff;border-radius:50%;box-shadow:0 0 0 3px #000,0 0 18px #ffd040;animation:pulso 1.4s ease-in-out infinite}
@keyframes pulso{50%{transform:scale(1.25)}}
.mapa-rotulo{position:absolute;font:12px "Silkscreen";color:#fff;text-shadow:1px 1px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000;white-space:nowrap;transform:translate(-50%,0)}
.mapa-todo{position:relative;border:2px solid #000}
.mapa-todo img{display:block;width:100%;image-rendering:pixelated}
.mapa-todo .ponto{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;background:#ffd040;border:2px solid #000}
.mapa-todo .caixa{position:absolute;border:2px solid #ffd040;box-shadow:0 0 0 1px #000}
.fala{position:relative;padding:12px 16px;margin:10px 0}
.fala b{font-family:"MedievalSharp";font-size:17px}

.segredo{display:flex;gap:16px;align-items:center;padding:16px 18px;border:2px dashed #8a6a40}
.segredo .selo{flex:none;width:64px;height:64px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#e8503a,#8a1e14 60%,#4a0806);border:3px solid #000;display:grid;place-items:center;font:28px "MedievalSharp";color:#ffd0b0;box-shadow:2px 3px 0 rgba(0,0,0,.4)}
.premios{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.premio{background:#1a110a;border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira);padding:12px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.premio .palco{height:110px;display:flex;align-items:flex-end;justify-content:center;gap:6px;flex-wrap:wrap}

/* Galeria */
.galeria{columns:3 300px;column-gap:12px}
.galeria figure{break-inside:avoid;margin:0 0 12px;background:#1a110a;border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira);padding:6px}
.galeria img{display:block;width:100%;image-rendering:pixelated}
.galeria figcaption{font-size:13px;color:var(--rotulo);padding:6px 4px 2px}
.galeria figcaption b{font-family:"MedievalSharp";color:var(--titulo);font-weight:400;font-size:15px}

/* Ranking */
.abas{display:flex;gap:4px;flex-wrap:wrap;border-bottom:2px solid #000;margin-bottom:0}
.abas .bt{font-size:15px}
.podio{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:10px;align-items:end;margin:14px 0}
.podio>div{text-align:center;background:#1a110a;border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira);padding:10px}
.podio>.p1{box-shadow:inset 0 0 0 2px var(--ouro);padding-top:16px}
.podio b{display:block;font:18px "MedievalSharp";color:var(--titulo)}
.podio .lugar{font:28px "Silkscreen";color:var(--ouro-claro)}
.caminho{font:11px "Silkscreen";padding:1px 6px;border:1px solid #000;color:#000}

/* Loja */
.saldo{display:flex;align-items:center;gap:10px;font:22px "Silkscreen";color:var(--ouro-claro)}
.pacotes{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.pacote{background:#1a110a;border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira);text-align:center;padding:12px 8px;display:flex;flex-direction:column;align-items:center;gap:6px}
.pacote b{font:22px "Silkscreen";color:#9ae0ff}
.pacote .preco{font:15px "Silkscreen";color:var(--texto)}
.pacote{position:relative}.pacote .tag{position:absolute;top:6px;right:6px}.pacote s,.produto s{font:11px "Silkscreen";color:var(--rotulo)}
.produto .rs{font:16px "Silkscreen";color:var(--texto)}.produto .dia small{font:11px "Silkscreen";color:var(--rotulo)}
.loja-pers{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 12px}
.loja-pers select{font:15px "Plex";background:#1a110a;color:var(--texto);border:2px solid #000;padding:8px 10px;min-width:0}
#loja-pedido .linha{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid #3a2c1e}
#loja-pedido .botoes{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.produtos{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.produto{background:#1a110a;border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira);display:flex;flex-direction:column}
.produto .palco{height:130px;display:flex;align-items:center;justify-content:center;gap:4px;background:radial-gradient(circle at 50% 60%,#4a3826,#1a110a 70%);border-bottom:2px solid #000}
.produto .info{padding:10px 12px;display:flex;flex-direction:column;gap:6px;flex:1}
.produto b{font:18px "MedievalSharp";color:var(--titulo)}
.produto p{margin:0;font-size:13px;color:var(--rotulo);flex:1}
.produto .compra{display:flex;align-items:center;justify-content:space-between}
.produto .dia{font:16px "Silkscreen";color:#9ae0ff;display:flex;align-items:center;gap:4px}
.dia img{width:20px;height:20px;image-rendering:pixelated}
.aviso{font-size:13px;color:var(--rotulo);padding:10px 14px;background:#1a110a;border-left:4px solid var(--ouro)}

/* O jogo */
.caminhos{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.caminho-c{background:#1a110a;border:2px solid #000;padding:10px;border-top:6px solid var(--c)}
.caminho-c b{font:20px "MedievalSharp";color:var(--c)}
.caminho-c p{font-size:13px;color:var(--rotulo);margin:4px 0 8px}
.caminho-c .icones{display:flex;gap:3px;flex-wrap:wrap}
.caminho-c .icones img{width:30px;height:30px;image-rendering:pixelated;border:1px solid #000}
.duas{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center}
.passos{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.passos figure{margin:0}
.passos img{width:100%;aspect-ratio:16/10;object-fit:cover;border:2px solid #000;display:block;image-rendering:pixelated}
.passos figcaption{padding-top:8px}
.passos figcaption b{font:19px "MedievalSharp";color:var(--titulo);display:block}

/* Rodapé */
.rodape{background:#000;border-top:2px solid var(--madeira);color:var(--discreto);font-size:13px}
.rodape .in{max-width:1180px;margin:0 auto;padding:22px 16px;display:grid;grid-template-columns:1.3fr repeat(4,1fr);gap:18px}
.rodape h4{font:15px "MedievalSharp";color:var(--titulo);margin:0 0 8px;font-weight:400}
.rodape a{color:var(--rotulo);display:block;padding:2px 0}
.rodape .fim{grid-column:1/-1;border-top:1px solid #2a1a0c;padding-top:12px;font:11px "Silkscreen"}
.so-cel{display:none}

/* Celular primeiro na prática: abaixo de 760 px tudo vira uma coluna, o
   menu recolhe e "Baixar" fica preso embaixo. */
@media (max-width:760px){
  body{font-size:15px}
  .topo-faixa .esq2{display:none}
  .cabecalho .in{padding:12px 16px}
  .palavra{font-size:32px}
  .marca svg{width:42px;height:42px}
  .lema{font-size:9px}
  .cabecalho .acoes{display:none}
  .menu .in{padding:0}
  .menu a{display:none}
  .menu .hamb{display:flex;align-items:center;gap:10px;font:17px "MedievalSharp";color:var(--texto);padding:10px 16px;background:none;border:0}
  .menu .hamb i{display:block;width:20px;height:3px;background:var(--texto);box-shadow:0 6px 0 var(--texto),0 -6px 0 var(--texto)}
  .menu .busca{padding:0 10px 0 0}
  .menu .busca input{width:150px}
  .pagina{grid-template-columns:minmax(0,1fr);padding:14px 12px 90px;gap:14px}
  .hero{min-height:420px;background-position:70% center}
  .hero::after{background:linear-gradient(0deg,rgba(10,6,3,.95) 0%,rgba(10,6,3,.6) 55%,rgba(10,6,3,.1) 100%)}
  .hero .txt{padding:150px 18px 20px}
  .hero h1{font-size:30px}
  .noticia{grid-template-columns:1fr}
  .noticia .img{min-height:150px;border-right:0;border-bottom:2px solid #000}
  .numeros{grid-template-columns:repeat(3,1fr)}
  .ficha{grid-template-columns:1fr}
  .stats{grid-template-columns:repeat(2,1fr)}
  .cartas{grid-template-columns:repeat(2,1fr)}
  .pacotes{grid-template-columns:repeat(2,1fr)}
  .caminhos{grid-template-columns:1fr 1fr}
  .duas,.passos{grid-template-columns:1fr}
  .podio{grid-template-columns:1fr 1fr 1fr;gap:6px}
  .podio b{font-size:14px}
  .artigo{padding:16px}
  .artigo h1{font-size:28px}
  .titulo-pag h1{font-size:28px}
  .rodape .in{grid-template-columns:1fr 1fr}
  .rodape .in>div:first-child{grid-column:1/-1}
  .tab .esconde{display:none}
  .so-cel{display:flex}
  .barra-cel{position:sticky;bottom:0;z-index:9;background:var(--madeira);border-top:2px solid #000;box-shadow:inset 0 2px 0 var(--madeira-clara);padding:8px 12px;gap:8px}
  .barra-cel .bt{flex:1;justify-content:center}
}
/* Ajustes da 2ª passada */
.carta .palco{background:radial-gradient(26px 6px at 50% 108px,rgba(0,0,0,.55) 95%,transparent),linear-gradient(#2a2016,#3a2c1e)}
.carta small+small{color:var(--discreto)}
.lista-mini .cx{width:40px;height:34px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.mapa-rotulo.reg{font-size:9px;white-space:normal;width:15%;text-align:center;line-height:1.15}
.todas{display:flex;gap:4px;margin-top:10px;background:#1a110a;border:2px solid #000;padding:6px;justify-content:space-between}
.todas figure{margin:0;display:flex;flex-direction:column;align-items:center}
.todas figcaption{font:9px "Silkscreen";color:var(--rotulo)}
@media (max-width:760px){.mapa-rotulo.reg{font-size:7px}.todas{overflow:hidden}}
.podio>div{overflow:hidden;min-width:0}
.podio .lugar{border:0;box-shadow:none;padding:0;background:none}
@media (max-width:760px){
  .abas{flex-wrap:nowrap;overflow-x:auto}
  .podio .spr{--s:1.5!important}
  .quadro>.corpo{overflow-x:auto}
  .titulo-pag{flex-wrap:wrap;align-items:baseline}
}
.ficha>div{min-width:0}
.duas.mapa-g{grid-template-columns:2fr 1fr;align-items:start}
.premios{grid-template-columns:1fr 2fr}
@media (max-width:760px){
  .duas.mapa-g,.premios{grid-template-columns:1fr}
  .premio{grid-column:auto!important}
  .todas{flex-wrap:wrap;justify-content:center}
  .tab td .spr{display:none}
  .mapa-vista{height:280px}
}
.premio .palco{height:auto;min-height:110px}

/* ---- Site de verdade: peças além da prancha (mesma linguagem visual) ---- */
.menu .busca{position:relative}
.resultados{position:absolute;right:6px;top:calc(100% + 2px);width:320px;max-width:calc(100vw - 24px);background:var(--painel);border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira),4px 6px 0 rgba(0,0,0,.5);z-index:20;display:none}
.resultados.aberto{display:block}
.resultados a{display:flex;gap:8px;align-items:center;padding:7px 10px;border-bottom:1px solid var(--linha);color:var(--texto);font:14px "Plex"}
.resultados a:hover,.resultados a.sel{background:#3a2c1e;text-decoration:none}
.resultados small{margin-left:auto;font:10px "Silkscreen";color:var(--rotulo)}
.resultados .nada{padding:10px;color:var(--rotulo);font-size:13px}
.vazio{display:flex;gap:16px;align-items:center;padding:18px;background:#1a110a;border:2px dashed var(--madeira);color:var(--rotulo)}
.vazio b{display:block;font:20px "MedievalSharp";color:var(--titulo);margin-bottom:4px}
.vazio .spr{flex:none}
.form{display:grid;gap:12px;max-width:440px}
.form label{display:grid;gap:4px;font:12px "Silkscreen";color:var(--rotulo)}
.form input[type=text],.form input[type=email],.form input[type=password]{font:16px "Plex";background:#1a110a;color:var(--texto);border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira);padding:10px}
.form .marca-c{display:flex;gap:8px;align-items:flex-start;font:14px "Plex";color:var(--texto)}
.form .bt{justify-content:center}
.msg{padding:10px 14px;border:2px solid #000;font-size:14px;display:none}
.msg.erro{display:block;background:#3a0806;color:#ffd0c0}
.msg.ok{display:block;background:#1e3a1a;color:#c8f0a8}
.msg.info{display:block;background:#1a110a;color:var(--rotulo);border-left:4px solid var(--ouro)}
.dica{font-size:12px;color:var(--discreto)}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:30;display:none;align-items:center;justify-content:center;padding:16px;cursor:zoom-out}
.lightbox.aberto{display:flex}
.lightbox img{max-width:100%;max-height:100%;image-rendering:pixelated;border:2px solid var(--madeira)}
.galeria img{cursor:zoom-in}
.wiki-cartoes{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.wiki-cartao{display:flex;gap:12px;align-items:center;background:#1a110a;border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira);padding:12px;color:var(--texto);text-decoration:none!important}
.wiki-cartao:hover{box-shadow:inset 0 0 0 2px var(--ouro)}
.wiki-cartao b{display:block;font:20px "MedievalSharp";color:var(--titulo)}
.wiki-cartao small{font:11px "Silkscreen";color:var(--rotulo)}
.wiki-cartao .ico{width:64px;height:64px;display:flex;align-items:flex-end;justify-content:center;flex:none;overflow:hidden}
.rank-tag{font:11px "Silkscreen";padding:1px 6px;border:1px solid #000;color:#000}
.camadas{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:10px;font-size:14px}
.mapa-todo .ponto.hunt{background:#e8503a}
.mapa-todo .ponto.sub{background:transparent;border:3px solid #e8503a}
.mapa-todo .ponto.lugar{width:14px;height:14px;margin:-7px 0 0 -7px;background:#b07ae8;border:2px solid #000;transform:rotate(45deg)}
.mapa-rotulo.lugar{color:#e8d0ff;font-size:11px}
@media (max-width:760px){.mapa-rotulo.lugar{font-size:8px}}
.mapa-todo .ponto.cidade{width:16px;height:16px;margin:-8px 0 0 -8px;background:#fff;border:3px solid #8a1e14}
.mapa-todo .ponto:hover{transform:scale(1.5);z-index:2}
.mapa-todo a.ponto{display:block}
.legenda-mapa{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--rotulo);margin-top:8px}
.legenda-mapa i{display:inline-block;width:10px;height:10px;border:2px solid #000;margin-right:5px;vertical-align:-1px}
.mapa-vista{cursor:grab;touch-action:none}
.mapa-vista.arrastando{cursor:grabbing}
.texto-longo{max-width:820px}
.texto-longo h2{font-size:24px;margin:22px 0 8px}
.texto-longo h3{font-size:19px;margin:16px 0 6px}
.rascunho{font:11px "Silkscreen";background:#5a1a10;color:#ffd0b0;padding:3px 8px;border:2px solid #000;display:inline-block;margin-bottom:10px}
.conta-pers{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.menu.aberto a{display:block}
@media (max-width:760px){
  .menu.aberto .in{flex-wrap:wrap}
  .menu.aberto a{width:100%;border-right:0;border-top:1px solid var(--madeira-escura)}
  .menu.aberto .busca{order:-1;margin-left:auto}
  .resultados{right:0}
  .vazio{flex-direction:column;text-align:center}
}
.mapa-vista .camada{position:absolute;left:0;top:0}
.numeros a{text-decoration:none!important;color:inherit}.numeros a:hover{box-shadow:inset 0 0 0 2px var(--ouro)}

/* Suporte e códigos (RFC 0077; RFC 0035, adendo de 2026-10-23). */
.form select,.form textarea{font:16px "Plex";background:#1a110a;color:var(--texto);border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira);padding:10px;width:100%}
.form input.codigo{font:28px "Silkscreen",monospace;letter-spacing:.4em;text-align:center;max-width:260px}
.tickets{display:grid;gap:8px}
.ticket{display:grid;gap:2px;background:#1a110a;border:2px solid #000;box-shadow:inset 0 0 0 1px var(--madeira);padding:10px 12px;color:var(--texto)}
.ticket:hover{text-decoration:none;box-shadow:inset 0 0 0 2px var(--ouro)}
.ticket .sk,.ticket small{color:var(--rotulo);font-size:12px}
.ticket b{overflow-wrap:anywhere}
.conversa{background:#1a110a;border-left:4px solid var(--madeira);padding:10px 12px;margin:10px 0}
.conversa.equipe{border-left-color:var(--ouro)}
.conversa small{display:block;color:var(--rotulo);font-size:12px;margin-bottom:4px}
.conversa div{white-space:pre-wrap;overflow-wrap:anywhere}
[hidden]{display:none!important}

/* Home: Criaturas e Boss do Dia (RFC 0052), quatro lado a lado; dois no celular. */
.do-dia{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.do-dia .item{display:flex;flex-direction:column;gap:6px;min-width:0}
.do-dia .item .tag{align-self:flex-start;font-size:10px}
.do-dia .item small{color:var(--rotulo);font-size:12px;text-align:center}
.do-dia .vitrine-mini{flex:1;justify-content:flex-end}
.do-dia-nota{margin:12px 0 0;color:var(--rotulo);font-size:13px}
@media (max-width:760px){.do-dia{grid-template-columns:1fr 1fr}}

/* Mapa no celular (revisão do site, 2026-10-29): espremido em 390 px os nomes
   se encavalavam; com 760 px e rolagem para o lado ficam legíveis. */
.mapa-dica{display:none}
@media (max-width:760px){
  .mapa-rolar{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .mapa-rolar .mapa-todo{width:760px}
  .mapa-rolar .mapa-rotulo.reg{font-size:9px}
  .mapa-rolar .mapa-rotulo.lugar{font-size:10px}
  .mapa-dica{display:block;margin:6px 0 0;color:var(--rotulo);font-size:12px}
}
/* A quantidade "1–99" do loot não quebra em duas linhas no celular. */
.tab.loot td.num{white-space:nowrap}
