/* ============ Pulso de trabajo — sistema de movimiento de Lurqiva ============
   Firma: un trazo lima que conecta selección → contexto → confirmación.
   Reglas: solo transform/opacity (más clip-path/trazo SVG en gráficos); los keyframes definen únicamente el estado de PARTIDA, de modo que sin animación
   (movimiento reducido, sin JS, animación cancelada) el elemento queda en su estado final natural. Nada depende de animationend/transitionend. */
:root{
  --mo-fast:120ms;          /* controles y confirmaciones: 100–180 ms */
  --mo-ctl:160ms;
  --mo-panel:220ms;         /* menús y paneles: 180–260 ms */
  --mo-brand:420ms;         /* composiciones de marca y gráficos: 300–500 ms */
  --mo-chart:360ms;
  --mo-ease:cubic-bezier(.2,.7,.2,1);      /* salida suave: entradas */
  --mo-ease-io:cubic-bezier(.45,0,.2,1);   /* continuidad: desplazamientos y trazos */
  --mo-shift:8px;           /* desplazamiento de entrada de paneles */
  --mo-shift-s:4px;         /* desplazamiento de controles y mensajes */
  --mo-stagger:45ms;        /* escalonamiento entre elementos hermanos */
  --mo-lime:var(--lime,#d9fa63);
}
:root[data-motion=reduced]{--mo-fast:.01ms;--mo-ctl:.01ms;--mo-panel:.01ms;--mo-brand:.01ms;--mo-chart:.01ms;--mo-shift:0px;--mo-shift-s:0px;--mo-stagger:0ms}

/* ---------- keyframes (solo estado de partida) ---------- */
@keyframes mo-rise{from{opacity:0;transform:translateY(var(--mo-shift))}}
@keyframes mo-lift{from{transform:translateY(var(--mo-shift-s))}}
@keyframes mo-rise-s{from{opacity:0;transform:translateY(var(--mo-shift-s))}}
@keyframes mo-pop{from{opacity:0;transform:translateY(calc(var(--mo-shift-s) * -1)) scale(.97)}}
@keyframes mo-pop-up{from{opacity:0;transform:translateY(var(--mo-shift-s)) scale(.97)}}
@keyframes mo-slide-r{from{opacity:0;transform:translateX(calc(var(--mo-shift) * -1))}}
@keyframes mo-fade{from{opacity:0}}
@keyframes mo-trace-x{from{transform:scaleX(0)}}
@keyframes mo-trace-y{from{transform:scaleY(0)}}
@keyframes mo-underline{from{transform:rotate(-.8deg) scaleX(0)}}
@keyframes mo-hl-line{from{transform:rotate(-1.2deg) scaleX(0)}}
@keyframes mo-flash{from{background-color:var(--lime);box-shadow:0 0 0 3px var(--lime)}}
@keyframes mo-bump{from{transform:scale(1.35)}}
@keyframes mo-draw{from{stroke-dashoffset:1}}
@keyframes mo-node{from{opacity:0;transform:scale(.3)}}
@keyframes mo-block{from{opacity:0;transform:translateY(12px)}}
@keyframes mo-wait{0%,100%{transform:scaleX(.15)}50%{transform:scaleX(1)}}

/* ---------- controles ---------- */
.btn,.icon-btn,.menu-item,.seg a,.rail nav a,.subnav a,.tabbar a,.drawer nav a,.menu-panel a,.jr-main,.af-ctl{transition:background-color var(--mo-fast) var(--mo-ease),color var(--mo-fast) var(--mo-ease),border-color var(--mo-fast) var(--mo-ease),transform var(--mo-fast) var(--mo-ease),box-shadow var(--mo-fast) var(--mo-ease)}
.btn:active:not(:disabled),.icon-btn:active{transform:translateY(1px) scale(.985)}
.af-ctl:focus-within{box-shadow:0 0 0 3px var(--lime-soft,rgba(217,250,99,.45))}

/* ---------- menús, búsqueda y navegación ---------- */
.menu[open]>.menu-panel{animation:mo-pop var(--mo-panel) var(--mo-ease);transform-origin:top right;will-change:transform,opacity}
.menu.up[open]>.menu-panel{animation-name:mo-pop-up;transform-origin:bottom left}
.rail .menu[open]>.menu-panel{animation-name:mo-slide-r;transform-origin:bottom left}
dialog#palette[open]{animation:mo-rise var(--mo-panel) var(--mo-ease);will-change:transform,opacity}
dialog#palette[open]::backdrop{animation:mo-fade var(--mo-panel) linear}
#palette li{transition:background-color var(--mo-fast) var(--mo-ease)}
#palette-results li{animation:mo-rise-s var(--mo-ctl) var(--mo-ease) backwards}
#palette-results li:nth-child(2){animation-delay:calc(var(--mo-stagger) * 1)}#palette-results li:nth-child(3){animation-delay:calc(var(--mo-stagger) * 2)}#palette-results li:nth-child(n+4){animation-delay:calc(var(--mo-stagger) * 3)}
@media(max-width:860px){
  .drawer{transition:transform var(--mo-panel) var(--mo-ease-io),visibility 0s linear var(--mo-panel)}
  body.nav-open .drawer{transition:transform var(--mo-panel) var(--mo-ease-io),visibility 0s}
  .side-backdrop{transition:opacity var(--mo-panel) linear}
}
/* llegada a una página desde la navegación: el trazo lima se dibuja bajo el título y la pastilla del área se asienta */
html.mo-arrive main h1:not(.plain)::after{transform-origin:left center;animation:mo-underline var(--mo-brand) var(--mo-ease-io) backwards}
html.mo-arrive .hl::after{transform-origin:left center;animation:mo-hl-line var(--mo-brand) var(--mo-ease-io) backwards;animation-delay:120ms}
html.mo-arrive .rail nav a[aria-current],html.mo-arrive .tabbar a[aria-current]{animation:mo-pop-up var(--mo-panel) var(--mo-ease) backwards}
html.mo-arrive .subnav a[aria-current]{animation:mo-rise-s var(--mo-ctl) var(--mo-ease) backwards}

/* ---------- confirmaciones y avisos (siempre con texto y rol accesibles) ---------- */
.flash{position:relative;overflow:hidden;animation:mo-rise var(--mo-panel) var(--mo-ease) backwards}
.flash::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--mo-lime);transform-origin:left center;animation:mo-trace-x var(--mo-brand) var(--mo-ease-io) backwards;animation-delay:80ms}
.flash.warn::after{background:#d99a1f}
.auth-alert{animation:mo-rise-s var(--mo-ctl) var(--mo-ease) backwards}
.mo-hl{animation:mo-flash 1.2s var(--mo-ease) 1;background-color:var(--lime-soft,rgba(217,250,99,.45));border-radius:4px;box-shadow:0 0 0 3px var(--lime-soft,rgba(217,250,99,.45))}
.count.mo-bump,[data-unread].mo-bump{animation:mo-bump var(--mo-ctl) var(--mo-ease)}
.net{transition:opacity var(--mo-ctl) linear}
.mo-trace{position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--mo-lime);transform-origin:left center;pointer-events:none;border-radius:99px}
.mo-wait{display:flex;align-items:center;gap:10px;margin:12px 0 0;color:var(--mut)}
.mo-wait .mo-bar{display:block;width:64px;height:3px;border-radius:99px;background:var(--mo-lime);transform-origin:left center;animation:mo-wait 1.1s var(--mo-ease-io) infinite}

