/* =====================================================================
   BLOQUE 4 — seguimiento mensual, «lo que tengo que hacer», clientes por
   tipos, barra de etapas, acciones de tarjeta, ayuda por pestaña, Mi día,
   formularios redondeados. Va después de app.css. Todo color vive en un
   token; Noche y Día; movimiento dentro de prefers-reduced-motion.
   ===================================================================== */
:root{
  --b4-ok:#00a37a; --b4-ok-ink:#2fd3a5; --b4-ok-bg:rgba(0,163,122,.16);
  --b4-am:#ffc94d; --b4-am-ink:#ffc94d; --b4-am-bg:rgba(255,201,77,.14);
  --b4-ro:#ff1200; --b4-ro-ink:#ff8a7e; --b4-ro-bg:rgba(255,18,0,.14);
  --b4-az:#0043ff; --b4-az-ink:#8fadff; --b4-az-bg:rgba(0,67,255,.18);
  --b4-mo:#a06bd6; --b4-mo-ink:#c9a5ef; --b4-mo-bg:rgba(160,107,214,.16);
  --b4-track:rgba(247,245,238,.12);
  --b4-card:var(--surface);
  --b4-r:18px;
}
:root[data-theme="light"]{
  --b4-ok:#006b4f; --b4-ok-ink:#00634a; --b4-ok-bg:rgba(0,107,79,.10);
  --b4-am:#b37400; --b4-am-ink:#7a4f00; --b4-am-bg:rgba(179,116,0,.12);
  --b4-ro:#c80e00; --b4-ro-ink:#b00c00; --b4-ro-bg:rgba(200,14,0,.09);
  --b4-az:#0037d6; --b4-az-ink:#0037d6; --b4-az-bg:rgba(0,55,214,.09);
  --b4-mo:#6d32a8; --b4-mo-ink:#5b2891; --b4-mo-bg:rgba(109,50,168,.10);
  --b4-track:rgba(0,14,53,.10);
}

/* ---------- B4.1 Seguimiento mensual ---------- */
.b4-anual{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--b4-r);
  padding:16px 16px 12px; margin:0 0 18px; box-shadow:var(--shadow);
}
.b4-anual-cab{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px;}
.b4-anual-tit{font-size:1rem; font-weight:800; margin:0;}
.b4-seg{display:flex; flex-wrap:wrap; gap:6px;}
.b4-seg .chip{min-height:36px; border-radius:999px;}
.b4-svg{display:block; width:100%; height:auto; max-height:280px; overflow:visible;}
.b4-grid{stroke:var(--line); stroke-width:1; stroke-dasharray:3 4;}
.b4-eje{fill:var(--ink-soft); font-size:10px; font-family:"Montserrat",sans-serif; font-weight:600;}
.b4-barra-obj{fill:none; stroke:var(--line-strong); stroke-width:1.2; stroke-dasharray:4 3;}
.b4-barra-real{fill:var(--b4-az); transition:opacity .15s ease;}
.b4-barra-real.s-ok{fill:var(--b4-ok);}
.b4-barra-real.s-ambar{fill:var(--b4-am);}
.b4-barra-real.s-rojo{fill:var(--b4-ro);}
.b4-barra-real:hover, .b4-barra-real:focus-visible{opacity:.8; outline:none; stroke:var(--ink); stroke-width:1.5;}
.b4-leyenda{display:flex; gap:16px; flex-wrap:wrap; font-size:.74rem; color:var(--ink-soft); margin-top:6px;}
.b4-leyenda span{display:inline-flex; align-items:center; gap:6px;}
.b4-leyenda span::before{content:""; width:14px; height:10px; border-radius:3px;}
.b4-ley-obj::before{border:1.5px dashed var(--line-strong);}
.b4-ley-real::before{background:var(--b4-ok);}

.month-card.b4-mes{
  border-radius:var(--b4-r); padding:14px 14px 12px; display:flex; flex-direction:column; gap:10px;
  box-shadow:var(--shadow); position:relative; min-width:0;
}
.month-card.b4-mes.current{border-color:var(--accent); box-shadow:var(--shadow), 0 0 0 1px var(--accent);}
.month-card.b4-mes.futuro{opacity:.78;}
.month-card.b4-mes .mname{margin:0; align-items:center; padding-right:0;}
.b4-mes-nom{font-size:1.05rem;}
.month-card.b4-mes .mname .tag{background:var(--accent); color:var(--accent-ink); padding:2px 9px; border-radius:999px; font-weight:700;}
.b4-sem{
  align-self:flex-start; display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:999px;
  font-size:.72rem; font-weight:700; background:var(--ok-bg); color:var(--ink-soft); margin-top:-4px;
}
.b4-sem::before{content:""; width:8px; height:8px; border-radius:50%; background:currentColor;}
.b4-sem.s-ok{background:var(--b4-ok-bg); color:var(--b4-ok-ink);}
.b4-sem.s-ambar{background:var(--b4-am-bg); color:var(--b4-am-ink);}
.b4-sem.s-rojo{background:var(--b4-ro-bg); color:var(--b4-ro-ink);}
.b4-barras{display:flex; flex-direction:column; gap:7px;}
.b4-fila{display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) auto; align-items:center; gap:8px; font-size:.76rem; min-height:22px;}
.b4-lab{display:flex; align-items:center; gap:6px; color:var(--ink-soft); min-width:0;}
.b4-lab .ico-set{width:15px; height:15px; flex:none;}
.b4-lab span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.b4-bar.pbar{height:8px; border-radius:99px; background:var(--b4-track); margin:0; overflow:hidden;}
.b4-bar.pbar i{height:100%; display:block; border-radius:99px; background:var(--b4-az); transition:width .5s cubic-bezier(.2,.7,.2,1);}
.b4-bar.t-ok i{background:var(--b4-ok);} .b4-bar.t-ambar i{background:var(--b4-am);} .b4-bar.t-rojo i{background:var(--b4-ro);}
.b4-val{font-weight:800; font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap;}
.b4-val small{font-weight:500; color:var(--ink-soft); font-size:.92em;}
.b4-marca{color:var(--b4-az-ink); font-size:.8rem; margin-left:-4px;}
.b4-dinero{display:grid; grid-template-columns:repeat(2,1fr); gap:6px;}
.b4-din{background:var(--b4-track); border-radius:12px; padding:7px 10px; display:flex; flex-direction:column; min-width:0;}
.b4-din-l{font-size:.64rem; text-transform:uppercase; letter-spacing:.07em; color:var(--ink-soft); font-weight:600;}
.b4-din-v{font-size:.92rem; font-weight:800; font-variant-numeric:tabular-nums; overflow-wrap:anywhere;}
.b4-din.neto{background:var(--b4-ok-bg);} .b4-din.neto .b4-din-v{color:var(--b4-ok-ink);}
.b4-din.neto.neg{background:var(--b4-ro-bg);} .b4-din.neto.neg .b4-din-v{color:var(--b4-ro-ink);}
.b4-ajustar{min-height:44px; width:100%;}
.b4-ajustar .ico-set{width:17px; height:17px;}
.b4-form{display:flex; flex-direction:column; gap:12px; padding-top:4px; border-top:1px dashed var(--line);}
.b4-form[hidden]{display:none;}
.b4-ayuda-mes{font-size:.76rem; color:var(--ink-soft); margin:8px 0 0; line-height:1.45;}
.b4-campo{display:grid; grid-template-columns:1fr auto; gap:6px 10px; align-items:center;}
.b4-campo-l{grid-column:1 / -1; font-size:.76rem; font-weight:700; color:var(--ink); text-transform:none; letter-spacing:0;}
.b4-estado{font-size:.68rem; font-weight:700; padding:2px 9px; border-radius:999px; background:var(--b4-track); color:var(--ink-soft); justify-self:end;}
.b4-estado.man{background:var(--b4-az-bg); color:var(--b4-az-ink);}
.b4-reset{grid-column:1 / -1; justify-self:start; background:none; border:0; color:var(--b4-az-ink); font:inherit; font-size:.74rem; font-weight:700; text-decoration:underline; cursor:pointer; padding:10px 4px; min-height:44px; border-radius:999px;}
.b4-reset:focus-visible, .b4-step:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}

