/* ═══════════════════════════════════════════════════════════════
   Cash Market · Entrada · login → 2FA → muro de postura
   Herencia estricta de MM: .login-wrap/.login-card/.field/.fld-in/
   .btn. Solo se estrenan las clases del muro (§2 del contrato v3).
   Mobile-first iOS 390px.
   ═══════════════════════════════════════════════════════════════ */

/* ─── Estados: solo uno activo ─── */
.ent-stage{display:none;min-height:100dvh;min-height:100vh}
.ent-stage.on{display:flex;flex-direction:column}

/* ─── Hint de simulación (login) ─── */
.ent-demo-hint{
  margin-top:14px;padding:11px 12px;
  background:var(--blue-bg);border-left:2px solid var(--blue-brd);
  font-size:.74rem;color:var(--blue);line-height:1.5;
}
.ent-demo-hint strong{font-weight:900;color:var(--blue)}

/* ─── 2FA ─── */
.ent-2fa-msg{
  font-size:.86rem;color:var(--ink2);line-height:1.55;margin-bottom:18px;
}
.ent-2fa-msg strong{font-weight:900;color:var(--ink)}
.ent-2fa-msg .em{color:var(--red);font-weight:800;word-break:break-all}

.ent-2fa-in{
  text-align:center;
  font-size:1.55rem;font-weight:900;
  letter-spacing:.42em;
  font-variant-numeric:tabular-nums;
  padding-left:18px;padding-right:0;
}
.ent-2fa-in::placeholder{
  letter-spacing:.42em;color:var(--ink4);font-weight:700;
}

.ent-2fa-actions{display:flex;flex-direction:column;gap:8px;margin-top:6px}

.ent-2fa-foot{
  margin-top:16px;padding:11px 12px;
  background:var(--amber-bg);border-left:2px solid var(--amber-brd);
  font-size:.74rem;color:var(--amber);line-height:1.5;
}
.ent-2fa-foot strong{font-weight:900;color:var(--amber)}

/* ─── MURO — bifurcación colocar / captar con libro borroso detrás ─── */

/* Shell del muro: appbar + área de scroll con copy + botones
   IMPORTANTE: el .app y su .sa deben ser TRANSPARENTES para que el
   .muro-blur (position:absolute detrás, z-index 0) se vea. Sólo el appbar
   mantiene bg opaco para separar visualmente al header del libro borroso. */
#s-muro{position:relative;overflow:hidden;background:var(--bg)}
#s-muro .app{position:relative;background:transparent;z-index:2}
#s-muro .appbar{background:var(--surf)}
#s-muro .sa{background:transparent}
#s-muro .wrap{
  padding-top:14px;
  padding-bottom:calc(env(safe-area-inset-bottom,16px) + 24px);
}

/* Copy del muro */
.muro-copy{margin-bottom:22px}
.muro-ey{
  font-size:.62rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink3);margin-bottom:6px;
}
.muro-h1{
  font-size:1.6rem;font-weight:900;letter-spacing:-.028em;line-height:1.1;
  color:var(--ink);margin-bottom:10px;
}
.muro-sub{
  font-size:.86rem;color:var(--ink3);line-height:1.5;
}
.muro-sub strong{color:var(--ink2);font-weight:800}

/* Bifurcación · dos botones grandes cromáticos */
.muro-choice{display:flex;flex-direction:column;gap:12px;margin-bottom:22px}
.muro-btn{
  border:1.5px solid var(--brd2);background:var(--surf);border-radius:16px;
  padding:18px 20px;text-align:left;cursor:pointer;font-family:var(--f);
  display:flex;flex-direction:column;gap:2px;
  min-height:120px;
  transition:border-color .15s, transform .12s, box-shadow .15s;
  position:relative;overflow:hidden;
}
.muro-btn:active{transform:scale(.98)}
.muro-btn-l{
  font-size:.6rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink3);
}
.muro-btn-n{
  font-size:1.7rem;font-weight:900;letter-spacing:-.025em;color:var(--ink);
  line-height:1;margin-top:2px;
}
.muro-btn-s{
  font-size:.8rem;color:var(--ink3);line-height:1.5;margin-top:10px;
}
.muro-btn-arrow{
  position:absolute;top:20px;right:20px;font-size:1.1rem;
  color:var(--ink4);line-height:1;
}

.muro-btn.colocar{
  background:var(--green-bg);border-color:var(--green-brd);
  box-shadow:inset 0 -3px 0 var(--green);
}
.muro-btn.colocar .muro-btn-l{color:var(--green)}
.muro-btn.colocar:active{box-shadow:inset 0 -3px 0 var(--green),0 2px 12px rgba(22,163,74,.18)}

.muro-btn.captar{
  background:var(--red-bg);border-color:var(--red-brd);
  box-shadow:inset 0 -3px 0 var(--red);
}
.muro-btn.captar .muro-btn-l{color:var(--red)}
.muro-btn.captar:active{box-shadow:inset 0 -3px 0 var(--red),0 2px 12px rgba(208,2,27,.18)}

/* Regla del muro · aviso corto */
.muro-rule{
  margin-top:14px;padding:11px 13px;
  background:var(--surf);border:1px solid var(--brd2);border-radius:10px;
  font-size:.72rem;color:var(--ink3);line-height:1.5;
}
.muro-rule strong{color:var(--ink2);font-weight:800}

/* ─── LIBRO BORROSO detrás del muro ───
   Cubre el ancho del .app (para no derramarse en desktop) debajo del
   contenido táctil. Muy sutil: blur alto, opacity baja, y mask-fade en
   ambos bordes para que el mercado se disipe suavemente en vez de
   recortarse. Anzuelo, no ruido. */
.muro-blur{
  position:absolute;top:56px;left:0;right:0;bottom:0;z-index:1;
  filter:blur(10px);
  opacity:.18;
  pointer-events:none;
  padding:24px 22px 40px;
  overflow:hidden;
  transition:filter .5s var(--ease), opacity .5s var(--ease);
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 22%,#000 68%,transparent 100%);
          mask-image:linear-gradient(180deg,transparent 0%,#000 22%,#000 68%,transparent 100%);
}
.muro-blur.reveal{filter:blur(0);opacity:1;-webkit-mask-image:none;mask-image:none}
.muro-blur-panel{
  background:var(--surf);border:1.5px solid var(--brd2);border-radius:14px;
  overflow:hidden;
}
.muro-blur-h{
  display:flex;justify-content:space-between;padding:10px 15px;
  background:var(--surf2);border-bottom:1px solid var(--brd);
  font-size:.55rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink3);
}
.muro-blur-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 15px;border-bottom:1px solid var(--brd);
}
.muro-blur-row:last-child{border-bottom:none}
.muro-blur-mount{
  font-size:1.02rem;font-weight:800;color:var(--ink);
  font-variant-numeric:tabular-nums;letter-spacing:-.015em;
}
.muro-blur-tasa{
  font-size:.96rem;font-weight:800;color:var(--ink);
  font-variant-numeric:tabular-nums;
}

/* Al elegir, animar fade-out del contenido táctil */
#s-muro.leaving .sa{opacity:0;transition:opacity .4s var(--ease)}