/* 🛍 Loja JSHOW (31/10/2026, prévia v4 aprovada pelo jota). Cores do site (tema-binance). [Claude] */
body.sn{--lj-ouro:var(--sn-ouro,#fcd535);--lj-card:var(--sn-card,#1e2329);--lj-card2:var(--sn-card2,#2b3139);--lj-linha:var(--sn-linha,#2b3139);--lj-mut:var(--sn-mut,#929aa5);--lj-txt:var(--sn-txt,#eaecef)}

/* cartão de acesso no Início */
.lj-acesso{position:relative;display:flex;align-items:center;gap:12px;margin:14px 0 0;padding:14px 16px;border-radius:16px;border:1px solid #fcd53566;background:radial-gradient(320px 140px at 0 0,#fcd5351f,transparent 70%),linear-gradient(180deg,var(--lj-card2),var(--lj-card));color:var(--lj-txt);text-decoration:none}
.lj-acesso .lj-ico{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:#fcd5351f}
.lj-acesso .lj-ico svg,.lj-prod-ico svg{width:24px;height:24px;fill:none;stroke:var(--lj-ouro);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lj-acesso .lj-txt{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.lj-acesso .lj-txt b{font:800 16px/1.2 Inter,system-ui,sans-serif}
.lj-acesso .lj-txt small{color:var(--lj-mut);font-size:13px;line-height:1.35}
.lj-acesso .lj-seta{flex:none;color:var(--lj-ouro);font:900 22px/1 Inter,system-ui,sans-serif}
.lj-novo{position:absolute;top:-9px;right:14px;padding:2px 8px;border-radius:999px;background:#fcd535;color:#181a20;font:900 11px/1.5 Inter,system-ui,sans-serif;letter-spacing:.04em}
.lj-sinal{display:inline-flex;align-items:center;gap:6px;font:700 12px/1.3 Inter,system-ui,sans-serif;color:var(--lj-mut)}
.lj-sinal::before{content:"";width:8px;height:8px;border-radius:50%;background:#5e6673}
.lj-sinal.on{color:#0ecb81}.lj-sinal.on::before{background:#0ecb81;box-shadow:0 0 0 3px #0ecb8133}

/* botão no Perfil › Meus pontos (no lugar do "Em breve") */
.lj-abrir-perfil{margin-top:8px}

/* tela da Loja (dentro da aba Perfil) */
.lj{display:flex;flex-direction:column;gap:14px;color:var(--lj-txt)}
.lj-voltar{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:8px 12px 8px 8px;border:1px solid var(--lj-linha);border-radius:999px;background:transparent;color:var(--lj-txt);font:700 14px/1 Inter,system-ui,sans-serif}
.lj-saldo{display:flex;flex-direction:column;gap:4px;padding:20px 18px;border-radius:22px;border:1px solid #fcd53540;background:radial-gradient(420px 180px at 0 0,#fcd5351a,transparent 70%),linear-gradient(180deg,#2b3139,#1e2329);box-shadow:0 10px 30px #0006}
.lj-saldo small{color:var(--lj-mut);font:700 12px/1.3 Inter,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.lj-saldo .lj-n{display:flex;align-items:baseline;gap:8px}
.lj-saldo .lj-n b{font:900 40px/1 Inter,system-ui,sans-serif;color:var(--lj-ouro);font-variant-numeric:tabular-nums}
.lj-saldo .lj-n span{font:800 16px/1 Inter,system-ui,sans-serif;color:var(--lj-txt)}
.lj-saldo p{margin:4px 0 0;color:var(--lj-mut);font-size:13px;line-height:1.4}
.lj-tit{margin:4px 0 0;color:var(--lj-ouro);font:800 12px/1.3 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.lj-prod{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:18px;border:1px solid var(--lj-linha);background:linear-gradient(180deg,var(--lj-card2),var(--lj-card))}
.lj-prod.lj-destaque{border-color:#fcd53566}
.lj-prod-cab{display:flex;align-items:center;gap:12px}
.lj-prod-ico{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:#fcd5351f}
.lj-prod-cab .lj-nome{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.lj-prod-cab .lj-nome b{font:800 17px/1.2 Inter,system-ui,sans-serif}
.lj-prod-cab .lj-nome small{color:var(--lj-mut);font-size:13px}
.lj-preco{margin:0;font-size:15px;line-height:1.4}
.lj-preco b{color:var(--lj-ouro);font-weight:900}
.lj-aviso{display:flex;gap:10px;align-items:flex-start;margin:0;padding:12px;border-radius:12px;background:#14171c;color:var(--lj-txt);font-size:14px;line-height:1.45}
.lj-aviso .lj-ai{flex:none;font-size:18px;line-height:1.2}
.lj-gravar{display:flex;flex-direction:column;align-items:center;gap:8px;padding:6px 0}
.lj-mic{width:84px;height:84px;border-radius:50%;border:0;display:grid;place-items:center;background:#fcd535;box-shadow:0 4px 0 #b39a4a}
.lj-mic svg{width:36px;height:36px;fill:none;stroke:#181a20;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.lj-mic[disabled]{background:#2b3139;box-shadow:none}
.lj-mic[disabled] svg{stroke:#5e6673}
.lj-gravar small{color:var(--lj-mut);font-size:13px}
.lj-ouvir{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#14171c}
.lj-play{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#2b3139;color:var(--lj-txt);font-size:14px}
.lj-onda{flex:1;height:28px;background:repeating-linear-gradient(90deg,#fcd535 0 3px,transparent 3px 6px);-webkit-mask:linear-gradient(180deg,transparent 0 20%,#000 20% 80%,transparent 80%);opacity:.75;border-radius:4px}
.lj-ouvir span{font:700 13px/1 Inter,system-ui,sans-serif;font-variant-numeric:tabular-nums;color:var(--lj-mut)}
.lj-conta{display:grid;grid-template-columns:1fr auto;gap:6px 12px;margin:0;padding:12px;border-radius:12px;background:#14171c;font-size:14px}
.lj-conta dt{color:var(--lj-mut)}.lj-conta dd{margin:0;text-align:right;font-weight:800;font-variant-numeric:tabular-nums}
.lj-conta .lj-total{color:var(--lj-ouro);font-size:18px}
.lj-falta{margin:0;color:#f6465d;font:800 14px/1.4 Inter,system-ui,sans-serif}
.lj-off{opacity:.62}
.lj-off .lj-prod-ico{background:#2b3139}.lj-off .lj-prod-ico svg{stroke:#929aa5}
.lj-indis{align-self:flex-start;padding:4px 10px;border-radius:999px;background:#2b3139;color:#b7bdc6;font:800 12px/1.4 Inter,system-ui,sans-serif}
.lj-regras{margin:0;padding:0 2px;color:var(--lj-mut);font-size:13px;line-height:1.5}
.ct-btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none!important;filter:grayscale(.4)}

/* ===== versão 2 (31/10): Início em ordem + Loja como tela própria ===== */
.lj-aovivo{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:6px;background:#f6465d;color:#fff;font:900 11px/1.2 Inter,system-ui,sans-serif;letter-spacing:.06em}
.lj-aovivo::before{content:"";width:7px;height:7px;border-radius:50%;background:#fff}
.lj-acesso{flex-direction:column;align-items:stretch;gap:10px}
.lj-acesso-topo{display:flex;align-items:center;gap:12px}
.lj-acesso .lj-txt small{display:flex;align-items:center;font:700 12px/1.3 Inter,system-ui,sans-serif;letter-spacing:.05em;text-transform:uppercase}
.lj-acesso .lj-txt b.lj-acesso-n{font:900 28px/1.05 Inter,system-ui,sans-serif;color:var(--lj-ouro);font-variant-numeric:tabular-nums}
.lj-acesso .lj-txt b.lj-acesso-n span{font:800 15px/1 Inter,system-ui,sans-serif;color:var(--lj-txt)}
.lj-acesso-msg{margin:0;font-size:14px;line-height:1.45;color:var(--lj-txt)}
.lj-acesso-msg.lj-mut{color:var(--lj-mut)}
.lj-acesso-on{border-color:#0ecb8166;background:radial-gradient(320px 140px at 0 0,#0ecb811a,transparent 70%),linear-gradient(180deg,var(--lj-card2),var(--lj-card))}
.lj-acesso .ct-btn{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}
.lj-bi svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;display:block}
.lj-link{align-self:center;color:var(--lj-ouro);font:700 14px/1.4 Inter,system-ui,sans-serif;text-decoration:none}
.ptl-loja a{color:var(--lj-ouro);text-decoration:none}
/* Loja como tela própria: some o resto da página (menu de baixo continua igual) */
body.lj-na-loja #conteudo>*:not(.lj-tela){display:none!important}
.lj-tela{padding-block:8px 24px}
.lj-topo{display:flex;align-items:center;gap:12px}
.lj-topo h1{margin:0;font:900 22px/1.2 Inter,system-ui,sans-serif;color:var(--lj-txt)}

/* ===== versão 3 (31/10): cartão "Loja JSHOW" é a primeira ação do Início ===== */
.ola .lj-acesso{margin:14px 0 0}
.lj-acesso .lj-txt b.lj-acesso-tit{font:900 19px/1.2 Inter,system-ui,sans-serif;color:var(--lj-txt)}
.lj-acesso .lj-txt small{display:block;text-transform:none;letter-spacing:0;font:500 14px/1.35 Inter,system-ui,sans-serif;color:var(--lj-mut)}
.lj-acesso .lj-txt small b{color:var(--lj-ouro);font-weight:900}
/* ===== no site de verdade ===== */
.lj-acesso{margin:0 0 16px}
#inicioOla+.lj-acesso{margin:14px 0 18px}
.lj-acesso .ct-btn{min-height:50px;font-size:16px}
.lj-acesso:active{transform:translateY(1px)}
.lj-tela[hidden]{display:none!important}
.lj-ai svg{width:18px;height:18px;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}
.lj-ai-am{stroke:#fcd535}.lj-ai-vd{stroke:#0ecb81}
.lj-mic.lj-rec{background:#f6465d;box-shadow:0 0 0 8px #f6465d33;animation:ljPulso 1.2s ease-in-out infinite}
.lj-mic.lj-rec svg{stroke:#fff;fill:#fff}
@keyframes ljPulso{50%{box-shadow:0 0 0 14px #f6465d1f}}
@media (prefers-reduced-motion:reduce){.lj-mic.lj-rec{animation:none}}
.lj-player{width:100%;height:44px}
.lj-msg{margin:0;padding:10px 12px;border-radius:10px;background:#0ecb811a;color:#0ecb81;font:700 14px/1.4 Inter,system-ui,sans-serif}
.lj-msg-erro{background:#f6465d1a;color:#ff8a98}
.lj-ultimo{margin:0;color:var(--lj-mut);font-size:13px;text-align:center}
.lj-voltar{text-decoration:none}
.lj-prod .ct-btn{text-decoration:none}
/* 01/11/2026 (jota, na live): a faixa "AO VIVO AGORA · Toque para assistir" VOLTA a aparecer no Início (era escondida desde 31/10) */
@media (min-width:900px){.lj-tela .lj{max-width:720px}.lj-acesso{max-width:720px}}
/* 31/10/2026 (jota): o aviso de live vem primeiro e a Loja logo depois dele */
body.sn .live-box+.lj-acesso{margin:16px 0 18px}
/* 31/10/2026 (jota): cartão da Loja = ícone + "LOJA DE TROCA" centralizado e o botão "ABRIR LOJA" (igual ao aviso de live) */
body.sn .lj-acesso{display:grid;gap:12px;padding:16px;border-radius:14px;background:#1e2329;border:1px solid #2b3139;text-decoration:none}
body.sn .lj-c-tit{display:inline-flex;align-items:center;justify-content:center;gap:10px;color:#eaecef;font:900 17px/1.2 Inter,system-ui,sans-serif;text-transform:uppercase;letter-spacing:.06em}
body.sn .lj-c-ico svg{display:block;width:22px;height:22px;fill:none;stroke:#f0b90b;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
body.sn .lj-acesso .ct-btn{min-height:50px;border-radius:8px;font-size:16px}
/* 31/10/2026 (jota): ícone da Loja na caixinha dourada do padrão do designer, ao lado do título */
body.sn .lj-acesso{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px}
body.sn .lj-c-tit{gap:14px}
body.sn .lj-c-ico{flex:none;width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:#f0b90b1f;border:1px solid #f0b90b55}
body.sn .lj-c-ico svg{width:26px;height:26px;stroke-width:2}
body.sn .lj-acesso .ct-btn{flex:1 1 100%}
body.sn .lj-prod-ico{width:52px;height:52px;border-radius:14px;border:1px solid #f0b90b55}
body.sn .lj-prod-ico svg{width:26px;height:26px;stroke-width:2}
body.sn .lj-off .lj-prod-ico{border-color:#3d444d}
/* 31/10/2026 (jota): ícone encostado na esquerda e o texto no meio do cartão */
body.sn .lj-acesso{display:grid;grid-template-columns:52px 1fr 52px;align-items:center}
body.sn .lj-c-tit{justify-content:center;text-align:center}
body.sn .lj-acesso .ct-btn{grid-column:1/-1}
body.sn .lj-acesso{grid-template-columns:52px 1fr}
body.sn .lj-acesso>span[aria-hidden="true"]:not(.lj-c-ico){display:none}
body.sn .lj-c-tit{white-space:nowrap;font-size:16px;letter-spacing:.04em}
body.sn .lj-regras,body.sn .lj-aviso{text-wrap:pretty}