/* Stepper − / + (reutilizable) */
.b4-stepper{display:inline-flex; align-items:center; gap:0; border:1.5px solid var(--line-strong); border-radius:999px; background:var(--bg); overflow:hidden; min-width:0; max-width:100%;}
.b4-stepper input{
  width:5.4em; min-width:0; flex:1 1 auto; height:44px; border:0; background:transparent; color:var(--ink); text-align:center;
  font:inherit; font-weight:800; font-size:.95rem; font-variant-numeric:tabular-nums; padding:0 2px; -moz-appearance:textfield; appearance:textfield; border-radius:0;
}
.b4-stepper input::-webkit-outer-spin-button, .b4-stepper input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
.b4-stepper input:focus-visible{outline:none; background:var(--b4-az-bg);}
.b4-stepper:focus-within{border-color:var(--b4-az); box-shadow:0 0 0 3px var(--b4-az-bg);}
.b4-step{
  width:44px; height:44px; flex:none; border:0; background:transparent; color:var(--ink); font-size:1.4rem; font-weight:700; line-height:1; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; font-family:"Montserrat",sans-serif;
}
.b4-step:hover{background:var(--b4-track);} .b4-step:active{background:var(--b4-az-bg);}

.b4-paneles{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:16px;}
@media (max-width:700px){ .b4-paneles{grid-template-columns:1fr;} }
.b4-panel{background:var(--surface); border:1px solid var(--line); border-radius:var(--b4-r); padding:16px; box-shadow:var(--shadow); min-width:0;}
.b4-panel-tit{font-size:1rem; font-weight:800; margin:0 0 12px;}
.b4-vacio{font-size:.84rem; color:var(--ink-soft); margin:0; line-height:1.5;}
.b4-origen-barra{display:flex; height:16px; border-radius:99px; overflow:hidden; gap:2px; background:var(--b4-track);}
.b4-origen-seg{display:block; min-width:6px;}
.o-ref{--o:var(--b4-ok); --o-ink:var(--b4-ok-ink);} .o-llam{--o:var(--b4-az); --o-ink:var(--b4-az-ink);} .o-portal{--o:var(--b4-mo); --o-ink:var(--b4-mo-ink);}
.b4-origen-seg{background:var(--o);}
.b4-origen-lista{list-style:none; margin:12px 0 0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:8px;}
@media (max-width:420px){ .b4-origen-lista{grid-template-columns:1fr;} }
.b4-origen-item{display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:8px 10px; border-radius:14px; background:var(--b4-track); color:var(--o-ink);}
.b4-origen-item .ico-set{width:18px; height:18px;}
.b4-origen-n{font-weight:800; font-size:1.05rem;}
.b4-origen-l{font-size:.72rem; color:var(--ink-soft); flex-basis:100%;}
.b4-prev-lista{list-style:none; margin:12px 0 0; padding:0; display:flex; flex-direction:column; gap:6px;}
.b4-prev-item{display:flex; justify-content:space-between; gap:10px; padding:8px 12px; border-radius:999px; background:var(--b4-track); font-size:.82rem;}
.b4-prev-imp{font-variant-numeric:tabular-nums;}
@media (prefers-reduced-motion:reduce){ .b4-bar.pbar i, .b4-barra-real{transition:none;} }

/* ---------- B4.2 Lo que tengo que hacer ---------- */
#funnelTable.funnel-table{background:none; border:0; padding:0;}
.b4-avisos{display:flex; flex-direction:column; gap:8px; margin-bottom:14px;}
.b4-aviso{display:flex; gap:12px; align-items:center; padding:12px 16px; border-radius:16px; background:var(--b4-am-bg); color:var(--ink); border:1px solid color-mix(in srgb, var(--b4-am) 40%, transparent);}
.b4-aviso .ico-set{width:22px; height:22px; flex:none; color:var(--b4-am-ink);}
.b4-aviso.ok{background:var(--b4-ok-bg); border-color:color-mix(in srgb, var(--b4-ok) 40%, transparent);} .b4-aviso.ok .ico-set{color:var(--b4-ok-ink);}
.b4-aviso-t{margin:0; font-size:.88rem; line-height:1.45;}
.b4-hacer-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px;}
@media (max-width:900px){ .b4-hacer-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:560px){ .b4-hacer-grid{grid-template-columns:1fr;} }
.b4-hacer{
  --k:var(--info); --k-ink:var(--info-ink); --k-bg:var(--info-bg);
  background:radial-gradient(130% 100% at 100% 0%, var(--k-bg), transparent 62%), var(--surface);
  border:1px solid var(--line); border-radius:var(--b4-r); padding:16px; box-shadow:var(--shadow);
  display:flex; flex-direction:column; gap:6px; min-width:0;
}
.b4-hacer.tono-ok{--k:var(--zona-comercial); --k-ink:var(--zona-comercial-ink); --k-bg:var(--zona-comercial-bg);}
.b4-hacer.tono-warn{--k:var(--warn); --k-ink:var(--warn-ink); --k-bg:var(--warn-bg);}
.b4-hacer.tono-alq{--k:var(--zona-alquiler); --k-ink:var(--zona-alquiler-ink); --k-bg:var(--zona-alquiler-bg);}
.b4-hacer.tono-neutro{--k:var(--ink); --k-ink:var(--ink); --k-bg:var(--ok-bg);}
.b4-hacer-top{display:flex; align-items:center; gap:10px;}
.b4-hacer-ico{width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:var(--k-bg); color:var(--k-ink); flex:none;}
.b4-hacer-ico .ico-set{width:19px; height:19px;}
.b4-hacer-tit{font-size:.86rem; font-weight:700; margin:0; line-height:1.25;}
.b4-hacer-num{margin:6px 0 0; line-height:1.15;}
.b4-aprox{font-size:clamp(1.6rem,1.3rem + 1vw,2.2rem); font-weight:900; letter-spacing:-.02em;}
.b4-hacer-txt{font-size:.9rem; color:var(--ink-soft); font-weight:600;}
.b4-hacer-peq{margin:0; font-size:.78rem; color:var(--ink-soft);}
.b4-hacer-prog{display:flex; flex-direction:column; gap:6px; margin-top:8px;}
.b4-llevas{font-size:.8rem; font-weight:700;}
.b4-hacer .b4-sem{margin-top:6px;}

