/* v0.63 — Mercado fechado em Fichas Negras. Arquivo separado para iniciar a modularização visual. */
.store-account-strip{flex-wrap:wrap}
.token-wallet{display:grid;align-content:center;min-width:215px;padding:12px 14px;border:1px solid #58417a;border-radius:11px;background:linear-gradient(145deg,#21182d,#14141b)}
.token-wallet span{color:#a98bd1;font-size:calc(8px * var(--text-scale,1));font-weight:900;letter-spacing:1px}.token-wallet strong{margin:3px 0;color:#e5d1ff;font-size:calc(17px * var(--text-scale,1))}.token-wallet small{color:#9184a3;font-size:calc(8px * var(--text-scale,1));line-height:1.35}.token-wallet button{margin-top:7px;padding:6px 8px;font-size:calc(7px * var(--text-scale,1));background:#302541;color:#cdb8e9;border-color:#5e4b77}
.token-economy-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 auto 12px;width:min(1180px,100%)}.token-economy-strip>div{padding:10px 12px;border:1px solid #353347;border-radius:9px;background:#151720}.token-economy-strip span,.token-economy-strip strong,.token-economy-strip small{display:block}.token-economy-strip span{color:#8c7ba7;font-size:calc(7px * var(--text-scale,1));font-weight:900;letter-spacing:.8px}.token-economy-strip strong{margin:3px 0;color:#e6d5ff;font-size:calc(13px * var(--text-scale,1))}.token-economy-strip small{color:#817b8b;font-size:calc(8px * var(--text-scale,1))}
.market-access-lock{margin:0 0 10px;padding:10px 12px;border:1px solid #644d27;border-radius:8px;background:#211a10;color:#d7bc83;font-size:calc(9px * var(--text-scale,1));line-height:1.45}.market-access-lock.ok{border-color:#355e4a;background:#132219;color:#a9d7bd}.market-access-lock strong{color:#ffe0a0}.market-access-lock.ok strong{color:#b8f0cd}.market-access-lock.ok.conta-nova{border-color:#8a6a2a;background:#2a2010;color:#f0d79a}.market-access-lock.ok.conta-nova strong{color:#ffd27a}
.market-fee-preview .market-anomaly{display:block;margin-top:6px;color:#ffca78}.market-fee-preview .market-safe{display:block;margin-top:6px;color:#8ac9a2}
.store-pack-card.token-pack{border-color:#5a4774;background:linear-gradient(145deg,#231a31,#161920)}.store-pack-card.token-pack .pack-icon{font-size:calc(33px * var(--text-scale,1));color:#d9bcff}.store-pack-card.utility-premium{border-color:#4d3c62;background:linear-gradient(145deg,#21192b,#151920)}
.premium-item-wallet{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px}.premium-item-chip{display:flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid #3a3346;border-radius:7px;background:#16141c;color:#cbbadf;font-size:calc(8px * var(--text-scale,1))}.premium-item-chip strong{color:#f0e4ff}.premium-item-chip button{padding:5px 7px;font-size:calc(7px * var(--text-scale,1))}
.soul-guard-option{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;padding:9px 10px;border:1px solid #4f4560;border-radius:8px;background:#191621}.soul-guard-option>div{display:grid;gap:2px}.soul-guard-option strong{color:#dac8ef;font-size:calc(9px * var(--text-scale,1))}.soul-guard-option small{color:#90859e;font-size:calc(8px * var(--text-scale,1));line-height:1.35}.soul-guard-option label{display:flex;align-items:center;gap:6px;color:#c5b2dc;font-size:calc(8px * var(--text-scale,1));font-weight:900;white-space:nowrap}
.market-listing .escrow-badge{display:inline-block;margin-left:5px;padding:2px 5px;border-radius:4px;background:#29223a;color:#bca7d5;font-size:.85em}.market-closed-loop-note{margin-top:8px;color:#8d8399;font-size:calc(8px * var(--text-scale,1));line-height:1.4}
@media(max-width:900px){.token-economy-strip{grid-template-columns:1fr}.token-wallet{width:100%;box-sizing:border-box}}
.market-dev-seed{align-self:flex-start;padding:7px 9px;border-color:#56446c;background:#261e31;color:#d9c2f4;font-size:calc(7px * var(--text-scale,1));white-space:nowrap}.market-listing .external-market-badge{display:inline-block;margin-left:5px;padding:2px 5px;border-radius:4px;background:#173127;color:#88d6ac;font-size:.85em}.market-listing-actions .buy-player{background:#254b39;border-color:#39785a;color:#b9f1d0}
/* v0.69 — controles DEV e quantidade fixa de Wings */
.market-dev-actions{display:flex;justify-content:flex-end;align-items:flex-start;gap:6px;flex-wrap:wrap}
.market-dev-renew{border-color:#6b5b3c;background:#2d271d;color:#eed79c}
.market-fixed-quantity{display:grid;place-items:center;min-width:76px;min-height:34px;padding:6px 10px;border:1px solid #4a5565;border-radius:4px;background:#171c24;color:#dbe5f2;font-size:calc(8px * var(--text-scale,1));font-weight:900;white-space:nowrap}
@media(max-width:720px){.market-dev-actions{justify-content:flex-start;width:100%}}
/* ==========================================================================
ARCHANGEL JOURNEY — BANNER UNIFICADO PREMIUM
========================================================================== */
.store-archangel-journey-card{
grid-column: 1 / -1;
display: grid;
gap: 12px;
padding: 16px 20px;
border: 1px solid #d4af37;
border-radius: 12px;
background: linear-gradient(135deg, rgba(42, 28, 66, 0.95), rgba(18, 16, 26, 0.98)), radial-gradient(ellipse at 80% 20%, rgba(212, 175, 55, 0.18), transparent 70%);
box-shadow: 0 4px 20px rgba(0,0,0,0.5), inset 0 0 15px rgba(212, 175, 55, 0.12);
margin-bottom: 8px;
}
.archangel-journey-header{
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 8px;
border-bottom: 1px solid rgba(212, 175, 55, 0.25);
padding-bottom: 8px;
}
.archangel-journey-header h3{
margin: 0;
color: #f7e3ad;
font-family: 'Cinzel', serif;
font-size: calc(14px * var(--text-scale, 1));
letter-spacing: 1.5px;
display: flex;
align-items: center;
gap: 6px;
}
.archangel-journey-steps{
display: flex;
gap: 6px;
flex-wrap: wrap;
}
.archangel-journey-step{
padding: 3px 8px;
border-radius: 6px;
font-size: calc(8px * var(--text-scale, 1));
font-weight: 800;
letter-spacing: 0.5px;
}
.archangel-journey-step.done{
background: rgba(46, 204, 113, 0.18);
border: 1px solid #2ecc71;
color: #a3e9b9;
}
.archangel-journey-step.current{
background: rgba(212, 175, 55, 0.28);
border: 1px solid #f1c40f;
color: #fff1a8;
box-shadow: 0 0 8px rgba(241, 196, 15, 0.4);
}
.archangel-journey-step.locked{
background: rgba(255, 255, 255, 0.05);
border: 1px solid #3d3b48;
color: #7d798c;
}
.archangel-journey-body{
display: grid;
grid-template-columns: auto 1fr auto;
align-items: center;
gap: 16px;
}
@media(max-width: 768px){
.archangel-journey-body{grid-template-columns: 1fr; text-align: center;}
}
.archangel-item-preview{
width: 64px;
height: 64px;
border-radius: 10px;
background: rgba(0,0,0,0.4);
border: 1px solid #f1c40f;
display: grid;
place-items: center;
box-shadow: 0 0 12px rgba(241, 196, 15, 0.25);
}
.archangel-item-preview img{
width: 48px;
height: 48px;
object-fit: contain;
filter: drop-shadow(0 0 6px rgba(241, 196, 15, 0.6));
}
.archangel-item-info h4{
margin: 0 0 4px;
color: #ffffff;
font-size: calc(12px * var(--text-scale, 1));
}
.archangel-item-info p{
margin: 0 0 6px;
color: #b5a8c9;
font-size: calc(9px * var(--text-scale, 1));
line-height: 1.4;
}
.archangel-rewards-tag{
display: inline-flex;
gap: 8px;
color: #ffd700;
font-weight: 800;
font-size: calc(8.5px * var(--text-scale, 1));
}
.archangel-buy-action{
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 6px;
}
@media(max-width: 768px){
.archangel-buy-action{align-items: center;}
}
.archangel-buy-action strong{
font-size: calc(16px * var(--text-scale, 1));
color: #ffd700;
}
.archangel-buy-action button{
padding: 8px 16px;
background:var(--botao-ouro-fundo);
color:var(--botao-ouro-texto);
font-weight: 900;
border:1px solid var(--botao-ouro-borda);
border-radius: 6px;
cursor: var(--cur-mao,pointer);
box-shadow: 0 2px 10px rgba(241, 196, 15, 0.35);
transition: transform 0.15s ease, filter 0.15s ease;
}
.archangel-buy-action button:hover:not(:disabled){
transform: translateY(-2px);
filter: brightness(1.1);
}
/* ==========================================================================
VIP HUB & REFERRAL HUB (MONETIZAÇÃO E PROGRESSÃO)
========================================================================== */
.vip-permanent-strip{
grid-column: 1 / -1;
display: grid;
gap: 10px;
padding: 14px 18px;
border: 1px solid #7c3aed;
border-radius: 10px;
background: linear-gradient(135deg, rgba(30, 20, 50, 0.95), rgba(15, 12, 22, 0.95));
margin-bottom: 8px;
}
.vip-permanent-header{
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 8px;
}
.vip-badge-pill{
display: inline-flex;
align-items: center;
gap: 6px;
padding: 3px 10px;
border-radius: 999px;
background: linear-gradient(135deg, #a855f7, #6b21a8);
color: #ffffff;
font-weight: 950;
font-size: calc(9.5px * var(--text-scale, 1));
letter-spacing: 0.5px;
}
.vip-progress-bar-wrap{
width: 100%;
height: 10px;
border-radius: 5px;
background: rgba(0,0,0,0.5);
border: 1px solid #4c1d95;
overflow: hidden;
position: relative;
}
.vip-progress-bar-fill{
height: 100%;
background: linear-gradient(90deg, #9333ea, #c084fc);
border-radius: 5px;
transition: width 0.3s ease;
}
.vip-benefit-summary{
color: #c4b5fd;
font-size: calc(8.5px * var(--text-scale, 1));
line-height: 1.4;
}
/* Referrals / Indique & Ganhe */
.referral-card{
grid-column: 1 / -1;
padding: 14px 18px;
border: 1px solid #059669;
border-radius: 10px;
background: linear-gradient(135deg, rgba(16, 45, 34, 0.95), rgba(10, 20, 16, 0.95));
margin-bottom: 8px;
display: grid;
gap: 10px;
}
.referral-header{
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 8px;
}
.referral-code-box{
display: inline-flex;
align-items: center;
gap: 8px;
padding: 4px 10px;
background: #064e3b;
border: 1px dashed #34d399;
border-radius: 6px;
color: #a7f3d0;
font-family: monospace;
font-size: calc(11px * var(--text-scale, 1));
font-weight: 900;
}
.referral-code-box button{
padding: 3px 8px;
background: #10b981;
color: #064e3b;
font-weight: 900;
border: none;
border-radius: 4px;
cursor: var(--cur-mao,pointer);
}
/* "Um amigo te indicou?" (0020): some depois de ligar ou quando o prazo passa. */
.referral-friend{display:grid;gap:6px;padding-top:8px;border-top:1px solid rgba(52,211,153,.25);color:#d1fae5;font-size:.88em}
.referral-friend-row{display:flex;gap:8px;flex-wrap:wrap}
.referral-friend-row input{flex:1 1 160px;min-width:0;min-height:36px;padding:6px 10px;background:#052e22;border:1px solid #34d399;border-radius:6px;color:#ecfdf5;font-family:monospace;font-size:1em;font-weight:800;text-transform:uppercase}
.referral-friend-row button{min-height:36px;padding:6px 14px;background:#10b981;color:#064e3b;font-weight:900;border:none;border-radius:6px;cursor:var(--cur-mao,pointer)}
.referral-friend-row button:disabled{opacity:.5;cursor:var(--cur-seta,default)}
.referral-friend small{color:#a7f3d0;opacity:.8}
.referral-friend-done{margin:0;color:#a7f3d0;font-size:.88em}
/* Cartão "A + WhatsApp" (0061, 28/09): as cores e letras da Loja B; o link é o principal. */
.referral-card.ref-a{gap:12px;padding:16px 18px;border-color:#6b5426;background:linear-gradient(180deg,#241b0d,#17120a);box-shadow:inset 0 0 0 1px #2b2110;color:#e9dcbc;min-width:0}
.ref-a .ref-titulo{margin:0;color:#fff1c9;font-family:Georgia,"Times New Roman",serif;font-size:calc(19px * var(--text-scale,1))}
.ref-a .ref-passos{margin:0;padding-left:1.3em;display:grid;gap:4px;color:#d6c7a3;font-size:calc(13.5px * var(--text-scale,1));line-height:1.45}
.ref-a .ref-regras{margin:0;color:#b8a984;font-size:calc(12.5px * var(--text-scale,1))}
.ref-a .ref-link{display:flex;gap:8px;align-items:stretch;min-width:0}
.ref-a .ref-url{flex:1 1 auto;min-width:0;display:flex;align-items:center;padding:0 12px;min-height:44px;border:1px solid #4a3a1c;border-radius:7px;background:#0f0c07;color:#fff1c9;font-family:ui-monospace,Consolas,monospace;font-size:13px;overflow:hidden}
.ref-a .ref-url span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;user-select:all}
.ref-a .ref-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border:0;border-radius:7px;font-weight:900;letter-spacing:.04em;cursor:var(--cur-mao,pointer);white-space:nowrap;font-size:calc(14px * var(--text-scale,1));text-decoration:none}
.ref-a .ref-ouro{background:var(--botao-ouro-fundo);color:var(--botao-ouro-texto);box-shadow:0 2px 0 #7a5a17}
.ref-a .ref-ouro.ref-copiado{background:linear-gradient(180deg,#6ee7a8,#22a06b);color:#05291a;box-shadow:0 2px 0 #11643f}
.ref-a .ref-sec{min-height:40px;padding:0 14px;background:transparent;border:1px solid #6b5426;color:#f3cf7a}
.ref-a .ref-zap{min-height:40px;padding:0 16px;background:#1f7a4d;color:#eafff3}
.ref-a .ref-acoes{display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:#b8a984;font-size:13px}
.ref-a .ref-cod code{color:#fff1c9;font-size:14px;letter-spacing:.06em}
.ref-a .ref-cont{display:flex;justify-content:space-between;align-items:baseline;gap:6px 10px;flex-wrap:wrap}
.ref-a .ref-cont strong{color:#fff1c9;font-size:18px}
.ref-a .ref-joias{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
.ref-a .ref-joias img{vertical-align:-5px}
.ref-a .ref-joias em{font-style:normal;color:#b8a984}
.ref-a .ref-vazio{color:#b8a984}
.ref-a .ref-barra{height:10px;border-radius:99px;background:#0f0c07;border:1px solid #3d311a;overflow:hidden}
.ref-a .ref-barra i{display:block;height:100%;background:linear-gradient(90deg,#b8862b,#f3cf7a)}
.ref-a .ref-calmo{margin:0;padding:8px 12px;border-radius:7px;background:#1f1a10;border:1px solid #3d311a;color:#d6c7a3}
.ref-a .referral-friend{border-top-color:#3d311a;color:#b8a984}
.ref-a .referral-friend-row input{flex:1 1 0;width:0;min-height:40px;background:#0f0c07;border-color:#4a3a1c;color:#fff1c9}
.ref-a .referral-friend-row button{min-height:40px;background:#2a2112;border:1px solid #6b5426;color:#f3cf7a}
.ref-a .referral-friend small,.ref-a .referral-friend-done{color:#b8a984;opacity:1}
/* 1872 (17/10): giros de Sentinela por amigo + lista dos amigos (nome vermelho = mesma pessoa) */
.ref-a .ref-giros{display:grid;gap:8px;padding:12px;border:1px solid #4a3a1c;border-radius:9px;background:#120e08;min-width:0}
.ref-a .ref-giros-t{margin:0;display:flex;align-items:center;gap:8px;color:#fff1c9;font-size:calc(15px * var(--text-scale,1));overflow-wrap:anywhere}
.ref-a .ref-giros-t img{flex:0 0 auto}
.ref-a .ref-giros-txt{margin:0;color:#d6c7a3;font-size:calc(12.5px * var(--text-scale,1));line-height:1.45;overflow-wrap:anywhere}
.ref-a .ref-giros-aviso{color:#f2a3a3}
.ref-a .ref-degraus{display:grid;grid-template-columns:repeat(auto-fit,minmax(calc(76px * var(--text-scale,1)),1fr));gap:6px}
.ref-a .ref-degrau{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 4px;border:1px solid #6b5426;border-radius:7px;background:#1f1a10;min-width:0}
.ref-a .ref-degrau small{color:#b8a984;font-size:calc(11px * var(--text-scale,1));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.ref-a .ref-degrau b{color:#f7dc8f;font-size:calc(16px * var(--text-scale,1))}
.ref-a .ref-giros-total{display:flex;flex-wrap:wrap;gap:6px 14px;color:#b8a984;font-size:calc(13px * var(--text-scale,1))}
.ref-a .ref-giros-total b{color:#fff1c9}
.ref-a .ref-amigos{list-style:none;margin:0;padding:0;display:grid;gap:4px;max-height:260px;overflow-y:auto}
.ref-a .ref-amigo{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:4px 10px;align-items:center;padding:6px 10px;border-radius:7px;background:#1a150c;border:1px solid #2f2614;font-size:calc(13px * var(--text-scale,1))}
.ref-a .ref-amigo-nome{color:#fff1c9;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ref-a .ref-amigo-res{color:#b8a984;white-space:nowrap}
.ref-a .ref-amigo-sit{display:inline-flex;align-items:center;gap:4px;color:#f3cf7a;white-space:nowrap}
.ref-a .ref-amigo.ref-trava{border-color:#7a2626;background:#2a1010}
.ref-a .ref-amigo.ref-trava .ref-amigo-nome{color:#ff6b6b}
.ref-a .ref-amigo.ref-trava .ref-amigo-sit{color:#ff9a9a;font-weight:700;white-space:normal;text-align:right}
@media (max-width:520px){.ref-a .ref-amigo.ref-trava{grid-template-columns:minmax(0,1fr) auto}.ref-a .ref-amigo.ref-trava .ref-amigo-sit{grid-column:1/-1;text-align:left}}
@media (max-width:520px){
.referral-card.ref-a{padding:14px}
.ref-a .ref-link{flex-direction:column}
.ref-a .ref-link .ref-btn{width:100%}
.ref-a .ref-cont{flex-direction:column;align-items:flex-start}
.ref-a .ref-zap{flex:1 1 100%}
}
/* ===================================================================
LOJA DE SKINS (Fase 62)
Vitrine do tema em cartaz. Tres cartoes (set, arma, asa) e o pack.
A ARTE PODE NAO EXISTIR: `.skin-art-fallback` e o emoji que entra no
`onerror` do ![]()
. A loja funciona com zero PNG desenhado, que e o
mesmo principio das asas de Temporada -- o pipeline de asset nao
segura o sistema.
=================================================================== */
.skin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:14px 0}
.skin-card{
display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;
padding:12px 10px;border-radius:12px;
border:1px solid rgba(148,163,184,.25);background:rgba(15,23,42,.55);
}
.skin-card.owned{border-color:rgba(167,139,250,.55)}
.skin-card.equipped{border-color:rgba(74,222,128,.75);background:rgba(20,45,30,.45)}
/* Fase 121: a arte da skin é PINTADA (WebP em alta), não pixel -- `pixelated` a serrilhava, e 72 px a escondia.
Caixa de 168 px e desenho suave; o tamanho fino e a posição de cada peça vêm do Editor (`loja:`). */
.skin-card-art{display:flex;align-items:center;justify-content:center;height:168px;width:100%;overflow:visible}
.skin-art{max-width:160px;max-height:160px;object-fit:contain;image-rendering:auto}
.skin-art-fallback{font-size:3.6em;line-height:1;opacity:.75}
.skin-card strong{font-size:.95em}
.skin-card small{color:#94a3b8;font-size:.78em}
.skin-card button{width:100%;margin-top:4px}
.skin-aviso{color:#fbbf24 !important;font-size:.72em !important}
.skin-pack{
display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
padding:12px 14px;border-radius:12px;
border:1px dashed rgba(250,204,21,.4);background:rgba(60,50,10,.25);
}
.skin-pack small{display:block;color:#94a3b8;font-size:.78em}
.skin-next{margin-top:12px}
.skin-next strong{display:block;font-size:1.15em;margin:2px 0 6px}
.skin-next small{color:#94a3b8}
.skin-colecao{margin-top:12px}
.skin-colecao>small{display:block;color:#94a3b8;margin:2px 0 8px}
/* Grade compacta (06/10): um quadradinho por tema; o toque abre Set/Arma/Asa numa janela por cima. */
.skin-colecao-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px;margin-top:8px}
.skin-colecao-tema{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;width:auto;margin:0;
padding:6px 4px;border-radius:10px;border:1px solid rgba(167,139,250,.45);background:rgba(15,23,42,.6);color:#e2e8f0;font:inherit;cursor:var(--cur-mao,pointer)}
.skin-colecao-tema:hover{border-color:rgba(196,181,253,.9)}
.skin-colecao-tema.vestindo{border-color:rgba(74,222,128,.8);background:rgba(20,45,30,.45)}
.skin-colecao-tema img{width:100%;height:78px;object-fit:contain}
.skin-colecao-tema b{max-width:100%;font-size:.78em;line-height:1.15;text-align:center;overflow-wrap:anywhere}
.skin-colecao-pontos{margin-top:auto}
.skin-colecao-pontos{display:flex;gap:4px}
.skin-colecao-pontos i{width:7px;height:7px;border-radius:50%;background:#475569}
.skin-colecao-pontos i.tem{background:#a78bfa}
.skin-colecao-pontos i.vestida{background:#4ade80}
.skin-colecao-fita{position:absolute;top:4px;left:4px;max-width:calc(100% - 8px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
font-size:.6em;font-weight:700;background:#166534;color:#dcfce7;border-radius:4px;padding:1px 4px}
.skin-colecao-fundo{position:fixed;inset:0;z-index:1250;display:flex;align-items:center;justify-content:center;padding:12px;background:rgba(2,6,23,.72)}
.skin-colecao-janela{width:min(640px,100%);max-height:calc(100dvh - 24px);overflow:auto;padding:12px 14px;border-radius:14px;border:1px solid #6d28d9;background:#111827}
.skin-colecao-janela header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.skin-colecao-janela header strong{font-size:1.1em;min-width:0;overflow-wrap:anywhere}
.skin-colecao-x{width:auto;flex:0 0 auto;padding:4px 10px}
.skin-colecao-janela .skin-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0}
.skin-colecao-janela .skin-card{min-width:0}
.skin-colecao-janela .skin-card-art{height:120px}
.skin-colecao-janela .skin-art{max-width:100%;max-height:116px}
/* Botões discretos na janela (06/10, autor: "os botões ali tão amarelos demais"): escuros com borda dourada. */
.skin-colecao-janela button{background:rgba(250,204,21,.07);color:#fcd34d;border:1px solid rgba(250,204,21,.5);box-shadow:none;text-shadow:none}
.skin-colecao-janela button:hover:not(:disabled){background:rgba(250,204,21,.16);border-color:rgba(250,204,21,.8)}
.skin-colecao-janela button[data-skin-tirar]{color:#86efac;border-color:rgba(74,222,128,.5);background:rgba(74,222,128,.07)}
.skin-colecao-janela button:disabled{background:transparent;color:#64748b;border-color:rgba(100,116,139,.35);opacity:1}
.skin-colecao-janela .skin-colecao-x{color:#cbd5e1;border-color:rgba(148,163,184,.4);background:transparent}
@media (max-width:700px){
.skin-colecao-grade{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.skin-colecao-tema img{height:60px}
.skin-colecao-tema b{font-size:.68em}
.skin-colecao-fita{font-size:.5em}
.skin-colecao-janela .skin-card-art{height:84px}
.skin-colecao-janela .skin-art{max-height:80px}
.skin-colecao-janela .skin-card button{padding-left:4px;padding-right:4px}
}
/* VITRINE DE APARÊNCIA — opção C do autor (03/10): o próprio herói montado como na arena (o lutador da seleção e
da ficha, contexto `loja`), luz do tema, relógio, provador, pack em R$ ou Jewel e a prévia do próximo tema. */
.skin-vitrine{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:0;padding:0!important;overflow:hidden;
border-color:#4c3a7a!important;background:radial-gradient(ellipse at 28% 62%,#2b1a52 0,#140f24 55%,#0c0a14 100%)!important}
.skin-palco{position:relative;min-height:440px;overflow:hidden;display:flex;align-items:flex-end;justify-content:center}
.skin-palco-raios{position:absolute;inset:-40%;background:repeating-conic-gradient(from 0deg at 50% 58%,rgba(167,139,250,.08) 0 6deg,transparent 6deg 18deg);animation:skinGira 50s linear infinite;pointer-events:none}
@keyframes skinGira{to{transform:rotate(360deg)}}
.skin-palco-aura{position:absolute;left:50%;bottom:36px;width:300px;height:340px;transform:translateX(-50%);border-radius:50%;
background:radial-gradient(ellipse at 50% 62%,rgba(167,139,250,.38),transparent 66%);filter:blur(10px);animation:skinPulsa 2.6s ease-in-out infinite;pointer-events:none}
@keyframes skinPulsa{50%{opacity:.55;transform:translateX(-50%) scale(1.06)}}
@media (prefers-reduced-motion:reduce){.skin-palco-raios,.skin-palco-aura{animation:none}}
.skin-palco::after{content:"";position:absolute;left:50%;bottom:30px;width:260px;height:44px;transform:translateX(-50%);
background:radial-gradient(ellipse,rgba(167,139,250,.5) 0,rgba(124,58,237,.18) 45%,transparent 70%);pointer-events:none}
.loja-lutador-palco{position:relative;display:flex;align-items:flex-end;justify-content:center;width:100%;pointer-events:none}
.loja-lutador{position:relative;width:150px;height:150px;display:flex;align-items:flex-end;justify-content:center;transform-origin:50% 100%}
.loja-lutador img{max-height:none}
.loja-lutador .pvp-weapon-enh{display:none!important}
.loja-lutador .pvp-pet-companion img,.loja-lutador .pvp-pet-asset{width:100%!important;height:100%!important;object-fit:contain}
.skin-palco-heroi{z-index:1;margin-bottom:46px}
.skin-palco-heroi .loja-lutador{transform:scale(2.05)}
.skin-provador{position:absolute;top:12px;left:12px;z-index:3;display:flex;gap:6px;flex-wrap:wrap}
.skin-provador button{border:1px solid #6d4fc0;background:rgba(29,20,51,.85);color:#e9ddff;border-radius:999px;padding:7px 12px;font-size:12px}
.skin-provador button.on{background:#7c3aed;color:#fff}
.skin-provar-arena{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);z-index:3;white-space:nowrap;
border:1px solid #6d4fc0;background:rgba(29,20,51,.9);color:#e9ddff;border-radius:999px;padding:8px 14px;font-size:12px}
.skin-info{position:relative;z-index:1;display:flex;flex-direction:column;gap:10px;padding:22px 22px 18px 6px;min-width:0}
.skin-info .eyebrow{color:#c4b5fd;margin:0}
.skin-titulo{margin:0!important;font-family:var(--font-display)!important;font-size:clamp(30px,4.2vw,44px)!important;line-height:1.05;letter-spacing:1px;text-transform:uppercase;
background:linear-gradient(180deg,#fff,#c4b5fd);-webkit-background-clip:text;background-clip:text;color:transparent;overflow-wrap:anywhere}
.skin-relogio{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:13px;color:#e9ddff}
.skin-relogio-nums{display:inline-flex;gap:6px}
.skin-relogio-num{background:#2a1d4a;border:1px solid #5b3fa0;border-radius:8px;padding:5px 9px;font-weight:900;font-size:16px}
.skin-selo{margin:0;font-size:13px;line-height:1.4;color:#cfc6e6}
.skin-vitrine .skin-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0}
.skin-vitrine .skin-card{background:rgba(18,14,31,.8);border-color:#4c3a7a;padding:8px 6px;gap:4px}
.skin-vitrine .skin-card-art{height:96px}
.skin-vitrine .skin-art{max-width:100%;max-height:90px;filter:drop-shadow(0 0 6px rgba(139,92,246,.8))}
.skin-vitrine .skin-card strong{font-size:13px}
.skin-comprar{display:flex;align-items:center;justify-content:center;gap:4px;flex-wrap:wrap;color:var(--botao-ouro-texto);background:var(--botao-ouro-fundo);border-radius:9px;padding:8px 4px}
.skin-preco-antigo{opacity:.55;font-weight:700}
.skin-vitrine s .mercado-valor,.skin-vitrine s{text-decoration:line-through}
.skin-nota-primeira{margin:-2px 0 0;font-size:12px;color:#f6c86b}
.skin-vitrine .skin-pack{position:relative;border:1px solid rgba(215,169,68,.55);background:linear-gradient(90deg,#3a2a0e,#1d1609);padding:14px}
.skin-pack-fita{position:absolute;top:-10px;right:12px;background:#e14b4b;color:#fff;font-weight:900;font-size:12px;padding:3px 8px;border-radius:7px}
.skin-pack-texto{flex:1 1 160px;min-width:0}
.skin-pack-texto strong{font-size:16px}
.skin-vitrine .skin-pack small{color:#d9c79a}
.skin-pack-botoes{display:flex;gap:8px;flex-wrap:wrap}
.skin-pack-botoes button{padding:11px 14px;border-radius:9px;font-size:14px;color:var(--botao-ouro-texto);background:var(--botao-ouro-fundo)}
.skin-pack-botoes .skin-pack-jewel{color:#fff;background:linear-gradient(180deg,#9b6dff,#6d3fe0);display:inline-flex;align-items:center;gap:4px}
.skin-vitrine .mercado-valor{display:inline-flex;align-items:center;gap:3px}
/* O próximo tema: a arte meio revelada, para dar vontade sem estragar a surpresa. */
.skin-next{display:flex;align-items:center;gap:16px;overflow:hidden;background:linear-gradient(90deg,#10202b,var(--panel) 60%)!important}
.skin-next-arte{position:relative;flex:none;width:150px;height:120px}
.skin-next-arte img{position:absolute;object-fit:contain;filter:brightness(.38) saturate(.6) drop-shadow(0 0 10px rgba(95,183,255,.7))}
.skin-next-asa{left:0;top:0;width:100%;height:80%}
.skin-next-set{left:25%;top:6%;width:50%;height:94%}
/* PRÓXIMO TEMA COM CARA DE TRAILER (autor 07/10: "próximo tema broxante, nossa que feio"). A arte saía apagada a 38%
numa faixa escura: agora aparece de verdade, maior, com um brilho atrás, e a contagem vira um selo. */
.skin-next{position:relative;min-height:150px;border:1px solid rgba(143,208,255,.28)!important;background:radial-gradient(ellipse 340px 200px at 110px 50%,rgba(70,150,230,.35),transparent 70%),linear-gradient(90deg,#0d1b2a,#121726 55%,var(--panel))!important;box-shadow:inset 0 0 30px rgba(95,183,255,.08)}
.skin-next-arte{width:200px;height:150px}
.skin-next-arte img{filter:brightness(.95) saturate(1.05) drop-shadow(0 0 14px rgba(95,183,255,.55))}
.skin-next-texto .eyebrow{letter-spacing:.18em}
.skin-next-texto strong{font-size:30px;color:#eaf6ff;text-shadow:0 0 18px rgba(95,183,255,.45)}
.skin-next-conta{padding:8px 14px;border:1px solid rgba(143,208,255,.35);border-radius:12px;background:rgba(10,24,40,.7);text-align:center}
.skin-next-conta b{font-size:22px}
.skin-next-texto{flex:1;min-width:0}
.skin-next-texto .eyebrow{color:#8fd0ff;margin:0}
.skin-next-texto strong{display:block;font-family:var(--font-display);font-size:22px;margin:2px 0 4px}
.skin-next-conta{margin-left:auto;text-align:right;flex:none}
.skin-next-conta small{display:block;color:#94a3b8}
.skin-next-conta b{font-size:19px;color:#8fd0ff;white-space:nowrap}
/* A Coleção Arcanjo montada como na arena (03/10). */
.loja-destaque:has(.loja-colecao-heroi){grid-template-columns:minmax(220px,320px) minmax(0,1fr)}
.loja-colecao-palco:has(.loja-colecao-heroi){position:relative;overflow:hidden;min-height:330px;align-items:end;border-radius:10px;
background:radial-gradient(ellipse at 50% 60%,rgba(243,207,122,.28),transparent 68%)}
.loja-colecao-heroi{height:100%;padding-bottom:30px;box-sizing:border-box}
.loja-colecao-heroi .loja-lutador{transform:scale(1.3)}
/* O lutador da loja tem o tamanho da arena. `!important` porque responsivo.css (carregado por
ultimo) limita `.loja-destaque-arte img` a 96px no celular e achatava o corpo: o heroi descia
e o pet ficava solto no ar (relato do autor, 03/10). */
.loja-lutador-palco img{max-width:none!important;max-height:none!important}
@media (max-width:700px){.loja-destaque:has(.loja-colecao-heroi){grid-template-columns:1fr}}
/* CARTÃO COMPACTO (10/10, autor com texto em 130%: "olha o tamanho da caixa onde ele está"). A lista de tudo o que
vem esticava o cartão e o herói ficava pequeno no pé de uma caixa enorme. Agora a arte tem altura fixa e fica no
meio, e a lista vira colunas: as 5 peças e, embaixo, o Griffin, Gold, joias, Boosts e Selos em fichas menores. */
.loja-colecao{align-items:center}
.loja-colecao .loja-colecao-palco:has(.loja-colecao-heroi){align-self:center;height:340px;min-height:0}
.loja-colecao .loja-conteudo.loja-colecao-pecas{grid-template-columns:repeat(auto-fill,minmax(min(100%,calc(190px * var(--text-scale,1))),1fr));gap:5px}
.loja-colecao .loja-conteudo.loja-colecao-extras{grid-template-columns:repeat(auto-fill,minmax(min(100%,calc(150px * var(--text-scale,1))),1fr))}
.loja-colecao .loja-conteudo li{padding:4px 8px}
.loja-colecao .loja-conteudo li>img,.loja-colecao .loja-conteudo li .col-icone img{width:24px;height:24px}
.loja-colecao .loja-conteudo li>span:first-child{min-width:24px;font-size:16px}
.loja-colecao .loja-conteudo{gap:5px}
/* Tela média (celular deitado, janela estreita): a arte encolhe para a lista não virar uma coluna fina. */
@media (min-width:701px) and (max-width:1100px){.loja-destaque.loja-colecao:has(.loja-colecao-heroi){grid-template-columns:minmax(170px,220px) minmax(0,1fr)}.loja-colecao .loja-colecao-palco:has(.loja-colecao-heroi){height:280px}}
@media (max-width:700px){
.skin-vitrine{grid-template-columns:1fr}
.skin-palco{min-height:390px}
.skin-palco-heroi{margin-bottom:46px}
.skin-palco-heroi .loja-lutador{transform:scale(1.55)}
.skin-palco-aura{width:240px;height:280px}
.skin-info{padding:4px 12px 14px}
.skin-vitrine .skin-card-art{height:76px}
.skin-vitrine .skin-art{max-height:70px}
.skin-pack-botoes{width:100%}
.skin-pack-botoes button{flex:1 1 120px}
.skin-next{flex-wrap:wrap;gap:10px}
.skin-next-arte{width:130px;height:110px}
.skin-next-texto strong{font-size:24px}
.skin-next-conta{margin-left:0;text-align:left}
}
/* 06/11 (fotos do celular: "Chega em" por cima do nome e o texto espremido numa coluna): no celular a contagem vai
para baixo, na largura toda. */
@media (max-width:560px){
.skin-next-texto{flex:1 1 150px}
.skin-next-conta{flex:1 1 100%;margin-left:0;text-align:left;display:flex;align-items:baseline;gap:8px}
.skin-next-conta small{display:inline}
}
@media (max-height:500px) and (orientation:landscape){
.skin-palco{min-height:320px}
.skin-palco-heroi .loja-lutador{transform:scale(1.4)}
}
/* ==========================================================================
LOJA — direção B (28/09, escolhida pelo autor): trilho de categorias à
esquerda, destaque do próximo pack com o conteúdo à vista, cartões com
moldura e o preço DENTRO do botão. No celular o trilho vira uma faixa de
abas que rola para o lado (seção 29 do responsivo.css).
========================================================================== */
.loja-casca{display:grid;grid-template-columns:200px minmax(0,1fr);gap:0;width:min(1180px,100%);margin:0 auto;border:1px solid #4a3a1c;border-radius:12px;overflow:hidden;background:radial-gradient(120% 60% at 60% 0%,#2a2113 0%,#16120c 55%,#100d09 100%)}
.loja-trilho{display:flex;flex-direction:column;gap:4px;padding:16px 10px;background:#120f0a;border-right:1px solid #3d311a}
.loja-trilho-titulo{padding:4px 10px 12px;color:#f3cf7a;font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:calc(16px * var(--text-scale,1));letter-spacing:.05em}
.loja-trilho .vendor-subtab{display:flex;justify-content:space-between;align-items:center;gap:6px;width:100%;padding:10px 12px;border:0;border-radius:7px;background:transparent;color:#d6c7a3;font-size:calc(13px * var(--text-scale,1));font-weight:700;letter-spacing:.2px;text-align:left;box-shadow:none}
.loja-trilho .vendor-subtab:hover{background:#221a0e;color:#fff1c9}
.loja-trilho .vendor-subtab.active{background:linear-gradient(90deg,#4b3a17,#2a2112);color:#fff3cf;box-shadow:inset 3px 0 0 #d9a441}
.loja-trilho .vendor-subtab em{font-style:normal;color:#9c8b66;font-size:.85em;font-weight:600}
.loja-trilho-rodape{margin-top:auto;padding:14px 10px 2px;color:#8d7f63;font-size:calc(11px * var(--text-scale,1));line-height:1.4}
/* 06/10: a seta "mais abas" só existe no celular (styles/responsivo.css). No PC ela caía como um botão dourado vazio
embaixo do trilho, no canto inferior esquerdo da Loja. */
.loja-trilho-seta{display:none}
.loja-vitrine{min-width:0;padding:16px 18px 20px;display:flex;flex-direction:column;gap:14px}
.loja-vitrine>.forge-panel-group>.wide-card,.loja-vitrine .market-layout,.loja-vitrine .token-economy-strip{width:100%;max-width:none}
.loja-barra.test-store-header{display:flex!important;justify-content:flex-end!important;margin:0;padding:0;border:0;background:none}
.loja-barra .store-account-strip{display:flex;gap:8px;justify-content:flex-end}
.loja-barra .token-wallet{grid-template-columns:auto auto;align-items:center;column-gap:10px;min-width:0;padding:8px 12px;border-color:#6b5426;background:#1b160d}
.loja-barra .token-wallet span{grid-column:1/-1;color:#b39d6a}
.loja-barra .token-wallet strong{margin:0;color:#e5d1ff;font-size:calc(20px * var(--text-scale,1))}
.loja-barra .token-wallet small{grid-column:1/-1}
.loja-barra .token-wallet .loja-link{grid-row:2;grid-column:2;justify-self:end}
.loja-barra .vip-store-status{padding:8px 12px}
/* Atalho MERCADO no topo da Loja (06/10): no PC, faixa da largura toda logo abaixo dos saldos (que não mudam de lugar);
no celular, antes dos saldos. Some na aba Mercado. */
.loja-barra.test-store-header{flex-wrap:wrap;gap:10px}
.loja-atalho-mercado{order:2;display:flex;align-items:center;gap:12px;flex:0 0 auto;width:100%;box-sizing:border-box;min-width:0;margin:0;padding:8px 14px;border:1px solid #8a6a2c;border-radius:10px;background:linear-gradient(100deg,#2c2210,#1a140b 70%);color:#fff1c9;text-align:left;cursor:var(--cur-mao,pointer);box-shadow:inset 0 0 0 1px #2b2110,0 0 18px rgba(217,164,65,.10)}
.loja-atalho-mercado:hover{border-color:#d9a441;background:linear-gradient(100deg,#3a2c13,#1f180c 70%)}
.loja-atalho-mercado-artes{display:flex;gap:4px;flex:none}
.loja-atalho-mercado-artes img{width:28px;height:28px;object-fit:contain;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.loja-atalho-mercado-texto{display:grid;gap:2px;min-width:0}
.loja-atalho-mercado-texto strong{color:#f3cf7a;font-size:calc(12px * var(--text-scale,1));letter-spacing:.08em}
.loja-atalho-mercado-texto small{color:#c9b98f;font-size:calc(11px * var(--text-scale,1));line-height:1.35;overflow-wrap:anywhere}
.loja-atalho-mercado-ir{flex:none;margin-left:auto;padding:6px 10px;border:1px solid #9a7631;border-radius:7px;background:#5c451e;color:#ffe9af;font-size:calc(11px * var(--text-scale,1));font-weight:800;letter-spacing:.06em}
.loja-atalho-mercado-ir::after{content:" ›"}
#storeView[data-loja-cat="market"] .loja-atalho-mercado{display:none}
@media(max-width:900px){.loja-atalho-mercado{order:0}}
#storePackList.store-pack-grid{display:flex;flex-direction:column;gap:14px;margin:0;padding:0;border:0;background:none;width:100%}
#storeView:not([data-loja-cat="utilidades"]):not([data-loja-cat="destaques"]) #premiumItemWallet{display:none}
#storeView[data-loja-cat="destaques"] .forge-panel-group[data-vendor-group-panel="packs"]{order:2}
#storeView[data-loja-cat="destaques"] #premiumItemWallet{order:3}
.loja-titulo{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-top:4px}
.loja-titulo h2{margin:0;color:#fff1c9;font-family:Georgia,"Times New Roman",serif;font-size:calc(20px * var(--text-scale,1))}
.loja-titulo small{color:#b8a984;font-size:calc(13px * var(--text-scale,1))}
.loja-titulo small a{color:#f3cf7a}
.loja-etapa{color:#f2a33a;font-size:calc(11px * var(--text-scale,1));font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.loja-destaque{display:grid;grid-template-columns:minmax(140px,210px) minmax(0,1fr);gap:18px;padding:16px;border:1px solid #6b5426;border-radius:10px;background:linear-gradient(180deg,#241b0d,#17120a);box-shadow:inset 0 0 0 1px #2b2110,0 0 40px rgba(217,164,65,.08)}
.loja-destaque-arte{display:grid;place-items:center;min-height:150px;background:radial-gradient(circle at 50% 45%,rgba(243,207,122,.2),transparent 65%)}
.loja-destaque-arte img{max-width:100%;max-height:180px;object-fit:contain}
.loja-trofeu{font-size:56px}
.loja-destaque-info{display:flex;flex-direction:column;gap:8px;min-width:0}
.loja-destaque h3{margin:0;color:#fff1c9;font-family:Georgia,"Times New Roman",serif;font-size:calc(22px * var(--text-scale,1))}
.loja-conteudo{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px;margin:0;padding:0;list-style:none}
/* 1791: o pacote cresce com o herói */
.loja-cresce{margin:6px 0 0;font-size:calc(11px * var(--text-scale,1));font-weight:700;color:#b9f0a0;line-height:1.3;overflow-wrap:anywhere}
.loja-conteudo li{display:flex;align-items:center;gap:8px;min-width:0;padding:6px 8px;border:1px solid #3a2e17;border-radius:6px;background:#0f0c07;color:#eadfc4;font-size:calc(13px * var(--text-scale,1))}
.loja-conteudo li img,.loja-conteudo li .col-icone img{width:28px;height:28px;object-fit:contain;flex:none}
.loja-conteudo li .col-icone{font-style:normal;font-size:20px;flex:none}
.loja-conteudo li span{overflow-wrap:anywhere}
.loja-destaque-pe{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.loja-destaque-pe small{color:#b8a984}
.loja-destaque .archangel-journey-steps{margin-top:2px}
.loja-comprar{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:8px 16px;border:1px solid var(--botao-ouro-borda);border-radius:7px;background:var(--botao-ouro-fundo);color:var(--botao-ouro-texto);font-weight:900;font-size:calc(14px * var(--text-scale,1));cursor:var(--cur-mao,pointer)}
.loja-comprar .mercado-valor{color:inherit}
.loja-comprar img{width:18px;height:18px}
.loja-comprar:disabled{border-color:#4a3d24;background:#2b2418;color:#9a8b6c;cursor:not-allowed}
.loja-comprar-grande{min-height:44px;padding:10px 22px;font-size:calc(15px * var(--text-scale,1))}
/* O BANNER DO PASSE LENDÁRIO (10/10, opção A "Cartaz" do autor). As cores vêm do tema (--lp-escuro/--lp-cor/--lp-claro,
paleta do golpe do tema), então cada mês do rodízio pinta o banner sozinho. Raios e brilho são gradientes parados (nada animado). */
.loja-tema.loja-passe{position:relative;display:block;overflow:hidden;min-height:250px;padding:22px 24px;border:1px solid rgba(var(--lp-claro),.55);border-radius:14px;color:#fff;
background:radial-gradient(120% 140% at 78% 60%,rgba(var(--lp-cor),.55),rgba(var(--lp-escuro),.35) 38%,#0b0714 72%);box-shadow:0 0 0 1px rgba(0,0,0,.6) inset,0 10px 30px rgba(var(--lp-escuro),.35)}
.loja-passe::before{content:"";position:absolute;inset:-40%;background:repeating-conic-gradient(from 0deg at 72% 62%,rgba(var(--lp-claro),.10) 0 6deg,transparent 6deg 18deg);pointer-events:none}
.loja-passe::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0b0714 0%,rgba(11,7,20,.85) 34%,transparent 62%);pointer-events:none}
.lp-txt{position:relative;z-index:2;display:flex;flex-direction:column;gap:8px;max-width:58%}
.lp-chip{align-self:flex-start;padding:3px 10px;border-radius:999px;background:rgba(var(--lp-cor),.28);border:1px solid rgba(var(--lp-claro),.6);color:rgb(var(--lp-claro));font-size:calc(11px * var(--text-scale,1));font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.loja-passe .lp-nome{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:900;letter-spacing:.04em;line-height:1.05;font-size:calc(40px * var(--text-scale,1));text-transform:uppercase;overflow-wrap:anywhere;
background:linear-gradient(180deg,#fff 10%,rgb(var(--lp-claro)) 55%,#f2c86a 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 6px rgba(var(--lp-escuro),.9))}
.lp-frase{margin:0;color:#efe8ff;font-size:calc(15px * var(--text-scale,1));line-height:1.35}
.lp-pecas{display:flex;flex-wrap:wrap;gap:6px}
.lp-peca{display:flex;flex-direction:column;align-items:center;min-width:64px;padding:5px 8px;border-radius:8px;background:rgba(0,0,0,.45);border:1px solid rgba(var(--lp-claro),.35)}
.lp-peca b{font-size:calc(13px * var(--text-scale,1))}.lp-peca small{color:rgb(var(--lp-claro));font-size:calc(11px * var(--text-scale,1))}
.lp-acao{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:4px}
.lp-cta{max-width:100%;min-height:44px;padding:10px 20px;border:1px solid var(--botao-ouro-borda);border-radius:8px;background:var(--botao-ouro-fundo);color:var(--botao-ouro-texto);font-weight:900;font-size:calc(15px * var(--text-scale,1));letter-spacing:.04em;cursor:var(--cur-mao,pointer);box-shadow:0 0 18px rgba(248,220,143,.35);overflow-wrap:anywhere}
.lp-fim{color:#d9cdf0;font-size:calc(12px * var(--text-scale,1));font-weight:700}
/* O herói fica DENTRO do banner (o autor: nada de personagem vazando da caixa): base no chão do cartão, topo com folga. */
.lp-heroi{position:absolute;z-index:1;top:14px;right:3%;bottom:0;width:40%;display:flex;align-items:flex-end;justify-content:center;pointer-events:none}
.lp-heroi .loja-lutador-palco{width:150px}
.lp-heroi .loja-lutador{transform:scale(1.3)}
.lp-heroi .loja-tema-arte{width:auto;height:90%;object-fit:contain}
/* 06/11: a montaria do tema ao lado do herói no cartaz do Passe (atrás dele, pisando no mesmo chão) */
.lp-heroi.com-montaria{width:48%;right:1%}
/* Com a montaria ao lado do herói, o texto fica mais estreito para a montaria não pisar nele (passe-cartaz-cabe-browser). */
.loja-passe.com-montaria .lp-txt{max-width:49%}
.lp-heroi .lp-montaria{position:absolute;left:0;bottom:4px;width:58%;max-width:230px;height:auto;object-fit:contain;z-index:0}
.lp-heroi.com-montaria>:not(.lp-montaria){position:relative;z-index:1;margin-left:34%}
/* 06/11 (autor): com a montaria ao lado, o herói vira para a esquerda, de frente para ela. */
.lp-heroi.com-montaria .loja-lutador{transform:scale(-1.3,1.3)}
.lp-heroi.com-montaria .loja-tema-arte{transform:scaleX(-1)}
.lp-peca-premium{border-color:rgba(243,207,122,.7)}
.lp-peca-premium small{color:#f3cf7a}
/* AS SKINS DE DATA (2378, 28/10, Halloween): o mesmo Cartaz, com as 6 classes em cartõezinhos (arte, nome, preço ou ✓ SUA).
O texto ocupa mais largura que no Passe (as 6 classes precisam caber); o herói fica no canto direito. */
.loja-skins-data .lp-txt{max-width:67%}
.loja-skins-data .lp-heroi{width:31%}
.loja-skins-data .lp-heroi .loja-lutador{transform:scale(1.75)}
.loja-skins-data .lsd-bonus{color:rgb(var(--lp-claro));font-weight:800}
.lsd-seu{margin:0;font-size:calc(13px * var(--text-scale,1));color:#f3e7ff}
.lsd-classes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px;margin-top:2px}
@media (max-width:1200px){.lsd-classes{grid-template-columns:repeat(3,minmax(0,1fr))}.loja-skins-data .lp-nome{font-size:calc(30px * var(--text-scale,1))}}
.loja-skins-data .lp-nome{overflow-wrap:normal}
.lsd-card{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0;padding:6px 6px 8px;border-radius:10px;text-align:center;
background:linear-gradient(180deg,rgba(var(--lp-escuro),.55),rgba(8,5,14,.85));border:1px solid rgba(var(--lp-claro),.32)}
.lsd-card.atual{border-color:rgba(var(--lp-claro),.85);box-shadow:0 0 12px rgba(var(--lp-cor),.45)}
.lsd-card.sua{border-color:rgba(122,214,120,.7)}
.lsd-arte{display:block;width:100%;aspect-ratio:11/20;padding-top:5px;box-sizing:border-box;overflow:hidden;border-radius:7px;background:radial-gradient(80% 70% at 50% 60%,rgba(var(--lp-cor),.35),transparent 70%)}
/* O corpo inteiro, da cabeça aos pés (autor, 28/10: "cabeça cortada"): a arte é quadrada e o corpo ocupa a faixa do meio. */
.lsd-arte img{width:100%;height:100%;object-fit:cover;object-position:50% 0}
/* O CONTADOR no canto de cima, por cima do herói (autor: "falta um contador no lugar da data final"). */
.lsd-relogio{position:absolute;z-index:3;top:16px;right:18px;display:flex;flex-direction:column;align-items:flex-end;gap:1px;padding:7px 12px;border-radius:10px;
background:rgba(10,4,18,.78);border:1px solid rgba(var(--lp-claro),.7);box-shadow:0 0 14px rgba(var(--lp-cor),.45)}
.lsd-relogio small{color:#e8dcff;font-size:calc(10.5px * var(--text-scale,1));font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.lsd-contador{color:rgb(var(--lp-claro));font-size:calc(17px * var(--text-scale,1));font-weight:900;white-space:nowrap;font-variant-numeric:tabular-nums}
.lsd-card b{font-size:calc(11.5px * var(--text-scale,1));line-height:1.15;overflow-wrap:normal;word-break:normal;hyphens:manual}
.lsd-card small{color:rgb(var(--lp-claro));font-size:calc(10.5px * var(--text-scale,1));margin-bottom:4px}
.lsd-comprar{margin-top:auto;width:100%;min-height:32px;padding:5px 6px;border:1px solid var(--botao-ouro-borda);border-radius:7px;background:var(--botao-ouro-fundo);
color:var(--botao-ouro-texto);font-weight:900;font-size:calc(12.5px * var(--text-scale,1));cursor:var(--cur-mao,pointer);white-space:nowrap}
.lsd-sua{margin-top:auto;width:100%;box-sizing:border-box;min-height:32px;display:grid;place-items:center;border-radius:7px;background:rgba(47,143,62,.28);
border:1px solid rgba(122,214,120,.7);color:#bff5b8;font-weight:900;font-size:calc(12px * var(--text-scale,1))}
.lsd-desconto{margin-left:6px;padding:1px 6px;border-radius:999px;background:#7a1e1e;color:#fff;font-size:calc(11px * var(--text-scale,1))}
.lsd-vestir{min-height:44px;padding:10px 16px;border:1px solid rgba(var(--lp-claro),.8);border-radius:8px;background:rgba(0,0,0,.45);color:#fff;font-weight:900;
font-size:calc(13.5px * var(--text-scale,1));letter-spacing:.03em;cursor:var(--cur-mao,pointer);overflow-wrap:anywhere}
.loja-link-botao{margin-top:8px;padding:8px 14px;border:1px solid #8a74b8;border-radius:7px;background:transparent;color:#efe5ff;font-weight:700;cursor:var(--cur-mao,pointer)}
.loja-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.loja-cartao{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;padding:14px 12px 12px;border:1px solid #4a3a1c;border-radius:9px;background:#161209;text-align:center}
.loja-cartao h3{margin:2px 0 0;color:#fff1c9;font-size:calc(14px * var(--text-scale,1));overflow-wrap:anywhere}
.loja-cartao>small{flex:1;color:#b8a984;font-size:calc(12px * var(--text-scale,1));line-height:1.4}
.loja-cartao .loja-comprar{width:100%;margin-top:4px}
.loja-moldura{display:grid;place-items:center;width:84px;height:84px;border:1px solid #6b5426;border-radius:9px;background:radial-gradient(circle,#2b2310,#120e07)}
.loja-moldura img,.loja-moldura .col-icone img{width:60px;height:60px;object-fit:contain}
.loja-moldura .col-icone{font-style:normal;font-size:40px}
.loja-cartao-dark .loja-moldura{border-color:#5a4774;background:radial-gradient(circle,#2a1f3b,#120e18)}
.loja-selo{position:absolute;top:8px;left:8px;padding:2px 6px;border-radius:4px;background:#2a2112;color:#d9b45f;font-size:calc(10px * var(--text-scale,1));font-weight:800;letter-spacing:.06em}
/* Jewel of Dark (12/10, autor: "mais atrativos, com efeitos top e mais popular"). Pilha de joias que cresce com o
pacote, selo por pacote e brilho por degrau. Só transform/opacity animam (leve no Android e na Vega 11). */
.loja-cartao-dark{padding-top:34px;overflow:hidden;isolation:isolate;transition:transform .18s ease,box-shadow .18s ease}
.loja-cartao-dark>*{position:relative;z-index:1}
.loja-cartao-dark>.loja-selo{position:absolute;z-index:3}
.loja-cartao-dark:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(124,58,237,.25)}
.loja-cartao-dark .loja-moldura{position:relative;overflow:hidden}
.loja-pilha{position:absolute;inset:0;display:block}
.loja-moldura .loja-pilha-joia{position:absolute;height:auto;transform:translate(-50%,-50%);filter:drop-shadow(0 2px 4px rgba(0,0,0,.6));animation:lojaJoiaFlutua 3.2s ease-in-out infinite}
@keyframes lojaJoiaFlutua{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-56%)}}
/* Aura suave pulsando atrás da pilha (autor, 12/10: no lugar dos pontinhos brilhando). Cor por pacote. */
.loja-pilha::before{content:"";position:absolute;left:50%;top:52%;width:86%;height:86%;border-radius:50%;background:radial-gradient(circle,var(--loja-aura,rgba(192,132,252,.55)) 0,transparent 68%);transform:translate(-50%,-50%);animation:lojaAura 3.2s ease-in-out infinite}
@keyframes lojaAura{0%,100%{opacity:.45;transform:translate(-50%,-50%) scale(.9)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}}
.loja-dark-ouro{--loja-aura:rgba(243,207,122,.5)}
.loja-dark-divino{--loja-aura:rgba(255,236,170,.6)}
.loja-dark-bonus{display:inline-block;padding:3px 9px;border:1px solid #86efac;border-radius:999px;background:linear-gradient(180deg,#14532d,#0b3a1f);color:#bbf7d0;font-size:calc(11px * var(--text-scale,1));font-weight:900;letter-spacing:.03em;box-shadow:0 0 12px rgba(74,222,128,.35);max-width:100%;overflow-wrap:anywhere}
/* 2330: o Tesouro do Mês (último fim de semana do mês): o mesmo selo, em ouro. */
.loja-dark-bonus.loja-dark-tesouro{border-color:#fcd34d;background:linear-gradient(180deg,#78350f,#451a03);color:#fde68a;box-shadow:0 0 12px rgba(251,191,36,.4)}
/* 2521 (01/11, opção A do autor): "E AINDA LEVA" — os recursos que o pack manda para o herói */
.loja-jodr{list-style:none;margin:2px 0;padding:6px 7px;width:100%;box-sizing:border-box;display:grid;gap:3px;border:1px solid rgba(192,132,252,.35);border-radius:8px;background:rgba(20,12,32,.6);min-width:0}
.loja-jodr li{display:flex;flex-wrap:wrap;align-items:center;gap:1px 6px;text-align:left;font-size:calc(12.5px * var(--text-scale,1));color:#e9ddff;min-width:0;line-height:1.25}
.loja-jodr img{width:22px;height:22px;object-fit:contain;flex:0 0 auto}
.loja-jodr b{color:#ffd76a;font-weight:900;white-space:nowrap;flex:0 1 auto;min-width:0}
.loja-jodr span{overflow-wrap:anywhere;min-width:0;flex:1 1 6em}
.loja-jodr .loja-jodr-tit{display:block;text-align:center;font-size:calc(10px * var(--text-scale,1));letter-spacing:.12em;color:#c4b5fd;font-weight:800}
/* MAIS POPULAR (R$ 24,90, o mais comprado): faixa no topo e borda roxa pulsando. */
.loja-dark-popular{border-color:#a855f7;box-shadow:0 0 0 1px rgba(168,85,247,.35),0 0 18px rgba(168,85,247,.25)}
/* Faixa de ponta a ponta no topo: MAIS POPULAR, ESCOLHA DOS TOPS, IMPERIAL e DIVINO. */
/* Fica no fluxo (não por cima): se o texto quebrar em 2 linhas no celular, empurra o resto em vez de cobrir a arte. */
.loja-cartao-dark.loja-dark-popular>.loja-selo,.loja-cartao-dark.loja-dark-ouro>.loja-selo,.loja-cartao-dark.loja-dark-imperial>.loja-selo,.loja-cartao-dark.loja-dark-divino>.loja-selo{position:relative;top:auto;left:auto;align-self:stretch;margin:-34px -12px 0;min-height:28px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:0;padding:4px 8px;text-align:center;font-size:calc(11px * var(--text-scale,1));line-height:1.2;letter-spacing:.08em;overflow-wrap:anywhere}
.loja-dark-popular>.loja-selo{background:linear-gradient(90deg,#7c3aed,#c026d3,#7c3aed);color:#fff}
.loja-dark-popular::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 18px rgba(192,38,211,.35);animation:lojaPulsa 2.2s ease-in-out infinite;pointer-events:none;z-index:0}
@keyframes lojaPulsa{0%,100%{opacity:.35}50%{opacity:1}}
.loja-dark-valor .loja-selo{background:#1e2a4a;color:#93c5fd}
/* ESCOLHA DOS TOPS (R$ 99,90): dourado com um reflexo passando. */
.loja-dark-ouro{border-color:#d4a73a;background:linear-gradient(180deg,#221a0a,#161209)}
.loja-dark-ouro>.loja-selo{background:linear-gradient(90deg,#b8860b,#f3cf7a,#b8860b);color:#2a1b04}
.loja-dark-ouro .loja-moldura{border-color:#d4a73a;background:radial-gradient(circle,#3b2a0e,#120e07)}
.loja-dark-ouro .loja-moldura::after,.loja-dark-imperial .loja-moldura::after,.loja-dark-divino .loja-moldura::after{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:translateX(-160%) skewX(-12deg);animation:lojaReflexo 3.4s ease-in-out infinite;pointer-events:none;z-index:3}
@keyframes lojaReflexo{0%,55%{transform:translateX(-160%) skewX(-12deg)}100%{transform:translateX(330%) skewX(-12deg)}}
/* Degraus (1630): borda girando. IMPERIAL roxo e ouro; DIVINO todas as cores, raios de luz atrás da pilha. */
.loja-dark-imperial,.loja-dark-divino{border-color:transparent;background:#120c1c}
@property --loja-giro{syntax:"";inherits:false;initial-value:0deg}
.loja-dark-imperial::before,.loja-dark-divino::before{content:"";position:absolute;z-index:-2;inset:0;border-radius:inherit;background:conic-gradient(from var(--loja-giro),#7c3aed,#f3cf7a,#c026d3,#7c3aed,#f3cf7a,#7c3aed);animation:lojaGiroDaBorda 6s linear infinite}
.loja-dark-divino::before{background:conic-gradient(from var(--loja-giro),#f3cf7a,#f472b6,#a78bfa,#38bdf8,#4ade80,#f3cf7a)}
@keyframes lojaGiroDaBorda{to{--loja-giro:360deg}}
.loja-dark-imperial::after,.loja-dark-divino::after{content:"";position:absolute;z-index:-1;inset:2px;border-radius:7px;background:radial-gradient(120% 80% at 50% 0%,#2a1645,#120c1c 70%)}
.loja-dark-divino::after{background:radial-gradient(120% 80% at 50% 0%,#3a2a12,#160f1f 70%)}
@keyframes lojaBordaGira{to{transform:translate(-50%,-50%) rotate(360deg)}}
.loja-dark-imperial{box-shadow:0 0 22px rgba(168,85,247,.35)}
.loja-dark-divino{box-shadow:0 0 26px rgba(243,207,122,.4)}
.loja-dark-imperial>.loja-selo{background:linear-gradient(90deg,#6d28d9,#c026d3);color:#fff}
.loja-dark-divino>.loja-selo{background:linear-gradient(90deg,#f3cf7a,#f472b6,#a78bfa);color:#1a0f02}
.loja-dark-imperial .loja-moldura{border-color:#a855f7;background:radial-gradient(circle,#3b1f5c,#120e18)}
.loja-dark-divino .loja-moldura{border-color:#f3cf7a;background:radial-gradient(circle,#4a3612,#140d1c)}
.loja-dark-divino .loja-moldura::before{content:"";position:absolute;left:50%;top:50%;width:160%;aspect-ratio:1;background:repeating-conic-gradient(rgba(255,236,170,.22) 0 10deg,transparent 10deg 30deg);transform:translate(-50%,-50%);animation:lojaBordaGira 14s linear infinite;pointer-events:none}
.loja-dark-imperial h3,.loja-dark-divino h3{color:#fde68a;text-shadow:0 0 10px rgba(243,207,122,.45)}
.loja-dark-imperial .loja-comprar,.loja-dark-divino .loja-comprar{background:var(--botao-ouro-fundo);border-color:var(--botao-ouro-borda);color:var(--botao-ouro-texto);font-weight:900;box-shadow:0 0 14px rgba(248,220,143,.35)}
/* O próximo degrau, trancado: prévia sem preço. */
.loja-dark-trancado .loja-pilha{filter:grayscale(.35) brightness(.8)}
.loja-dark-trancado::before{animation-duration:14s;opacity:.55}
.loja-cartao-dark .loja-dark-cadeado{background:rgba(10,6,18,.6);border:1px dashed #8a74b8;color:#d8c8f5;box-shadow:none;text-shadow:none;cursor:var(--cur-seta,default)}
.loja-dark-cadeado{display:flex;align-items:center;justify-content:center;min-height:36px;box-sizing:border-box;padding:8px 10px;border:1px dashed #8a74b8;border-radius:7px;color:#d8c8f5;font-weight:800;letter-spacing:.06em;font-size:calc(12px * var(--text-scale,1))}
.loja-dark-trancado .loja-falta{color:#f3cf7a;font-weight:700}
@media (prefers-reduced-motion:reduce){.loja-cartao-dark *,.loja-cartao-dark *::before,.loja-cartao-dark *::after,.loja-cartao-dark::before,.loja-cartao-dark::after{animation:none!important}.loja-cartao-dark .loja-moldura::after{display:none}}
.loja-falta{min-height:1.4em;color:#b8a984;font-size:calc(12px * var(--text-scale,1))}
.loja-link{padding:0;border:0;background:none;color:#f3cf7a;font:inherit;font-weight:700;text-decoration:underline;cursor:var(--cur-mao,pointer);box-shadow:none;min-height:0}
/* Packs novos (0201): Kit Boas-Vindas, Título Fundador, Coleção Arcanjo, 1ª compra em dobro e molduras premium. */
.loja-pack-novo .loja-conteudo{grid-template-columns:repeat(auto-fill,minmax(min(100%,calc(220px * var(--text-scale,1))),1fr))}
.loja-pack-novo .loja-conteudo li span{overflow-wrap:normal;word-break:normal;hyphens:auto}
.loja-pack-novo .loja-conteudo li>span:first-child{flex:none;min-width:28px;text-align:center;font-size:18px;font-weight:900;color:#f3cf7a}
.loja-pack-novo .loja-destaque-arte .loja-trofeu{font-size:64px}
.loja-cartao-dobro{border-color:#3f8f5a;box-shadow:0 0 18px rgba(74,222,128,.12)}
.loja-cartao-dobro .loja-selo{background:#123321;color:#86efac}
.loja-cartao-moldura .loja-moldura{border-color:#4b6b9b;background:radial-gradient(circle,#18253b,#0b1220)}
.loja-sem-arte{font-size:40px;filter:grayscale(.6);opacity:.75}
/* A Coleção Arcanjo: todas as peças juntas (asa atrás, armadura no centro, elmo, arma, botas e o Griffin). */
.loja-colecao-palco{min-height:190px}
.loja-colecao-arte{position:relative;width:min(100%,250px);aspect-ratio:1/1;margin:0 auto}
.loja-colecao-arte img{position:absolute;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(0,0,0,.55))}
/* o cavaleiro vestido: asa atrás, armadura no centro, elmo em cima, botas embaixo, arma na mão; o Griffin ao lado */
.loja-colecao-arte .lca-asa{left:-5%;top:1%;width:110%;height:66%;filter:drop-shadow(0 0 18px rgba(243,207,122,.35))}
.loja-colecao-arte .lca-armadura{left:35%;top:23%;width:30%;height:32%;z-index:2}
.loja-colecao-arte .lca-elmo{left:41.5%;top:9%;width:17%;height:16%;z-index:3}
.loja-colecao-arte .lca-botas{left:38.5%;top:53%;width:23%;height:21%;z-index:1}
.loja-colecao-arte .lca-arma{left:60%;top:22%;width:30%;height:74%;z-index:4;transform:rotate(10deg)}
.loja-colecao-arte .lca-griffin{left:0;top:64%;width:34%;height:34%;z-index:5}
.loja-colecao-desenhada{max-width:100%;max-height:210px;object-fit:contain}
/* O Kit Boas-Vindas: a arte do título em cima, as duas peças com a quantidade embaixo, num brilho azul que
combina com a arte do Recém-chegado. */
.loja-kit{border-color:rgba(96,165,250,.45);box-shadow:0 0 22px rgba(59,130,246,.12)}
.loja-kit .loja-kit-palco{background:radial-gradient(circle at 50% 42%,rgba(96,165,250,.24),rgba(243,207,122,.08) 45%,transparent 70%)}
.loja-kit-arte{display:flex;flex-direction:column;align-items:center;gap:12px;width:min(100%,290px);margin:0 auto;padding:6px 0}
.loja-kit-arte .lkit-titulo{width:100%;max-height:none;height:auto;object-fit:contain;filter:drop-shadow(0 0 14px rgba(96,165,250,.45))}
.lkit-pecas{display:flex;justify-content:center;gap:14px}
.lkit-peca{position:relative;display:grid;place-items:center;width:74px;height:74px;border-radius:14px;border:1px solid rgba(243,207,122,.35);background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.08),rgba(0,0,0,.45));box-shadow:inset 0 0 12px rgba(0,0,0,.6)}
.lkit-peca img,.lkit-peca .col-icone{width:50px;height:50px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.6))}
.lkit-peca .col-icone img{width:100%;height:100%;object-fit:contain}
.lkit-dark{border-color:rgba(168,85,247,.55);box-shadow:inset 0 0 12px rgba(0,0,0,.6),0 0 14px rgba(168,85,247,.25)}
.lkit-selo{border-color:rgba(96,165,250,.55);box-shadow:inset 0 0 12px rgba(0,0,0,.6),0 0 14px rgba(96,165,250,.25)}
.lkit-peca b{position:absolute;right:-8px;bottom:-8px;padding:2px 7px;border-radius:999px;background:#f3cf7a;color:#1a1206;font-size:13px;font-weight:900;line-height:1.3;box-shadow:0 2px 6px rgba(0,0,0,.5)}
.loja-pack-novo .loja-conteudo li>img.lkit-mini-titulo{flex:none;width:64px;height:24px;object-fit:contain}
/* ==========================================================================
MERCADO — direção M1 (28/09, escolhida pelo autor): a lista vem primeiro,
filtro por moeda no topo, preço grande com a imagem e o nome da moeda, e a
venda em três campos (item, preço, moeda em botões).
========================================================================== */
.loja-vitrine .market-layout{grid-template-columns:minmax(0,1.55fr) minmax(250px,.8fr)}
.loja-vitrine .market-list-card{order:1}
.loja-vitrine .market-create-card{order:2;align-self:start}
.mercado-filtros{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.mercado-chips{display:flex;flex-wrap:wrap;gap:6px}
.mercado-chip{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:6px 12px;border:1px solid #2d3140;border-radius:999px;background:#161922;color:#b7bfd0;font-weight:800;font-size:calc(13px * var(--text-scale,1));cursor:var(--cur-mao,pointer);box-shadow:none}
.mercado-chip img{width:18px;height:18px;object-fit:contain}
.mercado-chip small{color:inherit;opacity:.75;font-weight:600;font-size:.85em}
.mercado-chip.ativo{background:#e9e4d6;border-color:#e9e4d6;color:#14161d}
.mercado-chip-dark.ativo{background:#b27cff;border-color:#b27cff;color:#140b24}
.mercado-chip-bless.ativo{background:#7fa6ff;border-color:#7fa6ff;color:#0d1530}
.mercado-chip-soul.ativo{background:#ff6b93;border-color:#ff6b93;color:#2a0714}
.mercado-chip-chaos.ativo{background:#f2a33a;border-color:#f2a33a;color:#2a1703}
.mercado-chip-gold.ativo{background:#e8c65a;border-color:#e8c65a;color:#2a2003}
.mercado-filtros-linha{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.mercado-filtro-campo{display:inline-flex;align-items:center;gap:8px;color:#8794a7;font-size:calc(12px * var(--text-scale,1));font-weight:800}
.mercado-filtro-campo select{padding:6px 8px;border:1px solid #3c4655;border-radius:6px;background:#111720;color:#e4e9f0}
.mercado-filtro-check{display:inline-flex;align-items:center;gap:6px;color:#cfd3de;font-size:calc(12px * var(--text-scale,1))}
.mercado-lista{display:grid;gap:6px}
.market-listing.mercado-linha{display:grid;grid-template-columns:48px minmax(0,1fr) minmax(120px,auto) minmax(150px,auto)!important;align-items:center;gap:12px;padding:8px 10px}
.mercado-linha .market-listing-icon{width:48px;height:48px}
.mercado-linha-info{display:grid;gap:2px;min-width:0}
.mercado-linha-info strong{overflow-wrap:anywhere}
.mercado-preco{display:grid;grid-template-columns:auto auto;align-items:center;justify-content:end;column-gap:6px;text-align:right}
.mercado-preco img{width:24px;height:24px;object-fit:contain}
.mercado-preco strong{font-size:calc(17px * var(--text-scale,1));font-variant-numeric:tabular-nums;white-space:nowrap}
/* 10/10: preço de bilhões no celular a 130%: "Gold" desce de linha, o número inteiro fica. */
@media (max-width:520px){.mercado-preco strong{white-space:normal;min-width:0}}
.mercado-preco small{grid-column:1/-1;color:#8794a7;font-size:calc(11px * var(--text-scale,1))}
.mercado-preco-dark strong{color:#d2b3ff}.mercado-preco-bless strong{color:#9dbbff}.mercado-preco-soul strong{color:#ff8fae}.mercado-preco-chaos strong{color:#ffbf66}.mercado-preco-gold strong{color:#f3d77a}
.mercado-linha .market-listing-actions,.mercado-linha .mercado-compra{display:flex!important;grid-template-columns:none!important;gap:6px;justify-content:flex-end;align-items:center}
.mercado-linha .mercado-compra input{width:64px!important;flex:none}
.mercado-vazio{padding:16px;text-align:center}
.mercado-rodape{display:block;margin-top:10px;color:#8794a7;font-size:calc(11.5px * var(--text-scale,1));line-height:1.5}
.mercado-moeda-campo{display:grid;gap:6px;margin-top:9px}
.mercado-moeda-campo>span{color:#8794a7;font-size:calc(8px * var(--text-scale,1));font-weight:900}
.mercado-moeda-select{display:none!important}
.mercado-moedas{display:grid;grid-template-columns:repeat(auto-fit,minmax(60px,1fr));gap:6px}
.mercado-moeda-botao{display:grid;justify-items:center;gap:2px;padding:7px 4px;border:1px solid #333848;border-radius:8px;background:#111720;color:#aab2c3;font-weight:800;font-size:calc(12px * var(--text-scale,1));cursor:var(--cur-mao,pointer);box-shadow:none}
.mercado-moeda-botao img{width:24px;height:24px;object-fit:contain}
.mercado-moeda-botao.ativo.mercado-chip-dark{border-color:#b27cff;color:#d2b3ff;background:#221733}
.mercado-moeda-botao.ativo.mercado-chip-bless{border-color:#7fa6ff;color:#9dbbff;background:#16213d}
.mercado-moeda-botao.ativo.mercado-chip-soul{border-color:#ff6b93;color:#ff8fae;background:#33121d}
.mercado-moeda-botao.ativo.mercado-chip-chaos{border-color:#f2a33a;color:#ffbf66;background:#2c200d}
.mercado-moeda-botao.ativo.mercado-chip-gold{border-color:#e8c65a;color:#f3d77a;background:#2a250f}
.mercado-linha .market-owner-badge{margin-left:6px}
/* Mercado de itens, preço fixo (03/10, opção B): a grade "Escolha na mochila" do formulário de venda
e o selo "Verificado pelo servidor" na linha do item. A borda da célula pega a cor da raridade (--borda). */
.mercado-item-grade-campo{display:grid;gap:6px;margin-top:9px;min-width:0}
.mercado-item-grade-titulo{color:#8794a7;font-size:calc(8px * var(--text-scale,1));font-weight:900}
.mercado-item-grade-titulo small{margin-left:4px;font-weight:600;color:#6f7a8b}
/* 17/10: com mochila cheia (214 itens) os quadrados encavalavam: a linha da grade encolhia e o aspect-ratio
não segurava a altura. Agora cada linha tem altura fixa e o quadrado ocupa a célula inteira. */
.mercado-item-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));grid-auto-rows:56px;align-content:start;gap:6px;height:auto;max-height:236px;overflow-y:auto;overscroll-behavior:contain;padding:2px}
.mercado-item-grade:empty{display:none}
.mercado-item-grade-topo{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 10px;min-width:0}
.mercado-item-grade-topo select{width:auto;max-width:100%;padding:5px 8px;border:1px solid #3c4655;border-radius:6px;background:#111720;color:#e4e9f0;font-size:calc(12px * var(--text-scale,1))}
.mercado-item-celula{position:relative;display:grid;place-items:center;width:100%;height:100%;min-width:0;min-height:0;padding:4px;border:1px solid var(--borda,#3c4655);border-radius:8px;background:#10151c;cursor:var(--cur-mao,pointer);box-shadow:none}
.mercado-item-celula img{width:100%;height:100%;max-width:44px;max-height:44px;object-fit:contain;image-rendering:pixelated}
.mercado-item-celula b{position:absolute;right:2px;bottom:2px;padding:0 3px;border-radius:4px;background:rgba(8,10,14,.82);color:#ffe9af!important;font-size:calc(10px * var(--text-scale,1));line-height:1.35;text-shadow:none}
.mercado-item-celula.ativo{background:#2a2213;outline:2px solid #e2c27a;outline-offset:1px}
/* 05/11: peça numa vaga da Fusão (não vende até sair da vaga): apagada, com a chama no canto. */
.mercado-item-celula.na-fusao{border-style:dashed;cursor:var(--cur-ajuda,help)}
.mercado-item-celula.na-fusao img{opacity:.42;filter:grayscale(.7)}
.mercado-item-fusao-selo{position:absolute;right:2px;top:1px;font-style:normal;font-size:calc(11px * var(--text-scale,1));line-height:1}
.mercado-item-grade-fusao{margin:4px 0 2px;color:#f0b37a;font-size:calc(11px * var(--text-scale,1));line-height:1.4;overflow-wrap:anywhere}
.mercado-item-grade-vazia{padding:10px;font-size:calc(11px * var(--text-scale,1));line-height:1.45;text-align:left}
.mercado-item-selo{color:#75d29a;font-weight:800}
/* A lista do Mercado numa coluna estreita (03/10): no Android deitado (761 a ~1000 px) a lista
divide a tela com o formulário e ficava com ~290 px; as 4 colunas da linha (ícone, nome, preço,
botão) passavam da borda e o preço caía em cima do nome. Abaixo de 560 px DE LISTA, vale o
desenho do celular em pé: preço embaixo do nome e o botão na linha de baixo. */
.loja-vitrine .market-list-card{container-type:inline-size}
@container (max-width:560px){
.market-listing.mercado-linha{grid-template-columns:44px minmax(0,1fr)!important;gap:6px 10px}
.mercado-linha .mercado-preco{grid-column:2;justify-content:start;text-align:left}
.mercado-linha .market-listing-actions,.mercado-linha .mercado-compra{grid-column:1/-1;justify-content:stretch}
.mercado-linha .mercado-compra button{flex:1}
}
/* Vitrine de 30 min (06/10, SQL 0731): o botão "ABRE EM mm:ss" legível, em âmbar, sem cara de botão quebrado. */
.market-listing .mercado-compra button.mercado-vitrine-botao:disabled,.market-listing .market-listing-actions button.mercado-vitrine-botao:disabled{opacity:1;background:rgba(255,182,77,.12);color:#ffcf7a;border:1px solid rgba(255,182,77,.55);cursor:not-allowed;font-variant-numeric:tabular-nums;filter:none}
.mercado-na-vitrine{color:#ffcf7a;font-weight:700}
.mercado-venda-publica .mercado-linha-info small span{color:#e8dcc0;font-weight:700}
/* ==========================================================================
MERCADO NOVO — opção A do autor (06/10). No site o Mercado tem 4 abas (#mercadoAbas) e o
#marketPanel[data-mercado-aba] decide o que aparece: em COMPRAR, MEUS e ÚLTIMAS VENDAS só a lista;
em VENDER só o formulário (passo a passo). Em COMPRAR: 3 destaques, faixa de joias e cartões.
========================================================================== */
#marketPanel:not([data-mercado-aba]) .mercado-so-online,#marketPanel[data-mercado-aba] .mercado-so-offline{display:none}
#marketPanel[data-mercado-aba] .market-layout{grid-template-columns:minmax(0,1fr)}
#marketPanel[data-mercado-aba] .market-list-card>.card-title-row{display:none}
#marketPanel[data-mercado-aba] .market-list-card,#marketPanel[data-mercado-aba] .market-create-card,#marketListings,#marketListings>*{min-width:0;max-width:100%}
#marketPanel[data-mercado-aba]:not([data-mercado-aba="vender"]) .market-create-card,
#marketPanel[data-mercado-aba]:not([data-mercado-aba="vender"]) .token-economy-strip{display:none}
#marketPanel[data-mercado-aba="vender"] .market-list-card{display:none}
#marketPanel[data-mercado-aba="vender"] .market-create-card{width:min(720px,100%);margin:0 auto;order:1}
#marketPanel[data-mercado-aba="vender"] .market-create-card .card-title-row p{margin:2px 0 0}
#marketPanel[data-mercado-aba="vendas"] [data-mercado-ultimas-vendas]{display:none}
.mercado-abas{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0 0 12px;border-bottom:1px solid #3d311a}
.mercado-abas-fila{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;max-width:100%}
.mercado-abas-fila::-webkit-scrollbar{display:none}
.mercado-aba{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:8px 14px;border:0;border-bottom:3px solid transparent;border-radius:0;background:transparent;color:#bfae86;font-weight:900;letter-spacing:.04em;font-size:calc(13px * var(--text-scale,1));box-shadow:none;cursor:var(--cur-mao,pointer);white-space:nowrap}
.mercado-aba:hover{color:#fff1c9}
.mercado-aba.ativo{color:#fff3cf;border-bottom-color:#d9a441}
.mercado-aba em{font-style:normal;min-width:20px;padding:1px 6px;border-radius:999px;background:#d9a441;color:#1a1408;font-size:.8em;text-align:center}
.mercado-limite{margin-left:auto;display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border:1px solid #3d311a;border-radius:999px;background:#120f0a;color:#cdbb92;font-size:calc(12px * var(--text-scale,1));margin-bottom:6px}
.mercado-limite .mercado-valor{color:#fff1c9;font-weight:900}
.mercado-secao{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:16px 0 8px}
.mercado-secao:first-child{margin-top:2px}
.mercado-secao h3{margin:0;color:#f3cf7a;font-family:Georgia,"Times New Roman",serif;font-size:calc(15px * var(--text-scale,1));letter-spacing:.05em;text-transform:uppercase}
.mercado-secao small{color:#8d7f63;font-size:calc(11.5px * var(--text-scale,1))}
/* destaques */
.mercado-destaques-caixa{position:relative}
.mercado-destaques{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.mercado-destaque{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;padding:30px 12px 12px;border:1px solid var(--mercado-cor,#4a3a1c);border-radius:12px;text-align:center;
background:radial-gradient(90% 70% at 50% 28%,color-mix(in srgb,var(--mercado-cor,#d9a441) 20%,transparent),transparent 70%),#15110b;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.mercado-destaque-selo{position:absolute;top:9px;left:9px;padding:3px 8px;border-radius:999px;background:#d9a441;color:#1a1408;font-size:calc(10px * var(--text-scale,1));font-weight:900;letter-spacing:.06em}
.mercado-destaque-raro .mercado-destaque-selo{background:#6ff0b0;color:#0b1d14}
.mercado-destaque-novo .mercado-destaque-selo{background:#5fb3ff;color:#06182b}
.mercado-destaque-arte{width:96px;height:96px}
.mercado-destaque-arte>img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(0,0,0,.55))}
.mercado-destaque .mercado-linha-info{justify-items:center}
.mercado-destaque .mercado-linha-info strong{color:#fff3cf;font-size:calc(14.5px * var(--text-scale,1))}
.mercado-destaque .mercado-linha-info small{color:#a99a77}
.mercado-destaque .mercado-compra,.mercado-cartao .mercado-compra{width:100%;margin-top:auto;display:flex}
.mercado-destaque .mercado-compra button,.mercado-cartao .mercado-compra button{flex:1;min-width:0;min-height:40px;white-space:normal;line-height:1.2}
.mercado-destaque .mercado-compra button,.mercado-cartao .mercado-compra button{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:2px 4px}
.mercado-botao-preco{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.mercado-botao-preco img{width:18px;height:18px;object-fit:contain}
.mercado-seta{display:none}
.mercado-bolinhas{display:none}
/* joias */
.mercado-livro-aberto{margin-top:8px}
/* grade de itens */
.mercado-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.mercado-cartao{display:flex;flex-direction:column;gap:8px;min-width:0;padding:10px;border:1px solid #3d311a;border-left:3px solid var(--mercado-cor,#4a3a1c);border-radius:10px;background:#15110b}
.mercado-cartao-topo{display:flex;align-items:center;gap:10px;min-width:0}
.mercado-cartao-topo>.mercado-arte{flex:none;width:46px;height:46px;object-fit:contain;border-radius:8px;background:radial-gradient(circle,color-mix(in srgb,var(--mercado-cor,#d9a441) 26%,transparent),transparent 70%)}
.mercado-cartao .mercado-linha-info strong{color:#fff3cf;font-size:calc(13px * var(--text-scale,1));line-height:1.2}
.mercado-cartao .mercado-linha-info small{color:#a99a77;font-size:calc(11px * var(--text-scale,1))}
.mercado-mais{display:flex;justify-content:center;margin-top:12px}
.mercado-mais .loja-link{padding:8px 18px;border:1px solid #4a3a1c;border-radius:999px}
.mercado-filtros select{min-height:34px;padding:5px 8px;border:1px solid #3c4655;border-radius:8px;background:#111720;color:#e4e9f0;font-size:calc(12px * var(--text-scale,1));max-width:100%}
.mercado-filtros .mercado-filtro-check{min-height:36px;padding:0 6px}
/* vender passo a passo */
.mercado-passo-titulo{display:block;margin:12px 0 6px;color:#f3cf7a;font-size:calc(11px * var(--text-scale,1));font-weight:900;letter-spacing:.06em}
.mercado-tipos-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.mercado-tipo{display:grid;justify-items:center;gap:3px;min-width:0;padding:10px 6px;border:1px solid #3d311a;border-radius:10px;background:#120f0a;color:#e8dcc0;box-shadow:none;cursor:var(--cur-mao,pointer);text-align:center}
.mercado-tipo img,.mercado-tipo .col-icone{width:40px;height:40px;object-fit:contain}
.mercado-tipo strong{font-size:calc(12px * var(--text-scale,1));overflow-wrap:anywhere;line-height:1.2}
.mercado-tipo small{color:#8d7f63;font-size:calc(10.5px * var(--text-scale,1))}
.mercado-tipo.ativo{border-color:#d9a441;background:linear-gradient(180deg,#3a2c12,#1a140b);outline:1px solid #d9a441}
.mercado-passo{display:flex;align-items:stretch;gap:6px;margin-top:4px}
.mercado-passo input{flex:1;min-width:0;text-align:center}
.mercado-passo button{flex:none;width:44px;min-height:40px;padding:0;border:1px solid #4a3a1c;border-radius:8px;background:#221a0e;color:#f3cf7a;font-size:20px;font-weight:900;box-shadow:none;cursor:var(--cur-mao,pointer)}
.mercado-passo button:disabled{opacity:.4}
.market-fee-preview .mercado-passo-titulo{margin-top:0}
.mercado-recebe{display:block;margin-top:8px;color:#e8dcc0;font-size:calc(14px * var(--text-scale,1))}
.mercado-recebe strong{font-size:1.15em;color:#fff3cf}
.market-fee-preview .mercado-recebe+small{display:block;color:#8d7f63;font-size:calc(11px * var(--text-scale,1))}
.mercado-chips{align-items:center}
@media (max-width:760px){
.mercado-limite{margin-left:0;width:100%;justify-content:center}
.mercado-abas{border-bottom:0}
.mercado-abas-fila{width:100%;border-bottom:1px solid #3d311a}
.mercado-aba{padding:8px 10px;font-size:calc(12px * var(--text-scale,1))}
.mercado-destaques{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;padding:0 24px 4px;scrollbar-width:none}
.mercado-destaques::-webkit-scrollbar{display:none}
.mercado-destaque{flex:0 0 82%;scroll-snap-align:center}
.mercado-seta{position:absolute;top:50%;z-index:2;display:flex;align-items:center;justify-content:center;width:34px;height:52px;margin-top:-26px;padding:0;border:1px solid #4a3a1c;border-radius:8px;background:rgba(18,15,10,.88);color:#f3cf7a;font:700 26px/1 Georgia,"Times New Roman",serif;box-shadow:none;cursor:var(--cur-mao,pointer)}
.mercado-seta[data-mercado-destaque-passo="-1"]{left:0}
.mercado-seta[data-mercado-destaque-passo="1"]{right:0}
.mercado-bolinhas{display:flex;justify-content:center;gap:8px;margin-top:8px}
.mercado-bolinhas button{width:10px;height:10px;min-height:0;padding:0;border:0;border-radius:50%;background:#4a3a1c;box-shadow:none}
.mercado-bolinhas button.ativo{background:#f3cf7a}
.mercado-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.mercado-chips .mercado-chip{flex:none}
.mercado-chips::-webkit-scrollbar{display:none}
.mercado-grade{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.mercado-cartao{padding:8px}
.mercado-cartao-topo{align-items:flex-start;gap:8px}
.mercado-cartao-topo>.mercado-arte{width:38px;height:38px}
.mercado-tipos-grade{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:380px){
.mercado-grade{grid-template-columns:minmax(0,1fr)}
}
/* Título Fundador (06/10, autor: "aqueles emojis genericos ... estão bem broxante"): a lista mostra a arte do
título e o mesmo selo FUNDADOR que aparece no chat, no lugar de 🏛️ e 💬. */
.loja-pack-novo .loja-conteudo li>span.loja-selo-fundador{display:inline-flex;align-items:center;justify-content:center;flex:none;min-width:64px;height:22px;padding:0 7px;box-sizing:border-box;border:1px solid rgba(147,197,253,.7);border-radius:11px;background:linear-gradient(180deg,#132339,#0a1322);white-space:nowrap;font-size:0}
.loja-pack-novo .loja-conteudo li>span.loja-selo-fundador>b{color:#bfdbfe;font:900 calc(10px * var(--text-scale,1))/1 system-ui,sans-serif;letter-spacing:.08em}
/* COMO FUNCIONA das joias (06/10, pedido do autor): primeiro quadrado da faixa e o balão que ele abre. */
.game-tooltip.rico .mercado-ajuda{width:min(320px,calc(100vw - 28px));padding:12px 14px;font-size:calc(12px * var(--text-scale,1));line-height:1.4;color:#e8dcc0}
.mercado-ajuda .mercado-ajuda-titulo{display:block;margin-bottom:8px;color:#f3cf7a;font-size:calc(13.5px * var(--text-scale,1))}
.mercado-ajuda ol{margin:0;padding:0;list-style:none;display:grid;gap:5px}
.mercado-ajuda li{display:block}
.mercado-ajuda li b{color:#6ff0b0;font-size:calc(11px * var(--text-scale,1));letter-spacing:.06em}
/* JOIAS COM VENDEDOR (07/10, 1030): cada anúncio com o nome de quem vende; a vitrine de 1 h e o destaque
do anúncio que veio do aviso do chat. */
.mercado-ofertas-topo{display:grid;gap:2px;padding:4px 2px 6px}
.mercado-ofertas-topo strong{color:#f0e2cc;letter-spacing:.5px}
.mercado-ofertas-topo small{color:#b9ab97}
.mercado-oferta-vendedor{color:#f0c96a;font-weight:800}
/* 26/10 (SQL 2315): "por Fulano" no cartão do item, numa linha só */
.mercado-item-vendedor{display:block;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mercado-oferta-joia.minha{border-color:rgba(240,201,106,.45)}
.mercado-oferta-joia.na-vitrine .market-listing-icon,.mercado-oferta-joia.na-vitrine .mercado-preco{opacity:.78}
.mercado-regra-joia{display:block;color:#d8c9a8;margin-top:4px;font-size:calc(12px*var(--text-scale,1))}
.mercado-em-foco{animation:mercadoEmFoco 1s ease-in-out 3;box-shadow:0 0 0 2px #6fd3c3,0 0 18px rgba(111,211,195,.55)!important}
@keyframes mercadoEmFoco{50%{box-shadow:0 0 0 2px #6fd3c3,0 0 4px rgba(111,211,195,.2)}}
@media (prefers-reduced-motion:reduce){.mercado-em-foco{animation:none}}
/* JANELA DOS ANÚNCIOS DA JOIA (07/10): a lista abre por cima, como as janelas rápidas da batalha (styles/janelas-rapidas.css),
e a tela Comprar fica no lugar. O corpo é um "container" para a linha virar o desenho do celular quando fica estreita. */
.jr-janela.jr-mercado-joia{width:min(760px,calc(100vw - 24px));max-height:min(88vh,780px);z-index:1161}
.jr-fundo-mercado-joia{z-index:1160} /* por cima do CHAT e da AJUDA (1150): o aviso do chat abre esta janela */
.jr-mercado-joia .jr-corpo{container-type:inline-size;padding:10px 12px 14px}
.jr-mercado-joia .jr-icone img{width:26px;height:26px;object-fit:contain}
.jr-mercado-joia .mercado-ofertas-topo{padding-top:0}
.jr-mercado-joia .mercado-ofertas-topo strong{display:none}
/* Celular deitado (761–900 px): o style.css manda o bloco de compra para a linha de baixo (regra do Mercado M1),
mas na janela a linha tem lugar para as 4 colunas; abaixo de 560 px de janela vale o desenho do celular. */
@media (max-width:900px) and (min-width:761px){
.jr-mercado-joia .mercado-linha .mercado-compra,.jr-mercado-joia .mercado-linha .market-listing-actions{grid-column:auto!important}
}
/* No celular (em pé ou deitado) os botões AJUDA e CHAT saem do caminho enquanto a janela está aberta, como nas outras janelas. */
@media (max-width:760px), (max-height:520px){
html.col-janela-da-joia .col-ajuda,html.col-janela-da-joia .col-chat{display:none!important}
}
/* Botões de compra do Mercado com a mesma cor dos da Loja (.loja-comprar), pedido do autor 07/10. */
#marketListings .buy.buy-player,.jr-mercado-joia .buy.buy-player{border:1px solid var(--botao-ouro-borda);border-radius:7px;background:var(--botao-ouro-fundo);color:var(--botao-ouro-texto);font-weight:900;box-shadow:none;text-shadow:none}
#marketListings .buy.buy-player .mercado-botao-preco,.jr-mercado-joia .buy.buy-player .mercado-botao-preco{color:inherit}
#marketListings .buy.buy-player:disabled,.jr-mercado-joia .buy.buy-player:disabled{border-color:#4a3d24;background:#2b2418;color:#9a8b6c;opacity:1}
/* 1231: item de mapa que a conta ainda não liberou — aparece, mas o botão fica travado */
.mercado-trava-mapa{display:block;color:#c9b48a;font-size:.92em;line-height:1.3;overflow-wrap:anywhere}
.market-listing .mercado-compra button.mercado-travado:disabled,.market-listing .market-listing-actions button.mercado-travado:disabled,button.buy.mercado-travado:disabled{opacity:1;background:rgba(120,110,95,.18);color:#bfb39a;border:1px solid rgba(190,170,130,.4);cursor:not-allowed;filter:none}
/* JORNADA DO ARCANJO SÓ POR ETAPAS (12/10): a trilha e o "Próxima etapa" abrem a prévia flutuante da etapa. */
button.archangel-journey-step{font-family:inherit;cursor:var(--cur-mao,pointer);transition:transform .15s,filter .15s}
button.archangel-journey-step:hover,button.archangel-journey-step:focus-visible{transform:translateY(-1px);filter:brightness(1.25)}
.loja-proxima-etapa{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:6px 12px;border:1px solid #6a5426;border-radius:8px;
background:linear-gradient(90deg,rgba(212,175,55,.14),rgba(212,175,55,.04));color:#eadfc4;font:inherit;font-size:calc(12px * var(--text-scale,1));cursor:var(--cur-mao,pointer);text-align:left;transition:border-color .15s,background .15s}
.loja-proxima-etapa span{color:#b8a984;text-transform:uppercase;letter-spacing:.8px;font-size:calc(10px * var(--text-scale,1));font-weight:800}
.loja-proxima-etapa b{color:#ffe6a3;font-weight:800}
.loja-proxima-etapa i{font-style:normal;color:#f5d27f;font-size:calc(18px * var(--text-scale,1));line-height:1}
.loja-proxima-etapa:hover,.loja-proxima-etapa:focus-visible{border-color:#f5d27f;background:linear-gradient(90deg,rgba(212,175,55,.26),rgba(212,175,55,.08))}
.loja-previa-fundo{position:fixed;inset:0;z-index:1250;display:flex;align-items:center;justify-content:center;padding:16px;
background:radial-gradient(ellipse at center,rgba(40,28,6,.55),rgba(2,4,12,.82));animation:loja-previa-fundo .2s ease-out}
.loja-previa{position:relative;width:min(440px,100%);max-height:calc(100dvh - 32px);overflow:auto;padding:0 18px 18px;border:1px solid #8a6d2c;border-radius:16px;
background:linear-gradient(180deg,#1d160b 0%,#120e07 55%,#0c0905 100%);box-shadow:0 0 0 1px rgba(255,215,120,.08) inset,0 20px 60px rgba(0,0,0,.65),0 0 40px rgba(212,175,55,.18);
color:#eadfc4;text-align:center;animation:loja-previa-entra .28s cubic-bezier(.2,.9,.3,1.2)}
.loja-previa-fechar{position:absolute;top:10px;right:10px;z-index:3;width:34px;height:34px;border:1px solid #5a4720;border-radius:50%;background:rgba(10,8,4,.75);color:#eadfc4;font-size:16px;cursor:var(--cur-mao,pointer)}
.loja-previa-fechar:hover{border-color:#f5d27f;color:#fff}
.loja-previa-palco{position:relative;height:190px;margin:0 -18px 6px;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:16px 16px 0 0;
background:radial-gradient(circle at 50% 55%,rgba(255,214,120,.22),transparent 62%)}
.loja-previa-raios{position:absolute;left:50%;top:55%;width:420px;height:420px;margin:-210px 0 0 -210px;opacity:.55;
background:repeating-conic-gradient(from 0deg,rgba(255,220,140,.22) 0deg 6deg,transparent 6deg 18deg);
-webkit-mask:radial-gradient(circle,#000 18%,transparent 62%);mask:radial-gradient(circle,#000 18%,transparent 62%);animation:loja-previa-gira 24s linear infinite}
.loja-previa-brilho{position:absolute;left:50%;top:55%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;background:radial-gradient(circle,rgba(255,230,160,.5),transparent 70%);animation:loja-previa-pulsa 2.6s ease-in-out infinite}
.loja-previa-palco img{position:relative;z-index:1;max-width:150px;max-height:150px;object-fit:contain;filter:drop-shadow(0 6px 18px rgba(0,0,0,.7)) drop-shadow(0 0 12px rgba(255,210,120,.35));animation:loja-previa-flutua 3.2s ease-in-out infinite}
.loja-previa-mais7{position:absolute;z-index:2;right:calc(50% - 92px);top:26px;padding:3px 9px;border:1px solid #fbe3a3;border-radius:999px;background:linear-gradient(180deg,#f5d27f,#c8912f);color:#2a1b04;font-weight:900;font-size:calc(14px * var(--text-scale,1));box-shadow:0 0 14px rgba(245,210,127,.55)}
.loja-previa-etapa{color:#e3b04b;font-size:calc(11px * var(--text-scale,1));font-weight:800;letter-spacing:1.6px;text-transform:uppercase}
.loja-previa h3{margin:4px 0 2px;color:#fff1c9;font-family:Cinzel,Georgia,serif;font-size:calc(22px * var(--text-scale,1));line-height:1.15}
.loja-previa-chamada{margin:0 0 10px;color:#cdbf9c;font-size:calc(13px * var(--text-scale,1));line-height:1.35}
.loja-previa-trilha{display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.loja-previa-trilha span{display:grid;place-items:center;width:28px;height:28px;border:1px solid #4a3d22;border-radius:50%;background:#15110a;color:#7d725a;font:800 calc(11px * var(--text-scale,1)) Cinzel,Georgia,serif}
.loja-previa-trilha span.done{border-color:#2ecc71;color:#a3e9b9;background:rgba(46,204,113,.15)}
.loja-previa-trilha span.esta{border-color:#f5d27f;color:#2a1b04;background:linear-gradient(180deg,#f5d27f,#c8912f);box-shadow:0 0 12px rgba(245,210,127,.6)}
.loja-previa-trilha i{width:16px;height:2px;background:#4a3d22}
.loja-previa .loja-conteudo{grid-template-columns:repeat(auto-fill,minmax(min(100%,calc(180px * var(--text-scale,1))),1fr));text-align:left}
.loja-previa-pe{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:14px}
.loja-previa-pe .loja-comprar{width:100%}
.loja-previa-pe small{color:#b8a984}
.loja-previa-status{width:100%;padding:9px 12px;border:1px dashed #5a4720;border-radius:8px;background:rgba(0,0,0,.25);color:#cdbf9c;font-size:calc(13px * var(--text-scale,1))}
.loja-previa-status.ok{border-style:solid;border-color:#2ecc71;color:#a3e9b9;background:rgba(46,204,113,.1)}
.loja-previa.locked .loja-previa-palco img{filter:drop-shadow(0 6px 18px rgba(0,0,0,.7)) drop-shadow(0 0 10px rgba(255,210,120,.25)) saturate(.9)}
@keyframes loja-previa-fundo{from{opacity:0}to{opacity:1}}
@keyframes loja-previa-entra{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
@keyframes loja-previa-gira{to{transform:rotate(360deg)}}
@keyframes loja-previa-pulsa{0%,100%{opacity:.55;transform:scale(.92)}50%{opacity:1;transform:scale(1.08)}}
@keyframes loja-previa-flutua{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media (max-width:480px){.loja-previa-fundo{padding:10px}.loja-previa{padding:0 14px 14px}.loja-previa-palco{height:160px;margin:0 -14px 6px}.loja-previa-palco img{max-width:124px;max-height:124px}.loja-previa-mais7{right:calc(50% - 80px)}}
@media (max-height:500px){.loja-previa-palco{height:120px}.loja-previa-palco img{max-width:96px;max-height:96px}.loja-previa-mais7{top:12px}}
@media (prefers-reduced-motion:reduce){.loja-previa,.loja-previa-fundo,.loja-previa-raios,.loja-previa-brilho,.loja-previa-palco img{animation:none}}
/* 1663: venda privada (campo "Vender só para", selo e faixa "Reservados para você") */
.mercado-para-campo input{width:100%;box-sizing:border-box;min-width:0}
.mercado-para-campo span{overflow-wrap:anywhere}
.mercado-reservado{display:block;color:#f2c96b;font-weight:800;overflow-wrap:anywhere}
.market-fee-preview .mercado-privado-aviso{display:block;margin-top:6px;color:#f2c96b;overflow-wrap:anywhere}
.mercado-secao-reservados h3{color:#f2c96b}
/* ETIQUETA DO GRAU NO MERCADO (23/10, autor: "no mercado eu não tenho como saber os itens que são nightmare, godlike"):
a mesma faixa do quadradinho da mochila (styles/item-grau.css) no desenho de cada anúncio, nos destaques, em Meus
anúncios e na grade "Escolha na mochila" do VENDER. */
.mercado-arte{position:relative;display:block;overflow:hidden}
.mercado-cartao-topo>.mercado-arte>img,.market-listing-icon.mercado-arte>img{display:block;width:100%;height:100%;object-fit:contain}
.mercado-arte>.item-grau-faixa{border-radius:0}
.mercado-destaque-arte>.item-grau-faixa{width:14px;font-size:9px;letter-spacing:1px;border-radius:6px 0 0 6px}
.mercado-item-celula{overflow:hidden}
/* o quadrado do cartão é baixo (46 px; 44 no celular): letra 6 px sem espaço para NIGHTMARE caber inteiro */
.mercado-cartao-topo>.mercado-arte>.item-grau-faixa,.market-listing-icon.mercado-arte>.item-grau-faixa{font-size:6px;letter-spacing:0}
@media (max-width:699px){html:not(#_) .mercado-cartao-topo>.mercado-arte{width:44px;height:44px}}
/* e o selo do grau, o mesmo da ficha, logo depois da raridade (a faixa no desenho é pequena para ler de longe) */
.mercado-linha-info small .item-grau{margin-left:5px;padding:0 5px;font-size:calc(9px * var(--text-scale,1));letter-spacing:.6px;line-height:1.45}
/* PREÇO SUGERIDO AO ANUNCIAR (24/10, SQL 2145): game.js precoSugeridoHtml. */
.market-fee-preview .mercado-dica{display:grid;gap:4px;margin:8px 0;padding:9px 11px;border:1px solid #5a4620;border-radius:10px;background:linear-gradient(180deg,#241b0c,#16110a);color:#e8dcc0;font-size:calc(13px * var(--text-scale,1));line-height:1.35;overflow-wrap:anywhere;min-width:0}
.market-fee-preview .mercado-dica-titulo{color:#f3cf7a;font-weight:900;font-size:calc(11px * var(--text-scale,1));letter-spacing:.08em}
.market-fee-preview .mercado-dica small{color:#a8987a;font-size:calc(11.5px * var(--text-scale,1))}
.market-fee-preview .mercado-dica.carregando{opacity:.7}
.market-fee-preview .mercado-dica img.inline-dark-jewel-icon{width:1.15em;height:1.15em;vertical-align:-.2em}
.market-fee-preview .mercado-dica-moedas{display:grid;grid-template-columns:repeat(auto-fit,minmax(64px,1fr));gap:6px;margin-top:4px}
.market-fee-preview .mercado-dica-moeda{display:grid;justify-items:center;gap:1px;min-width:0;padding:6px 4px;border:1px solid #333848;border-radius:8px;background:#111720;color:#e8dcc0;cursor:var(--cur-mao,pointer);box-shadow:none}
.market-fee-preview .mercado-dica-moeda img.inline-dark-jewel-icon{width:22px;height:22px;object-fit:contain;vertical-align:middle}
.market-fee-preview .mercado-dica-moeda b{font-size:calc(13px * var(--text-scale,1));max-width:100%;overflow-wrap:anywhere}
.market-fee-preview .mercado-dica-moeda.ativo{border-color:#d9a441;background:#2a200d;outline:1px solid #d9a441}
.market-fee-preview .mercado-dica-moeda.vazio{opacity:.5}
/* 27/10 INDIQUE & GANHE com tela própria (categoria "indique" da Loja). Desenho B (painel), escolhido pelo autor; o fim dos Destaques virou dois atalhos com arte (.loja-conta-atalhos). */
.loja-conta-atalhos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:12px;min-width:0}
.lca{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 16px;border-radius:12px;border:1px solid #4a3a1c;background:radial-gradient(120% 140% at 0% 0%,rgba(243,207,122,.12),transparent 55%),linear-gradient(180deg,#1f180c,#120e07);color:#e9dcbc;text-align:left;font:inherit;cursor:var(--cur-mao,pointer);min-width:0;transition:border-color .15s,transform .15s}
.lca:hover{border-color:#d9a441;transform:translateY(-1px)}
.lca.lca-vip{border-color:#5b3d8c;background:radial-gradient(120% 140% at 0% 0%,rgba(167,139,250,.2),transparent 55%),linear-gradient(180deg,#1b1229,#0f0a18)}
.lca.lca-vip:hover{border-color:#a78bfa}
.lca-arte{width:calc(52px * var(--text-scale,1));height:calc(52px * var(--text-scale,1));object-fit:contain;filter:drop-shadow(0 3px 6px rgba(0,0,0,.6))}
.lca-txt{display:grid;gap:3px;min-width:0}
.lca-txt small{color:#b8a984;font-size:calc(11.5px * var(--text-scale,1));text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.lca-vip .lca-txt small{color:#c4b5fd}
.lca-txt b{color:#fff1c9;font-size:calc(15px * var(--text-scale,1));overflow-wrap:anywhere}
.lca-tit{color:#d6c7a3;font-weight:700}
.lca-barra{display:block;height:6px;border-radius:99px;background:#0b0712;border:1px solid #3b2a5c;overflow:hidden}
.lca-barra i{display:block;height:100%;background:linear-gradient(90deg,#7c3aed,#c4b5fd)}
.lca-joias{display:flex;gap:4px}
.lca-ir{font-style:normal;color:#f3cf7a;font-weight:800;font-size:calc(13px * var(--text-scale,1));white-space:nowrap}
.lca-vip .lca-ir{color:#d8b4fe}
@media (max-width:420px){.lca{grid-template-columns:auto minmax(0,1fr)}.lca-ir{grid-column:2}}
.referral-card.ref-v2{gap:14px;padding:18px;border-radius:14px;border-color:#6b5426;background:radial-gradient(90% 60% at 50% 0%,rgba(243,207,122,.08),transparent 70%),linear-gradient(180deg,#1d160b,#110d07)}
.ref-v2 .rf-arte{object-fit:contain;flex:0 0 auto;filter:drop-shadow(0 3px 6px rgba(0,0,0,.55))}
.ref-v2 .rf-topo{display:flex;align-items:center;gap:14px;min-width:0}
.ref-v2 .rf-selo{width:calc(64px * var(--text-scale,1));height:calc(64px * var(--text-scale,1))}
.ref-v2 .ref-titulo{font-size:calc(24px * var(--text-scale,1));letter-spacing:.02em;background:linear-gradient(180deg,#fff4d2,#e9b85a);-webkit-background-clip:text;background-clip:text;color:transparent}
.ref-v2 .rf-lema{margin:2px 0 0;color:#cdbb92;font-size:calc(13.5px * var(--text-scale,1));overflow-wrap:anywhere}
.ref-v2 .rf-bloco{display:grid;gap:10px;padding:14px;border:1px solid #3d311a;border-radius:12px;background:linear-gradient(180deg,#17120a,#0f0c07);min-width:0}
.ref-v2 .rf-sub{margin:0;display:flex;align-items:center;gap:8px;color:#f3cf7a;font-size:calc(13px * var(--text-scale,1));text-transform:uppercase;letter-spacing:.1em;font-weight:900;overflow-wrap:anywhere}
.ref-v2 .rf-sub-arte{width:calc(26px * var(--text-scale,1));height:calc(26px * var(--text-scale,1))}
.ref-v2 .rf-sub-num{margin-left:auto;color:#fff1c9;letter-spacing:0}
.ref-v2 .rf-txt{margin:0;color:#d6c7a3;font-size:calc(13px * var(--text-scale,1));line-height:1.45;overflow-wrap:anywhere}
.ref-v2 .rf-numeros{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:10px;min-width:0}
.ref-v2 .rf-num{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:4px 10px;padding:10px 12px;border:1px solid #4a3a1c;border-radius:11px;background:linear-gradient(180deg,#221a0d,#151009);min-width:0}
.ref-v2 .rf-num .rf-arte{width:calc(40px * var(--text-scale,1));height:calc(40px * var(--text-scale,1))}
.ref-v2 .rf-num .rf-par{display:flex;align-items:center;font-style:normal}
.ref-v2 .rf-num .rf-par .rf-arte{width:calc(28px * var(--text-scale,1));height:calc(28px * var(--text-scale,1))}
.ref-v2 .rf-num .rf-par .rf-arte+.rf-arte{margin-left:-6px}
.ref-v2 .rf-num>span{display:grid;min-width:0}
.ref-v2 .rf-num small{color:#b8a984;font-size:calc(11.5px * var(--text-scale,1));text-transform:uppercase;letter-spacing:.07em;font-weight:800}
.ref-v2 .rf-num b{color:#fff1c9;font-size:calc(18px * var(--text-scale,1));overflow-wrap:anywhere}
.ref-v2 .rf-num b em{font-style:normal;color:#b8a984;font-size:.72em;font-weight:700}
.ref-v2 .rf-num .ref-barra,.ref-v2 .rf-num .rf-num-mes{grid-column:1/-1}
.ref-v2 .rf-num .rf-num-mes{text-transform:none;letter-spacing:0;font-weight:600}
.ref-v2 .ref-barra{height:7px}
.ref-v2 .rf-passos{list-style:none;margin:0;padding:0;display:grid;gap:8px;counter-reset:rfp}
.ref-v2 .rf-passos li{counter-increment:rfp;position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center;padding:10px 12px;border:1px solid #3d311a;border-radius:11px;background:#15100a;color:#e2d3ae;font-size:calc(13px * var(--text-scale,1));line-height:1.45;overflow-wrap:anywhere}
.ref-v2 .rf-passos li::before{content:counter(rfp);position:absolute;left:6px;top:6px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,#f7dc8f,#d9a441);color:#2a1d05;font-size:11px;font-weight:900;z-index:1}
.ref-v2 .rf-passos .rf-arte{width:calc(44px * var(--text-scale,1));height:calc(44px * var(--text-scale,1))}
.ref-v2 .rf-premio-joias{grid-template-columns:auto minmax(0,1fr);align-items:center}
.ref-v2 .rf-premio-joias>div{display:grid;gap:6px;min-width:0}
.ref-v2 .rf-premio-arte{position:relative;width:calc(70px * var(--text-scale,1));height:calc(64px * var(--text-scale,1))}
.ref-v2 .rf-premio-arte .rf-arte{position:absolute;width:calc(46px * var(--text-scale,1));height:calc(46px * var(--text-scale,1))}
.ref-v2 .rf-premio-arte .rf-arte:first-child{left:0;top:0}
.ref-v2 .rf-premio-arte .rf-arte:last-child{right:0;bottom:0}
.ref-v2 .ref-giros{padding:14px;border-radius:12px;border-color:#3d311a;background:radial-gradient(100% 80% at 100% 0%,rgba(139,92,246,.14),transparent 60%),linear-gradient(180deg,#17120a,#0f0c07)}
.ref-v2 .ref-degraus{position:relative}
.ref-v2 .ref-degrau{border-color:#5b4a26;background:linear-gradient(180deg,#261d0e,#191209)}
.ref-v2 .rf-convite{border-color:#6b5426;background:radial-gradient(120% 120% at 0% 0%,rgba(243,207,122,.1),transparent 60%),linear-gradient(180deg,#1d160b,#120e07)}
.ref-v2 .ref-url{min-height:48px;font-size:calc(13px * var(--text-scale,1))}
.ref-v2 .ref-link .ref-ouro{min-height:48px;padding:0 22px}
.ref-v2 .referral-friend{padding-top:10px}
.ref-v2 .referral-friend-done{display:flex;align-items:center;gap:6px}
.ref-v2 .ref-amigos{max-height:300px}
/* B · painel: números em cima, convite e amigos à esquerda, regras e prêmios à direita. */
.ref-painel .rf-colunas{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:14px;align-items:start;min-width:0}
.ref-painel .rf-col{display:grid;gap:14px;min-width:0}
.ref-painel .rf-passos li{background:transparent;border:0;border-left:2px solid #4a3a1c;border-radius:0;padding:6px 0 6px 14px}
.ref-painel .rf-passos li::before{left:-10px;top:50%;margin-top:-9px}
.ref-painel .rf-passos li .rf-arte{margin-left:6px}
@media (max-width:900px){.ref-painel .rf-colunas{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){.referral-card.ref-v2{padding:14px}.ref-v2 .rf-selo{width:calc(50px * var(--text-scale,1));height:calc(50px * var(--text-scale,1))}.ref-v2 .ref-titulo{font-size:calc(21px * var(--text-scale,1))}.ref-v2 .rf-bloco{padding:12px}
.ref-v2 .rf-numeros{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.ref-v2 .rf-num{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;padding:8px 6px;gap:3px}.ref-v2 .rf-num>span{justify-items:center}.ref-v2 .rf-num b{font-size:calc(15px * var(--text-scale,1))}.ref-v2 .rf-num small{font-size:calc(10px * var(--text-scale,1));letter-spacing:.04em}.ref-v2 .rf-num .ref-barra{width:100%}
.ref-v2 .rf-premio-joias{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center}}
/* "COMPRE COMPLETO COM DESCONTO" (28/10): atalho no cartão do Pack I que abre a Coleção numa janela (abrirColecaoCompleta). */
.loja-colecao-atalho{display:flex;align-items:center;gap:8px;max-width:100%;box-sizing:border-box;cursor:var(--cur-mao,pointer);font:inherit;color:#ffe6a3}
.loja-colecao-atalho .lca-pct{flex:0 0 auto;padding:1px 7px;border-radius:999px;background:#7a1e1e;color:#fff;font-style:normal;font-weight:900;font-size:calc(12px * var(--text-scale,1))}
.loja-colecao-atalho i{font-style:normal;color:#f5d27f;font-size:calc(18px * var(--text-scale,1));line-height:1;margin-left:auto}
.loja-colecao-atalho.est-a{width:100%;margin-top:10px;padding:9px 12px;border:1px solid #c8912f;border-radius:8px;background:linear-gradient(90deg,rgba(212,175,55,.28),rgba(122,30,30,.22));
text-transform:uppercase;letter-spacing:.6px;font-weight:900;font-size:calc(13px * var(--text-scale,1));box-shadow:0 0 14px rgba(212,175,55,.18)}
.loja-colecao-atalho.est-a span{min-width:0;overflow-wrap:anywhere;text-align:left}
.loja-colecao-atalho:hover,.loja-colecao-atalho:focus-visible{border-color:#fbe3a3;filter:brightness(1.12)}
.loja-destaque:has(.loja-colecao-atalho.est-b){position:relative}
.loja-colecao-atalho.est-b{position:absolute;top:10px;right:10px;z-index:2;padding:5px 8px 5px 12px;border:1px solid var(--botao-ouro-borda);border-radius:999px;
background:var(--botao-ouro-fundo);color:var(--botao-ouro-texto);font-weight:900;text-transform:uppercase;letter-spacing:.6px;font-size:calc(12px * var(--text-scale,1));
box-shadow:0 0 16px rgba(245,210,127,.55);animation:lca-pulsa 2.4s ease-in-out infinite}
@keyframes lca-pulsa{0%,100%{box-shadow:0 0 10px rgba(245,210,127,.35)}50%{box-shadow:0 0 22px rgba(245,210,127,.8)}}
.loja-colecao-atalho.est-c{width:100%;margin-top:10px;padding:8px 10px;border:1px solid #6b5426;border-radius:10px;background:linear-gradient(180deg,#2a200f,#1a140a);text-align:left}
.loja-colecao-atalho.est-c .lca-pecas{display:flex;flex:0 0 auto}
.loja-colecao-atalho.est-c .lca-pecas img{width:30px;height:30px;object-fit:contain;margin-left:-6px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.7))}
.loja-colecao-atalho.est-c .lca-pecas img:first-child{margin-left:0}
.loja-colecao-atalho.est-c .lca-txt{display:grid;min-width:0}
.loja-colecao-atalho.est-c .lca-txt b{font-weight:900;font-size:calc(13px * var(--text-scale,1));overflow-wrap:anywhere}
.loja-colecao-atalho.est-c .lca-txt small{color:#b8a984;font-size:calc(11px * var(--text-scale,1))}
@media (max-width:420px){.loja-colecao-atalho.est-c .lca-pecas img{width:24px;height:24px}}
@media (prefers-reduced-motion:reduce){.loja-colecao-atalho.est-b{animation:none}}
/* A janela da Coleção: o mesmo banner da vitrine, por cima da Loja. */
.loja-colecao-janela{position:relative;width:min(1000px,100%);max-height:calc(100dvh - 32px);overflow:auto;border-radius:12px;animation:loja-previa-entra .28s cubic-bezier(.2,.9,.3,1.2)}
.loja-colecao-janela>.loja-destaque{margin:0}
.loja-colecao-janela>.loja-previa-fechar{position:sticky;float:right;top:10px;margin:10px 10px -44px 0}
@media (max-width:700px){.loja-colecao-janela .loja-destaque{grid-template-columns:1fr}}
/* A skin de data ampliada (28/10, ampliarSkinDeData). */
button.lsd-arte{border:0;margin:0;font:inherit;color:inherit;cursor:zoom-in}
.lsd-zoom{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;width:min(460px,100%);max-height:calc(100dvh - 32px);padding:14px 14px 16px;box-sizing:border-box;
border:1px solid #8a6d2c;border-radius:16px;background:radial-gradient(80% 60% at 50% 45%,rgba(var(--lp-cor),.38),transparent 72%),linear-gradient(180deg,#1d160b,#0c0905);
color:#fff1c9;text-align:center;animation:loja-previa-entra .28s cubic-bezier(.2,.9,.3,1.2)}
.lsd-zoom img{width:100%;max-height:calc(100dvh - 120px);object-fit:contain;filter:drop-shadow(0 8px 20px rgba(0,0,0,.7))}
.lsd-zoom b{font-family:Cinzel,Georgia,serif;font-size:calc(20px * var(--text-scale,1))}
.lsd-zoom small{color:#e3b04b;font-size:calc(12px * var(--text-scale,1))}
.loja-colecao-atalho.est-c .lca-txt{flex:1 1 auto}
.loja-colecao-atalho.est-c .lca-txt small{text-transform:none;letter-spacing:0}
@media (max-width:420px){.loja-colecao-atalho.est-c{flex-wrap:wrap}.loja-colecao-atalho.est-c .lca-pecas{order:-1;width:100%;justify-content:center}}
/* 31/10: "Como funciona?" do aviso e o TOTAL antes de comprar só existem no celular em pé (celular-em-pe.css). */
.market-access-lock .mal-como,.market-access-lock .mal-ajuda,.mercado-oferta-total{display:none}
/* JOIAS E EMBLEMAS ARRUMADOS (31/10, o autor escolheu a C): faixaDasJoiasDoMercadoHtml no game.js. Cartões só do que
tem oferta; o resto em etiquetas. Nome nunca quebra no meio da palavra (2 linhas e reticências). */
.mercado-secao-joias{align-items:center}
/* 04/11: sem a faixa MERCADO ABERTO, o "Como funciona?" das joias aparece também no celular em pé */
.mercado-joias-ajuda{display:inline-flex;align-items:center;margin-left:auto;min-height:0;padding:4px 10px;border:1px solid rgba(111,240,176,.45);border-radius:14px;background:#0c1511;color:#6ff0b0;font-weight:800;font-size:calc(11.5px * var(--text-scale,1));box-shadow:none;cursor:var(--cur-mao,pointer)}
.mercado-joias-ajuda:hover,.mercado-joias-ajuda:focus-visible{border-color:#6ff0b0;background:#12261d}
:is(.mercado-joia2,.mercado-joia-etiqueta) :is(img,.col-icone){flex:none;object-fit:contain}
:is(.mercado-joia2,.mercado-joia-etiqueta) .col-icone{display:inline-flex}
:is(.mercado-joia2,.mercado-joia-etiqueta) .col-icone img{width:100%;height:100%;object-fit:contain}
:is(.mercado-joia2,.mercado-joia-etiqueta) strong,.mercado-joia-etiqueta span{overflow-wrap:normal;word-break:normal;hyphens:none}
/* cartões do que tem oferta */
.mercado-joias2{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.mercado-joia2{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;min-width:0;padding:10px 6px 8px;border:1px solid #3d311a;border-radius:12px;background:linear-gradient(180deg,#1a140b,#100d08);color:#e8dcc0;text-align:center;box-shadow:none;cursor:var(--cur-mao,pointer)}
.mercado-joia2:hover,.mercado-joia2.ativo{border-color:#d9a441;background:#1d170d}
.mercado-joia2>:is(img,.col-icone){width:40px;height:40px;margin-bottom:2px}
.mercado-joia2 strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:100%;min-height:2.5em;color:#fff1c9;font-size:calc(12px * var(--text-scale,1));line-height:1.25}
.mercado-joia2 small{color:#8d7f63;font-size:calc(11px * var(--text-scale,1))}
.mercado-joia2 .mercado-joia-preco{color:#fff1c9;font-weight:900}
.mercado-joia2 .mercado-joia-preco img{width:14px;height:14px}
/* etiquetas do que está sem oferta */
.mercado-joias-sem{margin-top:10px;display:grid;gap:6px}
.mercado-joias-sem>small{color:#8d7f63;font-size:calc(11.5px * var(--text-scale,1))}
.mercado-joias-etiquetas{display:flex;flex-wrap:wrap;gap:6px}
.mercado-joia-etiqueta{display:inline-flex;align-items:center;gap:6px;max-width:100%;min-height:32px;padding:3px 10px 3px 6px;border:1px solid #33291a;border-radius:16px;background:#0f0c08;color:#cfc3a6;font-weight:700;font-size:calc(11.5px * var(--text-scale,1));box-shadow:none;cursor:var(--cur-mao,pointer)}
.mercado-joia-etiqueta:hover,.mercado-joia-etiqueta.ativo{border-color:#d9a441;color:#fff1c9}
.mercado-joia-etiqueta>:is(img,.col-icone){width:22px;height:22px}
.mercado-joia-etiqueta span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:760px){
.mercado-joias2{display:flex;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.mercado-joias2::-webkit-scrollbar{display:none}
.mercado-joia2{flex:0 0 108px}
.mercado-joias-etiquetas{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.mercado-joias-etiquetas::-webkit-scrollbar{display:none}
.mercado-joia-etiqueta{flex:none}
}
.mercado-tipo .col-icone img{width:100%;height:100%;object-fit:contain}
/* 2565: pack cuja 1ª compra já foi (o bônus não vem mais) */
.loja-jodr-usado{margin:2px 0;padding:4px 7px;width:100%;box-sizing:border-box;border:1px dashed rgba(192,132,252,.3);border-radius:8px;font-size:calc(11.5px * var(--text-scale,1));color:#b9a8d9;text-align:center;line-height:1.3;overflow-wrap:anywhere}
/* ==========================================================================
MERCADO ORGANIZADO (04/11, autor). Faixa "MERCADO ABERTO" saiu (game.js); as joias sem oferta ficam atrás do
botão VENDER RECURSOS; as domadas entram na grade do COMPRAR (.dmm-junto) e no VENDER (botão "Domada").
========================================================================== */
.mercado-joias-sem{margin-top:10px}
.mercado-vender-recursos{justify-self:start;display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:6px 14px;border:1px solid #5a4422;border-radius:10px;background:#1a140b;color:#f3cf7a;font-weight:900;letter-spacing:.05em;font-size:calc(12px * var(--text-scale,1));box-shadow:none;cursor:var(--cur-mao,pointer);max-width:100%}
.mercado-vender-recursos:hover,.mercado-joias-sem.aberto .mercado-vender-recursos{border-color:#d9a441;color:#fff1c9}
.mercado-vender-recursos em{font-style:normal;min-width:20px;padding:1px 6px;border-radius:999px;background:#3a2c14;color:#f3cf7a;font-size:.9em;text-align:center}
.mercado-vender-recursos b{font-size:.9em;color:#bfae86}
.mercado-joias-sem.aberto{padding:10px;border:1px solid #33291a;border-radius:10px;background:#0d0a06}
.mercado-joias-sem.aberto .mercado-vender-recursos{margin:-2px 0 2px}
@media (max-width:760px){
.mercado-joias-sem.aberto .mercado-joias-etiquetas{flex-wrap:wrap;overflow:visible}
.mercado-joias-sem.aberto .mercado-joia-etiqueta{flex:0 1 auto}
}
/* domada na grade dos itens: o cartão das domadas com a cara de cartão do Mercado */
.mercado-grade .dmm-card.dmm-junto{--c:#c9d2de;gap:8px;padding:10px;border:1px solid #3d311a;border-left:3px solid var(--dmm-cor,#4a3a1c);border-radius:10px;background:#15110b;color:#e9e1cc}
.mercado-grade .dmm-junto:has(.dm-elite){--dmm-cor:#4fd18b}.mercado-grade .dmm-junto:has(.dm-chefe){--dmm-cor:#b778ff}.mercado-grade .dmm-junto:has(.dm-lenda){--dmm-cor:#f2c14e}
.mercado-grade .dmm-junto .dmm-domada{gap:10px}
.mercado-grade .dmm-junto .dm-orb{--s:52px!important}
.mercado-grade .dmm-junto .dmm-info small{color:#bfb59c}
.mercado-grade .dmm-junto .dmm-nome{font-size:calc(13.5px * var(--text-scale,1));color:#fff1c9}
/* VENDER: com "Domada" escolhida o formulário de sempre some e entra a venda das domadas */
.market-create-card.mercado-vende-domada>:not(.card-title-row,#marketTipoBotoes,#marketDomadaVenda){display:none!important}
.mercado-domada-venda{min-width:0}
.mercado-domada-venda .dmm-painel{padding:0}
.mercado-tipo-domada img{width:40px;height:40px;object-fit:contain}
.mercado-grade .dmm-junto .dmm-pe{gap:4px 8px}
.mercado-grade .dmm-junto .dmm-btn{flex:1 1 100%;margin-left:0;min-height:42px}
/* OPÇÃO C do autor (04/11): no celular (em pé ou deitado) as 5 abas viram botões em 2 linhas, todas à vista (sem arrastar a fila) */
@media (max-width:760px),(max-height:500px){
html:not(#_):not(#__):not(#___) #marketPanel .mercado-abas{border-bottom:0}
html:not(#_):not(#__):not(#___) #marketPanel .mercado-abas-fila{flex-wrap:wrap;overflow:visible;gap:6px;width:100%;padding:2px 0 4px}
html:not(#_):not(#__):not(#___) #marketPanel .mercado-abas-fila .mercado-aba{flex:1 1 30%;justify-content:center;min-width:0;min-height:38px;padding:6px 8px;border:1px solid #3d311a;border-radius:10px;background:#120f0a;white-space:normal;text-align:center;line-height:1.15}
html:not(#_):not(#__):not(#___) #marketPanel .mercado-abas-fila .mercado-aba.ativo{background:#d9a441;color:#1a1408;border-color:#d9a441}
html:not(#_):not(#__):not(#___) #marketPanel .mercado-abas-fila .mercado-aba.ativo em{background:#1a1408;color:#f3cf7a}
}
/* 04/11: aviso "FAÇA TRADE PELA PRAÇA" no lugar da venda privada desligada (game.js mostrarAvisoDaPracaNoMercado). */
.mercado-praca-aviso{display:flex;margin-top:6px;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;border:1px dashed rgba(240,196,92,.55);border-radius:10px;background:rgba(240,196,92,.08);font-size:13px;line-height:1.35;box-sizing:border-box;min-width:0}
.mercado-praca-aviso.hidden{display:none}
.mercado-praca-aviso-texto{min-width:0;overflow-wrap:anywhere}
.mercado-praca-aviso strong{color:#f0c45c;letter-spacing:.02em}
/* 04/11 (autor: "tira o botão... no texto mesmo, discreto: ir"): o "ir" é um link no fim do texto. */
.mercado-praca-ir{display:inline;margin:0 0 0 2px;padding:0;min-height:0;border:0;background:none;box-shadow:none;color:rgba(240,196,92,.8);font:inherit;font-size:.95em;text-decoration:underline;text-underline-offset:2px;cursor:var(--cur-mao,pointer);width:auto}
.mercado-praca-ir:hover,.mercado-praca-ir:focus-visible{color:#f0c45c}
.mercado-praca-ir.hidden{display:none}
/* LOJA (05/11, autor): cartão escolhido em destaque e os outros da fileira escurecidos. A dica da moeda abre só na arte. */
.loja-cartao{cursor:var(--cur-mao,pointer);transition:opacity .18s ease,filter .18s ease,transform .18s ease,box-shadow .18s ease}
.loja-cartao .loja-moldura[data-tooltip]{cursor:var(--cur-seta,help)}
.loja-cartao.loja-escolhido{border-color:#f3cf7a;box-shadow:0 0 0 2px #f3cf7a,0 10px 26px rgba(243,207,122,.28);transform:translateY(-3px);z-index:2}
:has(>.loja-cartao.loja-escolhido)>.loja-cartao:not(.loja-escolhido){opacity:.45;filter:saturate(.55) brightness(.7)}
:has(>.loja-cartao.loja-escolhido)>.loja-cartao:not(.loja-escolhido):hover{opacity:.75}
@media (prefers-reduced-motion:reduce){.loja-cartao.loja-escolhido{transform:none}}
/* BÔNUS DA 1ª COMPRA, OPÇÃO B DO AUTOR (05/11, "minimalista e mais atrativo"): sem caixa; título curto e os ícones grandes
com o número embaixo (o nome e o número inteiro ficam na dica do ícone). Bônus de JoD e VIP lado a lado. */
.loja-cartao-dark .loja-jodr{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 10px;padding:0;border:0;background:none;margin:2px 0 0}
.loja-cartao-dark .loja-jodr li{flex:0 0 auto;flex-direction:column;flex-wrap:nowrap;align-items:center;gap:1px;text-align:center;line-height:1.1}
.loja-cartao-dark .loja-jodr li img{width:28px;height:28px;filter:drop-shadow(0 0 6px rgba(192,132,252,.35))}
.loja-cartao-dark .loja-jodr li b{font-size:calc(12px * var(--text-scale,1))}
.loja-cartao-dark .loja-jodr .loja-jodr-tit{flex:1 0 100%;font-size:calc(10px * var(--text-scale,1));letter-spacing:.1em;line-height:1.3}
.loja-dark-selos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:5px;max-width:100%}
.loja-dark-selos:empty{display:none}
.loja-dark-bonus img{width:14px;height:14px;margin-right:3px;vertical-align:-2px}
/* OFERTA DE NOVEMBRO (2678, 06/11): o desconto que cai até a Black Friday (src/ui/promo-queda-ui.js). Sem brilho. */
.pq-joia{width:34px;height:34px;flex:0 0 auto}
.pq-cai{color:#fde68a;font-weight:800;font-size:calc(12px * var(--text-scale,1));white-space:nowrap}
.pq-faixa{grid-column:1/-1;display:flex;align-items:center;gap:12px;margin:8px 0 12px;padding:10px 14px;border:1px solid #7f1d1d;border-radius:9px;background:linear-gradient(90deg,#2a0d0d,#17110b);color:#f5e6c4;min-width:0}
.pq-c{flex-direction:column;align-items:stretch}
.pq-c header{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pq-c header div{display:flex;flex-direction:column;flex:1;min-width:150px}
.pq-c header b{color:#fca5a5;font-weight:900;letter-spacing:.08em;font-size:calc(14px * var(--text-scale,1))}
.pq-c header small{color:#d6c6a0;font-size:calc(12px * var(--text-scale,1))}
.pq-escada{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:0;padding:0;list-style:none}
.pq-passo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:6px 2px;border:1px solid #4a3a22;border-radius:7px;background:#16110b;color:#a8987a;text-align:center;min-width:0}
.pq-passo b{font-size:calc(16px * var(--text-scale,1));font-weight:900;color:#cdbb92}
.pq-passo small{font-size:calc(10px * var(--text-scale,1));overflow-wrap:anywhere}
.pq-passo.pq-agora{border-color:#ef4444;background:#7f1d1d;color:#fff}
.pq-passo.pq-agora b{color:#fff;font-size:calc(19px * var(--text-scale,1))}
.pq-passo.pq-passou{opacity:.35}
.pq-passo-fim{border-style:dashed;background:#0b0b0d}
.pq-passo-fim b{color:#cdbb92;font-size:calc(11px * var(--text-scale,1));letter-spacing:.04em}
.pq-cartao{position:relative}
.loja-cartao .pq-selo{position:absolute;z-index:4;top:36px;right:8px;padding:3px 8px;border-radius:5px;background:#b91c1c;color:#fff;font-weight:900;font-size:calc(13px * var(--text-scale,1))}
.pq-riscado{display:block;margin-top:6px;color:#a8987a;font-size:calc(12px * var(--text-scale,1));text-align:center}
@media (max-width:560px){.pq-escada{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.pq-passo b{font-size:calc(13px * var(--text-scale,1))}.pq-passo.pq-agora b{font-size:calc(15px * var(--text-scale,1))}.pq-passo-fim b{font-size:calc(9px * var(--text-scale,1));letter-spacing:0;line-height:1.15}.pq-passo{padding:6px 1px}}
/* KIT ACELERADOR (2703): o baú do x17.500 e o balão com o que vem (abre no mouse, no foco ou no toque) */
.loja-cartao-dark .loja-jodr li.loja-jodr-kit{position:relative;cursor:pointer;outline:none}
.loja-cartao-dark .loja-jodr li.loja-jodr-kit>img{width:32px;height:32px}
.loja-cartao-dark .loja-jodr li.loja-jodr-kit>b{color:#e9d5ff;font-size:calc(10.5px * var(--text-scale,1));white-space:normal;max-width:7.5em;line-height:1.1}
.loja-kit-balao{display:none;position:fixed;z-index:9000;left:0;top:0;width:max-content;max-width:min(240px,80vw);padding:8px 10px;box-sizing:border-box;border:1px solid rgba(192,132,252,.55);border-radius:10px;background:rgba(16,9,28,.97);box-shadow:0 6px 18px rgba(0,0,0,.55);text-align:left}
.loja-kit-balao.loja-kit-portal{display:block}.loja-kit-balao.loja-kit-portal[hidden]{display:none}
.loja-kit-balao .loja-kit-tit{margin:0 0 5px;text-align:center;font-size:calc(10px * var(--text-scale,1));letter-spacing:.12em;color:#c4b5fd;font-weight:800;text-transform:uppercase}
.loja-kit-balao .loja-kit-item{display:flex;align-items:center;gap:6px;margin:3px 0;font-size:calc(12px * var(--text-scale,1));color:#e9ddff;line-height:1.2;min-width:0}
.loja-kit-balao .loja-kit-item img{width:22px;height:22px;object-fit:contain;flex:0 0 auto;filter:none}
.loja-kit-balao .loja-kit-item b{color:#ffd76a;font-weight:900;white-space:nowrap;flex:0 0 auto}
.loja-kit-balao .loja-kit-item span{overflow-wrap:anywhere;min-width:0}