/* ---------- Pulso, resultados y objetivos ---------- */
.stat,.panel{animation:mo-lift var(--mo-panel) var(--mo-ease) backwards} /* solo transform: el contenido principal se pinta de inmediato (no retrasa LCP) */
/* una actualización en vivo reemplaza el contenido: lo que no cambió no vuelve a animarse */
.mo-quiet :is(.stat,.panel,.mo-enter,.flash,.prop-list>li){animation:none}
.stat:nth-child(2){animation-delay:var(--mo-stagger)}.stat:nth-child(3){animation-delay:calc(var(--mo-stagger) * 2)}.stat:nth-child(n+4){animation-delay:calc(var(--mo-stagger) * 3)}

/* ---------- Oportunidades: selección → contexto ---------- */
.jr-item{position:relative}
html.mo-ready .jr-item.on::before{content:"";position:absolute;left:-1px;top:8px;bottom:8px;width:3px;border-radius:3px;background:var(--mo-lime);box-shadow:0 0 0 1px var(--ink);transform-origin:top center;animation:mo-trace-y var(--mo-panel) var(--mo-ease-io) backwards}
html.mo-ready #ctx .ctx-p:not([hidden]){animation:mo-lift var(--mo-panel) var(--mo-ease) backwards} /* solo transform: el contraste del contenido nunca queda a medias */
html.mo-ready .jr-item.on .ctx-m:not([hidden]){animation:mo-lift var(--mo-panel) var(--mo-ease) backwards}
.rec.mo-go li.cur::before{transform-origin:left center;animation:mo-trace-x var(--mo-brand) var(--mo-ease-io) backwards}
.rec.mo-go li.cur .pt{animation:mo-pop-up var(--mo-panel) var(--mo-ease) backwards;animation-delay:140ms}