/* ---------- B4.3 Clientes por tipos ---------- */
.b4-tipos{display:flex; gap:10px; overflow-x:auto; padding:2px 2px 10px; margin-bottom:6px; scrollbar-width:thin;}
.b4-tipo{
  --t:var(--ink); --t-bg:var(--b4-track); --t-ink:var(--ink);
  flex:1 1 0; min-width:150px; min-height:56px; display:flex; align-items:center; gap:10px; padding:8px 14px 8px 10px;
  border-radius:999px; border:1.5px solid var(--line); background:var(--surface); color:var(--ink); cursor:pointer;
  font:inherit; font-weight:700; font-size:.82rem; text-align:left;
}
.b4-tipo.t-prop{--t:var(--b4-az); --t-bg:var(--b4-az-bg); --t-ink:var(--b4-az-ink);}
.b4-tipo.t-comp{--t:var(--b4-ok); --t-bg:var(--b4-ok-bg); --t-ink:var(--b4-ok-ink);}
.b4-tipo.t-amigo{--t:var(--b4-mo); --t-bg:var(--b4-mo-bg); --t-ink:var(--b4-mo-ink);}
.b4-tipo-ico{width:36px; height:36px; border-radius:50%; background:var(--t-bg); color:var(--t-ink); display:grid; place-items:center; flex:none;}
.b4-tipo-ico .ico-set{width:18px; height:18px;}
.b4-tipo-l{flex:1 1 auto; line-height:1.2;}
.b4-tipo-n{min-width:28px; height:26px; padding:0 8px; border-radius:999px; background:var(--t-bg); color:var(--t-ink); display:grid; place-items:center; font-weight:800; font-size:.8rem;}
.b4-tipo.activa{background:var(--t-bg); border-color:var(--t);}
.b4-tipo.activa .b4-tipo-ico{background:var(--t); color:#fff;}
.b4-tipo:focus-visible, .b4-acc:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}
.contacts-grid .contact-card.b4-cc{
  --t:var(--b4-az); --t-bg:var(--b4-az-bg); --t-ink:var(--b4-az-ink);
  border-radius:var(--b4-r); padding:14px; gap:10px; box-shadow:var(--shadow); cursor:pointer;
  border-top:3px solid var(--t);
}
.b4-cc.t-comp{--t:var(--b4-ok); --t-bg:var(--b4-ok-bg); --t-ink:var(--b4-ok-ink);}
.b4-cc.t-amigo{--t:var(--b4-mo); --t-bg:var(--b4-mo-bg); --t-ink:var(--b4-mo-ink);}
.b4-cc.t-todos{--t:var(--line-strong); --t-bg:var(--b4-track); --t-ink:var(--ink);}
.b4-cc-cab{display:flex; align-items:center; gap:12px;}
.b4-cc-av{width:46px; height:46px; border-radius:50%; flex:none; display:grid; place-items:center; background:var(--t-bg); color:var(--t-ink); font-weight:800; font-size:.95rem; box-shadow:inset 0 0 0 1.5px var(--t);}
.b4-cc-tx{min-width:0; flex:1 1 auto;}
.b4-cc .cc-name{font-weight:800; overflow-wrap:anywhere;}
.b4-cc .cc-sub{overflow-wrap:anywhere;}
.b4-cc .cc-chip{border-radius:999px;}
.b4-cc .cc-prio{border-radius:999px;}
.b4-acciones{display:flex; flex-wrap:wrap; gap:8px; align-self:stretch !important; align-items:center;}
/* Botón circular solo icono, táctil (≥44 px), con tooltip (title) y animación al pasar/pulsar */
.b4-acc{
  appearance:none; box-sizing:border-box; width:44px; height:44px; min-width:44px; padding:0; border-radius:50%; cursor:pointer;
  display:inline-grid; place-items:center; text-decoration:none; flex:none; position:relative;
  border:1.5px solid var(--btn-sec-bd); background:transparent; color:var(--btn-sec-fg);
}
.b4-acc .ico-set{width:20px; height:20px;}
.b4-acc:hover{background:var(--btn-sec-hover-bg);}
.b4-acc.b4-wa{background:var(--b4-ok-bg); border-color:var(--b4-ok); color:var(--b4-ok-ink);}
.b4-acc.b4-reg{background:var(--b4-az-bg); border-color:var(--b4-az); color:var(--b4-az-ink);}
.b4-acc.b4-sig{background:var(--accent); border-color:var(--accent); color:var(--accent-ink);}
.b4-acc.b4-sig:hover{background:var(--accent-hover); border-color:var(--accent-hover);}
.b4-acc.b4-del{background:var(--b4-ro-bg); border-color:var(--b4-ro); color:var(--b4-ro-ink);}
.b4-acc.b4-del:hover{background:var(--b4-ro); color:#fff;}
@media (prefers-reduced-motion:no-preference){
  .b4-acc{transition:transform .15s cubic-bezier(.2,.7,.2,1), background .18s ease, box-shadow .2s ease, color .18s ease;}
  .b4-acc:hover{transform:translateY(-2px) scale(1.06); box-shadow:var(--shadow);}
  .b4-acc:active{transform:scale(.92); box-shadow:none;}
}
.b4-tipo.t-todos.activa .b4-tipo-ico{background:var(--accent); color:var(--accent-ink);}

/* ---------- B4.4 Barra de etapas (chevron), mini progreso, deslizar ---------- */
.b4-etapas{display:flex; align-items:stretch; gap:0; margin:2px 0 14px; overflow-x:auto; padding:2px 0 6px; scrollbar-width:thin;}
.b4-chev{
  --ch:var(--b4-az-ink); --ch-bg:var(--b4-az-bg);
  appearance:none; border:0; cursor:pointer; flex:1 0 auto; min-width:132px; min-height:54px; margin-left:-10px; padding:0 22px 0 26px;
  display:flex; align-items:center; gap:10px; background:var(--ch-bg); color:var(--ink); font:inherit; font-weight:700; font-size:.82rem; text-align:left;
  clip-path:polygon(0 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 0 100%, 16px 50%);
  position:relative;
}
.b4-chev:first-child{margin-left:0; padding-left:18px; clip-path:polygon(0 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 0 100%); border-radius:999px 0 0 999px;}
.b4-chev:last-of-type{border-radius:0 999px 999px 0;}
.b4-chev.c-morado{--ch:var(--b4-mo-ink); --ch-bg:var(--b4-mo-bg);}
.b4-chev.c-verde{--ch:var(--b4-ok-ink); --ch-bg:var(--b4-ok-bg);}
.b4-chev.c-ambar{--ch:var(--b4-am-ink); --ch-bg:var(--b4-am-bg);}
.b4-chev.c-rojo{--ch:var(--b4-ro-ink); --ch-bg:var(--b4-ro-bg);}
.b4-chev.c-marino{--ch:var(--ink); --ch-bg:var(--b4-track);}
.b4-chev-n{min-width:30px; height:30px; padding:0 8px; border-radius:999px; display:grid; place-items:center; background:var(--surface); color:var(--ch); font-weight:900; font-size:.92rem; box-shadow:inset 0 0 0 1.5px var(--ch); flex:none;}
.b4-chev-l{line-height:1.2; white-space:nowrap;}
/* vacía: sin opacity (bajaba el contraste del texto y del número por debajo de 4,5:1) */
.b4-chev.vacia .b4-chev-l{font-weight:600;}
.b4-chev.vacia .b4-chev-n{box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--ch) 55%, transparent);}
.b4-chev.activa{background:var(--ch); color:var(--bg);}
.b4-chev.activa .b4-chev-n{background:var(--bg); color:var(--ch);}
.b4-chev:hover{filter:brightness(1.12);}
.b4-chev:focus-visible, .b4-chev-quitar:focus-visible{outline:2px solid var(--accent); outline-offset:-3px;}
.b4-chev-quitar{flex:none; align-self:center; margin-left:10px; min-height:44px; padding:0 16px; border-radius:999px; border:1.5px solid var(--btn-sec-bd); background:transparent; color:var(--btn-sec-fg); font:inherit; font-weight:700; font-size:.78rem; cursor:pointer;}
.b4-prog{display:flex; align-items:center; gap:4px; margin:2px 0 8px;}
.b4-prog-seg{flex:1 1 0; height:6px; border-radius:99px; background:var(--b4-track); display:block;}
.b4-prog-seg.hecha{background:var(--b4-ok);}
.b4-prog-seg.actual{background:var(--accent);}
.b4-prog-t{font-size:.68rem; font-weight:700; color:var(--ink-soft); margin-left:6px; font-variant-numeric:tabular-nums;}
.b4-deslizable{touch-action:pan-y; position:relative;}
.b4-revela{position:absolute; left:10px; top:50%; transform:translateY(-50%); z-index:0; padding:8px 14px; border-radius:999px; background:var(--accent); color:var(--accent-ink); font-size:.74rem; font-weight:800; opacity:0; pointer-events:none; white-space:nowrap;}
.b4-desliza{box-shadow:inset 5px 0 0 var(--accent), var(--shadow);}
.b4-desliza .b4-revela{opacity:var(--b4-dx,0);}
.b4-listo .b4-revela{outline:3px solid var(--b4-ok);}
@media (prefers-reduced-motion:no-preference){ .b4-deslizable{transition:transform .18s cubic-bezier(.2,.7,.2,1);} .b4-desliza{transition:none;} .b4-chev{transition:filter .15s ease, background .2s ease;} }
@media (max-width:600px){ .b4-chev{min-width:118px; font-size:.78rem; padding-right:18px;} }

/* ---------- B4.5 Botones circulares de tarjeta ---------- */
.card .actions.b4-acciones, .card .actions.contact-actions{display:flex; flex-wrap:wrap; gap:6px; align-items:center; justify-content:flex-start;}
.contact-actions.b4-acciones-c{display:contents;}
.icon-btn.b4-acc{width:44px; height:44px; min-width:44px;}
.b4-acc.b4-ok{background:var(--b4-ok-bg); border-color:var(--b4-ok); color:var(--b4-ok-ink);}
.b4-acc.b4-prom{border-color:var(--b4-mo); color:var(--b4-mo-ink); background:var(--b4-mo-bg);}
.b4-acc.b4-tarea{border-color:var(--b4-az); color:var(--b4-az-ink); background:var(--b4-az-bg);}
.b4-acc.b4-bp{border-color:var(--line-strong);}
.b4-acc.b4-del.confirming{background:var(--b4-ro); border-color:var(--b4-ro); color:#fff;}
.icon-btn.danger.b4-acc{color:var(--b4-ro-ink);}
.icon-btn.danger.b4-acc:hover{color:#fff;}
.btn-check.b4-sig-pv{background:var(--accent); border-color:var(--accent); color:var(--accent-ink); width:44px; height:44px;}
@media (prefers-reduced-motion:no-preference){
  .b4-acc.b4-sig{animation:b4Late 2.6s ease-in-out infinite;}
  @keyframes b4Late{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb, var(--accent) 0%, transparent);} 50%{box-shadow:0 0 0 6px color-mix(in srgb, var(--accent) 22%, transparent);}}
}

