:root {
  --fs-primary:          #1B3A6B;
  --fs-primary-dark:     #142d55;
  --fs-primary-light:    #e8eef7;
  --fs-accent:           #2563EB;
  --fs-accent-hover:     #1d4ed8;
  --fs-accent-light:     #EFF6FF;
  --fs-bg-app:           #F6F7F9;
  --fs-bg-surface:       #FFFFFF;
  --fs-bg-surface-2:     #FAFBFC;
  --fs-bg-sidebar:       #1B3A6B;
  --fs-text-primary:     #101828;
  --fs-text-secondary:   #475467;
  --fs-text-muted:       #98A2B3;
  --fs-text-white:       #FFFFFF;
  --fs-critica:          #DC2626;
  --fs-critica-bg:       #FEF2F2;
  --fs-alta:             #EA580C;
  --fs-alta-bg:          #FFF7ED;
  --fs-media:            #D97706;
  --fs-media-bg:         #FFFBEB;
  --fs-success:          #16A34A;
  --fs-success-bg:       #F0FDF4;
  --fs-error:            #DC2626;
  --fs-error-bg:         #FEF2F2;
  --fs-border:           #E4E7EC;
  --fs-border-strong:    #D0D5DD;

  /* Radio: mas suave que la version anterior (producto tipo Stripe/Linear) */
  --fs-radius-sm:        6px;
  --fs-radius:           10px;
  --fs-radius-lg:        14px;
  --fs-radius-pill:      999px;

  /* Sombras: mas difusas, menos opacas — "elevacion de producto" en vez
     de sombra de caja clasica. */
  --fs-shadow-sm:        0 1px 2px rgba(16,24,40,.05);
  --fs-shadow:           0 4px 12px -2px rgba(16,24,40,.08), 0 2px 4px -2px rgba(16,24,40,.05);
  --fs-shadow-lg:        0 12px 24px -4px rgba(16,24,40,.10), 0 4px 8px -4px rgba(16,24,40,.06);

  /* Espaciado: escala nombrada, evita valores sueltos en las reglas nuevas */
  --fs-space-1: 4px;
  --fs-space-2: 8px;
  --fs-space-3: 12px;
  --fs-space-4: 16px;
  --fs-space-5: 24px;
  --fs-space-6: 32px;
  --fs-space-7: 48px;

  --fs-transition:       150ms ease;
  --fs-transition-view:  200ms ease-out;
  --fs-sidebar-w:        240px;
  --fs-rail-w:           76px;
  --fs-bottomnav-h:      60px;
  --fs-topbar-h:         56px;
  --fs-gap:              24px;
  --fs-font:             'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --fs-text-xs:          11px;
  --fs-text-sm:          13px;
  --fs-text-base:        14px;
  --fs-text-md:          15px;
  --fs-text-lg:          18px;
  --fs-text-xl:          22px;
  --fs-text-2xl:         28px;

  /* Zona segura del sistema (notch/home indicator), 0 si el navegador
     no la soporta — preparacion para PWA standalone en iOS. */
  --fs-safe-bottom: env(safe-area-inset-bottom, 0px);
  --fs-safe-top:    env(safe-area-inset-top, 0px);
}

/* Un usuario con "reducir movimiento" activado no debe recibir ninguna
   transicion/animacion decorativa — accesibilidad, no solo gusto. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}
