/* =====================================================================
   LOJA DA GLÓRIA (20/10, SQL 1949) — src/ui/gloria-ui.js
   Janela por cima de tudo, aberta pelo botão "Glória" no topo dos Rankings.
   Celular: uma coluna, botões com 40px de toque; letra até 130% cabe (flex-wrap).
   ===================================================================== */
.rk-gloria-botao img{width:22px;height:22px;object-fit:contain}
.rk-gloria-botao i{font-style:normal}
.rk-gloria-botao b{color:#ffd76a;font-variant-numeric:tabular-nums}

.gl-veu{position:fixed;inset:0;z-index:1160;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(4,4,10,.82);backdrop-filter:blur(3px)}
.gl-veu.hidden{display:none}
.gl-cartao{position:relative;width:min(780px,100%);max-height:92vh;overflow:auto;overscroll-behavior:contain;border:1px solid #a8812f;border-radius:14px;
  background:radial-gradient(circle at 50% -20%,#4a3912,#17130b 62%);color:#f3ead6;box-shadow:0 18px 50px rgba(0,0,0,.6);padding:14px;font-family:Arial,sans-serif}
.gl-topo{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.gl-topo>img{width:44px;height:44px;object-fit:contain;filter:drop-shadow(0 0 6px rgba(255,200,80,.5))}
.gl-topo small{display:block;color:#c9b27a;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.gl-topo h2{margin:0;font:700 20px/1.2 Cinzel,Georgia,serif;color:#ffe3a0}
.gl-saldo{margin-left:auto;display:flex;align-items:center;gap:6px;padding:4px 12px 4px 6px;border:1px solid #a8812f;border-radius:999px;background:rgba(0,0,0,.35)}
.gl-saldo img{width:24px;height:24px;object-fit:contain}
.gl-saldo b{font-size:17px;color:#ffd76a;font-variant-numeric:tabular-nums}
.gl-fechar{width:36px;height:36px;min-width:36px;border-radius:50%;border:1px solid #6d5a33;background:#241d10;color:#d8c9a4;font-size:15px;cursor:var(--cur-mao,pointer)}
.gl-fechar:hover,.gl-fechar:focus-visible{color:#fff;border-color:#ffd76a}
.gl-abas{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.gl-aba{flex:1 1 0;min-height:38px;padding:6px 10px;border:1px solid #5c4a24;border-radius:10px;background:#1f190d;color:#d8c9a4;font-weight:700;cursor:var(--cur-mao,pointer)}
.gl-aba.on{background:linear-gradient(#6b5016,#3d2d0b);color:#fff2c6;border-color:#d6aa4a}
.gl-aviso{padding:8px 10px;border-radius:8px;margin-bottom:8px;font-size:13px}
.gl-aviso.ok{background:rgba(60,140,70,.25);border:1px solid #4f9d5c}
.gl-aviso.erro{background:rgba(150,40,40,.25);border:1px solid #b34a4a}
.gl-vazio,.gl-texto{color:#d4c7a8;font-size:13px;line-height:1.45;margin:6px 0 10px}
.gl-grade{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gl-item{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:10px;border:1px solid #4d3f20;border-radius:12px;background:rgba(0,0,0,.28)}
.gl-item.gl-com-peca{grid-column:1/-1}
.gl-item.gl-destaque{border-color:#c49a3c;background:linear-gradient(135deg,rgba(120,90,20,.28),rgba(0,0,0,.3))}
.gl-arte{width:56px;height:56px;flex:0 0 56px;display:grid;place-items:center;border-radius:10px;background:radial-gradient(circle,#3a2f17,#16120a)}
.gl-arte img{width:46px;height:46px;object-fit:contain}
.gl-arte canvas{width:56px;height:56px}
.gl-info{flex:1 1 140px;min-width:0}
.gl-info b{display:block;color:#fff0c8;font-size:14px}
.gl-info small{display:block;color:#bfae86;font-size:12px;line-height:1.35;margin-top:2px}
.gl-pecas{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.gl-peca{display:flex;align-items:center;gap:3px;min-height:32px;padding:2px 7px 2px 3px;border:1px solid #5c4a24;border-radius:8px;background:#1f190d;color:#d8c9a4;font-size:11px;cursor:var(--cur-mao,pointer)}
.gl-peca img{width:24px;height:24px;object-fit:contain}
.gl-peca.on{border-color:#ffd76a;background:#4a3812;color:#fff}
.gl-preco{display:flex;flex-direction:column;align-items:flex-end;gap:6px;margin-left:auto}
.gl-preco span{display:flex;align-items:center;gap:4px;color:#ffd76a;font-weight:700;font-size:15px;font-variant-numeric:tabular-nums}
.gl-preco span img{width:18px;height:18px;object-fit:contain}
.gl-comprar{min-height:38px;min-width:96px;padding:6px 12px;border-radius:9px;border:1px solid var(--botao-ouro-borda);background:var(--botao-ouro-fundo);color:var(--botao-ouro-texto);font-weight:700;cursor:var(--cur-mao,pointer)}
.gl-comprar:disabled{background:#2a2414;border-color:#4d3f20;color:#9b8c6c;cursor:var(--cur-seta,default)}
.gl-fonte{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid rgba(168,129,47,.25)}
.gl-fonte>div:first-child{flex:0 0 150px}
.gl-fonte b{display:block;color:#fff0c8;font-size:14px}
.gl-fonte small{color:#bfae86;font-size:11px}
.gl-faixas{display:flex;flex-wrap:wrap;gap:6px;flex:1 1 200px}
.gl-faixas span{padding:3px 8px;border-radius:999px;background:rgba(0,0,0,.35);border:1px solid #4d3f20;color:#ffd76a;font-weight:700;font-size:12px}
.gl-faixas i{font-style:normal;color:#d4c7a8;font-weight:400}
.gl-corpo h4{margin:14px 0 6px;color:#ffe3a0;font:700 14px Cinzel,Georgia,serif}
.gl-ultimos{list-style:none;margin:0;padding:0}
.gl-ultimos li{display:flex;justify-content:space-between;padding:5px 8px;border-bottom:1px solid rgba(168,129,47,.18);font-size:13px}
.gl-ultimos b{color:#ffd76a}
.gl-titulos{display:flex;flex-direction:column;gap:6px}
.gl-titulo{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border:1px solid #4d3f20;border-radius:10px;background:rgba(0,0,0,.25)}
.gl-titulo.on{border-color:#ffd76a;box-shadow:0 0 10px rgba(255,200,80,.25) inset}
.gl-titulo b{display:block;color:#fff0c8;font-size:14px}
.gl-titulo small{color:#bfae86;font-size:12px}
.gl-bonus{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.gl-bonus span{color:#ffd76a;font-weight:700;font-size:13px}
.gl-st{font-style:normal;font-size:11px;padding:2px 8px;border-radius:999px}
.gl-st.on{background:#3d7a3f;color:#eaffea}
.gl-st.meu{background:#5a4512;color:#ffe8a8}
.gl-confirma{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(8,6,2,.78);border-radius:14px}
.gl-conf-caixa{width:min(380px,100%);padding:16px;border:1px solid #d6aa4a;border-radius:12px;background:#221a0b;text-align:center}
.gl-conf-caixa h3{margin:0 0 8px;font:700 17px Cinzel,Georgia,serif;color:#ffe3a0}
.gl-conf-caixa p{margin:6px 0;font-size:14px;line-height:1.4}
.gl-conf-sobra{color:#bfae86;font-size:12px!important}
.gl-conf-botoes{display:flex;gap:8px;justify-content:center;margin-top:12px;flex-wrap:wrap}
.gl-voltar,.gl-sim{min-height:40px;min-width:110px;padding:6px 14px;border-radius:9px;font-weight:700;cursor:var(--cur-mao,pointer)}
.gl-voltar{border:1px solid #6d5a33;background:#1f190d;color:#d8c9a4}
.gl-sim{border:1px solid var(--botao-ouro-borda);background:var(--botao-ouro-fundo);color:var(--botao-ouro-texto)}
.gl-sim:disabled{opacity:.6;cursor:var(--cur-seta,default)}
@media (max-width:640px){
  .gl-veu{padding:8px}
  .gl-cartao{padding:10px;max-height:96vh}
  .gl-grade{grid-template-columns:1fr}
  .gl-topo h2{font-size:17px}
  .gl-topo>img{width:36px;height:36px}
  .gl-fonte>div:first-child{flex:1 1 100%}
  .gl-preco{flex:1 1 100%;flex-direction:row;justify-content:space-between;align-items:center}
  .rk-gloria-botao .rk-gl-nome{display:none}
}
@media (orientation:landscape) and (max-height:500px){
  .gl-cartao{max-height:98vh}
  .gl-grade{grid-template-columns:1fr 1fr}
}
/* PETS DE PvP (SQL 1964): na loja a arte grande; a aba Pets com o que cada um faz, o nível e os botões. */
.gl-item.gl-pet{grid-column:1/-1}
.gl-item.gl-pet .gl-arte{width:84px;height:84px;flex:0 0 84px}
.gl-item.gl-pet .gl-arte img{width:80px;height:80px}
.gl-pet-faz{color:#e8dcbc!important}
.gl-pets{display:flex;flex-direction:column;gap:8px}
.gl-petcard{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:10px;border:1px solid #4d3f20;border-radius:12px;background:rgba(0,0,0,.28)}
.gl-petcard.on{border-color:#ffd76a;box-shadow:0 0 14px rgba(255,200,80,.22) inset}
.gl-petcard.gl-nao-tem .gl-petarte img{filter:grayscale(.55) brightness(.75)}
.gl-petarte{width:92px;height:92px;flex:0 0 92px;display:grid;place-items:center;border-radius:12px;background:radial-gradient(circle,#3a2f17,#120e07)}
.gl-petarte img{width:88px;height:88px;object-fit:contain}
.gl-petinfo{flex:1 1 220px;min-width:0}
.gl-petinfo b{color:#fff0c8;font-size:15px;margin-right:6px}
.gl-petinfo em{display:block;font-style:normal;color:#ffd76a;font-weight:700;font-size:13px;margin-top:2px}
.gl-petinfo small{display:block;color:#d4c7a8;font-size:12px;line-height:1.4;margin-top:3px}
.gl-petinfo small strong{color:#fff0c8}
.gl-niv i{font-style:normal;color:#5a4a28;font-size:13px}
.gl-niv i.on{color:#ffd76a}
.gl-petbotoes{display:flex;flex-direction:column;gap:6px;margin-left:auto}
.gl-comprar.gl-sec{background:linear-gradient(#3a2d10,#221a08);display:flex;align-items:center;justify-content:center;gap:4px}
.gl-comprar.gl-sec img{width:16px;height:16px;object-fit:contain}
.gl-comprar.gl-sec:disabled{background:#2a2414}
.gl-comprar.gl-usando{background:linear-gradient(#3d7a3f,#204a22);border-color:#7fd17f}
@media (max-width:640px){
  .gl-petbotoes{flex:1 1 100%;flex-direction:row;flex-wrap:wrap}
  .gl-petbotoes .gl-comprar{flex:1 1 140px}
  .gl-petarte{width:72px;height:72px;flex-basis:72px}.gl-petarte img{width:68px;height:68px}
}
