:root{
  --op:#1f4d3a;
  --oc:#4a8f6b;
  --ol:#eaf5ee;
  --od:#1f4d3a;
  --su:#c99a45;
  --co:#2f7a52;
  --mu:#6f8579;
  --bg:#f5faf7;
  --white:#ffffff;
  --bd:#dbe8e0;
  --tx:#1a2b22;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Montserrat',sans-serif;background:var(--bg);color:var(--tx);-webkit-font-smoothing:antialiased}
button,select,input{font-family:'Montserrat',sans-serif}
button{cursor:pointer}

/* ===== LOGIN ===== */
#loginScreen{position:fixed;inset:0;z-index:999;background:linear-gradient(160deg,#10261c 0%,#1f4d3a 55%,#2f7a52 100%);display:flex;align-items:center;justify-content:center;padding:1.5rem}
.lbox{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:2.25rem 1.75rem;max-width:340px;width:100%;text-align:center;backdrop-filter:blur(6px)}
.llogo{font-size:20px;font-weight:800;color:#fff;letter-spacing:.3px;margin-bottom:.15rem}
.llogo span{color:var(--su)}
.lsub{font-size:11px;color:#a9d8bb;font-weight:600;letter-spacing:1px;text-transform:uppercase;margin-bottom:1.5rem}
.linp{width:100%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);border-radius:9px;padding:.75rem .9rem;color:#fff;font-size:14px;text-align:center;letter-spacing:3px;outline:none;margin-bottom:.6rem;transition:.2s}
.linp:focus{border-color:var(--su);background:rgba(255,255,255,.12)}
.linp::placeholder{color:rgba(255,255,255,.35);letter-spacing:3px}
.lerr{display:none;color:#ff9d7a;font-size:11px;font-weight:600;margin-bottom:.6rem}
.lerr.show{display:block}
.lbtn{width:100%;background:var(--co);color:#fff;border:none;border-radius:9px;padding:.8rem;font-size:13px;font-weight:700;letter-spacing:.3px;margin-bottom:.85rem;transition:.2s}
.lbtn:hover{background:#21603f}
.lhint{font-size:9px;color:rgba(255,255,255,.4);font-weight:600;letter-spacing:.5px}

/* ===== HEADER ===== */
.hdr{background:linear-gradient(120deg,#10261c 0%,#2f7a52 100%);padding:1.5rem 1.25rem}
.hdr-in{max-width:760px;margin:0 auto;display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap}
.ley{font-size:9px;color:#a9d8bb;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:.3rem}
.ttl{font-size:22px;font-weight:800;color:#fff;letter-spacing:.2px}
.ttl span{color:var(--su)}
.sub{font-size:11px;color:rgba(255,255,255,.6);font-weight:500;margin-top:.25rem}
.wk{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:10px;font-weight:700;letter-spacing:.5px;padding:5px 12px;border-radius:20px;white-space:nowrap}

/* ===== PROTOCOL BANNER BUTTON ===== */
.pbb{max-width:760px;margin:1rem auto 0;padding:0 1.25rem}
.pb{width:100%;background:linear-gradient(120deg,var(--co),#4fae7f);border:none;border-radius:12px;padding:.9rem 1.1rem;display:flex;align-items:center;gap:.75rem;text-align:left;box-shadow:0 6px 18px rgba(47,122,82,.28);transition:.2s}
.pb:hover{transform:translateY(-1px);box-shadow:0 9px 22px rgba(47,122,82,.35)}
.pt{font-size:12.5px;font-weight:800;color:#fff}
.ps0{font-size:10px;color:rgba(255,255,255,.85);font-weight:500;margin-top:2px}

/* ===== MODAL ===== */
.mo{display:none;position:fixed;inset:0;background:rgba(12,53,71,.55);z-index:500;align-items:flex-start;justify-content:center;padding:2vh 1rem;overflow-y:auto}
.mo.show{display:flex}
.md{background:#fff;border-radius:16px;max-width:640px;width:100%;margin:auto;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.mh{background:linear-gradient(120deg,#10261c,#2f7a52);padding:1.1rem 1.25rem;display:flex;align-items:flex-start;gap:.65rem}
.mht{font-size:14px;font-weight:800;color:#fff}
.mhs{font-size:10.5px;color:#cdead9;margin-top:2px}
.mx{margin-left:auto;background:rgba(255,255,255,.12);border:none;color:#fff;width:26px;height:26px;border-radius:50%;font-size:13px;flex-shrink:0}
.mb{padding:1.1rem 1.25rem 1.4rem;max-height:78vh;overflow-y:auto}

.si{display:flex;align-items:center;gap:6px;margin-bottom:1rem}
.sd{width:20px;height:5px;border-radius:3px;background:var(--bd)}
.sd.act{background:var(--co)}
.sd.done{background:var(--su)}

.pg{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-bottom:1rem}
@media(max-width:520px){.pg{grid-template-columns:1fr}}
.pgi{border:1.5px solid #c9e3d3;border-radius:10px;padding:.8rem .85rem;text-align:left;background:var(--ol);transition:.15s;display:flex;flex-direction:column;gap:.28rem}
.pgi:hover{border-color:var(--oc)}
.pgi.sel{border-color:var(--co);background:#fff;box-shadow:0 0 0 1.5px var(--co) inset}
.pgi-ico{font-size:19px;line-height:1}
.pgi-cat{font-size:9px;font-weight:800;color:var(--co);text-transform:uppercase;letter-spacing:.6px}
.pgi-title{font-size:12.5px;font-weight:800;color:var(--tx);line-height:1.3}
.pgi-desc{font-size:10.5px;color:var(--mu);line-height:1.45}

.btn-rf{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin-bottom:.85rem}
.bk{background:none;border:1.5px solid var(--bd);color:var(--mu);font-size:10.5px;font-weight:700;padding:6px 13px;border-radius:8px}
.bk:hover{border-color:var(--od);color:var(--od)}
.bcor{background:var(--co);color:#fff;border:none;border-radius:9px;font-weight:700;transition:.2s}
.bcor:hover:not(:disabled){background:#21603f}
.bcor:disabled{cursor:not-allowed}
.conv-btn{background:var(--ol);border:1.5px solid #9cc9ab;color:var(--od);font-size:10.5px;font-weight:700;padding:6px 13px;border-radius:8px}
.conv-btn:hover{background:#e2f2e8}

.conv-zone.loaded{background:#fdf4d9;border:1.5px dashed var(--co);border-radius:10px;padding:.75rem;margin-bottom:.75rem}
.conv-thumbs{display:flex;gap:6px;flex-wrap:wrap}
.conv-thumbs img{width:52px;height:52px;object-fit:cover;border-radius:6px;border:1px solid var(--bd)}
.conv-analysis{background:#f3fbf6;border:1px solid #bfe8cf;border-radius:10px;padding:.75rem;margin-bottom:.5rem}
.conv-at{display:flex;align-items:center;justify-content:space-between;font-size:10px;font-weight:800;color:#1f8a4c;text-transform:uppercase;letter-spacing:.6px;margin-bottom:.45rem}
.conv-ax{font-size:12px;line-height:1.65;color:var(--tx);white-space:pre-wrap}
.ok-note{background:#eefaf1;color:#1f8a4c;font-size:10px;font-weight:700;padding:.5rem .7rem;border-radius:8px;margin-bottom:.85rem}

.ps2{background:#f7fafb;border:1px solid var(--bd);border-radius:10px;padding:.8rem .9rem;margin-bottom:.7rem}
.ps2h{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.45rem}
.ps2t{font-size:11px;font-weight:800;color:var(--od);text-transform:uppercase;letter-spacing:.4px}
.ps2x{font-size:12.5px;line-height:1.7;color:var(--tx);white-space:pre-wrap}
.div{height:1px;background:var(--bd);margin:1rem 0}
.attn{width:100%;background:linear-gradient(120deg,#1f8a4c,#2ba85c);color:#fff;border:none;border-radius:10px;padding:.85rem;font-size:12.5px;font-weight:800;margin-bottom:.35rem}
.attn:hover{filter:brightness(1.06)}

.ch{margin-bottom:.9rem}
.cht{font-size:14px;font-weight:800;color:var(--od)}
.chs{font-size:11px;color:var(--mu);font-weight:600;margin-top:2px}

.rq{background:#f7fafb;border:1px solid var(--bd);border-radius:10px;padding:.75rem .85rem;margin-bottom:.6rem}
.rql{font-size:10.5px;font-weight:800;color:var(--od);margin-bottom:.5rem}
.rqo{display:flex;gap:.4rem;flex-wrap:wrap}
.rqb{border:1.5px solid var(--bd);background:#fff;color:var(--tx);font-size:10.5px;font-weight:600;padding:5px 11px;border-radius:20px}
.rqb.sel{border-color:var(--co);background:#fff5ef;color:var(--co);font-weight:700}

.ld{color:var(--mu);font-style:italic}

/* ===== REPLY BOX (shared component) ===== */
.rb-ta{width:100%;border:1.5px solid var(--bd);border-radius:9px;padding:.6rem .75rem;font-size:12px;font-family:'Montserrat',sans-serif;resize:vertical;min-height:64px;margin-bottom:.55rem;outline:none}
.rb-ta:focus{border-color:var(--co)}
.rb-row{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:.65rem}
.rb-row select{width:100%;border:1.5px solid var(--bd);border-radius:8px;padding:.5rem .6rem;font-size:11px;color:var(--tx);outline:none;background:#fff}
.rb-btn{width:100%;background:var(--co);color:#fff;border:none;border-radius:9px;padding:.7rem;font-size:12px;font-weight:700}
.rb-btn:hover{background:#21603f}
.rb-out{margin-top:.7rem;background:#fff;border:1px solid var(--bd);border-radius:9px;padding:.75rem;font-size:12.5px;line-height:1.65;white-space:pre-wrap;display:none}
.rb-out.show{display:block}
.rb-cp{margin-top:.5rem;background:none;border:1.5px solid var(--bd);color:var(--od);font-size:10px;font-weight:700;padding:5px 12px;border-radius:7px}

/* ===== DASHBOARD BODY ===== */
.body{max-width:760px;margin:0 auto;padding:1rem 1.1rem 3rem}

.tabs{display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.6rem;margin-bottom:.9rem;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{flex-shrink:0;background:#fff;border:1.5px solid var(--bd);color:var(--mu);font-size:11px;font-weight:700;padding:8px 14px;border-radius:20px;white-space:nowrap;transition:.15s}
.tab.act{background:var(--od);border-color:var(--od);color:#fff}

.pnl{display:none}
.pnl.act{display:block}

.brow{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.75rem}
.tbtn{background:#fff;border:1.5px solid var(--bd);color:var(--mu);font-size:10.5px;font-weight:700;padding:6px 12px;border-radius:18px}
.tbtn.act{background:var(--ol);border-color:#9cc9ab;color:var(--od)}

.ai-box{background:#fff;border:1px solid var(--bd);border-radius:12px;padding:1rem;margin-bottom:.85rem}
.ai-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:.65rem}
.ai-lbl{font-size:10.5px;font-weight:800;color:var(--od);text-transform:uppercase;letter-spacing:.6px}
.bpri{background:var(--od);color:#fff;border:none;border-radius:8px;font-size:10px;font-weight:700;padding:6px 12px}
.bpri:hover{background:#2f7a52}
.ai-out{font-size:13px;line-height:1.75;color:var(--tx);white-space:pre-wrap;min-height:40px}

.hl{background:#fff8ec;border:1px solid #f0dcae;border-radius:10px;padding:.75rem .9rem;font-size:11.5px;line-height:1.6;color:#7a5c1e}

.card{background:#fff;border:1px solid var(--bd);border-radius:12px;padding:1rem;margin-bottom:.85rem}
.ct{font-size:11.5px;font-weight:800;color:var(--od);text-transform:uppercase;letter-spacing:.5px;margin-bottom:.75rem}

/* video */
.prow{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.85rem}
.tpill{background:#fff;border:1.5px solid var(--bd);color:var(--mu);font-size:10.5px;font-weight:700;padding:6px 12px;border-radius:18px}
.tpill.act{background:var(--co);border-color:var(--co);color:#fff}
.vctl{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-bottom:.85rem}
.vlb{font-size:9.5px;font-weight:800;color:var(--mu);text-transform:uppercase;letter-spacing:.5px;margin-bottom:.3rem}
.vctl select{width:100%;border:1.5px solid var(--bd);border-radius:8px;padding:.55rem .6rem;font-size:11px;color:var(--tx);background:#fff;outline:none}
.hkb{background:var(--op);border-radius:10px;padding:.85rem;margin-bottom:.7rem}
.hkl{font-size:9px;color:#a9d8bb;font-weight:800;text-transform:uppercase;letter-spacing:1px;margin-bottom:.3rem}
.hkt{font-size:14px;font-weight:700;color:#fff;line-height:1.4}
.ssc{margin-bottom:.65rem}
.ssl{font-size:9.5px;font-weight:800;color:var(--od);text-transform:uppercase;letter-spacing:.6px;margin-bottom:.3rem}
.ssx{font-size:12.5px;line-height:1.65;color:var(--tx);white-space:pre-wrap}
.cpb{background:none;border:1.5px solid var(--bd);color:var(--od);font-size:10px;font-weight:700;padding:5px 12px;border-radius:7px}
.cpb:hover{border-color:var(--od)}

/* estrategia */
.tlist{display:flex;flex-direction:column;gap:.5rem}
.tlist span{background:#f7fafb;border-left:3px solid var(--co);border-radius:6px;padding:.5rem .7rem;font-size:11px;font-weight:600;color:var(--tx)}
.mpill{background:var(--ol);border:1px solid #9cc9ab;border-radius:8px;padding:.6rem .8rem;font-size:11.5px;font-weight:700;color:var(--od);margin-bottom:.5rem}
.zs{display:flex;gap:.65rem;margin-bottom:.75rem;align-items:flex-start}
.zn{flex-shrink:0;width:24px;height:24px;border-radius:50%;background:var(--od);color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}
.zt{font-size:12px;font-weight:700;color:var(--tx)}
.zst{font-size:10.5px;color:var(--mu);margin-top:1px}
.warn-note{background:#fff3e8;border:1px solid #f0c896;border-radius:9px;padding:.65rem .8rem;font-size:11px;font-weight:600;color:#8a5314;margin-top:.5rem}

.fstep{display:flex;gap:.65rem;margin-bottom:.7rem;align-items:flex-start}
.fnum{flex-shrink:0;width:24px;height:24px;border-radius:50%;background:var(--co);color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}
.ftxt{font-size:12px;font-weight:700;color:var(--tx)}
.fsub{font-size:10.5px;color:var(--mu);margin-top:1px}

.hyp{border-left:3px solid var(--su);background:#fdf9ef;border-radius:6px;padding:.6rem .8rem;margin-bottom:.55rem}
.hypt{font-size:11.5px;font-weight:800;color:#8a6a1e;margin-bottom:.2rem}
.hyps{font-size:11px;color:var(--tx);line-height:1.5}

/* objections / scripts */
.oitem{border:1px solid var(--bd);border-radius:10px;margin-bottom:.5rem;overflow:hidden}
.oq{width:100%;background:#f7fafb;border:none;text-align:left;padding:.7rem .85rem;font-size:12px;font-weight:700;color:var(--tx);display:flex;justify-content:space-between;align-items:center;gap:.5rem}
.oq .arw{transition:.2s;color:var(--mu);font-size:11px}
.oq.open .arw{transform:rotate(180deg)}
.oa{display:none;padding:.75rem .85rem;font-size:12px;line-height:1.65;color:var(--tx);border-top:1px solid var(--bd)}
.oa.show{display:block}

.sitem{background:#f7fafb;border:1px solid var(--bd);border-radius:10px;padding:.75rem .85rem;margin-bottom:.55rem}
.sitl{font-size:10.5px;font-weight:800;color:var(--od);text-transform:uppercase;letter-spacing:.4px;margin-bottom:.4rem}
.sitx{font-size:12px;line-height:1.6;color:var(--tx);white-space:pre-wrap;margin-bottom:.4rem}

/* referencia */
.rg{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}
.ri{background:#f7fafb;border-radius:9px;padding:.65rem .75rem}
.rl{font-size:9px;font-weight:800;color:var(--mu);text-transform:uppercase;letter-spacing:.5px;margin-bottom:.25rem}
.rv{font-size:12.5px;font-weight:700;color:var(--tx)}
.rv.oc{color:var(--su);font-weight:800}
.ptbl{width:100%;border-collapse:collapse;font-size:11px;margin-top:.4rem}
.ptbl th{text-align:left;font-size:9px;color:var(--mu);text-transform:uppercase;letter-spacing:.4px;padding:.4rem .3rem;border-bottom:1.5px solid var(--bd)}
.ptbl td{padding:.45rem .3rem;border-bottom:1px solid var(--bd);color:var(--tx);font-weight:600}
.ptbl tr:last-child td{border-bottom:none}

.promo{background:linear-gradient(120deg,var(--su),#ffd35c);border-radius:14px;padding:1.1rem;margin-bottom:.85rem;text-align:center}
.prt{font-size:10.5px;font-weight:800;color:#5c3f0a;letter-spacing:.3px;margin-bottom:.45rem}
.prv{font-size:24px;font-weight:800;color:#3d2a08;margin-bottom:.6rem}
.prbp{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-bottom:.55rem}
.prb{background:rgba(255,255,255,.55);color:#5c3f0a;font-size:9.5px;font-weight:700;padding:4px 10px;border-radius:14px}
.prx{font-size:10.5px;color:#5c3f0a;font-weight:600}

.chip-row{display:flex;gap:6px;flex-wrap:wrap}
.chip{background:#f7fafb;border:1px solid var(--bd);color:var(--tx);font-size:10.5px;font-weight:600;padding:5px 11px;border-radius:16px}
.chip.g{background:#eafaf0;border-color:#bfe8cf;color:#1f8a4c}
.chip.b{background:var(--ol);border-color:var(--oc);color:var(--od)}

@media(max-width:480px){
  .vctl{grid-template-columns:1fr}
  .rb-row{grid-template-columns:1fr}
}