/* ---------- B4.7 Icono ⓘ con panel: ayuda por pestaña y texto explicativo ---------- */
.b4-tit-fila{display:flex; align-items:center; gap:4px; min-width:0;}
.b4-tit-fila > h2{min-width:0;}
.b4-info-btn{flex:none; width:44px; height:44px; margin:-6px -4px -6px 0; padding:0; border:0; background:transparent; display:grid; place-items:center; cursor:pointer; color:var(--b4-az-ink); border-radius:50%; -webkit-tap-highlight-color:transparent;}
.b4-info-circ{width:36px; height:36px; border-radius:50%; display:grid; place-items:center; background:var(--b4-az-bg); border:1.5px solid var(--b4-az-ink); transition:background .18s ease, color .18s ease, transform .18s ease;}
.b4-info-circ .ico-set{width:20px; height:20px;}
.b4-info-btn:hover .b4-info-circ{transform:scale(1.06);}
.b4-info-btn[aria-expanded="true"] .b4-info-circ{background:var(--accent); border-color:var(--accent); color:var(--accent-ink);}
.b4-info-btn:focus-visible{outline:none;}
.b4-info-btn:focus-visible .b4-info-circ{outline:2px solid var(--accent); outline-offset:2px;}
.b4-sub-plegado{display:none;}
.b4-ip{position:fixed; z-index:120; width:min(400px, calc(100vw - 24px)); max-height:70vh; overflow:auto; overscroll-behavior:contain; background:var(--surface); color:var(--ink); border:1px solid var(--line-strong); border-radius:22px; box-shadow:var(--shadow), 0 26px 60px -24px rgba(0,0,0,.55);}
.b4-ip[hidden]{display:none;}
.b4-ip-cab{position:sticky; top:0; z-index:1; display:flex; align-items:center; gap:10px; padding:10px 8px 8px 18px; background:var(--surface); border-bottom:1px solid var(--line);}
.b4-ip-tit{margin:0; font-size:.95rem; font-weight:800; white-space:nowrap;}
.b4-ip-chip{font-size:.72rem; font-weight:700; color:var(--b4-az-ink); background:var(--b4-az-bg); padding:3px 10px; border-radius:999px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0;}
.b4-ip-x{margin-left:auto; flex:none; width:44px; height:44px; border:0; border-radius:50%; background:transparent; color:var(--ink-soft); display:grid; place-items:center; cursor:pointer;}
.b4-ip-x .ico-set{width:20px; height:20px;}
.b4-ip-x:hover{background:var(--b4-track); color:var(--ink);}
.b4-ip-x:focus-visible{outline:2px solid var(--accent); outline-offset:-2px;}
.b4-ip-cuerpo{padding:14px 18px 18px; display:flex; flex-direction:column; gap:10px;}
.b4-ip-texto{margin:0; font-size:.88rem; line-height:1.55; color:var(--ink-soft);}
@media (prefers-reduced-motion:no-preference){
  .b4-ip{animation:b4IpEntra .18s ease-out;}
  @keyframes b4IpEntra{from{opacity:0; transform:translateY(-6px);} to{opacity:1; transform:none;}}
  @media (max-width:520px){ .b4-ip{animation-name:b4IpHoja;} @keyframes b4IpHoja{from{opacity:.4; transform:translateY(40px);} to{opacity:1; transform:none;}} }
}
@media (prefers-reduced-motion:reduce){ .b4-info-circ{transition:none;} .b4-info-btn:hover .b4-info-circ{transform:none;} }
@media (max-width:520px){
  .b4-ip{left:0; right:0; bottom:0; top:auto; width:100%; max-height:82vh; border-radius:24px 24px 0 0; border-bottom:0; padding-bottom:env(safe-area-inset-bottom);}
  body.b4-ip-abierto::after{content:""; position:fixed; inset:0; z-index:119; background:rgba(0,14,53,.5); pointer-events:none;}
}
.b4-ayuda-pasos{margin:0; padding:0; list-style:none; counter-reset:b4p; display:flex; flex-direction:column; gap:8px;}
.b4-ayuda-pasos li{counter-increment:b4p; display:flex; gap:12px; align-items:flex-start; font-size:.88rem; line-height:1.5;}
.b4-ayuda-pasos li::before{content:counter(b4p); flex:none; width:26px; height:26px; border-radius:50%; display:grid; place-items:center; background:var(--accent); color:var(--accent-ink); font-weight:800; font-size:.78rem; margin-top:1px;}
.b4-ayuda-h{margin:8px 0 0; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-soft);}
.b4-duda{background:var(--b4-track); border-radius:14px; padding:10px 14px;}
.b4-duda strong{font-size:.86rem;} .b4-duda p{margin:4px 0 0; font-size:.84rem; color:var(--ink-soft); line-height:1.5;}

/* ---------- B4.8 Interruptor de celebraciones (Ajustes) ---------- */
.b4-switch-fila{display:flex; align-items:center; gap:16px; justify-content:space-between; padding:14px 16px; border-radius:var(--b4-r); background:var(--surface); border:1px solid var(--line); margin-bottom:12px;}
.b4-switch-txt{display:flex; flex-direction:column; gap:3px; min-width:0;}
.b4-switch-txt span{font-size:.8rem; color:var(--ink-soft); line-height:1.4;}
.b4-switch{
  appearance:none; flex:none; width:64px; height:44px; border-radius:999px; border:1.5px solid var(--line-strong); background:var(--b4-track); padding:0; position:relative; cursor:pointer;
}
.b4-switch-bola{position:absolute; top:5px; left:5px; width:32px; height:32px; border-radius:50%; background:var(--ink-soft); transition:transform .2s cubic-bezier(.2,.7,.2,1), background .2s;}
.b4-switch.on{background:var(--b4-ok-bg); border-color:var(--b4-ok);}
.b4-switch.on .b4-switch-bola{transform:translateX(20px); background:var(--b4-ok);}
.b4-switch:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}
@media (prefers-reduced-motion:reduce){ .b4-switch-bola{transition:none;} }

