/* Chama Lance — tela de recomendação. Painel escuro autônomo (não depende do tema). */
.cl-wrap{
  --cl-bg:#161616; --cl-card:#1f1f1f; --cl-border:#333; --cl-text:#f2f2f2; --cl-muted:#a8a8a8;
  --cl-accent:#3bd671; --cl-warn:#f6ad55; --cl-warn-bg:#2a2115;
  max-width:760px; margin:24px auto; padding:20px 16px 28px;
  background:var(--cl-bg); color:var(--cl-text); border-radius:16px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; line-height:1.45; box-sizing:border-box;
}
.cl-wrap *{ box-sizing:border-box; }
.cl-wrap h1{ margin:6px 0 4px; font-size:26px; color:var(--cl-text); }
.cl-wrap h2{ margin:0 0 10px; font-size:18px; color:var(--cl-text); }
.cl-wrap p{ margin:0 0 10px; color:var(--cl-text); }

.cl-head{ text-align:center; margin-bottom:18px; }
.cl-badge{ display:inline-block; padding:3px 12px; border-radius:20px; background:#243d2f; color:var(--cl-accent); font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }

.cl-notice{ margin:0 0 16px; padding:12px 14px; border-radius:10px; background:var(--cl-warn-bg); border:1px solid var(--cl-warn); color:var(--cl-warn); }
.cl-notice strong{ color:#fff; }

/* Aviso no topo: só a versão roxa da carta permite a transferência das coins */
.cl-purple{ display:flex; gap:16px; align-items:flex-start; margin:0 0 16px; padding:18px 20px; background:linear-gradient(135deg,rgba(139,92,246,.16),rgba(139,92,246,.05)) , var(--cl-card); border:1px solid rgba(167,139,250,.45); border-left:4px solid #a78bfa; border-radius:14px; }
.cl-purple-icon{ flex:0 0 auto; display:flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:10px; background:rgba(167,139,250,.16); color:#c4b5fd; }
.cl-purple-body{ min-width:0; }
.cl-wrap .cl-purple-title{ margin:0 0 6px; color:#c4b5fd; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.cl-wrap .cl-purple-text{ margin:0 0 4px; color:var(--cl-text); font-size:17px; font-weight:500; line-height:1.45; }
.cl-wrap .cl-purple-text strong{ color:#fff; font-weight:700; }
.cl-wrap .cl-purple-sub{ margin:0; color:var(--cl-muted); font-size:14px; }

.cl-player{ display:flex; gap:20px; align-items:center; padding:16px; margin-bottom:16px; background:var(--cl-card); border:1px solid var(--cl-border); border-radius:14px; }
.cl-card{ flex:0 0 auto; width:200px; max-width:46%; }
.cl-card img{ max-width:100%; height:auto; }
.cl-player-info{ min-width:0; }
.cl-eyebrow{ margin:0 0 2px; color:var(--cl-muted) !important; font-size:12px; text-transform:uppercase; letter-spacing:.06em; }
.cl-player-info h2{ margin:0 0 8px; font-size:24px; overflow-wrap:anywhere; }
.cl-market{ color:var(--cl-muted) !important; }
.cl-market strong{ color:var(--cl-text); }

.cl-card-fallback{ position:relative; text-align:center; padding:14px 8px; background:#2a2a2a; border-radius:12px; }
.cl-card-fallback img{ width:100%; height:auto; display:block; }
.cl-card-fallback-rating{ font-size:28px; font-weight:800; }
.cl-card-fallback-pos{ color:var(--cl-muted); font-size:14px; }

.cl-listing{ padding:16px; margin-bottom:16px; background:var(--cl-card); border:1px solid var(--cl-border); border-radius:14px; }
.cl-values{ list-style:none; margin:0; padding:0; }
.cl-values li{ display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid var(--cl-border); }
.cl-values li:last-child{ border-bottom:0; }
.cl-label{ flex:1 1 auto; color:var(--cl-muted); }
.cl-value{ font-size:22px; font-variant-numeric:tabular-nums; color:var(--cl-accent); }
.cl-copy{ flex:0 0 auto; padding:6px 12px; border:1px solid var(--cl-border); border-radius:8px; background:#2b2b2b; color:var(--cl-text); font-size:13px; cursor:pointer; }
.cl-copy:hover{ background:#353535; }

.cl-steps{ padding:16px; margin-bottom:16px; background:var(--cl-card); border:1px solid var(--cl-border); border-radius:14px; }
.cl-steps ol{ margin:0; padding-left:20px; }
.cl-steps li{ margin-bottom:8px; }
.cl-steps li:last-child{ margin-bottom:0; }

.cl-warning{ padding:14px 16px; margin-bottom:16px; background:var(--cl-warn-bg); border:1px solid var(--cl-warn); border-radius:14px; }
.cl-warning p{ color:#f7e3c4; }
.cl-ack{ display:flex; align-items:center; gap:10px; margin-top:6px; cursor:pointer; color:var(--cl-text); font-weight:600; }
.cl-ack input{ width:20px; height:20px; accent-color:var(--cl-accent); }

.cl-whatsapp{ text-align:center; }
.cl-whatsapp-btn{ display:inline-block; width:100%; max-width:420px; padding:15px 24px; border:0; border-radius:12px; background:#25d366; color:#08210f; font-size:17px; font-weight:800; text-decoration:none; cursor:pointer; }
.cl-whatsapp-btn.is-disabled{ background:#3a3a3a; color:#8a8a8a; cursor:not-allowed; pointer-events:none; }
.cl-pay-hint{ margin:8px 0 0; font-size:13px; color:var(--cl-muted) !important; }

.cl-support{ text-align:center; margin:14px 0 0; }
.cl-support a, .cl-support-btn{ color:var(--cl-accent); font-weight:600; }
.cl-message{ text-align:center; padding:24px 8px; }

@media (max-width:560px){
  .cl-wrap{ margin:0; border-radius:0; padding:16px 12px 24px; }
  .cl-wrap h1{ font-size:22px; }
  .cl-purple{ padding:14px 14px; gap:12px; }
  .cl-wrap .cl-purple-text{ font-size:16px; }
  .cl-player{ flex-direction:column; text-align:center; }
  .cl-card{ width:220px; max-width:80%; }
  .cl-value{ font-size:20px; }
}