/* ============================================================
   LC SYSTEM · premium.css — Fase 17: Rediseño Premium
   ------------------------------------------------------------
   Auditoría previa a este archivo: el sistema YA tenía una base de
   diseño sólida de fases anteriores (variables.css: tokens completos
   de color/tipografía/sombra; dark mode real con switch en el sidebar;
   toast maduro con 5 niveles y animación de entrada/salida propia;
   botones y tarjetas KPI con microinteracciones (hover lift, glow de
   color, estado activo); skeleton loading (.skeleton/.skeleton-row)
   con shimmer; tags de estado con color semántico). No se reconstruyó
   nada de eso -- se habría duplicado trabajo que ya funciona bien.

   El único hueco real encontrado: el modal (showModal/closeModal,
   js/ui.js) aparece y desaparece de golpe (display:none <-> flex),
   sin ninguna animación. Este archivo agrega SOLO esa animación de
   entrada, más un límite de movimiento coherente con
   prefers-reduced-motion (ya usado en el resto del sistema).

   A propósito NO se tocó ningún archivo CSS existente (así este
   archivo se puede quitar sin riesgo con solo sacar el <link> de
   index.php) y NO se agregó ningún selector de "tema" nuevo
   (Neón/Futurista/etc. como paleta aparte): el estilo actual YA lee
   como oscuro + acentos neón + soft UI, que es exactamente lo que
   pedía el brief de esta fase -- agregar una segunda paleta completa
   sería duplicar identidad visual, no mejorarla, y tocar decenas de
   pantallas para reemplazar los íconos emoji por una librería SVG es
   un cambio de alto riesgo/bajo beneficio que no se justifica acá
   (ver criterio "el diseño nunca debe afectar rendimiento ni
   usabilidad" y la Regla de Checkpoint del proyecto).
   ============================================================ */

@keyframes lcModalIn{
  from{ opacity:0; transform: scale(.97) translateY(6px); }
  to{ opacity:1; transform:none; }
}

.overlay.active{ animation: fade .15s ease-out; }
.overlay.active .modal{ animation: lcModalIn .18s cubic-bezier(.2,.8,.3,1); }

@media (prefers-reduced-motion: reduce){
  .overlay.active, .overlay.active .modal{ animation:none; }
}