/* ---------- B4.6 Mi día: línea del día y cierre ---------- */
.b4-linea-dia{margin-top:18px; background:var(--surface); border:1px solid var(--line); border-radius:var(--b4-r); padding:16px; box-shadow:var(--shadow);}
.b4-linea-cab{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:8px; margin-bottom:12px;}
.b4-linea-tit{margin:0; font-size:1rem; font-weight:800;}
.b4-linea-pct{font-size:.8rem; font-weight:700; color:var(--ink-soft);}
.b4-linea{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; position:relative;}
.b4-linea::before{content:""; position:absolute; left:16%; right:16%; top:30px; height:3px; border-radius:99px; background:var(--b4-track);}
.b4-nodo-btn{
  position:relative; width:100%; min-height:44px; padding:10px 8px 12px; border-radius:16px; border:1.5px solid transparent; background:transparent; color:var(--ink); cursor:pointer;
  font:inherit; display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center;
}
.b4-nodo-btn:hover{background:var(--b4-track);}
.b4-nodo-btn:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}
.b4-nodo-ico{width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:var(--surface); border:2px solid var(--line-strong); color:var(--ink-soft); position:relative; z-index:1;}
.b4-nodo-ico .ico-set{width:20px; height:20px;}
.b4-nodo.ahora .b4-nodo-btn{border-color:var(--accent); background:var(--danger-tint);}
.b4-nodo.ahora .b4-nodo-ico{border-color:var(--accent); color:var(--accent);}
.b4-nodo.completo .b4-nodo-ico{background:var(--b4-ok); border-color:var(--b4-ok); color:#fff;}
.b4-nodo-l{font-weight:800; font-size:.86rem;}
.b4-nodo-n{font-size:.74rem; color:var(--ink-soft); font-weight:600;}
.b4-nodo-btn .b4-bar{width:80%;}
.b4-nodo-ahora{position:absolute; top:6px; right:8px; font-size:.62rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; background:var(--accent); color:var(--accent-ink); padding:2px 8px; border-radius:999px;}
.bloque-card{border-radius:var(--b4-r);}
.bloque-card.b4-destaca{box-shadow:0 0 0 3px var(--accent);}
.b4-bloque-prog.pbar{height:6px; border-radius:99px; background:var(--b4-track); margin:8px 0; overflow:hidden;}
.b4-bloque-prog.pbar i{display:block; height:100%; background:var(--b4-az); border-radius:99px; transition:width .4s ease;}
.b4-bloque-prog.t-ok i{background:var(--b4-ok);}
.b4-cierre-kpis{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:0 0 14px;}
@media (max-width:900px){ .b4-cierre-kpis{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:520px){ .b4-nodo-l{font-size:.78rem;} .b4-nodo-ahora{position:static;} .b4-linea{gap:6px;} }

/* ---------- B4.11 Grupos de contactos ---------- */
.cc-prio.prioritario{background:var(--b4-am-bg); color:var(--b4-am-ink); border:1px solid var(--b4-am);}
.cc-prio.base{background:var(--b4-az-bg); color:var(--b4-az-ink); border:1px solid var(--b4-az);}
.cc-prio.nuevo{background:var(--b4-ok-bg); color:var(--b4-ok-ink); border:1px solid var(--b4-ok);}
.cc-prio{border-radius:999px; padding:3px 10px; text-transform:none; letter-spacing:0; font-weight:700;}
.b4-grupos{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px;}
@media (max-width:900px){ .b4-grupos{grid-template-columns:1fr;} }
.b4-grupo{--g:var(--b4-az); --g-bg:var(--b4-az-bg); background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--g); border-radius:var(--b4-r); padding:16px; display:flex; flex-direction:column; gap:12px; box-shadow:var(--shadow);}
.b4-grupo.g-ambar{--g:var(--b4-am); --g-bg:var(--b4-am-bg);} .b4-grupo.g-verde{--g:var(--b4-ok); --g-bg:var(--b4-ok-bg);}
.b4-grupo-cab{display:flex; align-items:center; gap:12px;}
.b4-grupo-ico{width:48px; height:48px; border-radius:50%; display:grid; place-items:center; font-size:1.5rem; background:var(--g-bg); box-shadow:inset 0 0 0 1.5px var(--g); flex:none;}
.b4-grupo-tx{display:flex; flex-direction:column; min-width:0;} .b4-grupo-tx span{font-size:.78rem; color:var(--ink-soft);}
.b4-grupo-campo{display:flex; flex-direction:column; gap:6px;} .b4-grupo-campo label{font-size:.76rem; font-weight:700;}
.b4-grupo-campo input{min-height:44px; border-radius:999px; border:1.5px solid var(--line-strong); background:var(--bg); color:var(--ink); padding:0 16px; font:inherit; font-size:.9rem;}
.b4-iconos{display:grid; grid-template-columns:repeat(6,1fr); gap:6px;}
.b4-icono{min-height:44px; border-radius:14px; border:1.5px solid var(--line); background:var(--bg); font-size:1.25rem; cursor:pointer; padding:0;}
.b4-icono:hover{background:var(--g-bg);} .b4-icono.sel{border-color:var(--g); background:var(--g-bg); box-shadow:0 0 0 2px var(--g);}
.b4-icono:focus-visible, .b4-grupo-campo input:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}
.b4-grupo-rest{align-self:flex-start;}

/* ---------- B4.9 Ajustar mi plan ---------- */
.b4-plan-panel{gap:16px;}
.b4-plan-prev{position:sticky; top:-24px; z-index:3; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:0 -6px; padding:10px 6px 12px; background:linear-gradient(var(--surface) 82%, transparent);}
@media (max-width:640px){ .b4-plan-prev{grid-template-columns:repeat(2,minmax(0,1fr)); top:-22px;} }
.b4-plan-prev .stat.kpi{min-height:0; padding:10px 12px;}
.b4-plan-prev .stat.kpi .kpi-ico{width:28px; height:28px; top:8px; right:8px;}
.b4-plan-prev .stat.kpi .kpi-ico .ico-set{width:14px; height:14px;}
.b4-plan-prev .kpi .label{min-height:0; font-size:.62rem; padding-right:32px;}
.b4-plan-prev .stat.kpi .value{font-size:1.15rem; margin-top:4px;}
.b4-plan-grupo{background:var(--bg); border:1px solid var(--line); border-radius:var(--b4-r); padding:16px; display:flex; flex-direction:column; gap:14px;}
.b4-plan-cab{display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.b4-plan-ico{width:42px; height:42px; border-radius:50%; background:var(--b4-az-bg); color:var(--b4-az-ink); display:grid; place-items:center; flex:none;}
.b4-plan-ico .ico-set{width:21px; height:21px;}
.b4-plan-cab-tx{display:flex; flex-direction:column; min-width:0; flex:1 1 auto;}
.b4-plan-tit{margin:0; font-size:1rem; font-weight:800;}
.b4-plan-sub{font-size:.76rem; color:var(--ink-soft);}
.b4-plan-total{font-weight:800; font-size:.86rem; background:var(--b4-ok-bg); color:var(--b4-ok-ink); padding:5px 12px; border-radius:999px;}
.b4-plan-campos{display:grid; grid-template-columns:1fr; gap:16px;}
.b4-plan-campos.compacto{grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 14px;}
@media (max-width:520px){ .b4-plan-campos.compacto{grid-template-columns:1fr;} }
.b4-plan-campo{display:flex; flex-direction:column; gap:8px; min-width:0;}
.b4-plan-l{font-size:.78rem; font-weight:700; text-transform:none; letter-spacing:0; color:var(--ink);}
.b4-plan-fila{display:flex; align-items:center; gap:8px;}
.b4-plan-fila .b4-stepper{flex:1 1 auto;}
.b4-plan-fila .b4-stepper input{font-size:1.15rem; width:100%;}
.b4-plan-u{font-weight:800; color:var(--ink-soft); min-width:1.2em;}
.b4-rango{-webkit-appearance:none; appearance:none; width:100%; height:32px; background:transparent; margin:0; --b4-pct:50%;}
.b4-rango::-webkit-slider-runnable-track{height:10px; border-radius:99px; background:linear-gradient(90deg, var(--accent) var(--b4-pct), var(--b4-track) var(--b4-pct));}
.b4-rango::-moz-range-track{height:10px; border-radius:99px; background:var(--b4-track);}
.b4-rango::-moz-range-progress{height:10px; border-radius:99px; background:var(--accent);}
.b4-rango::-webkit-slider-thumb{-webkit-appearance:none; width:28px; height:28px; border-radius:50%; background:var(--btn-bg); border:3px solid var(--accent); margin-top:-9px; box-shadow:var(--shadow); cursor:grab;}
.b4-rango::-moz-range-thumb{width:24px; height:24px; border-radius:50%; background:var(--btn-bg); border:3px solid var(--accent); cursor:grab;}
.b4-rango:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:99px;}

/* ---------- B4.A Negocio cerrado ---------- */
.comisiones-table.b4-nc{display:flex; flex-direction:column; gap:14px; background:none; border:0; padding:0;}
.b4-nc-kpis{display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; margin:0;}
.b4-nc-graf{background:var(--surface); border:1px solid var(--line); border-radius:var(--b4-r); padding:14px 16px; box-shadow:var(--shadow);}
.b4-nc-graf .b4-svg{max-height:170px;}
.b4-nc-filtros{display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center;}
.b4-nc-grupo{display:flex; flex-wrap:wrap; gap:6px;}
.b4-nc-filtros .chip{min-height:38px; border-radius:999px;}
.b4-nc-buscar{flex:1 1 220px; min-height:44px; border-radius:999px !important; padding:0 18px !important;}
.b4-nc-lista{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px;}
@media (max-width:760px){ .b4-nc-lista{grid-template-columns:1fr;} }
.b4-nc-card{--z:var(--info); background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--z); border-radius:var(--b4-r); padding:14px 16px; display:flex; flex-direction:column; gap:10px; cursor:pointer; box-shadow:var(--shadow);}
.b4-nc-card.z-collection{--z:var(--accent);} .b4-nc-card.z-commercial{--z:var(--zona-comercial);} .b4-nc-card.z-alquileres{--z:var(--zona-alquiler);}
.b4-nc-card:hover{border-color:var(--z);} .b4-nc-card:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}
.b4-nc-top{display:flex; flex-direction:column; gap:8px;}
.b4-nc-dir{font-size:.98rem; overflow-wrap:anywhere;}
.b4-nc-chips{display:flex; flex-wrap:wrap; gap:6px;}
.b4-nc-chip{font-size:.7rem; font-weight:800; padding:3px 10px; border-radius:999px; background:var(--b4-track); color:var(--ink);}
.b4-nc-chip.tipo-venta{background:var(--b4-az-bg); color:var(--b4-az-ink);} .b4-nc-chip.tipo-alquiler{background:var(--b4-mo-bg); color:var(--b4-mo-ink);}
.b4-nc-chip.zona{background:transparent; border:1.5px solid var(--z); color:var(--ink);}
.b4-nc-chip.cobrada{background:var(--b4-ok-bg); color:var(--b4-ok-ink);} .b4-nc-chip.pend{background:var(--b4-am-bg); color:var(--b4-am-ink);}
.b4-nc-datos{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 12px;}
.b4-nc-dato{display:flex; flex-direction:column; min-width:0;}
.b4-nc-dl{font-size:.64rem; text-transform:uppercase; letter-spacing:.07em; color:var(--ink-soft); font-weight:600;}
.b4-nc-dv{font-weight:700; font-size:.88rem; overflow-wrap:anywhere;}

