/* ===== Transiciones NEXUS (hoja compartida) =====
   Se incluye en cada módulo justo antes de su <style>.
   Da vida a los cambios de pestaña y a la entrada de la vista. */
:root{--nx-ease:cubic-bezier(.2,.8,.2,1)}

/* .zone sigue posicionada: habia hijos absolutos apoyados en ella. */
.zone{position:relative}

/* Los bloques de la pestaña activa entran escalonados: desvanecido y un
   desplazamiento corto. Sin desenfoque, que era lo que hacia temblar la
   pantalla al entrar. */
.zone.on>*{animation:nx-card .34s var(--nx-ease) both}
.zone.on>*:nth-child(1){animation-delay:.02s}
.zone.on>*:nth-child(2){animation-delay:.05s}
.zone.on>*:nth-child(3){animation-delay:.08s}
.zone.on>*:nth-child(4){animation-delay:.11s}
.zone.on>*:nth-child(5){animation-delay:.14s}
.zone.on>*:nth-child(6){animation-delay:.17s}
.zone.on>*:nth-child(7){animation-delay:.20s}
@keyframes nx-card{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* El botón de pestaña recién activado da un pequeño "pop" */
.tabs button.on{animation:nx-tabpop .34s ease}
@keyframes nx-tabpop{0%{transform:translateY(1px)}55%{transform:translateY(-1.5px)}100%{transform:none}}

/* Filas de tabla: aparición rápida y escalonada al renderizar */
.tblWrap tbody tr{animation:nx-row .4s var(--nx-ease) both}
.tblWrap tbody tr:nth-child(1){animation-delay:.02s}
.tblWrap tbody tr:nth-child(2){animation-delay:.05s}
.tblWrap tbody tr:nth-child(3){animation-delay:.08s}
.tblWrap tbody tr:nth-child(4){animation-delay:.11s}
.tblWrap tbody tr:nth-child(5){animation-delay:.14s}
.tblWrap tbody tr:nth-child(6){animation-delay:.17s}
.tblWrap tbody tr:nth-child(7){animation-delay:.20s}
.tblWrap tbody tr:nth-child(8){animation-delay:.23s}
@keyframes nx-row{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}

/* Barras horizontales / rellenos que ya existan: leve realce al entrar */
.report{transition:box-shadow .3s,transform .3s}

/* ----- Microfeedback: check animado + pulso en los avisos (toast) ----- */
.toast .nx-chk{display:inline-flex;vertical-align:-3px;margin-right:7px}
.toast .nx-chk svg{width:16px;height:16px}
.toast .nx-chk path{stroke:#5fe0a0;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:26;stroke-dashoffset:26;animation:nx-draw .5s .05s ease forwards}
@keyframes nx-draw{to{stroke-dashoffset:0}}
.toast.nx-pulse{animation:nx-toastpop .42s ease}
@keyframes nx-toastpop{0%{transform:translateX(-50%) translateY(6px) scale(.96)}60%{transform:translateX(-50%) translateY(0) scale(1.03)}100%{transform:translateX(-50%) translateY(0) scale(1)}}

@media(prefers-reduced-motion:reduce){
  .zone.on>*,.tabs button.on,.tblWrap tbody tr,.toast.nx-pulse,.toast .nx-chk path{animation:none!important}
}