:root{--bg:#0b0b11;--panel:#171423;--panel2:#221634;--line:#33234f;--text:#f8f6ff;--muted:#777184;--accent:#8b5cf6;--accent2:#a855f7;--accentDark:#4c1d95;--money:#ff4fd8;--danger:#ef4444}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;min-height:100vh}.app{min-height:100vh;padding:env(safe-area-inset-top) 0 120px}.top{display:flex;align-items:center;gap:18px;padding:40px 24px 28px;border-bottom:1px solid var(--line);background:#120f1c}.top img{width:74px;height:74px;border-radius:50%;object-fit:cover;background:#111;border:1px solid #252532}.userbox{min-width:0}.top h1{font-size:28px;margin:0 0 14px;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.balance-label{letter-spacing:4px;color:var(--muted);font-weight:800}.balance-label strong{letter-spacing:0;color:var(--money);font-size:27px}.plus{margin-left:auto;width:64px;height:64px;border:0;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));color:white;font-size:42px;line-height:1;font-weight:300;box-shadow:0 12px 32px rgba(139,92,246,.30)}.store-head{display:flex;align-items:center;justify-content:space-between;padding:22px 24px 14px}.store-head h2{font-size:18px;margin:0;color:#dcd8e8}.store-head button{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#151020;color:#ddd;font-size:22px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px;padding:0 24px}.card{background:var(--panel);border:1px solid var(--line);border-radius:24px;overflow:hidden;min-height:312px;display:flex;flex-direction:column;box-shadow:0 18px 45px rgba(76,29,149,.16)}.card .img{height:170px;background:#0e0e14;display:flex;align-items:center;justify-content:center;overflow:hidden}.card img{width:100%;height:100%;object-fit:cover}.placeholder{font-size:48px}.info{padding:16px}.title{font-size:18px;font-weight:850;line-height:1.18;margin:0 0 18px;min-height:42px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.price{font-size:25px;color:var(--money);font-weight:950;margin-bottom:18px}.stock{color:var(--muted);font-size:16px;margin-bottom:18px}.stock:before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--accent);margin-right:8px}.add{width:100%;border:0;border-radius:14px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:white;padding:15px 8px;font-size:18px;font-weight:900}.empty{color:var(--muted);text-align:center;margin-top:50px}.cartbar{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(400px,calc(100% - 48px));height:82px;border-radius:42px;border:1px solid #4c1d95;background:#171423;color:var(--text);box-shadow:0 0 32px rgba(139,92,246,.24);display:flex;align-items:center;gap:16px;padding:10px 16px;z-index:10}.cartIcon{width:62px;height:62px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-size:32px;position:relative}.cartIcon b{position:absolute;right:-6px;top:-9px;background:var(--money);color:#111;border-radius:50%;font-size:17px;min-width:30px;height:30px;display:flex;align-items:center;justify-content:center}.cartbar span:not(.cartIcon):not(.next){font-size:17px;color:#d7d3df}.cartbar strong{color:var(--money);font-size:25px;margin-left:auto}.next{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#21172f;border:1px solid #4c3270;font-size:46px;line-height:1}.modal{position:fixed;inset:0;background:rgba(0,0,0,.62);display:flex;align-items:flex-end;z-index:20}.sheet{width:100%;background:#151020;border-radius:28px 28px 0 0;padding:22px;max-height:82vh;overflow:auto;border-top:1px solid var(--line)}.sheet-head{display:flex;align-items:center;justify-content:space-between}.sheet h2{margin:0 0 18px}.sheet-head button{border:0;background:#26183a;color:white;border-radius:50%;font-size:28px;width:44px;height:44px}.cartItem{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line)}.cartItem strong{display:block}.cartItem span{color:var(--muted)}.qtyBtns{display:flex;align-items:center;gap:12px}.qtyBtns button{border:0;background:#21172f;color:white;width:36px;height:36px;border-radius:50%;font-size:22px}.totalLine{display:flex;justify-content:space-between;font-size:22px;margin:22px 0}.totalLine strong{color:var(--money)}.checkout{width:100%;border:0;border-radius:18px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:white;font-weight:950;font-size:19px;padding:18px}.checkout:disabled{opacity:.65}.hint{color:var(--muted);font-size:13px;text-align:center}.toast{position:fixed;left:20px;right:20px;top:18px;background:#21172f;border:1px solid #4c3270;color:white;border-radius:18px;padding:14px;text-align:center;z-index:99;font-weight:800}@media (max-width:430px){.top{padding-left:24px;padding-right:24px}.grid{padding-left:24px;padding-right:24px;gap:18px 14px}.card{border-radius:24px;min-height:306px}.card .img{height:160px}.top h1{font-size:27px}.balance-label strong{font-size:26px}.title{font-size:17px}.price{font-size:24px}.add{font-size:17px}}@media (max-width:360px){.grid{grid-template-columns:1fr}.card .img{height:190px}}

/* Tema roxo aplicado: remove verde do mini app */
.toast{border-color:#6d28d9;background:linear-gradient(135deg,#21172f,#3b1b63);box-shadow:0 12px 32px rgba(139,92,246,.22)}
.card:hover{border-color:#6d28d9;box-shadow:0 16px 42px rgba(139,92,246,.18)}
.checkout:not(:disabled),.add,.plus,.cartIcon{background:linear-gradient(135deg,#7c3aed,#a855f7)!important}
.stock:before{background:#a855f7!important}
.cartbar{border-color:#5b21b6!important;box-shadow:0 0 34px rgba(139,92,246,.28)!important}


/* CORREÇÃO V5 — carrinho não fica travado na frente */
[hidden]{display:none!important}

.modal[hidden]{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

.modal{
  display:none;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.modal.open{
  display:flex!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}

/* O botão pequeno do carrinho só aparece quando tem produto */
.cartbar[hidden]{
  display:none!important;
  pointer-events:none!important;
}

/* Mantém o carrinho por cima somente quando existir item, sem bloquear os cards */
.cartbar{
  z-index:15;
}

/* Deixa a página clicável normalmente */
.app{
  position:relative;
  z-index:1;
}

/* Corrige área inferior para o carrinho pequeno não cobrir os últimos produtos */
body.cart-has-items .app{
  padding-bottom:140px;
}

/* Roxo em todas as ações principais */
.checkout:not(:disabled),
.add,
.plus,
.cartIcon{
  background:linear-gradient(135deg,#7c3aed,#a855f7)!important;
}

.sheet-head button,
.qtyBtns button{
  background:#26183a!important;
  border:1px solid #4c3270!important;
}

.toast{
  border-color:#6d28d9!important;
  background:linear-gradient(135deg,#21172f,#3b1b63)!important;
}

.stock:before{
  background:#a855f7!important;
}


/* CORREÇÃO V6 — mini app menor, pagamento no + e entrega no modal */
:root{
  --accent:#7c3aed;
  --accent2:#a855f7;
  --accentDark:#4c1d95;
}

body{
  background:#08070d!important;
}

.app{
  max-width:430px;
  margin:0 auto;
  min-height:100vh;
  padding-bottom:105px!important;
}

.top{
  gap:12px!important;
  padding:22px 16px 18px!important;
  background:#120d1c!important;
}

.top img{
  width:54px!important;
  height:54px!important;
}

.top h1{
  font-size:21px!important;
  margin-bottom:8px!important;
}

.balance-label{
  font-size:12px!important;
  letter-spacing:3px!important;
}

.balance-label strong{
  font-size:20px!important;
}

.plus{
  width:50px!important;
  height:50px!important;
  font-size:32px!important;
  box-shadow:0 10px 24px rgba(168,85,247,.32)!important;
}

.store-head{
  padding:16px 14px 10px!important;
}

.store-head h2{
  font-size:15px!important;
}

.store-head button{
  width:36px!important;
  height:36px!important;
  font-size:18px!important;
}

.grid{
  padding:0 14px!important;
  gap:13px 10px!important;
}

.card{
  border-radius:18px!important;
  min-height:252px!important;
}

.card .img{
  height:118px!important;
}

.info{
  padding:12px!important;
}

.title{
  font-size:14px!important;
  min-height:34px!important;
  margin-bottom:12px!important;
}

.price{
  font-size:20px!important;
  margin-bottom:12px!important;
}

.stock{
  font-size:13px!important;
  margin-bottom:12px!important;
}

.add{
  padding:12px 6px!important;
  border-radius:12px!important;
  font-size:15px!important;
}

.cartbar{
  width:min(330px,calc(100% - 32px))!important;
  height:64px!important;
  gap:10px!important;
  padding:8px 10px!important;
  bottom:calc(14px + env(safe-area-inset-bottom))!important;
}

.cartIcon{
  width:48px!important;
  height:48px!important;
  font-size:24px!important;
}

.cartIcon b{
  min-width:24px!important;
  height:24px!important;
  font-size:13px!important;
}

.cartbar span:not(.cartIcon):not(.next){
  font-size:14px!important;
}

.cartbar strong{
  font-size:19px!important;
}

.next{
  width:44px!important;
  height:44px!important;
  font-size:34px!important;
}

.sheet{
  max-width:430px;
  margin:0 auto;
  padding:18px!important;
  border-radius:24px 24px 0 0!important;
}

.sheet h2{
  font-size:22px!important;
}

.sheet-head button{
  width:42px!important;
  height:42px!important;
}

.paySheet{
  padding-bottom:calc(18px + env(safe-area-inset-bottom))!important;
}

.payLabel{
  text-align:center;
  color:#aaa2b8;
  font-size:16px;
  margin:22px 0 14px;
}

.moneyInput{
  display:flex;
  align-items:center;
  border:1px solid #302845;
  border-radius:18px;
  overflow:hidden;
  background:#12101b;
  height:68px;
}

.moneyInput span{
  width:82px;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#181421;
  color:#ff4fd8;
  font-size:24px;
  font-weight:950;
}

.moneyInput input{
  flex:1;
  min-width:0;
  height:100%;
  border:0;
  outline:0;
  background:transparent;
  color:#f6f1ff;
  font-size:34px;
  font-weight:900;
  padding:0 18px;
}

.quickValues{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:9px;
  margin:18px 0;
}

.quickValues button{
  height:46px;
  border-radius:14px;
  border:1px solid #302845;
  background:#151020;
  color:#fff;
  font-weight:850;
  font-size:15px;
}

.pixBtn,.verifyBtn{
  background:linear-gradient(135deg,#7c3aed,#a855f7)!important;
}

.pixAmount{
  text-align:center;
  color:#aaa2b8;
  font-size:22px;
  margin:18px 0;
}

.pixAmount strong{
  color:#ff4fd8;
  font-size:32px;
}

.qrImg{
  display:block;
  width:min(260px,76vw);
  height:min(260px,76vw);
  margin:0 auto 18px;
  background:white;
  border-radius:18px;
  padding:10px;
  object-fit:contain;
}

.copyLine{
  display:flex;
  gap:10px;
  margin:10px 0 16px;
}

.copyLine input{
  flex:1;
  min-width:0;
  border:1px solid #302845;
  border-radius:14px;
  background:#12101b;
  color:#fff;
  padding:0 14px;
  height:52px;
  font-size:15px;
}

.copyLine button{
  width:58px;
  border:0;
  border-radius:16px;
  background:linear-gradient(135deg,#7c3aed,#a855f7);
  color:white;
  font-size:24px;
}

.statusBox{
  border:1px solid #302845;
  border-radius:16px;
  padding:16px;
  text-align:center;
  color:#aaa2b8;
  margin:16px 0;
  background:#12101b;
  font-size:16px;
}

.statusBox.ok{
  color:#fff;
  border-color:#7c3aed;
  background:#1d1231;
}

.backBtn{
  width:100%;
  height:54px;
  border-radius:16px;
  border:1px solid #302845;
  background:#111019;
  color:#fff;
  font-size:18px;
  font-weight:850;
  margin-top:12px;
}

.doneBox{
  width:min(390px,calc(100% - 42px));
  margin:auto;
  background:linear-gradient(160deg,#151720,#10131a);
  border:1px solid #24283a;
  border-radius:24px;
  padding:44px 28px 28px;
  text-align:center;
  box-shadow:0 24px 80px rgba(0,0,0,.5);
}

.doneIcon{
  width:86px;
  height:86px;
  margin:0 auto 28px;
  border-radius:50%;
  background:rgba(124,58,237,.22);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:42px;
}

.doneIcon:before{
  content:"";
}

.doneBox h2{
  font-size:30px;
  margin:0 0 14px;
}

.doneBox p{
  color:#a7afbd;
  font-size:18px;
  margin:0 0 24px;
}

.deliveryList{
  border:1px solid #293044;
  border-radius:18px;
  padding:18px;
  text-align:left;
  margin-bottom:24px;
  background:rgba(20,26,34,.65);
}

.deliveryItem strong{
  display:block;
  color:#fff;
  font-size:16px;
  margin-bottom:12px;
}

.deliveryItem div{
  color:#aeb8c6;
  font-size:16px;
  margin:8px 0;
  word-break:break-all;
}

.prettyItem{
  background:linear-gradient(180deg,rgba(18,22,33,.96),rgba(13,16,24,.96));
  border:1px solid #2a3150;
  border-radius:20px;
  padding:16px;
}

.deliveryTop{
  display:flex;
  justify-content:flex-start;
  margin-bottom:14px;
}

.deliveryBadge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(124,58,237,.15);
  border:1px solid rgba(168,85,247,.35);
  color:#f3edff;
  font-weight:800;
  font-size:13px;
}

.credentialBlock{
  margin:10px 0 14px;
}

.credentialBlock label{
  display:block;
  color:#c8c4d8;
  font-size:13px;
  font-weight:700;
  margin:0 0 8px;
}

.credentialRow{
  display:flex;
  gap:10px;
}

.credentialRow input{
  flex:1;
  min-width:0;
  height:50px;
  border-radius:14px;
  border:1px solid #303959;
  background:#0f1421;
  color:#fff;
  padding:0 14px;
  font-size:15px;
  font-weight:700;
}

.copyBtn{
  width:54px;
  height:50px;
  border:0;
  border-radius:14px;
  background:linear-gradient(135deg,#7c3aed,#a855f7);
  color:#fff;
  font-size:22px;
  font-weight:900;
  box-shadow:0 10px 24px rgba(124,58,237,.28);
}

@media (max-width:360px){
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .card .img{height:105px!important}
  .title{font-size:13px!important}
  .add{font-size:14px!important}
}

/* V14 disabled add */
.add:disabled{opacity:.45;filter:grayscale(.4);cursor:not-allowed;}


/* V49 - Compra realizada mais bonita: somente e-mail/senha + copiar */
.doneBox{
  background:linear-gradient(160deg,#171326,#0f111b)!important;
  border:1px solid #4c1d95!important;
  box-shadow:0 22px 80px rgba(124,58,237,.22),0 20px 70px rgba(0,0,0,.55)!important;
}
.doneIcon{
  background:linear-gradient(135deg,#6d28d9,#a855f7)!important;
  color:#fff!important;
  box-shadow:0 0 0 14px rgba(124,58,237,.16)!important;
}
.doneBox h2{
  font-size:31px!important;
  font-weight:950!important;
}
.deliveryList{
  border:0!important;
  padding:0!important;
  background:transparent!important;
}
.prettyDelivery{
  border:1px solid #34224f!important;
  background:rgba(17,14,28,.88)!important;
  border-radius:20px!important;
  padding:16px!important;
  margin-bottom:14px!important;
}
.accessRow{
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
  margin:10px 0!important;
}
.accessRow span{
  color:#b7aecb!important;
  font-size:14px!important;
  font-weight:800!important;
}
.accessRow code{
  display:block!important;
  background:#0b0a12!important;
  border:1px solid #302845!important;
  border-radius:14px!important;
  padding:12px!important;
  color:#fff!important;
  font-size:15px!important;
  word-break:break-all!important;
}
.copyAccess{
  width:100%!important;
  border:0!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,#7c3aed,#a855f7)!important;
  color:#fff!important;
  height:46px!important;
  font-size:15px!important;
  font-weight:900!important;
  margin:4px 0 12px!important;
}


/* V50 - compra realizada mais limpa */
.productMiniHeader{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}

.productMiniImage{
  width:72px;
  height:72px;
  border-radius:16px;
  object-fit:cover;
  border:1px solid rgba(168,85,247,.45);
  box-shadow:0 10px 24px rgba(124,58,237,.25);
}

.productMiniTitle{
  color:#fff;
  font-size:18px;
  font-weight:900;
  line-height:1.1;
}

.productMiniSub{
  color:#a78bfa;
  font-size:12px;
  font-weight:800;
  margin-top:4px;
  text-transform:uppercase;
  letter-spacing:.6px;
}

.miniCredentials{
  background:rgba(5,8,15,.45);
  border:1px solid rgba(168,85,247,.22);
  border-radius:16px;
  padding:14px;
  margin:12px 0 14px;
}

.miniCredentialLine{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:0 0 12px;
  color:#e8ddff;
  font-size:16px;
}

.miniCredentialLine:last-child{
  margin-bottom:0;
}

.miniCredentialLine code{
  display:block;
  color:#fff;
  background:#0b0b12;
  border:1px solid #3b285d;
  border-radius:12px;
  padding:12px;
  font-size:15px;
  font-weight:800;
  word-break:break-all;
}

.copyActionsRow{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.copySideBtn{
  border:0;
  border-radius:14px;
  padding:14px 8px;
  background:linear-gradient(135deg,#7c3aed,#a855f7);
  color:#fff;
  font-weight:900;
  font-size:14px;
  box-shadow:0 10px 24px rgba(124,58,237,.25);
}

@media(max-width:360px){
  .copyActionsRow{ grid-template-columns:1fr; }
}


/* V54 carrinho com foto, cupons do painel e promoções */
.cartItemV54{
  display:grid;
  grid-template-columns:62px 1fr auto;
  gap:12px;
  align-items:center;
}

.cartItemImg{
  width:62px;
  height:62px;
  border-radius:14px;
  object-fit:cover;
  border:1px solid rgba(168,85,247,.35);
  background:#11131b;
}

.cartItemImg.placeholder{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
}

.promoSuggestions{
  margin:14px 0;
  padding:12px;
  border-radius:16px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(168,85,247,.12);
}

.promoTitle{
  color:#fff;
  font-weight:900;
  margin:0 0 10px;
  font-size:15px;
}

.promoItem{
  display:grid;
  grid-template-columns:64px 1fr auto;
  gap:10px;
  align-items:center;
  background:rgba(12,10,18,.72);
  border:1px solid rgba(168,85,247,.14);
  border-radius:14px;
  padding:10px;
  margin:10px 0;
}

.promoImageWrap{
  position:relative;
  width:64px;
  height:64px;
}

.promoImageWrap img,
.promoNoImg{
  width:64px;
  height:64px;
  border-radius:12px;
  object-fit:cover;
  background:#16131f;
}

.promoNoImg{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:26px;
}

.promoBadge{
  position:absolute;
  top:-7px;
  right:-8px;
  background:#a000ff;
  color:#fff;
  border-radius:999px;
  padding:3px 7px;
  font-size:11px;
  font-weight:900;
}

.promoInfo strong{
  display:block;
  color:#fff;
  font-weight:900;
  font-size:14px;
  line-height:1.15;
  max-width:150px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.promoInfo s{
  color:#8e8799;
  font-size:12px;
}

.promoInfo b{
  color:#a855f7;
  margin-left:5px;
  font-size:14px;
}

.promoAddBtn{
  border:0;
  border-radius:10px;
  background:linear-gradient(135deg,#7c3aed,#b832ff);
  color:#fff;
  padding:10px 12px;
  font-size:13px;
  font-weight:900;
}

.couponRow{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  margin:12px 0;
}

.couponRow input{
  height:44px;
  border-radius:12px;
  border:1px solid #29273a;
  background:#070911;
  color:#fff;
  padding:0 12px;
  outline:none;
}

.couponRow button{
  border:0;
  border-radius:12px;
  padding:0 16px;
  font-weight:900;
  background:#f1f1f1;
  color:#111;
}

.couponStatus{
  color:#c8ffdc;
  font-size:13px;
  margin:8px 0;
}

.couponStatus button{
  margin-left:8px;
  border:0;
  background:transparent;
  color:#ff7b7b;
  font-weight:900;
}

.cartSummaryV54{
  margin-top:12px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  padding:12px;
}

.cartSummaryV54 div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#f3f3f7;
  margin:7px 0;
  font-size:14px;
}

.cartSummaryV54 .totalLine{
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:9px;
  font-size:17px;
  font-weight:900;
}

.minPixText{
  color:#8f88a6;
  font-size:13px;
  text-align:center;
  margin:0 0 8px;
  font-weight:800;
}

@media(max-width:380px){
  .promoItem{ grid-template-columns:54px 1fr; }
  .promoAddBtn{ grid-column:1/3; width:100%; }
  .couponRow{ grid-template-columns:1fr; }
}


/* V60 clean cart/coupon */
body.cart-open .cartFloat{ display:none !important; }

.cartItemV60{
  display:grid;
  grid-template-columns:64px 1fr auto;
  gap:12px;
  align-items:center;
  padding:12px;
  border-radius:16px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(168,85,247,.14);
  margin-bottom:10px;
}

.cartItemV60 .cartInfo strong{
  display:block;
  color:#fff;
  font-size:15px;
  font-weight:900;
  line-height:1.2;
  margin-bottom:4px;
}

.cartItemV60 .cartInfo span{
  color:#a9a0b8;
  font-size:14px;
}

.cartItemV60 .qtyBtns{
  display:flex;
  align-items:center;
  gap:8px;
}

.cartItemV60 .qtyBtns button{
  width:34px;
  height:34px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#fff;
  font-size:20px;
  font-weight:900;
}

.cartItemV60 .qtyBtns b{
  min-width:20px;
  text-align:center;
  color:#fff;
}

.cartItemImg{
  width:64px;
  height:64px;
  border-radius:14px;
  object-fit:cover;
  border:1px solid rgba(168,85,247,.35);
  background:#11131b;
}

.cartItemImg.placeholder{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
}

.emptyCart{
  color:#a9a0b8;
  text-align:center;
  padding:18px 0;
}

.promoSuggestions{
  margin:14px 0;
  padding:12px;
  border-radius:16px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(168,85,247,.12);
}
.promoTitle{ color:#fff; font-weight:900; margin:0 0 10px; font-size:15px; }
.promoItem{
  display:grid;
  grid-template-columns:64px 1fr auto;
  gap:10px;
  align-items:center;
  background:rgba(12,10,18,.72);
  border:1px solid rgba(168,85,247,.14);
  border-radius:14px;
  padding:10px;
  margin:10px 0;
}
.promoImageWrap{ position:relative; width:64px; height:64px; }
.promoImageWrap img,.promoNoImg{ width:64px; height:64px; border-radius:12px; object-fit:cover; background:#16131f; }
.promoNoImg{ display:flex; align-items:center; justify-content:center; font-size:26px; }
.promoBadge{ position:absolute; top:-7px; right:-8px; background:#a000ff; color:#fff; border-radius:999px; padding:3px 7px; font-size:11px; font-weight:900; }
.promoInfo strong{ display:block; color:#fff; font-weight:900; font-size:14px; line-height:1.15; max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.promoInfo s{ color:#8e8799; font-size:12px; }
.promoInfo b{ color:#a855f7; margin-left:5px; font-size:14px; }
.promoAddBtn{
  border:0;
  border-radius:10px;
  background:linear-gradient(135deg,#7c3aed,#b832ff);
  color:#fff;
  padding:10px 12px;
  font-size:13px;
  font-weight:900;
}

.couponRow{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  margin:12px 0;
}
.couponRow input{
  height:44px;
  border-radius:12px;
  border:1px solid #29273a;
  background:#070911;
  color:#fff;
  padding:0 12px;
  outline:none;
}
.couponRow button{
  border:0;
  border-radius:12px;
  padding:0 16px;
  font-weight:900;
  background:#f1f1f1;
  color:#111;
}
.couponStatus{ color:#c8ffdc; font-size:13px; margin:8px 0; }
.couponStatus button{ margin-left:8px; border:0; background:transparent; color:#ff7b7b; font-weight:900; }
.cartSummaryV60{
  margin-top:12px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  padding:12px;
}
.cartSummaryV60 div{ display:flex; align-items:center; justify-content:space-between; color:#f3f3f7; margin:7px 0; font-size:14px; }

.cartFloat{
  position:fixed;
  left:50%;
  bottom:22px;
  transform:translateX(-50%);
  z-index:80;
  min-width:260px;
  max-width:calc(100% - 36px);
  height:74px;
  border:1px solid rgba(168,85,247,.35);
  border-radius:999px;
  background:rgba(20,17,31,.96);
  box-shadow:0 18px 40px rgba(124,58,237,.25), 0 0 0 1px rgba(255,255,255,.04) inset;
  align-items:center;
  gap:13px;
  padding:10px 14px 10px 12px;
  color:#fff;
  backdrop-filter:blur(14px);
}
.cartFloatIcon{
  width:52px; height:52px; border-radius:50%;
  background:linear-gradient(135deg,#7c3aed,#a855f7);
  display:flex; align-items:center; justify-content:center;
  font-size:25px; flex:0 0 auto;
}
.cartFloatBadge{
  position:absolute; top:4px; left:52px; min-width:24px; height:24px; padding:0 7px;
  border-radius:999px; background:#ff4fd8; color:#111; font-weight:900; font-size:13px;
  display:flex; align-items:center; justify-content:center;
}
.cartFloatText{ display:flex; flex-direction:column; align-items:flex-start; line-height:1.15; flex:1; min-width:0; }
.cartFloatText small{ color:#a7a0b8; font-size:14px; font-weight:700; }
.cartFloatText b{ color:#ff4fd8; font-size:22px; font-weight:900; white-space:nowrap; }
.cartFloatArrow{
  width:48px; height:48px; border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  display:flex; align-items:center; justify-content:center;
  font-size:38px; line-height:1; color:#fff; flex:0 0 auto;
}
@media(max-width:380px){
  .promoItem{ grid-template-columns:54px 1fr; }
  .promoAddBtn{ grid-column:1/3; width:100%; }
  .couponRow{ grid-template-columns:1fr; }
}


/* V63 - só 2 ofertas no carrinho, sem quebrar o Mini App */
.promoSuggestions .promoItem:nth-of-type(n+4){
  display:none !important;
}


/* V66 - base V63 estável, ofertas certas */
.promoSuggestions .promoItem:nth-of-type(n+4){
  display:none !important;
}


/* V72 - botão Aplicar cupom roxo */
.couponRow button,
#applyCouponBtn{
  background: linear-gradient(135deg, #7c3aed, #b832ff) !important;
  color: #ffffff !important;
  border: 0 !important;
  box-shadow: 0 8px 22px rgba(168, 85, 247, .28) !important;
}

.couponRow button:hover,
#applyCouponBtn:hover{
  filter: brightness(1.06);
}

.couponRow button:active,
#applyCouponBtn:active{
  transform: scale(.98);
}


/* V90 - mostrar taxa PIX no modal */
.pixFeeBoxV90{
  width: calc(100% - 28px);
  margin: 14px auto 10px auto;
  padding: 12px 14px;
  border: 1px solid rgba(168, 85, 247, .28);
  border-radius: 14px;
  background: rgba(255,255,255,.035);
  color: #fff;
  font-size: 14px;
}
.pixFeeBoxV90 div{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 5px 0;
}
.pixFeeBoxV90 span{
  color: rgba(255,255,255,.72);
}
.pixFeeBoxV90 b{
  color: #ff4fd8;
  font-weight: 800;
}
.pixFeeTotalV90{
  border-top: 1px solid rgba(255,255,255,.10);
  padding-top: 8px;
  margin-top: 8px !important;
}
.pixFeeTotalV90 span,
.pixFeeTotalV90 b{
  font-size: 15px;
}


/* V91 - tela bonita de pagamento aprovado */
.pixSuccessCardV91{
  margin: 16px auto 10px auto;
  width: calc(100% - 28px);
  padding: 20px 16px;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(139, 92, 246, .24), rgba(18, 10, 30, .96));
  border: 1px solid rgba(168, 85, 247, .45);
  box-shadow: 0 18px 40px rgba(0,0,0,.30), 0 0 22px rgba(168,85,247,.15);
  text-align: center;
  color: #fff;
}
.pixSuccessIconV91{
  width: 58px;
  height: 58px;
  margin: 0 auto 10px auto;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(34,197,94,.18);
  border: 1px solid rgba(34,197,94,.45);
  font-size: 30px;
}
.pixSuccessCardV91 h3{
  margin: 6px 0 4px 0;
  font-size: 22px;
  font-weight: 900;
}
.pixSuccessCardV91 p{
  margin: 0 0 14px 0;
  color: rgba(255,255,255,.76);
  font-size: 14px;
}
.pixSuccessValuesV91{
  margin: 12px 0 16px 0;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.08);
}
.pixSuccessValuesV91 div{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 7px 0;
  font-size: 14px;
}
.pixSuccessValuesV91 span{ color: rgba(255,255,255,.70); }
.pixSuccessValuesV91 b{ color: #ff4fd8; font-weight: 900; }
.pixSuccessBtnV91{
  width: 100%;
  border: 0;
  outline: 0;
  border-radius: 16px;
  padding: 14px 16px;
  font-weight: 900;
  color: #fff;
  background: linear-gradient(135deg, #7c3aed, #a855f7);
  box-shadow: 0 10px 24px rgba(168,85,247,.24);
}


/* V93 - QR Code vira aprovado */
.pixApprovedVisualV93{
  width: min(260px, calc(100% - 24px));
  min-height: 260px;
  margin: 18px auto 18px auto;
  padding: 22px 18px;
  border-radius: 26px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at top, rgba(34,197,94,.24), transparent 55%),
    linear-gradient(180deg, rgba(139,92,246,.22), rgba(18,10,30,.96));
  border: 1px solid rgba(34,197,94,.35);
  box-shadow: 0 20px 42px rgba(0,0,0,.36), 0 0 24px rgba(34,197,94,.18);
  color: #fff;
  text-align: center;
  animation: pixApprovedPopV93 .28s ease-out;
}
.pixApprovedCircleV93{
  width: 82px;
  height: 82px;
  border-radius: 999px;
  background: rgba(34,197,94,.16);
  border: 1px solid rgba(34,197,94,.48);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}
.pixApprovedCircleV93 svg{
  width: 64px;
  height: 64px;
  overflow: visible;
}
.pixApprovedCircleV93 circle{
  fill: rgba(34,197,94,.08);
  stroke: rgba(34,197,94,.55);
  stroke-width: 3;
}
.pixApprovedCircleV93 path{
  fill: none;
  stroke: #22c55e;
  stroke-width: 7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.pixApprovedVisualV93 h3{
  margin: 4px 0 5px 0;
  font-size: 22px;
  font-weight: 900;
}
.pixApprovedVisualV93 p{
  margin: 0 0 12px 0;
  color: rgba(255,255,255,.75);
  font-size: 14px;
}
.pixApprovedRowsV93{
  width: 100%;
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.08);
}
.pixApprovedRowsV93 div{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 6px 0;
  font-size: 13px;
}
.pixApprovedRowsV93 span{
  color: rgba(255,255,255,.68);
}
.pixApprovedRowsV93 b{
  color: #ff4fd8;
  font-weight: 900;
}
.pixApprovedButtonV93{
  opacity: .85 !important;
  cursor: default !important;
}
@keyframes pixApprovedPopV93{
  from{ transform: scale(.94); opacity: 0; }
  to{ transform: scale(1); opacity: 1; }
}


/* V95 - QR vira card aprovado e verificação automática */
.pixApprovedCardV95{
  width: min(270px, calc(100% - 24px));
  min-height: 270px;
  margin: 18px auto 18px auto;
  padding: 22px 18px;
  border-radius: 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at 50% 0%, rgba(34,197,94,.28), transparent 58%),
    linear-gradient(180deg, rgba(139,92,246,.24), rgba(16,9,27,.98));
  border: 1px solid rgba(34,197,94,.42);
  box-shadow: 0 18px 42px rgba(0,0,0,.36), 0 0 30px rgba(34,197,94,.18);
  color: #fff;
  text-align: center;
  animation: pixApprovedPopV95 .30s ease-out;
}
.pixApprovedBadgeV95{
  width: 92px;
  height: 92px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom: 12px;
  background: rgba(34,197,94,.16);
  border: 1px solid rgba(34,197,94,.55);
}
.pixApprovedBadgeV95 svg{
  width: 76px;
  height: 76px;
}
.pixApprovedBadgeV95 circle{
  fill: rgba(34,197,94,.08);
  stroke: rgba(34,197,94,.65);
  stroke-width: 4;
}
.pixApprovedBadgeV95 path{
  fill:none;
  stroke:#22c55e;
  stroke-width:8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.pixApprovedCardV95 h3{
  margin: 4px 0 5px 0;
  font-size: 23px;
  font-weight: 900;
}
.pixApprovedCardV95 p{
  margin: 0 0 13px 0;
  font-size: 14px;
  color: rgba(255,255,255,.76);
}
.pixApprovedInfoV95{
  width: 100%;
  border-radius: 16px;
  padding: 10px 12px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.08);
}
.pixApprovedInfoV95 div{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 6px 0;
  font-size: 13px;
}
.pixApprovedInfoV95 span{
  color: rgba(255,255,255,.68);
}
.pixApprovedInfoV95 b{
  color: #ff4fd8;
  font-weight: 900;
}
.pixApprovedButtonV95{
  opacity: .85 !important;
  cursor: default !important;
}
@keyframes pixApprovedPopV95{
  from{transform: scale(.94); opacity:0;}
  to{transform: scale(1); opacity:1;}
}


/* V96 - confirmação real no lugar do QR */
.pixApprovedRealV96{
  width: min(260px, calc(100% - 24px));
  min-height: 260px;
  margin: 18px auto;
  padding: 22px 18px;
  border-radius: 28px;
  background:
    radial-gradient(circle at 50% 0%, rgba(34,197,94,.30), transparent 58%),
    linear-gradient(180deg, rgba(139,92,246,.25), rgba(16,9,27,.98));
  border: 1px solid rgba(34,197,94,.45);
  box-shadow: 0 18px 42px rgba(0,0,0,.36), 0 0 30px rgba(34,197,94,.18);
  color: #fff;
  text-align: center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  animation: pixApprovedRealPopV96 .28s ease-out;
}
.pixApprovedIconRealV96{
  width: 90px;
  height: 90px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(34,197,94,.16);
  border: 1px solid rgba(34,197,94,.55);
  margin-bottom: 12px;
}
.pixApprovedIconRealV96 svg{width:74px;height:74px;}
.pixApprovedIconRealV96 circle{
  fill: rgba(34,197,94,.08);
  stroke: rgba(34,197,94,.65);
  stroke-width: 4;
}
.pixApprovedIconRealV96 path{
  fill:none;
  stroke:#22c55e;
  stroke-width:8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.pixApprovedRealV96 h3{
  margin: 4px 0 5px 0;
  font-size: 22px;
  font-weight: 900;
}
.pixApprovedRealV96 p{
  margin: 0 0 12px 0;
  font-size: 14px;
  color: rgba(255,255,255,.76);
}
.pixApprovedRowsRealV96{
  width:100%;
  border-radius:16px;
  padding:10px 12px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.08);
}
.pixApprovedRowsRealV96 div{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin:6px 0;
  font-size:13px;
}
.pixApprovedRowsRealV96 span{color:rgba(255,255,255,.68);}
.pixApprovedRowsRealV96 b{color:#ff4fd8;font-weight:900;}
.pixApprovedButtonRealV96{
  opacity:.85!important;
  cursor:default!important;
}
@keyframes pixApprovedRealPopV96{
  from{transform:scale(.94);opacity:0;}
  to{transform:scale(1);opacity:1;}
}


/* V97 - aprovado simples, sem taxa/saldo no card */
.pixApprovedSimpleV97{
  min-height: 235px !important;
}
.pixApprovedSimpleV97 .pixApprovedRowsRealV96{
  display: none !important;
}
.pixApprovedSimpleV97 p{
  display: none !important;
}


/* V121 - valores em rosa */
.price,
.product-price,
.card-price,
.total-price,
.cart-total,
.balance-value,
#userBalance,
#pixAmount,
.pixAmount,
.amount,
.value,
.total strong,
.price-value,
.product .price,
.product-card .price,
.cart-summary strong,
.cart-total-value {
  color: #ff4fd8 !important;
}

.old-price,
.original-price {
  color: rgba(255, 255, 255, .45) !important;
}


/* V122 - remove amarelo restante dos valores */
:root {
  --yellow: #ff4fd8 !important;
  --orange: #ff4fd8 !important;
  --accent-yellow: #ff4fd8 !important;
  --price-color: #ff4fd8 !important;
  --money-color: #ff4fd8 !important;
}

/* Valores/preços/saldo/total em rosa */
.price,
.product-price,
.card-price,
.product__price,
.productPrice,
.item-price,
.cart-price,
.total-price,
.cart-total,
.cart-total-value,
.balance-value,
.balance,
.saldo,
.saldo-value,
#userBalance,
#balance,
#pixAmount,
.pixAmount,
.amount,
.value,
.money,
.total strong,
.total,
.subtotal strong,
.discount strong,
.price-value,
.product .price,
.product-card .price,
.cart-summary strong,
.cart-summary span:last-child,
.checkout-total,
.checkout-total strong,
.floating-cart-total,
.mini-cart-total,
#cartTotal,
#subtotalValue,
#discountValue,
#totalValue {
  color: #ff4fd8 !important;
  text-shadow: 0 0 12px rgba(255, 79, 216, .35) !important;
}

.old-price,
.original-price,
.compare-price {
  color: rgba(255, 255, 255, .45) !important;
  text-shadow: none !important;
}


/* =========================================================
   V196 — Tema dinâmico configurável pelo painel web
   ========================================================= */
:root{--bg:#08070d;--panel:#171423;--panel2:#21172f;--line:#4c3270;--accent:#7c3aed;--accent2:#a855f7;--accentDark:#4c3270;--money:#ff4fd8;--text:#f8f6ff;--muted:#8e8799}
body{background:var(--bg)!important;color:var(--text)!important}.top{background:color-mix(in srgb,var(--panel) 78%,var(--bg))!important;border-color:var(--line)!important}.card,.cartbar,.sheet{background:var(--panel)!important;border-color:var(--line)!important}.store-head button,.sheet-head button,.qtyBtns button,.next{background:var(--panel2)!important;border-color:var(--line)!important;color:var(--text)!important}.checkout:not(:disabled),.add,.plus,.cartIcon,.quickValues button.active,.pixSuccessBtnV91{background:linear-gradient(135deg,var(--accent),var(--accent2))!important}.stock:before{background:var(--accent2)!important}.price,.balance-label strong,.cartbar strong,.totalLine strong,.promoInfo b{color:var(--money)!important}.balance-label,.stock,.hint,.cartItem span{color:var(--muted)!important}.toast{border-color:var(--line)!important;background:linear-gradient(135deg,var(--panel2),color-mix(in srgb,var(--accent) 28%,var(--panel2)))!important;box-shadow:0 12px 32px color-mix(in srgb,var(--accent) 22%,transparent)!important}.card{box-shadow:0 18px 45px color-mix(in srgb,var(--accent) 13%,transparent)!important}.card:hover{border-color:var(--accent)!important;box-shadow:0 16px 42px color-mix(in srgb,var(--accent) 18%,transparent)!important}.cartbar{box-shadow:0 0 34px color-mix(in srgb,var(--accent) 25%,transparent)!important}.plus{box-shadow:0 10px 24px color-mix(in srgb,var(--accent2) 30%,transparent)!important}.modal,.modalOverlay{--theme-accent:var(--accent);--theme-accent2:var(--accent2)}

/* =========================================================
   V198 — Tema dinâmico em TODAS as telas da Mini App
   Corrige cores fixas restantes em saldo, PIX e carrinho.
   ========================================================= */

/* Cabeçalho / saldo */
.top,
.store-head,
.paySheet,
.sheet,
.modalBody{
  color:var(--text)!important;
}
.top{
  background:color-mix(in srgb,var(--panel) 82%,var(--bg))!important;
  border-color:var(--line)!important;
}
.plus,
#addBalance,
.pixBtn,
.verifyBtn,
#generatePix,
#copyPix,
.copyLine button,
.promoAddBtn,
.couponRow button,
#applyCouponBtn,
.checkout:not(:disabled),
.add,
.copyBtn,
.copyAccess,
.copySideBtn,
.cartFloatIcon,
.quickValues button.active,
.pixSuccessBtnV91{
  background:linear-gradient(135deg,var(--accent),var(--accent2))!important;
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 10px 24px color-mix(in srgb,var(--accent) 26%,transparent)!important;
}

/* Modal de adicionar saldo */
.payLabel,
.pixAmount,
.statusBox,
.doneBox p,
.cartFloatText small{
  color:var(--muted)!important;
}
.moneyInput,
.copyLine input,
.statusBox,
.backBtn,
.quickValues button,
.couponRow input{
  border-color:var(--line)!important;
  background:var(--panel2)!important;
  color:var(--text)!important;
}
.moneyInput span{
  background:color-mix(in srgb,var(--panel2) 86%,var(--accent) 14%)!important;
  color:var(--money)!important;
}
.moneyInput input{
  color:var(--text)!important;
}
.quickValues button{
  color:var(--text)!important;
}
.quickValues button:hover,
.quickValues button:focus-visible{
  border-color:var(--accent)!important;
}
.pixAmount strong,
#pixAmount,
.pixFeeBoxV90 b,
.pixSuccessValuesV91 b,
.pixApprovedRowsV93 b,
.pixApprovedInfoV95 b,
.pixApprovedRowsRealV96 b{
  color:var(--money)!important;
  text-shadow:0 0 12px color-mix(in srgb,var(--money) 30%,transparent)!important;
}
.copyLine input:focus,
.couponRow input:focus,
.moneyInput:focus-within{
  border-color:var(--accent)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)!important;
}
.statusBox.ok{
  border-color:var(--accent)!important;
  background:color-mix(in srgb,var(--panel2) 82%,var(--accent) 18%)!important;
  color:var(--text)!important;
}
.pixFeeBoxV90{
  border-color:color-mix(in srgb,var(--accent) 34%,var(--line))!important;
  background:color-mix(in srgb,var(--panel) 86%,var(--accent) 14%)!important;
  color:var(--text)!important;
}
.pixFeeBoxV90 span{
  color:var(--muted)!important;
}

/* Carrinho / ofertas / cupom */
.promoSuggestions,
.cartSummaryV54,
.cartSummaryV60{
  background:color-mix(in srgb,var(--panel) 94%,var(--text) 6%)!important;
  border-color:var(--line)!important;
}
.promoItem{
  background:color-mix(in srgb,var(--panel2) 88%,var(--bg) 12%)!important;
  border-color:color-mix(in srgb,var(--accent) 24%,var(--line))!important;
}
.promoNoImg,
.promoImageWrap img,
.cartItemImg{
  background:var(--panel2)!important;
  border-color:color-mix(in srgb,var(--accent) 34%,var(--line))!important;
}
.promoBadge{
  background:var(--accent2)!important;
  color:#fff!important;
}
.promoTitle,
.promoInfo strong,
.cartSummaryV54 div,
.cartSummaryV60 div{
  color:var(--text)!important;
}
.promoInfo s{
  color:var(--muted)!important;
}
.promoInfo b,
#subtotalValue,
#discountValue,
#modalTotal,
#cartTotal,
#cartFloatTotal,
.cartFloatText b,
.cartSummaryV54 b,
.cartSummaryV60 b{
  color:var(--money)!important;
  text-shadow:0 0 12px color-mix(in srgb,var(--money) 28%,transparent)!important;
}
.couponRow button,
#applyCouponBtn{
  background:linear-gradient(135deg,var(--accent),var(--accent2))!important;
}
.cartFloat{
  border-color:color-mix(in srgb,var(--accent) 42%,var(--line))!important;
  background:color-mix(in srgb,var(--panel) 94%,transparent)!important;
  box-shadow:0 18px 40px color-mix(in srgb,var(--accent) 24%,transparent),0 0 0 1px color-mix(in srgb,var(--text) 5%,transparent) inset!important;
}
.cartFloatBadge,
.cartIcon b{
  background:var(--money)!important;
  color:var(--bg)!important;
}

/* Cards, bordas e detalhes que ainda carregavam roxo fixo */
.doneBox,
.prettyDelivery,
.miniCredentials,
.deliveryBadge,
.productMiniImage,
.miniCredentialLine code,
.accessRow code,
.credentialRow input{
  border-color:color-mix(in srgb,var(--accent) 34%,var(--line))!important;
}
.doneBox,
.prettyDelivery,
.miniCredentials{
  background:color-mix(in srgb,var(--panel) 92%,var(--accent) 8%)!important;
}
.doneIcon,
.deliveryBadge{
  background:color-mix(in srgb,var(--accent) 18%,var(--panel2))!important;
  color:var(--text)!important;
}
.productMiniSub{
  color:var(--accent2)!important;
}

/* Telas de pagamento aprovado: mantém o verde de sucesso, mas troca o fundo roxo pelo tema */
.pixSuccessCardV91,
.pixApprovedVisualV93,
.pixApprovedCardV95,
.pixApprovedRealV96{
  background:
    radial-gradient(circle at 50% 0%,rgba(34,197,94,.24),transparent 58%),
    linear-gradient(180deg,color-mix(in srgb,var(--accent) 22%,var(--panel)),var(--panel2))!important;
  color:var(--text)!important;
}
.pixSuccessCardV91{
  border-color:color-mix(in srgb,var(--accent) 45%,var(--line))!important;
  box-shadow:0 18px 40px rgba(0,0,0,.30),0 0 22px color-mix(in srgb,var(--accent) 16%,transparent)!important;
}

/* Compatibilidade com seletores antigos que forçavam rosa/roxo */
:root{
  --yellow:var(--money)!important;
  --orange:var(--money)!important;
  --accent-yellow:var(--money)!important;
  --price-color:var(--money)!important;
  --money-color:var(--money)!important;
}
.price,
.product-price,
.card-price,
.product__price,
.productPrice,
.item-price,
.cart-price,
.total-price,
.cart-total,
.cart-total-value,
.balance-value,
.balance,
.saldo,
.saldo-value,
#userBalance,
#balance,
#pixAmount,
.pixAmount strong,
.amount,
.value,
.money,
.total strong,
.subtotal strong,
.discount strong,
.price-value,
.product .price,
.product-card .price,
.cart-summary strong,
.cart-summary span:last-child,
.checkout-total,
.checkout-total strong,
.floating-cart-total,
.mini-cart-total,
#cartTotal,
#subtotalValue,
#discountValue,
#totalValue{
  color:var(--money)!important;
  text-shadow:0 0 12px color-mix(in srgb,var(--money) 30%,transparent)!important;
}

/* V216 — Mini App funcional também no navegador/site */
.webSessionButton{
  margin-top:4px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--accent2);
  font:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px;
}
.webLoginModal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(4,3,8,.82);
  backdrop-filter:blur(12px);
}
.webLoginModal[hidden]{display:none!important}
.webLoginCard{
  width:min(100%,420px);
  padding:28px 22px;
  border:1px solid color-mix(in srgb,var(--accent) 42%,var(--line));
  border-radius:26px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 92%,var(--accent) 8%),var(--panel2));
  color:var(--text);
  text-align:center;
  box-shadow:0 24px 70px rgba(0,0,0,.48);
}
.webLoginIcon{
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  margin:0 auto 14px;
  border-radius:20px;
  background:color-mix(in srgb,var(--accent) 18%,var(--panel2));
  font-size:31px;
}
.webLoginCard h2{margin:0 0 9px;font-size:23px}
.webLoginCard p{margin:0 auto 20px;color:var(--muted);line-height:1.45}
.telegramLoginLink,
.checkWebLogin,
.renewWebLogin{
  box-sizing:border-box;
  width:100%;
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:15px;
  font-weight:900;
  text-decoration:none;
  cursor:pointer;
}
.telegramLoginLink{
  border:0;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;
}
.checkWebLogin,
.renewWebLogin{
  margin-top:10px;
  border:1px solid var(--line);
  background:var(--panel);
  color:var(--text);
}
.webLoginStatus{
  min-height:22px;
  margin:15px 0 8px;
  color:var(--accent2);
  font-size:13px;
  font-weight:800;
}
.webLoginCard small{display:block;color:var(--muted);line-height:1.4}
@media (max-width:480px){
  .webLoginModal{padding:14px}
  .webLoginCard{padding:24px 18px;border-radius:22px}
}

/* V217 — Conta independente no site (Telegram opcional) */
.accountLinks{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.webLoginCard{position:relative;text-align:left;max-height:min(92vh,760px);overflow:auto}
.webLoginCard>h2,.webLoginCard>p,.webLoginCard>.webLoginIcon,.webLoginCard>small{text-align:center}
.closeWebLogin{position:absolute;top:12px;right:14px;width:36px;height:36px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text);font-size:22px;cursor:pointer}
.accountTabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:4px 0 16px;padding:5px;border:1px solid var(--line);border-radius:15px;background:var(--panel)}
.accountTab{min-height:42px;border:0;border-radius:11px;background:transparent;color:var(--muted);font-weight:900;cursor:pointer}
.accountTab.active{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff}
.siteAccountForm{display:grid;gap:8px}
.siteAccountForm[hidden]{display:none!important}
.siteAccountForm label{font-size:13px;font-weight:800;color:var(--text);margin-top:3px}
.siteAccountForm input{box-sizing:border-box;width:100%;min-height:48px;padding:0 14px;border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--text);font:inherit;outline:none}
.siteAccountForm input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}
.siteAccountPrimary{width:100%;min-height:49px;margin-top:8px;border:0;border-radius:15px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;font-weight:900;cursor:pointer}
.siteAccountPrimary:disabled{opacity:.65;cursor:wait}
.telegramOptional{margin:14px 0 12px;padding:12px;border:1px solid var(--line);border-radius:15px;background:color-mix(in srgb,var(--panel) 86%,transparent)}
.telegramOptional summary{cursor:pointer;color:var(--muted);font-size:13px;font-weight:800;text-align:center}
.telegramOptional[open] summary{margin-bottom:10px;color:var(--text)}
.telegramOptional .telegramLoginLink,.telegramOptional .checkWebLogin,.telegramOptional .renewWebLogin{min-height:44px;font-size:14px}
.webLoginStatus:empty{display:none}
.purchasesSheet{max-height:min(90vh,820px);overflow:auto}
.purchasesSheetHead{align-items:flex-start;margin-bottom:14px}
.purchasesSheetHead h2{margin:0 0 6px}
.purchasesSheetHead p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}
.purchaseHistoryTools{display:grid;gap:10px;margin:4px 0 16px}
.purchaseHistorySearch{height:46px;padding:0 13px;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:14px;background:var(--panel2)}
.purchaseHistorySearch span{color:var(--muted);font-size:18px}
.purchaseHistorySearch input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--text);font:inherit}
.purchaseHistorySearch input::placeholder{color:var(--muted)}
.purchaseHistoryFilters{display:flex;gap:8px;overflow:auto;padding-bottom:1px}
.purchaseHistoryFilters button{min-height:36px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--muted);font-weight:850;cursor:pointer}
.purchaseHistoryFilters button.active{border-color:transparent;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff}
.purchasesList{display:grid;gap:14px;padding:2px 0 12px}
.purchaseHistoryEmpty{padding:30px 12px;text-align:center;color:var(--muted)}
.purchaseHistoryCard{padding:14px;border:1px solid color-mix(in srgb,var(--accent) 52%,var(--line));border-radius:18px;background:var(--panel2);box-shadow:0 12px 28px rgba(0,0,0,.14)}
.purchaseHistoryProductHead{display:grid;grid-template-columns:156px minmax(0,1fr);gap:14px;align-items:start}
.purchaseHistoryImageBox{width:156px;aspect-ratio:16/9;border-radius:13px;overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 68%,var(--line));background:var(--panel);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent2) 16%,transparent),0 8px 20px color-mix(in srgb,var(--accent) 18%,transparent);transition:border-color .18s ease,box-shadow .18s ease}
.purchaseHistoryImage{display:block;width:100%;height:100%;object-fit:contain;background:var(--panel);transition:filter .18s ease,opacity .18s ease}
.purchaseHistoryImageFallback{display:grid;place-items:center;font-size:30px}
.purchaseHistoryProductInfo{min-width:0;padding-top:2px}
.purchaseHistoryProductInfo b{display:block;font-size:14px;line-height:1.25;word-break:break-word}
.purchaseHistoryProductInfo small{display:block;margin-top:7px;color:var(--muted);font-size:11px;line-height:1.35}
.purchaseHistoryStatus{display:inline-flex;align-items:center;min-height:26px;margin-top:10px;padding:0 10px;border-radius:999px;background:color-mix(in srgb,#22c55e 16%,var(--panel));color:#55e38b;font-size:10px;font-weight:900}
.purchaseCredentials{display:grid;gap:9px;margin-top:14px;padding:11px;border-radius:13px;background:var(--panel);font-size:13px;word-break:break-word}
.purchaseCredentialRow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.purchaseCredentialRow small{display:block;margin-bottom:3px;color:var(--muted);font-size:10px}
.purchaseCredentialRow code,.purchaseHistoryFooter code{color:var(--money);font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.purchaseCredentialRow button{min-height:30px;padding:0 10px;border:0;border-radius:9px;background:color-mix(in srgb,var(--accent) 18%,var(--panel2));color:var(--accent2);font-size:10px;font-weight:900;cursor:pointer}
.purchaseHistoryFooter{display:flex;align-items:center;justify-content:flex-start;gap:12px;margin-top:12px;color:var(--muted);font-size:11px}
@media(max-width:480px){
  .accountLinks{gap:7px}.webLoginCard{padding-top:24px}
  .purchasesSheet{padding:18px}
  .purchaseHistoryProductHead{grid-template-columns:142px minmax(0,1fr);gap:12px}
  .purchaseHistoryImageBox{width:142px}
}
@media(max-width:365px){
  .purchaseHistoryProductHead{grid-template-columns:126px minmax(0,1fr);gap:10px}
  .purchaseHistoryImageBox{width:126px}
  .purchaseHistoryProductInfo b{font-size:13px}
  .purchaseHistoryFooter{align-items:flex-start;flex-direction:column}
}

/* V218 — Login do site redesenhado */
.webLoginModal{
  padding:18px;
  overflow-y:auto;
  background:
    radial-gradient(circle at 18% 20%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 34%),
    rgba(3,4,10,.88);
  backdrop-filter:blur(16px);
}
.webLoginCard{
  width:min(100%,820px);
  min-height:510px;
  max-height:none;
  padding:0;
  display:grid;
  grid-template-columns:minmax(270px,.9fr) minmax(370px,1.1fr);
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--accent) 38%,var(--line));
  border-radius:28px;
  background:var(--panel2);
  box-shadow:0 28px 90px rgba(0,0,0,.52);
  text-align:left;
}
.webLoginShowcase{
  position:relative;
  min-width:0;
  padding:34px 30px 30px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  color:#fff;
  overflow:hidden;
  background:
    radial-gradient(circle at 86% 12%,rgba(255,255,255,.18),transparent 26%),
    radial-gradient(circle at 14% 88%,rgba(255,255,255,.12),transparent 30%),
    linear-gradient(145deg,color-mix(in srgb,var(--accent) 86%,#18244b),color-mix(in srgb,var(--accent2) 72%,#071022));
}
.webLoginShowcase::before,
.webLoginShowcase::after{
  content:"";
  position:absolute;
  border:1px solid rgba(255,255,255,.13);
  border-radius:50%;
  pointer-events:none;
}
.webLoginShowcase::before{width:220px;height:220px;right:-115px;top:70px}
.webLoginShowcase::after{width:150px;height:150px;left:-82px;bottom:36px}
.authBrand,
.authMobileBrand{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:12px;
}
.authBrandMark{
  width:43px;
  height:43px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:14px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  font-size:21px;
  font-weight:1000;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15);
}
.authBrandText,
.authMobileBrand>span:last-child{
  display:grid;
  gap:2px;
}
.authBrand b,
.authMobileBrand b{font-size:16px;letter-spacing:.1px}
.authBrand small,
.authMobileBrand small{font-size:11px;color:rgba(255,255,255,.68)}
.authHero{position:relative;z-index:1;margin:56px 0 34px}
.authPill{
  display:inline-flex;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  background:rgba(255,255,255,.1);
  font-size:10px;
  font-weight:900;
  letter-spacing:1.2px;
}
.authHero h3{max-width:310px;margin:17px 0 12px;font-size:30px;line-height:1.08;letter-spacing:-.7px}
.authHero p{max-width:300px;margin:0;color:rgba(255,255,255,.74);font-size:14px;line-height:1.55;text-align:left}
.authBenefits{position:relative;z-index:1;display:grid;gap:10px}
.authBenefits span{display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.83);font-size:13px;font-weight:700}
.authBenefits i{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:rgba(255,255,255,.14);
  color:#fff;
  font-style:normal;
  font-size:12px;
}
.webLoginContent{
  min-width:0;
  padding:34px 38px 28px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:
    radial-gradient(circle at 100% 0,color-mix(in srgb,var(--accent) 7%,transparent),transparent 35%),
    var(--panel2);
}
.authMobileBrand{display:none}
.authHeader{margin-bottom:18px}
.authEyebrow{display:block;margin-bottom:7px;color:var(--accent2);font-size:10px;font-weight:1000;letter-spacing:1.35px}
.webLoginCard .authHeader h2{margin:0 0 7px;font-size:27px;line-height:1.12;letter-spacing:-.45px;text-align:left}
.webLoginCard .authHeader p{margin:0;color:var(--muted);font-size:14px;line-height:1.45;text-align:left}
.closeWebLogin{
  z-index:5;
  top:17px;
  right:17px;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-color:color-mix(in srgb,var(--line) 72%,transparent);
  border-radius:13px;
  background:color-mix(in srgb,var(--panel) 82%,transparent);
  font-size:21px;
  line-height:1;
  backdrop-filter:blur(8px);
}
.closeWebLogin:hover{border-color:var(--accent);color:var(--accent2)}
.accountTabs{
  gap:4px;
  margin:0 0 17px;
  padding:4px;
  border:0;
  border-radius:13px;
  background:color-mix(in srgb,var(--panel) 80%,var(--line));
}
.accountTab{min-height:39px;border-radius:10px;font-size:13px}
.accountTab.active{
  background:var(--panel2);
  color:var(--text);
  box-shadow:0 4px 16px rgba(0,0,0,.18),inset 0 0 0 1px color-mix(in srgb,var(--accent) 30%,var(--line));
}
.siteAccountForm{gap:7px}
.siteAccountForm label{margin:2px 0 0;font-size:12px;color:color-mix(in srgb,var(--text) 90%,var(--muted))}
.authInputWrap{
  min-height:47px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 13px;
  border:1px solid var(--line);
  border-radius:13px;
  background:color-mix(in srgb,var(--panel) 92%,transparent);
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.authInputWrap:focus-within{
  border-color:var(--accent);
  background:var(--panel);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent);
}
.authInputWrap>span{
  width:18px;
  color:var(--muted);
  font-size:12px;
  text-align:center;
  opacity:.85;
}
.siteAccountForm .authInputWrap input{
  min-width:0;
  min-height:45px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none!important;
}
.siteAccountForm .authInputWrap input:focus{border:0;box-shadow:none}
.siteAccountForm input::placeholder{color:color-mix(in srgb,var(--muted) 76%,transparent)}
.registerFields{display:grid;grid-template-columns:1fr;gap:7px}
.registerFields>div{display:grid;gap:7px}
.siteAccountPrimary{
  min-height:48px;
  margin-top:10px;
  border-radius:13px;
  box-shadow:0 10px 24px color-mix(in srgb,var(--accent) 22%,transparent);
  transition:transform .16s ease,filter .16s ease;
}
.siteAccountPrimary:hover{filter:brightness(1.06);transform:translateY(-1px)}
.siteAccountPrimary:active{transform:translateY(0)}
.webLoginStatus{min-height:0;margin:10px 0 0;padding:0;font-size:12px;text-align:center}
.webLoginStatus:not(:empty){padding:9px 11px;border-radius:11px;background:color-mix(in srgb,var(--accent) 10%,var(--panel));border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line))}
.authDivider{display:flex;align-items:center;gap:11px;margin:14px 0 10px;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.8px}
.authDivider::before,.authDivider::after{content:"";height:1px;flex:1;background:var(--line)}
.telegramOptional{
  margin:0;
  padding:0;
  border:1px solid var(--line);
  border-radius:13px;
  background:color-mix(in srgb,var(--panel) 88%,transparent);
  overflow:hidden;
}
.telegramOptional summary{
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 14px;
  list-style:none;
  color:var(--text);
  font-size:13px;
  font-weight:850;
}
.telegramOptional summary::-webkit-details-marker{display:none}
.telegramOptional summary::after{content:"⌄";margin-left:auto;color:var(--muted);transition:transform .2s ease}
.telegramOptional[open] summary{margin:0;border-bottom:1px solid var(--line)}
.telegramOptional[open] summary::after{transform:rotate(180deg)}
.telegramOptional summary small{display:inline;color:var(--muted);font-size:10px;font-weight:700}
.telegramMark{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:color-mix(in srgb,#229ED9 18%,var(--panel2));
  color:#39aee9;
  font-size:11px;
  transform:rotate(-22deg);
}
.telegramActions{display:grid;grid-template-columns:1fr 112px;gap:8px;padding:10px}
.telegramOptional .telegramLoginLink,
.telegramOptional .checkWebLogin,
.telegramOptional .renewWebLogin{
  min-height:40px;
  margin:0;
  border-radius:10px;
  font-size:12px;
}
.telegramOptional .telegramLoginLink{background:#229ED9}
.telegramOptional .renewWebLogin{grid-column:1/-1}
.authLegal{margin-top:11px!important;color:var(--muted)!important;font-size:10px!important;line-height:1.35!important;text-align:center!important}

@media (max-width:760px){
  .webLoginModal{align-items:flex-start;padding:14px}
  .webLoginCard{
    width:min(100%,460px);
    min-height:0;
    margin:auto;
    display:block;
    overflow:visible;
    border-radius:24px;
  }
  .webLoginShowcase{display:none}
  .webLoginContent{padding:27px 22px 22px;border-radius:24px}
  .authMobileBrand{display:flex;margin:0 46px 22px 0}
  .authMobileBrand .authBrandMark{width:38px;height:38px;border-color:color-mix(in srgb,var(--accent) 32%,var(--line));background:color-mix(in srgb,var(--accent) 16%,var(--panel));color:var(--accent2)}
  .authMobileBrand small{color:var(--muted)}
  .webLoginCard .authHeader h2{font-size:25px}
}

@media (max-width:430px){
  .webLoginModal{padding:10px}
  .webLoginCard{border-radius:21px}
  .webLoginContent{padding:22px 16px 18px;border-radius:21px}
  .authMobileBrand{margin-bottom:17px}
  .authHeader{margin-bottom:15px}
  .webLoginCard .authHeader h2{font-size:23px}
  .accountTabs{margin-bottom:14px}
  .authInputWrap{min-height:45px}
  .siteAccountPrimary{min-height:46px}
  .telegramActions{grid-template-columns:1fr}
}

@media (min-width:761px) and (max-height:650px){
  .webLoginModal{align-items:flex-start;padding:10px}
  .webLoginCard{min-height:0;margin:auto}
  .webLoginShowcase{padding:24px 26px}
  .authHero{margin:28px 0 24px}
  .authHero h3{font-size:25px}
  .webLoginContent{padding:24px 34px 20px}
  .authHeader{margin-bottom:13px}
  .webLoginCard .authHeader h2{font-size:24px}
  .accountTabs{margin-bottom:12px}
  .authInputWrap{min-height:43px}
  .siteAccountForm .authInputWrap input{min-height:41px}
  .siteAccountPrimary{min-height:44px;margin-top:7px}
  .authDivider{margin:10px 0 8px}
  .telegramOptional summary{min-height:40px}
  .authLegal{margin-top:7px!important}
}


/* =========================================================
   V219 — Layout responsivo para desktop + suporte flutuante
   ========================================================= */
.floatingSupport{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:92;
  min-height:54px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 17px 7px 7px;
  border:1px solid color-mix(in srgb,var(--accent) 44%,var(--line));
  border-radius:999px;
  background:color-mix(in srgb,var(--panel) 94%,transparent);
  color:var(--text);
  text-decoration:none;
  font-size:14px;
  font-weight:900;
  box-shadow:0 18px 48px rgba(0,0,0,.36),0 0 0 1px color-mix(in srgb,var(--text) 5%,transparent) inset;
  backdrop-filter:blur(16px);
  transition:transform .18s ease,border-color .18s ease,filter .18s ease;
}
.floatingSupport[hidden]{display:none!important}
.floatingSupport:hover{transform:translateY(-2px);border-color:var(--accent);filter:brightness(1.08)}
.floatingSupport:active{transform:translateY(0)}
.floatingSupportIcon{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:50%;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;
  font-size:19px;
  box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 30%,transparent);
}
.floatingSupportLabel{white-space:nowrap}

@media (min-width:760px){
  body{
    background:
      radial-gradient(circle at 18% 0,color-mix(in srgb,var(--accent) 10%,transparent),transparent 32%),
      radial-gradient(circle at 92% 12%,color-mix(in srgb,var(--accent2) 8%,transparent),transparent 28%),
      var(--bg)!important;
  }
  .app{
    width:min(100%,1280px)!important;
    max-width:1280px!important;
    margin:0 auto!important;
    padding:24px 28px 140px!important;
  }
  .top{
    min-height:104px;
    gap:18px!important;
    padding:22px 26px!important;
    border:1px solid var(--line)!important;
    border-radius:24px!important;
    box-shadow:0 18px 54px rgba(0,0,0,.20)!important;
  }
  .top img{width:62px!important;height:62px!important}
  .top h1{font-size:23px!important;margin-bottom:7px!important}
  .balance-label{font-size:12px!important}
  .balance-label strong{font-size:22px!important}
  .accountLinks{margin-top:6px!important}
  .plus{width:54px!important;height:54px!important;font-size:34px!important}
  .store-head{padding:30px 2px 16px!important}
  .store-head h2{font-size:19px!important}
  .store-head button{width:42px!important;height:42px!important}
  .grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:20px!important;
    padding:0!important;
  }
  .card{
    min-height:332px!important;
    border-radius:20px!important;
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
  }
  .card:hover{transform:translateY(-3px)}
  .card .img{
    width:100%;
    height:auto!important;
    aspect-ratio:16/9;
  }
  .info{padding:15px!important;display:flex;flex:1;flex-direction:column}
  .title{font-size:15px!important;min-height:36px!important;margin-bottom:12px!important}
  .price{font-size:22px!important;margin-bottom:10px!important}
  .stock{font-size:13px!important;margin-bottom:14px!important}
  .add{margin-top:auto;padding:13px 8px!important;font-size:15px!important}
  .modal{align-items:center!important;padding:24px!important}
  .sheet{
    width:min(100%,720px)!important;
    max-width:720px!important;
    max-height:min(88vh,820px)!important;
    margin:auto!important;
    border:1px solid var(--line)!important;
    border-radius:24px!important;
  }
  .paySheet{max-width:560px!important}
  .purchasesSheet{max-width:760px!important}
  .doneBox{width:min(100%,620px)!important}
  .cartFloat{left:auto!important;right:24px!important;bottom:24px!important;transform:none!important}
  body.cart-has-items .floatingSupport{bottom:112px}
}

@media (min-width:1100px){
  .grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .card{min-height:338px!important}
}

@media (min-width:1500px){
  .app{max-width:1380px!important;width:min(100%,1380px)!important}
  .grid{gap:22px!important}
}

@media (max-width:759px){
  .floatingSupport{
    right:14px;
    bottom:18px;
    width:52px;
    height:52px;
    min-height:52px;
    padding:6px;
    justify-content:center;
  }
  .floatingSupportIcon{width:40px;height:40px}
  .floatingSupportLabel{display:none}
  body.cart-has-items .floatingSupport{bottom:100px}
}


/* V247 - banner completo e fallback somente com emoji */
.card .img > img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain!important;
  object-position:center;
  background:var(--bg);
}
.fallback-banner{
  position:relative;
  width:100%;
  height:100%;
  min-height:100%;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  color:#fff;
  background:
    radial-gradient(circle at 24% 20%,color-mix(in srgb,var(--accent2) 34%,transparent),transparent 36%),
    radial-gradient(circle at 82% 78%,color-mix(in srgb,var(--accent) 28%,transparent),transparent 38%),
    linear-gradient(135deg,color-mix(in srgb,var(--panel) 90%,#000),color-mix(in srgb,var(--panel2) 88%,#000));
}
.fallback-banner:before{
  content:"";
  position:absolute;
  inset:0;
  border:1px solid color-mix(in srgb,var(--accent2) 24%,transparent);
  pointer-events:none;
}
.fallback-noise{
  position:absolute;
  inset:0;
  opacity:.9;
  background:
    linear-gradient(180deg,rgba(255,255,255,.045),transparent 38%),
    repeating-linear-gradient(125deg,transparent 0 18px,rgba(255,255,255,.012) 19px 20px);
}
.fallback-center{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.fallback-icon{
  width:68px;
  height:68px;
  border-radius:21px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:42px;
  line-height:1;
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent2) 78%,#fff 22%),var(--accent));
  border:1px solid rgba(255,255,255,.20);
  box-shadow:0 14px 34px color-mix(in srgb,var(--accent) 34%,transparent),0 0 0 8px rgba(255,255,255,.035);
}
.fallback-banner.compact .fallback-icon{
  width:38px;
  height:38px;
  border-radius:12px;
  font-size:24px;
  box-shadow:0 8px 18px color-mix(in srgb,var(--accent) 28%,transparent);
}
.cartItemImg.fallback-mini{
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,var(--accent2),var(--accent))!important;
  color:#fff!important;
  font-size:24px!important;
  line-height:1!important;
  font-weight:1000!important;
  border:1px solid color-mix(in srgb,var(--accent2) 42%,transparent);
}
.promoImageWrap .fallback-banner{height:100%;min-height:100%}


/* V248 - banner oficial preenchendo o card, sem miniatura encaixada */
.card .img{
  height:auto!important;
  aspect-ratio:16/9!important;
  background:color-mix(in srgb,var(--panel) 88%,#000)!important;
}
.card .img > img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  background:transparent!important;
}


/* V249 - fallback com emoji ocupando o banner inteiro */
.fallback-banner{
  isolation:isolate;
  background:
    radial-gradient(circle at 18% 18%,color-mix(in srgb,var(--accent2) 48%,transparent),transparent 38%),
    radial-gradient(circle at 84% 78%,color-mix(in srgb,var(--accent) 42%,transparent),transparent 42%),
    linear-gradient(135deg,color-mix(in srgb,var(--panel2) 86%,#000),color-mix(in srgb,var(--panel) 92%,#000));
}
.fallback-banner::after{
  content:attr(data-emoji);
  position:absolute;
  z-index:-1;
  inset:-42%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:clamp(150px,38vw,300px);
  line-height:1;
  opacity:.16;
  filter:blur(9px) saturate(1.25);
  transform:rotate(-12deg) scale(1.18);
  pointer-events:none;
}
.fallback-emoji-full{
  position:absolute;
  z-index:2;
  inset:-5%;
  display:flex;
  align-items:center;
  justify-content:center;
  width:110%;
  height:110%;
  overflow:hidden;
  font-size:clamp(78px,20vw,136px);
  line-height:1;
  transform:scale(1.12);
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.44)) drop-shadow(0 0 22px color-mix(in srgb,var(--accent2) 42%,transparent));
  user-select:none;
  pointer-events:none;
}
.fallback-shine{
  position:absolute;
  z-index:3;
  inset:0;
  background:
    linear-gradient(118deg,transparent 0 32%,rgba(255,255,255,.10) 42%,transparent 53%),
    linear-gradient(180deg,rgba(255,255,255,.05),transparent 45%,rgba(0,0,0,.14));
  pointer-events:none;
}
.fallback-banner.compact .fallback-emoji-full{
  inset:-8%;
  width:116%;
  height:116%;
  font-size:clamp(52px,13vw,84px);
  transform:scale(1.14);
}
.fallback-banner.compact::after{
  font-size:clamp(92px,24vw,170px);
  filter:blur(7px) saturate(1.2);
}


/* V251 - banner genérico de streaming para produtos sem imagem definida */
.fallback-banner.fallback-stream-style{
  padding:0!important;
  background:#08040f!important;
  border:0!important;
}
.fallback-banner.fallback-stream-style::before,
.fallback-banner.fallback-stream-style::after{content:none!important;display:none!important}
.fallback-banner.fallback-stream-style>img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
}
.fallback-banner.fallback-hard{
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(135deg,#12051f,#3b0764)!important;
}
.fallback-banner.fallback-hard>span{font-size:clamp(72px,18vw,128px);line-height:1}

/* V252 - banner padrão acompanha automaticamente a cor do tema da Mini App */
.fallback-banner.fallback-stream-style{background:color-mix(in srgb,var(--bg) 88%,#000)!important}
.fallback-banner.fallback-hard{
  background:
    radial-gradient(circle at 25% 20%,color-mix(in srgb,var(--accent2) 42%,transparent),transparent 38%),
    linear-gradient(135deg,color-mix(in srgb,var(--panel2) 82%,#000),color-mix(in srgb,var(--accent) 44%,#000))!important;
}
.fallback-banner.fallback-hard>span{filter:drop-shadow(0 12px 24px rgba(0,0,0,.42)) drop-shadow(0 0 18px color-mix(in srgb,var(--accent2) 38%,transparent))}


/* V253 - imagens cadastradas recoloridas conforme o tema da Mini App */
img[data-theme-product-image="1"]{transition:filter .18s ease,opacity .18s ease}

/* V282 - Fundo opaco da compra realizada acompanha o tema ativo */
#deliveryModal.modal{
  background:
    radial-gradient(
      circle at 50% 8%,
      color-mix(in srgb,var(--accent) 24%,var(--bg)) 0%,
      color-mix(in srgb,var(--accent) 10%,var(--bg)) 34%,
      var(--bg) 74%
    )!important;
  opacity:1!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

#deliveryModal .doneBox{
  background:linear-gradient(
    160deg,
    color-mix(in srgb,var(--panel) 86%,var(--accent) 14%),
    var(--panel2)
  )!important;
  opacity:1!important;
  border-color:color-mix(in srgb,var(--accent) 46%,var(--line))!important;
  box-shadow:
    0 24px 80px rgba(0,0,0,.58),
    0 0 38px color-mix(in srgb,var(--accent) 20%,transparent)!important;
}

#deliveryModal .prettyDelivery,
#deliveryModal .miniCredentials,
#deliveryModal .credentialRow input,
#deliveryModal .accessRow code{
  background:var(--panel2)!important;
  opacity:1!important;
}


/* V283 - Modal de entrega 100% opaco, compatível com WebView antigo */
#deliveryModal.modal{
  background:var(--delivery-backdrop-solid,#08070d)!important;
  background-color:var(--delivery-backdrop-solid,#08070d)!important;
  background-image:none!important;
  opacity:1!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#deliveryModal .doneBox{
  background:var(--delivery-card-solid,#171423)!important;
  background-color:var(--delivery-card-solid,#171423)!important;
  background-image:none!important;
  opacity:1!important;
}
#deliveryModal .deliveryList,
#deliveryModal .prettyItem,
#deliveryModal .prettyDelivery,
#deliveryModal .miniCredentials{
  background:var(--delivery-inner-solid,#21172f)!important;
  background-color:var(--delivery-inner-solid,#21172f)!important;
  background-image:none!important;
  opacity:1!important;
}
#deliveryModal .credentialRow input,
#deliveryModal .accessRow code,
#deliveryModal .miniCredentialLine code{
  background:var(--delivery-input-solid,#0b0b12)!important;
  background-color:var(--delivery-input-solid,#0b0b12)!important;
  background-image:none!important;
  opacity:1!important;
}


/* =========================================================
   V286 — Entorno da compra sólido, temático e acima de tudo
   ========================================================= */
html.delivery-modal-open,
body.delivery-modal-open,
body.delivery-modal-open .app{
  background:var(--delivery-backdrop-solid,#271a43)!important;
  background-color:var(--delivery-backdrop-solid,#271a43)!important;
  background-image:none!important;
}
body.delivery-modal-open{
  overflow:hidden!important;
}
body.delivery-modal-open .floatingSupport,
body.delivery-modal-open .cartFloat,
body.delivery-modal-open .cartbar{
  visibility:hidden!important;
  pointer-events:none!important;
}
#deliveryModal.modal{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  z-index:10050!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  background:var(--delivery-backdrop-solid,#271a43)!important;
  background-color:var(--delivery-backdrop-solid,#271a43)!important;
  background-image:none!important;
  opacity:1!important;
  isolation:isolate!important;
}
#deliveryModal.modal::before,
#deliveryModal.modal::after{
  content:none!important;
  display:none!important;
}
#deliveryModal .doneBox{
  position:relative!important;
  z-index:1!important;
}


/* =========================================================
   V287 — Modal de entrega no estilo solicitado
   Cartão sólido + produtos visíveis sob camada escura
   ========================================================= */
html.delivery-modal-open{
  background:var(--bg)!important;
  background-color:var(--bg)!important;
  background-image:none!important;
}
body.delivery-modal-open,
body.delivery-modal-open .app{
  background:var(--bg)!important;
  background-color:var(--bg)!important;
  background-image:none!important;
}
body.delivery-modal-open{
  overflow:hidden!important;
}
body.delivery-modal-open .floatingSupport,
body.delivery-modal-open .cartFloat,
body.delivery-modal-open .cartbar{
  visibility:hidden!important;
  pointer-events:none!important;
}

#deliveryModal.modal{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  z-index:10050!important;
  display:none;
  align-items:center!important;
  justify-content:center!important;
  padding:24px 16px!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  background:var(--delivery-overlay,rgba(8,7,13,.84))!important;
  background-color:var(--delivery-overlay,rgba(8,7,13,.84))!important;
  background-image:none!important;
  opacity:1!important;
  isolation:isolate!important;
  backdrop-filter:blur(1.5px)!important;
  -webkit-backdrop-filter:blur(1.5px)!important;
}
#deliveryModal.modal.open{
  display:flex!important;
}
#deliveryModal.modal::before,
#deliveryModal.modal::after{
  content:none!important;
  display:none!important;
}

#deliveryModal .doneBox{
  position:relative!important;
  z-index:1!important;
  width:min(374px,calc(100% - 4px))!important;
  max-height:calc(100dvh - 36px)!important;
  margin:auto!important;
  padding:38px 26px 26px!important;
  overflow-y:auto!important;
  text-align:center!important;
  border:1px solid var(--delivery-border-solid,var(--line))!important;
  border-radius:24px!important;
  background:
    linear-gradient(
      160deg,
      var(--delivery-card-top,#1b1629),
      var(--delivery-card-solid,#111019)
    )!important;
  background-color:var(--delivery-card-solid,#111019)!important;
  opacity:1!important;
  box-shadow:
    0 24px 70px rgba(0,0,0,.62),
    0 0 26px rgba(124,58,237,.12)!important;
}
#deliveryModal .doneIcon{
  width:82px!important;
  height:82px!important;
  margin:0 auto 24px!important;
  font-size:42px!important;
  background:linear-gradient(135deg,var(--accent),var(--accent2))!important;
  box-shadow:0 0 0 13px rgba(124,58,237,.18)!important;
}
#deliveryModal .doneBox h2{
  margin:0 0 10px!important;
  font-size:30px!important;
  line-height:1.12!important;
  font-weight:950!important;
}
#deliveryModal .doneBox > p{
  margin:0 0 22px!important;
  color:var(--muted)!important;
  font-size:17px!important;
}
#deliveryModal .deliveryList{
  margin:0 0 24px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  background-color:transparent!important;
}
#deliveryModal .prettyItem{
  margin:0!important;
  padding:16px!important;
  border:1px solid var(--delivery-border-solid,var(--line))!important;
  border-radius:20px!important;
  background:var(--delivery-inner-solid,#17131f)!important;
  background-color:var(--delivery-inner-solid,#17131f)!important;
  background-image:none!important;
  opacity:1!important;
}
#deliveryModal .productMiniHeader{
  gap:12px!important;
  margin-bottom:14px!important;
  text-align:left!important;
}
#deliveryModal .productMiniImage{
  width:68px!important;
  height:68px!important;
  flex:0 0 68px!important;
  border-radius:14px!important;
  border:1px solid var(--delivery-border-solid,var(--line))!important;
}
#deliveryModal .productMiniTitle{
  font-size:16px!important;
  line-height:1.2!important;
}
#deliveryModal .productMiniSub{
  margin-top:4px!important;
  color:var(--accent2)!important;
  font-size:12px!important;
}
#deliveryModal .miniCredentials{
  margin:12px 0 14px!important;
  padding:13px!important;
  border:1px solid var(--delivery-border-solid,var(--line))!important;
  border-radius:16px!important;
  background:var(--delivery-inner-solid,#17131f)!important;
  background-color:var(--delivery-inner-solid,#17131f)!important;
  background-image:none!important;
  opacity:1!important;
}
#deliveryModal .miniCredentialLine{
  text-align:left!important;
}
#deliveryModal .miniCredentialLine code{
  min-height:43px!important;
  padding:11px 12px!important;
  border:1px solid var(--delivery-border-solid,var(--line))!important;
  background:var(--delivery-input-solid,#0a0910)!important;
  background-color:var(--delivery-input-solid,#0a0910)!important;
  background-image:none!important;
  opacity:1!important;
}
#deliveryModal .copyActionsRow{
  gap:10px!important;
}
#deliveryModal .copySideBtn{
  min-height:43px!important;
  padding:11px 7px!important;
  border-radius:13px!important;
  box-shadow:none!important;
}
#deliveryModal #doneOk{
  min-height:57px!important;
  margin-top:0!important;
  border-radius:16px!important;
  font-size:19px!important;
}

@media(max-width:380px){
  #deliveryModal.modal{padding:16px 10px!important}
  #deliveryModal .doneBox{
    width:100%!important;
    max-height:calc(100dvh - 22px)!important;
    padding:32px 18px 20px!important;
  }
  #deliveryModal .doneBox h2{font-size:27px!important}
  #deliveryModal .copySideBtn{font-size:13px!important}
}


/* =========================================================
   V298 — Tela inicial: só revela a loja após carregar os dados
   ========================================================= */
body.miniapp-loading{
  overflow:hidden!important;
}
body.miniapp-loading .app,
body.miniapp-loading #cartFloat,
body.miniapp-loading #floatingSupport,
body.miniapp-loading #toast,
body.miniapp-loading .modal,
body.miniapp-loading .webLoginModal{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.initialLoader{
  position:fixed;
  inset:0;
  z-index:100000;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:100dvh;
  padding:32px 24px calc(32px + env(safe-area-inset-bottom));
  background:
    radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 30%),
    var(--bg);
  color:var(--text);
  opacity:1;
  visibility:visible;
  transition:opacity .24s ease,visibility .24s ease;
}
.initialLoader.is-hiding{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.initialLoaderContent{
  width:min(100%,360px);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  transform:translateY(-5vh);
}
.initialLoaderSpinner{
  width:76px;
  height:76px;
  margin-bottom:28px;
  border-radius:50%;
  border:7px solid color-mix(in srgb,var(--accent) 17%,transparent);
  border-top-color:var(--accent);
  border-right-color:var(--accent2);
  filter:drop-shadow(0 0 18px color-mix(in srgb,var(--accent) 30%,transparent));
  animation:miniappLoaderSpin .85s linear infinite;
}
.initialLoader h1{
  margin:0 0 12px;
  font-size:30px;
  line-height:1.15;
  font-weight:900;
  letter-spacing:-.4px;
}
.initialLoader p{
  max-width:300px;
  margin:0;
  color:var(--muted);
  font-size:17px;
  line-height:1.5;
}
.initialLoaderRetry{
  margin-top:24px;
  min-width:180px;
  border:0;
  border-radius:16px;
  padding:14px 20px;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;
  font-size:16px;
  font-weight:900;
  box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 24%,transparent);
}
.initialLoader.is-error .initialLoaderSpinner{
  width:68px;
  height:68px;
  border:0;
  filter:none;
  animation:none;
}
.initialLoader.is-error .initialLoaderSpinner::before{
  content:"!";
  width:68px;
  height:68px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:2px solid color-mix(in srgb,#ef4444 65%,var(--line));
  background:color-mix(in srgb,#ef4444 14%,var(--panel));
  color:#ff8b8b;
  font-size:36px;
  font-weight:950;
}
@keyframes miniappLoaderSpin{
  to{transform:rotate(360deg)}
}
@media (prefers-reduced-motion:reduce){
  .initialLoaderSpinner{animation-duration:1.6s}
  .initialLoader{transition:none}
}