/* ---------- Chat ---------- */
.msg.mo-in{animation:mo-rise-s var(--mo-ctl) var(--mo-ease) backwards}
#cx-side.mo-in,#cx-conv.mo-in{animation:mo-slide-r var(--mo-panel) var(--mo-ease) backwards}
#chat-typing{transition:opacity var(--mo-fast) linear}

/* ---------- Asistentes ---------- */
.mo-enter{animation:mo-rise var(--mo-panel) var(--mo-ease) backwards}
.mo-enter:nth-child(2){animation-delay:var(--mo-stagger)}.mo-enter:nth-child(3){animation-delay:calc(var(--mo-stagger) * 2)}.mo-enter:nth-child(n+4){animation-delay:calc(var(--mo-stagger) * 3)}
.prop-list>li{animation:mo-rise-s var(--mo-panel) var(--mo-ease) backwards}
.prop-list>li:nth-child(2){animation-delay:var(--mo-stagger)}.prop-list>li:nth-child(3){animation-delay:calc(var(--mo-stagger) * 2)}.prop-list>li:nth-child(n+4){animation-delay:calc(var(--mo-stagger) * 3)}

/* ---------- Transición entre vistas (agenda): fundido corto del documento ---------- */
::view-transition-old(root),::view-transition-new(root){animation-duration:var(--mo-panel);animation-timing-function:var(--mo-ease-io)}

/* ---------- composiciones de marca (SVG propias; el estado final es el natural) ---------- */
.mo-art{display:block;max-width:100%;height:auto;overflow:visible}
.mo-art .mo-line{fill:none;stroke-dasharray:1;stroke-linecap:round;stroke-linejoin:round;animation:mo-draw var(--mo-brand) var(--mo-ease-io) backwards;animation-delay:calc(var(--d,0) * 1ms)}
.mo-art .mo-node{transform-box:fill-box;transform-origin:center;animation:mo-node var(--mo-ctl) var(--mo-ease) backwards;animation-delay:calc(var(--d,0) * 1ms)}
.mo-art .mo-block{transform-box:fill-box;transform-origin:center bottom;animation:mo-block var(--mo-brand) var(--mo-ease) backwards;animation-delay:calc(var(--d,0) * 1ms)}
.auth-brand .mo-art{position:absolute;left:auto;right:clamp(24px,3.4vw,54px);bottom:clamp(16px,2.6vw,40px);z-index:2;width:min(190px,36%);pointer-events:none}
.auth-mark rect{transform-box:fill-box;transform-origin:center}
.auth-mark rect:first-child{animation:mo-block var(--mo-brand) var(--mo-ease) backwards}
.auth-mark rect:last-child{animation:mo-block var(--mo-brand) var(--mo-ease) backwards;animation-delay:120ms}
.auth-head h1{animation:mo-lift var(--mo-panel) var(--mo-ease) backwards;animation-delay:100ms}
.empty .mo-art{margin:0 auto 12px;width:132px}
.panel .mo-welcome{margin:0 0 12px;width:min(260px,100%)}
@media(max-width:860px){.auth-brand .mo-art{display:none}}

/* ---------- movimiento reducido: estado final inmediato, sin transiciones ni animaciones (la información no cambia) ---------- */
@media(prefers-reduced-motion:reduce){
  /* la regla global de app.css no alcanza a los pseudo-elementos: se completa acá */
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .btn:active:not(:disabled),.icon-btn:active{transform:none}
  .mo-wait .mo-bar{animation:none}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}
:root[data-motion=reduced] .mo-wait .mo-bar{animation:none}
:root[data-motion=reduced] *,:root[data-motion=reduced] *::before,:root[data-motion=reduced] *::after{animation:none!important;transition:none!important}
.mo-art .d0{--d:0}.mo-art .d1{--d:90}.mo-art .d2{--d:180}.mo-art .d3{--d:270}.mo-art .d4{--d:340}.mo-art .d5{--d:400}.mo-art .d6{--d:460}.mo-art .d7{--d:520}.mo-art .d8{--d:580}