/* ---------- PLAN 360 ---------- */
.month-grid.b4-p360-grid{grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px;}
@media (max-width:1000px){ .month-grid.b4-p360-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:620px){ .month-grid.b4-p360-grid{grid-template-columns:1fr;} }
.b4-p360-grid[hidden], .b4-p360-vista[hidden]{display:none;}
.b4-p360-mes{background:var(--surface); border:1px solid var(--line); border-radius:var(--b4-r); padding:14px; display:flex; flex-direction:column; gap:10px; box-shadow:var(--shadow); min-width:0;}
.b4-p360-mes.e-pasado{opacity:.72;}
.b4-p360-mes.current{border-color:var(--accent); box-shadow:var(--shadow), 0 0 0 1px var(--accent); background:linear-gradient(160deg, var(--danger-tint), transparent 55%), var(--surface);}
.b4-p360-top{display:flex; align-items:center; gap:10px;}
.b4-p360-ico{width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:var(--b4-am-bg); color:var(--b4-am-ink); flex:none;}
.b4-p360-ico.a-autoridad{background:var(--b4-az-bg); color:var(--b4-az-ink);} .b4-p360-ico .ico-set{width:20px; height:20px;}
.b4-p360-nm{display:flex; flex-direction:column; flex:1 1 auto; min-width:0;}
.b4-p360-est-t{font-size:.7rem; font-weight:700; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.06em;}
.b4-p360-mes.current .b4-p360-est-t{color:var(--accent);}
.b4-p360-t{margin:0; font-size:.92rem; line-height:1.3; flex:1 1 auto;}
.b4-p360-chips{display:flex; flex-wrap:wrap; gap:6px;}
.b4-p360-ang, .b4-p360-c, .b4-p360-pers{font-size:.68rem; font-weight:800; padding:3px 10px; border-radius:999px;}
.b4-p360-ang.a-dolor{background:var(--b4-am-bg); color:var(--b4-am-ink);} .b4-p360-ang.a-autoridad{background:var(--b4-az-bg); color:var(--b4-az-ink);}
.b4-p360-c.c-Contacto{background:var(--b4-az-bg); color:var(--b4-az-ink);} .b4-p360-c.c-Cuidado{background:var(--b4-am-bg); color:var(--b4-am-ink);} .b4-p360-c.c-Comunidad{background:var(--b4-ok-bg); color:var(--b4-ok-ink);}
.b4-p360-pers{background:var(--b4-mo-bg); color:var(--b4-mo-ink); white-space:nowrap;}
.b4-p360-ver{min-height:44px; width:100%;}
.b4-p360-vista{display:flex; flex-direction:column; gap:16px;}
.b4-p360-cab{display:flex; flex-wrap:wrap; align-items:center; gap:12px;}
.b4-p360-tt{flex:1 1 260px; display:flex; flex-direction:column; gap:8px; min-width:0;}
.b4-p360-h{margin:0; font-size:1.25rem; font-weight:800;}
.b4-p360-paso{background:var(--surface); border:1px solid var(--line); border-radius:var(--b4-r); padding:16px; display:flex; flex-direction:column; gap:10px; box-shadow:var(--shadow);}
.b4-p360-ph{margin:0; font-size:1.02rem; font-weight:800;}
.b4-p360-sh{margin:6px 0 0; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-soft);}
.b4-p360-ficha{display:grid; grid-template-columns:minmax(120px,190px) 1fr; gap:6px 14px; margin:0;}
.b4-p360-ficha dt{font-size:.74rem; font-weight:700; color:var(--ink-soft);} .b4-p360-ficha dd{margin:0; font-size:.88rem; overflow-wrap:anywhere;}
@media (max-width:560px){ .b4-p360-ficha{grid-template-columns:1fr;} .b4-p360-ficha dt{margin-top:6px;} }
.b4-p360-est{margin:0; padding-left:20px; font-size:.86rem; line-height:1.6;}
.b4-p360-email{white-space:pre-wrap; overflow-wrap:anywhere; margin:0; font-family:inherit; font-size:.88rem; line-height:1.6; padding:14px 16px; border-radius:16px; background:var(--b4-track); border:1px solid var(--line);}
.b4-p360-nota, .b4-p360-txt{margin:0; font-size:.82rem; color:var(--ink-soft); line-height:1.5;}
.b4-p360-wa{margin:0; padding:12px 16px; border-radius:16px; background:var(--b4-ok-bg); font-size:.88rem; line-height:1.5;}
.b4-p360-acciones{display:flex; flex-wrap:wrap; gap:10px;}
.b4-p360-acciones .btn{min-height:44px;}
.b4-p360-zonaform{background:var(--surface); border:1px solid var(--b4-az); border-radius:var(--b4-r); padding:16px;}
.b4-p360-form{display:flex; flex-direction:column; gap:14px;}
.b4-f-campo{display:flex; flex-direction:column; gap:6px;}
.b4-f-l{font-size:.78rem; font-weight:700; color:var(--ink); text-transform:none; letter-spacing:0;}
.b4-f-ayuda{font-size:.72rem; color:var(--ink-soft);}
.b4-f-campo input[type=text], .b4-f-campo select{min-height:44px; border-radius:999px; border:1.5px solid var(--line-strong); background:var(--bg); color:var(--ink); padding:0 18px; font:inherit; font-size:.9rem;}
.b4-f-campo textarea{border-radius:16px; border:1.5px solid var(--line-strong); background:var(--bg); color:var(--ink); padding:12px 16px; font:inherit; font-size:.9rem; line-height:1.5; resize:vertical;}
.b4-f-campo input:focus-visible, .b4-f-campo textarea:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}
.b4-f-lista{display:flex; flex-direction:column; gap:8px;} .b4-f-fila{display:flex; gap:8px; align-items:center;} .b4-f-fila input{flex:1 1 auto;}
.b4-f-aviso{padding:10px 14px; border-radius:14px; background:var(--b4-am-bg); color:var(--b4-am-ink); font-size:.82rem;}
.b4-f-error{margin:0; padding:10px 14px; border-radius:14px; background:var(--b4-ro-bg); color:var(--b4-ro-ink); font-size:.84rem; font-weight:700;}
.b4-f-aviso[hidden], .b4-f-error[hidden]{display:none;}
.b4-filtro-extra{display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:10px 14px; border-radius:16px; background:var(--b4-az-bg); color:var(--ink); font-size:.84rem; margin:0 0 10px;}
.b4-filtro-extra[hidden]{display:none;} .b4-filtro-extra .btn{min-height:44px;}
.b4-ruta-tarjeta{margin:0 0 16px; border-radius:var(--b4-r); border:1.5px solid var(--accent); background:linear-gradient(120deg, var(--danger-tint), transparent 70%), var(--surface); box-shadow:var(--shadow);}
.b4-ruta-tarjeta[hidden]{display:none;}
.b4-ruta-sum{list-style:none; cursor:pointer; display:flex; align-items:center; gap:12px; min-height:56px; padding:10px 16px; font-weight:800;}
.b4-ruta-sum::-webkit-details-marker{display:none;} .b4-ruta-sum .ico-set{width:22px; height:22px; color:var(--accent); flex:none;}
.b4-ruta-prog{margin-left:auto; font-size:.74rem; font-weight:800; background:var(--b4-track); padding:4px 12px; border-radius:999px;}
.b4-ruta-cuerpo{padding:0 16px 16px; display:flex; flex-direction:column; gap:12px; align-items:flex-start;}
.b4-ruta-cuerpo .pbar{width:100%;}
.b4-ruta-linea{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px;}
@media (max-width:760px){ .b4-ruta-linea{grid-template-columns:1fr;} }
.b4-ruta-sem{display:flex; gap:10px; align-items:flex-start; background:var(--b4-track); border-radius:16px; padding:12px;}
.b4-ruta-num{width:30px; height:30px; flex:none; border-radius:50%; display:grid; place-items:center; background:var(--accent); color:var(--accent-ink); font-weight:800;}
.b4-ruta-st{font-size:.84rem; line-height:1.45;}
.b4-ruta-medir{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px;}
@media (max-width:640px){ .b4-ruta-medir{grid-template-columns:1fr;} }
.b4-ruta-cajita{background:var(--b4-track); border-radius:16px; padding:12px 14px;} .b4-ruta-cajita p{margin:4px 0 0; font-size:.84rem; color:var(--ink-soft);}
.b4-ruta-kpis{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin:0;}
.b4-ruta-preg{margin:0; padding-left:20px; font-size:.88rem; line-height:1.7;}

