refactor(ajustes): rebalanceo final de tarjetas para cerrar huecos externos

- Usuarios (alta) pasa a ancho completo; Mi sesion (baja) se empareja con
  Instalar app si es visible o con Acerca de si no
- con PWA visible: [Mi sesion | Instalar] y Acerca de a ancho completo
- patron 'altas a ancho completo, bajas emparejadas' anotado en la skill

Author: gnacho

app/src/pages/Ajustes.tsx

@@ -1654,37 +1654,38 @@ export default function Ajustes() {
           <NotificationsSection />
         </Section>
 
-        {userRole === 'admin' ? (
-          <div className="grid items-start gap-5 lg:grid-cols-2">
-            <Section id="sesion" title={t('ajustes.sections.sesion')}>
-              <SessionSection />
-            </Section>
-            <Section id="usuarios" title={t('ajustes.sections.usuarios')}>
-              <UsersSection />
-            </Section>
-          </div>
-        ) : (
-          <Section id="sesion" title={t('ajustes.sections.sesion')}>
-            <SessionSection />
+        {userRole === 'admin' && (
+          <Section id="usuarios" title={t('ajustes.sections.usuarios')}>
+            <UsersSection />
           </Section>
         )}
 
-        {/* PWA (solo si el navegador lo soporta) + Acerca de en la misma horizontal (≥lg).
-            Si la tarjeta de instalar no se renderiza, la fila colapsa a 1 columna:
-            nunca dejar una celda vacía al lado de Acerca de. */}
+        {/* Mi sesión (baja) se empareja con otra tarjeta baja: Instalar app si el
+            navegador la soporta, si no Acerca de. Con PWA visible, Acerca de va a
+            ancho completo al final. Nunca una tarjeta muy baja junto a una alta. */}
         {installState !== 'hidden' ? (
+          <>
+            <div className="grid items-start gap-5 lg:grid-cols-2">
+              <Section id="sesion" title={t('ajustes.sections.sesion')}>
+                <SessionSection />
+              </Section>
+              <Section id="app" title={t('ajustes.sections.app')}>
+                <InstallSection state={installState} install={install} />
+              </Section>
+            </div>
+            <Section id="acerca" title={t('ajustes.sections.acerca')}>
+              <AboutSection />
+            </Section>
+          </>
+        ) : (
           <div className="grid items-start gap-5 lg:grid-cols-2">
-            <Section id="app" title={t('ajustes.sections.app')}>
-              <InstallSection state={installState} install={install} />
+            <Section id="sesion" title={t('ajustes.sections.sesion')}>
+              <SessionSection />
             </Section>
             <Section id="acerca" title={t('ajustes.sections.acerca')}>
               <AboutSection />
             </Section>
           </div>
-        ) : (
-          <Section id="acerca" title={t('ajustes.sections.acerca')}>
-            <AboutSection />
-          </Section>
         )}
 
       </div>