/* Estilo comum das páginas de conta e painel — madeira cartoon do Horta vs Pragas */
:root { --borda:#3a2416; --creme:#fff8ea; --ouro:#ffd23a; --verde:#4fa52a; --vermelho:#d8322a; }
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
[hidden] { display:none !important; }
body { margin:0; min-height:100dvh; color:var(--creme); font-family:"Baloo 2","Trebuchet MS",system-ui,sans-serif;
       background:radial-gradient(ellipse at top, #2c4a1e, #0c1608) fixed; }
a { color:#ffe14d; }
.topo-pg { position:sticky; top:0; z-index:5; display:flex; align-items:center; gap:12px; padding:8px 16px;
  background:repeating-linear-gradient(90deg, rgba(255,220,160,.07) 0 2px, transparent 2px 22px), linear-gradient(#d08a42,#a8662c 50%,#7a4618);
  border-bottom:4px solid var(--borda); box-shadow:0 6px 14px rgba(0,0,0,.4); }
.topo-pg img { height:52px; filter:drop-shadow(0 3px 4px rgba(0,0,0,.4)); }
.topo-pg .esp { flex:1; }
.saldo-chip { display:flex; align-items:center; gap:8px; padding:4px 14px; border-radius:999px; font-weight:800; font-size:18px;
  background:linear-gradient(#4a2810,#2e1806); border:2px solid #1e0f04; box-shadow:inset 0 3px 6px rgba(0,0,0,.6); }
.saldo-chip b { color:var(--ouro); }
.pagina { max-width:1100px; margin:0 auto; padding:18px 16px 40px; }
h1, h2 { margin:6px 0 12px; font-weight:800; color:var(--ouro); -webkit-text-stroke:2px var(--borda); paint-order:stroke fill; text-shadow:0 3px 0 var(--borda); }
h1 { font-size:clamp(26px,4vw,38px); } h2 { font-size:clamp(20px,3vw,28px); }
.madeira { position:relative; border-radius:20px; border:5px solid var(--borda); padding:16px clamp(12px,2.5vw,24px);
  background:repeating-linear-gradient(0deg, transparent 0 46px, rgba(40,20,5,.35) 46px 49px), linear-gradient(#9a6438,#6b4423);
  box-shadow:inset 0 4px 0 rgba(255,220,170,.35), 0 12px 28px rgba(0,0,0,.5); margin-bottom:18px; }
.poço { border-radius:14px; padding:10px 14px; background:linear-gradient(#4a2810,#2e1806); box-shadow:inset 0 3px 6px rgba(0,0,0,.55); }
.grade { display:grid; gap:14px; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); }
.bt { display:inline-flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; font:800 16px "Baloo 2",sans-serif; color:#fff8ea;
  padding:8px 18px 6px; min-height:44px; border-radius:14px; border:3px solid #3a1a04; text-shadow:0 2px 0 rgba(0,0,0,.4);
  background:linear-gradient(#ffc04a,#f08a10 60%,#c05a06); box-shadow:0 4px 0 #3a1a04, inset 0 3px 0 rgba(255,255,255,.45); transition:transform .08s, filter .15s; }
.bt:hover { filter:brightness(1.08); } .bt:active { transform:translateY(3px); box-shadow:0 1px 0 #3a1a04; }
.bt.verde { background:linear-gradient(#a8e85a,#4fa52a 60%,#2f7a1a); border-color:#163a06; box-shadow:0 4px 0 #163a06, inset 0 3px 0 rgba(255,255,255,.45); }
.bt.vermelho { background:linear-gradient(#ff8a6a,#d8322a 60%,#8a1a10); border-color:#4a0a06; box-shadow:0 4px 0 #4a0a06, inset 0 3px 0 rgba(255,255,255,.35); }
.bt.marrom { background:linear-gradient(#b07a4a,#7a4a22 60%,#5a3414); }
.bt.peq { min-height:34px; padding:4px 12px 2px; font-size:14px; }
.bt[disabled] { filter:grayscale(.8) brightness(.8); cursor:not-allowed; }
label.campo { display:block; margin:8px 0; font-weight:700; }
label.campo span { display:block; font-size:14px; margin-bottom:3px; }
input, select { width:100%; font:600 16px "Baloo 2",sans-serif; color:var(--borda); background:linear-gradient(#fff8ea,#f3e2bd);
  border:3px solid var(--borda); border-radius:12px; padding:8px 12px 6px; min-height:44px; }
input:focus, select:focus { outline:3px solid var(--ouro); }
.msg { margin:8px 0; padding:8px 12px; border-radius:12px; font-weight:700; display:none; }
.msg.erro { display:block; background:#5a0a06; border:2px solid #ff6b5b; }
.msg.ok { display:block; background:#163a06; border:2px solid #8be36a; }
.abas { display:flex; gap:8px; margin-bottom:12px; flex-wrap:wrap; }
.abas .bt { opacity:.7; } .abas .bt.ativa { opacity:1; box-shadow:0 0 0 3px var(--ouro), 0 4px 0 #3a1a04; }
table { width:100%; border-collapse:collapse; font-size:15px; }
th, td { text-align:left; padding:7px 8px; border-bottom:1px solid rgba(255,220,160,.18); vertical-align:middle; }
th { color:#ffe9a8; font-size:13px; text-transform:uppercase; letter-spacing:.04em; }
.tab-rolagem { overflow-x:auto; }
.pos { color:#8be36a; } .neg { color:#ff8a7a; }
.tag { display:inline-block; padding:1px 10px; border-radius:999px; font-size:13px; font-weight:800; background:#3a2416; }
.tag.pendente { background:#a8661a; } .tag.pago, .tag.encerrado { background:#2f7a1a; } .tag.recusado, .tag.falhou, .tag.cancelado, .tag.contestado { background:#8a1a10; } .tag.aberto { background:#1d5fa8; }
.card-t { display:flex; flex-direction:column; gap:6px; }
.card-t .cab { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.card-t .titulo { font-size:20px; font-weight:800; color:var(--ouro); }
.linhas { display:grid; grid-template-columns:auto 1fr; gap:2px 12px; font-size:15px; }
.linhas b { color:#fff; }
.premio { font-size:26px; font-weight:800; color:var(--ouro); text-shadow:0 2px 0 var(--borda); }
.qr { background:#fff; border-radius:14px; padding:10px; width:min(260px, 70vw); margin:8px auto; }
.copia { display:flex; gap:8px; } .copia input { font-size:13px; }
.centro { text-align:center; }
.oculto { display:none !important; }
.aviso { font-size:13px; opacity:.85; }
.kpis { display:grid; gap:12px; grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); }
.kpi .v { font-size:24px; font-weight:800; color:var(--ouro); } .kpi .t { font-size:13px; opacity:.85; }
.barra-uso { height:14px; border-radius:7px; background:#2e1806; overflow:hidden; margin-top:6px; }
.barra-uso i { display:block; height:100%; background:linear-gradient(90deg,#8be36a,#ffd23a,#ff6b5b); }
@media (max-width:600px) { .topo-pg img { height:40px; } .saldo-chip { font-size:15px; } th, td { font-size:13px; padding:6px 4px; } }

/* loja */
.ico-semente { display:inline-block; width:18px; height:18px; vertical-align:-3px; flex:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg transform='rotate(-35 12 12)'%3E%3Cpath d='M12 2.5c4.2 0 6.3 4.6 6.3 9.5S16.2 21.5 12 21.5 5.7 16.9 5.7 12 7.8 2.5 12 2.5z' fill='%23f6b81c' stroke='%233a2416' stroke-width='1.8'/%3E%3Cpath d='M12 4.5v15' stroke='%23b9780a' stroke-width='1.6'/%3E%3Cpath d='M9.3 7.5c-.8 1.4-1.1 2.9-1.1 4.5' stroke='%23fff3b0' stroke-width='1.7' fill='none' stroke-linecap='round'/%3E%3C/g%3E%3Cpath d='M20 2.5l.7 1.6 1.6.7-1.6.7-.7 1.6-.7-1.6-1.6-.7 1.6-.7z' fill='%23fff8d0'/%3E%3C/svg%3E") center/contain no-repeat; }
.ico-semente.grande { width:34px; height:34px; }
.loja-topo .moeda { display:flex; align-items:center; gap:12px; }
.loja-topo .moeda b { font-size:34px; color:var(--ouro); text-shadow:0 2px 0 var(--borda); line-height:1; }
.loja-topo .moeda .ico-semente.grande { width:48px; height:48px; }
.pacotes { display:grid; gap:12px; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); }
.pacote { position:relative; display:flex; flex-direction:column; align-items:center; gap:2px; cursor:pointer; padding:14px 8px 10px;
  font-family:inherit; color:var(--creme); border-radius:16px; border:3px solid #1e0f04;
  background:linear-gradient(#4a2810,#2e1806); box-shadow:inset 0 3px 6px rgba(0,0,0,.55), 0 4px 0 #1e0f04; transition:transform .08s, filter .15s; }
.pacote:hover { filter:brightness(1.15); } .pacote:active { transform:translateY(3px); }
.pacote .qtd { font-size:26px; color:var(--ouro); line-height:1.1; } .pacote .nome { font-weight:700; font-size:14px; opacity:.85; }
.pacote .preco { margin-top:6px; padding:3px 14px; border-radius:999px; font-weight:800; background:linear-gradient(#a8e85a,#4fa52a 60%,#2f7a1a); border:2px solid #163a06; }
.pacote .selo { position:absolute; top:-10px; right:-6px; padding:1px 8px; border-radius:999px; font-size:13px; font-weight:800; background:var(--vermelho); border:2px solid #4a0a06; transform:rotate(6deg); }
.itens { display:grid; gap:14px; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); }
.item-loja { display:flex; flex-direction:column; gap:6px; padding:8px; border-radius:16px; background:linear-gradient(#4a2810,#2e1806); box-shadow:inset 0 3px 6px rgba(0,0,0,.55); border:3px solid transparent; }
.item-loja.usando { border-color:var(--ouro); }
.item-loja canvas { width:100%; aspect-ratio:4/3; border-radius:12px; border:3px solid var(--borda); background:#5fb83f; display:block; }
.item-loja .nome { font-weight:800; font-size:16px; } .item-loja .bt { width:100%; }
.tag.raro { background:linear-gradient(90deg,#9a5aff,#ff5aa8); }

/* ajustes vistos no teste de celular */
a.bt, .bt { text-decoration:none; }
html, body { background-color:#0c1608; }
body { background:radial-gradient(ellipse at top, #2c4a1e, #0c1608 70%) no-repeat, #0c1608; background-attachment:scroll; }
@media (max-width:600px) {
  .kpis { grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; }
  .kpi .v { font-size:19px; } .kpi .t { font-size:12px; }
  .itens { grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; } .item-loja .nome { font-size:14px; }
  .pacotes { grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; }
  #chipSaldo, #chipSementes { font-size:14px; padding:3px 10px; gap:5px; }
  #chipSaldo .rot { display:none; }
  .topo-pg [data-instalar] { font-size:0; gap:0; padding:4px 8px; }
  .topo-pg { gap:8px; padding:6px 10px; }
  .topo-pg b { font-size:15px !important; line-height:1.1; }
  .topo-pg .bt.peq { white-space:nowrap; }
  .abas .bt { flex:1 1 auto; min-height:40px; padding:4px 10px; font-size:14px; }
}

/* regras do torneio */
.regras-t summary { cursor:pointer; list-style:none; }
.regras-t summary::-webkit-details-marker { display:none; }
.regras-t summary::after { content:" ▾"; color:var(--ouro); font-size:22px; }
.regras-t[open] summary::after { content:" ▴"; }
.regras-t ol { margin:6px 0 10px; padding-left:22px; display:grid; gap:6px; font-weight:600; }
.regras-t ol b { color:var(--ouro); }

/* perfil, partidas do torneio e placar ao vivo */
.perfil-topo { display:flex; align-items:center; gap:16px; margin:6px 0 12px; }
.perfil-topo h1 { margin:0 0 4px; }
.acoes-foto { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.foto-perfil { position:relative; cursor:pointer; flex:none; }
.av { display:inline-grid; place-items:center; width:32px; height:32px; border-radius:50%; object-fit:cover; flex:none;
  border:2px solid var(--borda); background:linear-gradient(#ffc04a,#c06a0a); color:#fff8ea; font-weight:800; text-transform:uppercase; }
.av.grande { width:84px; height:84px; font-size:38px; border:4px solid var(--ouro); box-shadow:0 0 0 3px var(--borda), 0 6px 14px rgba(0,0,0,.5); }
.foto-perfil .lapis { position:absolute; right:-2px; bottom:-2px; width:30px; height:30px; border-radius:50%; display:grid; place-items:center;
  background:var(--ouro); border:3px solid var(--borda); }
.foto-perfil .lapis svg { width:16px; height:16px; }
.partidas-t { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.bolinhas { display:inline-flex; gap:4px; } .bolinhas i { width:14px; height:14px; border-radius:50%; background:#8be36a; border:2px solid #163a06; }
.bolinhas i.usada { background:#5a4630; border-color:#2a1a08; }
.placar { border-radius:14px; padding:10px 12px; background:linear-gradient(#3e2009,#2a1406); box-shadow:inset 0 3px 6px rgba(0,0,0,.55); }
.placar-cab { display:flex; justify-content:space-between; align-items:baseline; gap:8px; flex-wrap:wrap; margin-bottom:6px; }
.placar-cab b { color:var(--ouro); font-size:17px; }
.minha-pos { display:flex; align-items:center; gap:10px; margin:6px 0 8px; padding:8px 10px; border-radius:12px; background:#5a3414; border:2px solid #8a5a2c; font-weight:700; }
.minha-pos.ganhando { background:#1f4a0e; border-color:#8be36a; }
.minha-pos .av { width:40px; height:40px; } .minha-pos small { display:block; font-size:13px; opacity:.95; }
.top10 { list-style:none; margin:0; padding:0; display:grid; gap:4px; }
.top10 li { display:flex; align-items:center; gap:8px; padding:4px 8px; border-radius:10px; font-weight:700; font-size:15px; }
.top10 li:nth-child(odd) { background:rgba(255,220,160,.06); }
.top10 li.premiado .pos { color:var(--ouro); } .top10 li.eu { outline:2px solid var(--ouro); background:rgba(255,210,58,.12); }
.top10 .pos { width:28px; text-align:right; } .top10 .nm { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.top10 .pts { color:#fff; } .top10 .rs { font-size:13px; color:#8be36a; min-width:64px; text-align:right; }
@media (max-width:600px) { .av.grande { width:64px; height:64px; font-size:28px; } .perfil-topo { gap:12px; } }
.placar { min-width:0; overflow:hidden; }
.top10 li { gap:6px; padding:4px 6px; font-size:14px; min-width:0; }
.top10 .pos { width:24px; flex:none; } .top10 .pts { flex:none; } .top10 .rs { min-width:0; flex:none; font-size:12px; }
.top10 .av { width:28px; height:28px; font-size:14px; }