/* ---------- B4.10 Formularios: todo redondeado (píldora en una línea, ~16 px en textareas y bloques) ---------- */
body :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]), select){
  border-radius:999px; min-height:44px; padding-inline:18px;
}
body textarea{border-radius:16px; padding:12px 16px; line-height:1.5;}
body .b4-stepper input, body .b4-rango, body .cal-dia input{border-radius:0; padding-inline:2px; min-height:44px;}
body .tarj-grupo :is(input, select){border-radius:0;}
body .field-group, body .ctc-meta, body .comisiones-table, body .guia, body .historial-combo, body .funnel-table{border-radius:var(--b4-r);}
body .field label, body .fg-title{font-weight:700;}
.overlay .panel{border-radius:24px 0 0 24px;}
@media (max-width:600px){ .overlay .panel{border-radius:24px 24px 0 0; height:calc(100% - 12px); margin-top:12px; align-self:flex-end;} }
.overlay .panel-close{border-radius:50%;}
body .update-add, body .recordatorio-add{gap:10px;}
body .update-add .btn, body .recordatorio-add .btn{min-height:44px;}
.b4-tipos-act.tarj-segmentado{flex-wrap:wrap; gap:8px; background:none; border:0; padding:0;}
.b4-tipos-act.tarj-segmentado .tarj{min-height:44px; border-radius:999px; padding:6px 14px; display:inline-flex; align-items:center; gap:8px;}
.b4-tipos-act .tarj-ico .ico-set, .tarj-ico .ico-set{width:18px; height:18px;}
.panel-pulso .field textarea, .update-add textarea{min-height:88px;}

/* =====================================================================
   B4.0 Una idea por pantalla: menos texto, nada duplicado, ancho cómodo
   ===================================================================== */
.wrap{max-width:1100px;}
.section-head > div, .section-head .tareas-titulo > div{min-width:0;}
.section-head .sub{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;}
.b4-estr{margin:0 0 14px;}
.b4-estr > summary{cursor:pointer; list-style:none; display:inline-flex; align-items:center; gap:8px; min-height:36px; padding:0 14px; border-radius:999px; background:var(--b4-track); color:var(--ink-soft); font-size:.74rem; font-weight:700;}
.b4-estr > summary::-webkit-details-marker{display:none;}
.b4-estr > summary::before{content:"ⓘ"; font-size:.9rem;}
.b4-estr[open] > summary{margin-bottom:10px;}
.b4-estr > p.sub, .b4-estr > .b4-p360-est{white-space:normal; max-width:70ch;}
.b4-estr > summary:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}
/* Mi día: la cifra de contactos y la racha ya están en el anillo y en la cabecera */
#diaKpis > .stat:nth-child(1), #diaKpis > .stat:nth-child(2){display:none;}
#diaKpis{grid-template-columns:1fr;}
.bloque-hint{display:none;}
/* Tableros: la barra de etapas ya lleva nombre y contador */
.b4-etapas + .board .col-head{display:none;}
.b4-etapas + .board .col{padding-top:0;}
/* Números: sin KPI repetidos (neto, ingresos anuales y honorarios ya salen en «Cómo voy» y en el plan) */
#planStats > .stat:has(#planBeneficioNetoAnual), #planStats > .stat:has(#planBeneficioNetoMensual), #planStats > .stat:has(#planIngresosObjetivo), #planStats > .stat:has(#planHonorariosAgente){display:none;}
#yearProgress{display:none;}
/* Una línea en tarjetas */
.cc-last, .cc-sub{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
/* Anillos */
.b4-anillo{position:relative; width:56px; height:56px; display:inline-grid; place-items:center; flex:none; --an:var(--b4-az);}
.b4-anillo.t-ok{--an:var(--b4-ok);} .b4-anillo.t-ambar{--an:var(--b4-am);} .b4-anillo.t-rojo{--an:var(--b4-ro);}
.b4-anillo svg{position:absolute; inset:0; width:100%; height:100%;}
.b4-an-bg{fill:none; stroke:var(--b4-track); stroke-width:6;}
.b4-an-fg{fill:none; stroke:var(--an); stroke-width:6; stroke-linecap:round; transition:stroke-dashoffset .6s cubic-bezier(.2,.7,.2,1);}
.b4-an-n{position:relative; font-size:.78rem; font-weight:800; font-variant-numeric:tabular-nums;}
@media (prefers-reduced-motion:reduce){ .b4-an-fg{transition:none;} }
.b4-hacer-prog{flex-direction:row; align-items:center; gap:12px;}
.b4-llevas{font-size:.8rem; color:var(--ink-soft);}
.b4-cierre-kpis{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:0 0 14px;}
@media (max-width:560px){ .b4-cierre-kpis{grid-template-columns:1fr;} }
.b4-cierre-ficha{display:flex; align-items:center; gap:12px; background:var(--surface); border:1px solid var(--line); border-radius:var(--b4-r); padding:10px 14px; box-shadow:var(--shadow);}
.b4-cierre-ico{width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:var(--b4-az-bg); color:var(--b4-az-ink); flex:none;}
.b4-cierre-ico .ico-set{width:19px; height:19px;}
.b4-cierre-l{font-weight:700; font-size:.88rem; flex:1 1 auto;}
.b4-cierre-v{font-weight:800; font-size:1.1rem;}
.b4-dinero{grid-template-columns:repeat(3,minmax(0,1fr));}
@media (max-width:420px){ .b4-dinero{grid-template-columns:1fr;} }
/* Meses: compactos salvo el actual; «Ver mes» despliega */
.b4-mes-resumen{margin:0; font-size:.8rem; color:var(--ink-soft); font-weight:600;}
.b4-mes-ver{min-height:44px; width:100%;}
.month-card.b4-mes:not(.b4-abierta) .b4-mes-cuerpo{display:none;}
.month-card.b4-mes.b4-abierta .b4-mes-resumen{display:none;}
@media (min-width:901px){ .month-card.b4-mes.b4-abierta{grid-column:span 2;} .month-card.b4-abierta .b4-barras{display:grid; grid-template-columns:1fr 1fr; gap:7px 18px;} }
.month-grid{align-items:start; grid-auto-flow:row dense;}
.contacts-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));}
.contacts-grid .contact-card{min-width:0;}
#filtrosPrioridadContactos .chip:first-child{display:none;}

/* =====================================================================
   Chat del equipo en verde WhatsApp (solo color; la lógica no cambia).
   Noche: verdes claros sobre azul marino. Día: verdes oscuros (AA sobre
   crema/blanco; #25D366 solo no llega a 3:1 sobre claro).
   ===================================================================== */
:root{
  --wa:#25d366; --wa-ink:#25d366; --wa-fg:#06240f;
  --wa-own-bg:#005c4b; --wa-own-fg:#e9edef; --wa-other-bg:var(--surface);
  --wa-line:rgba(37,211,102,.45);
}
:root[data-theme="light"]{
  --wa:#0f7a28; --wa-ink:#0f7a28; --wa-fg:#ffffff;
  --wa-own-bg:#d9fdd3; --wa-own-fg:#0b141a; --wa-other-bg:#ffffff;
  --wa-line:rgba(15,122,40,.5);
}
/* Botón del chat de la cabecera: círculo verde WhatsApp con burbuja blanca */
.btn-ico.sec.hdr-chat{--wa-btn:#14a04d; background:var(--wa-btn); color:#fff; border-color:var(--wa-btn);}
:root[data-theme="light"] .btn-ico.sec.hdr-chat{--wa-btn:#0f7a28;}
.btn-ico.sec.hdr-chat:hover, .btn-ico.sec.hdr-chat:focus-visible{background:color-mix(in srgb, var(--wa-btn) 86%, #000); color:#fff; border-color:color-mix(in srgb, var(--wa-btn) 86%, #000);}
.hdr-chat .ico-set{fill:currentColor; stroke:currentColor;}
.hdr-chat .chat-badge, .chat-item-badge{background:var(--wa); color:var(--wa-fg);}
.chat-av-general{background:var(--wa); color:var(--wa-fg);}
.chat-item.activa{box-shadow:inset 3px 0 0 var(--wa-ink);}
.chat-msgs{background:color-mix(in srgb, var(--wa) 6%, var(--bg));}
.msg.ajeno .msg-burbuja{background:var(--wa-other-bg);}
.msg.propio .msg-burbuja{background:var(--wa-own-bg); color:var(--wa-own-fg); border-color:transparent;}
.msg.propio .msg-autor{color:inherit;}
.msg.propio .msg-acc.confirming{background:var(--wa-ink); color:var(--wa-fg);}
.chat-form .chat-btn-enviar{border-radius:50%; background:var(--wa); color:var(--wa-fg); border:0;}
.chat-form .chat-btn-enviar:hover:not(:disabled), .chat-form .chat-btn-enviar:focus-visible{background:var(--wa); filter:brightness(1.1);}
.chat-form .chat-btn-enviar:disabled{opacity:.45;}
#chatTexto:focus{border-color:var(--wa-ink); box-shadow:0 0 0 3px var(--wa-line);}
.chat-nuevos{background:var(--wa); color:var(--wa-fg);}

/* Logo que lleva al inicio y botón «Volver arriba» */
.logo-chip[role="link"]{cursor:pointer;}
.logo-chip[role="link"]:focus-visible{outline:3px solid var(--info-ink); outline-offset:3px;}
.ir-arriba{
  appearance:none; position:fixed; z-index:34; right:30px; bottom:96px; box-sizing:border-box;
  width:44px; height:44px; padding:0; border-radius:50%; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--surface); color:var(--ink); border:1.5px solid var(--line-strong); box-shadow:var(--shadow);
  opacity:0; visibility:hidden; transform:translateY(8px); pointer-events:none;
  -webkit-tap-highlight-color:transparent;
}
.ir-arriba.visible{opacity:1; visibility:visible; transform:none; pointer-events:auto;}
.ir-arriba:hover{border-color:var(--info-ink); color:var(--info-ink);}
.ir-arriba:focus-visible{outline:3px solid var(--info-ink); outline-offset:3px;}
body.chat-abierto .ir-arriba{visibility:hidden;}
@media (prefers-reduced-motion:no-preference){
  .ir-arriba{transition:opacity .2s ease, transform .2s ease, visibility 0s linear .2s;}
  .ir-arriba.visible{transition:opacity .2s ease, transform .2s ease, visibility 0s;}
}
@media (max-width:700px){
  /* a la derecha, en la misma fila que el «+» centrado y sobre la barra inferior */
  .ir-arriba{right:16px; bottom:calc(var(--nav-bar-h) + env(safe-area-inset-bottom, 0px) + 20px);}
}
/* ---------- Inmovilla: cartera importada (docs/INMOVILLA_OPCION1.md) ----------
   Foto, chip «Inmovilla», rasgos, aviso «Ya no está disponible» con tres
   botones redondos y «Cambios en Inmovilla». Colores solo con tokens. */
.inm-card .inm-foto{
  margin:-13px -14px 10px; aspect-ratio:16 / 9; overflow:hidden; background:var(--surface-2);
  border-radius:inherit; border-bottom-left-radius:0; border-bottom-right-radius:0;
}
.inm-card .inm-foto img{display:block; width:100%; height:100%; object-fit:cover;}
.inm-card .inm-foto.sin-foto{display:none;}
.card .zona.inm-chip{background:var(--b4-az-bg); color:var(--b4-az-ink); border-color:var(--b4-az); margin-left:5px; border-radius:999px;}
.inm-rasgos{margin-top:6px; font-size:.74rem; color:var(--ink-soft); font-variant-numeric:tabular-nums; overflow-wrap:anywhere;}
.inm-aviso{
  margin-top:10px; padding:10px 12px 12px; border-radius:14px;
  background:var(--b4-am-bg); border:1px solid var(--b4-am); color:var(--ink);
}
.inm-aviso-t{display:flex; align-items:center; gap:8px; font-weight:700; font-size:.82rem; color:var(--b4-am-ink);}
.inm-aviso-t .ico-set{width:18px; height:18px; flex:none;}
.inm-aviso-b{display:flex; justify-content:space-between; gap:4px; margin-top:10px;}
.inm-redondo{
  appearance:none; background:none; border:0; padding:0; cursor:pointer; color:var(--ink);
  display:inline-flex; flex-direction:column; align-items:center; gap:4px; font:inherit; flex:1 1 0; min-width:0;
}
.inm-redondo-c{
  width:48px; height:48px; border-radius:50%; display:grid; place-items:center; box-sizing:border-box;
  border:1.5px solid var(--btn-sec-bd); background:var(--surface);
}
.inm-redondo-c .ico-set{width:22px; height:22px;}
.inm-redondo-t{font-size:.72rem; font-weight:700; max-width:100%; overflow-wrap:anywhere; text-align:center;}
.inm-vendido .inm-redondo-c{background:var(--b4-ok-bg); border-color:var(--b4-ok); color:var(--b4-ok-ink);}
.inm-alquilado .inm-redondo-c{background:var(--b4-az-bg); border-color:var(--b4-az); color:var(--b4-az-ink);}
.inm-retirado .inm-redondo-c{background:var(--b4-ro-bg); border-color:var(--b4-ro); color:var(--b4-ro-ink);}
.inm-redondo:focus-visible{outline:none;}
.inm-redondo:focus-visible .inm-redondo-c{outline:2px solid var(--accent); outline-offset:2px;}
.inm-cambios{
  margin-top:10px; padding:8px 10px; border-radius:14px; display:flex; align-items:center; gap:10px;
  background:var(--b4-az-bg); border:1px solid var(--b4-az);
}
.inm-cambios-tx{flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:2px; font-size:.78rem; overflow-wrap:anywhere;}
.inm-cambios-tx b{color:var(--b4-az-ink); font-size:.8rem;}
.inm-cambios-b{display:flex; gap:6px; flex:none;}
.b4-acc.inm-aceptar{background:var(--b4-ok-bg); border-color:var(--b4-ok); color:var(--b4-ok-ink);}
.b4-acc.inm-ficha{background:var(--b4-az-bg); border-color:var(--b4-az); color:var(--b4-az-ink);}
@media (prefers-reduced-motion:no-preference){
  .inm-redondo-c{transition:transform .15s cubic-bezier(.2,.7,.2,1), box-shadow .2s ease;}
  .inm-redondo:hover .inm-redondo-c{transform:translateY(-2px) scale(1.06); box-shadow:var(--shadow);}
  .inm-redondo:active .inm-redondo-c{transform:scale(.92); box-shadow:none;}
}
.inm-cierre .field input{border-radius:12px;}

/* Ajustes → Usuarios: columna «Código Inmovilla» */
.usuario-row{grid-template-columns:2fr 1.4fr 1fr 1.1fr .8fr .8fr 130px;}
.usuario-row .u-inm-f{display:flex; align-items:center; gap:6px; min-width:0;}
.usuario-row .u-inm-input{
  width:100%; min-width:0; box-sizing:border-box; border:1px solid var(--line-strong); background:var(--bg); color:var(--ink);
  padding:6px 8px; font-family:inherit; font-size:.82rem; border-radius:10px; font-variant-numeric:tabular-nums;
}
.usuario-row .u-inm-input[aria-invalid="true"]{border-color:var(--b4-ro);}
.usuario-row .u-inm-guardar{width:36px; height:36px; min-width:36px; background:var(--b4-ok-bg); border-color:var(--b4-ok); color:var(--b4-ok-ink);}
.usuario-row .u-inm-guardar[hidden]{display:none;}
.usuario-row .u-inm-lbl{display:none;}
@media (max-width:760px){
  .usuario-row{grid-template-columns:1fr 1fr;}
  .usuario-row .u-inm{grid-column:1 / -1;}
  .usuario-row .u-inm-input{max-width:170px;}
  .usuario-row .u-inm-lbl{display:inline; font-size:.64rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); flex:none;}
}
