Feat: Agregar vista expandida de ResumenMuestra

Implementación completa de vista detallada para muestras:

Componentes nuevos:
- ResumenMuestraExpandido: Vista no compacta con valores claramente visibles
- ModalResumenExpandido: Modal reutilizable para mostrar vista expandida

Integraciones:
- Calculadora SCAA: Usa vista expandida en paso 3
- Página de sesión:
  * Long press en móvil (500ms) en header del accordion
  * Botón expandir en desktop cerca del título
  * Vibración háptica en móvil al activar

Características:
- Grid responsivo de intensidades afectivas
- Puntajes destacados (Σ y SCAA) con colores según valor
- Visualización clara de penalizaciones
- Diseño adaptativo móvil/desktop

nuxt4/app/pages/cata/sesion.vue

@@ -167,10 +167,25 @@
         >
           <!-- Header personalizado con ResumenMuestra -->
           <template #default="{ item }">
-            <CataResumenMuestra
-              :muestra="item.muestra"
-              :tab-activa="tabActiva"
-            />
+            <div
+              class="resumen-wrapper"
+              @touchstart="(e) => onTouchStart(e, item.muestra)"
+              @touchend="onTouchEnd"
+              @touchcancel="onTouchEnd"
+            >
+              <CataResumenMuestra
+                :muestra="item.muestra"
+                :tab-activa="tabActiva"
+              />
+              <!-- Botón para vista expandida (solo desktop) -->
+              <button
+                class="boton-expandir hidden sm:flex"
+                @click.stop="abrirVistaExpandida(item.muestra)"
+                title="Ver resumen detallado"
+              >
+                <UIcon name="i-lucide-expand" class="w-4 h-4" />
+              </button>
+            </div>
           </template>
 
           <!-- Content con FormularioMuestra -->
@@ -203,6 +218,13 @@
           />
         </button>
       </div>
+
+      <!-- Modal de vista expandida -->
+      <CataModalResumenExpandido
+        v-if="muestraExpandida"
+        v-model="mostrarModalExpandido"
+        :muestra="muestraExpandida"
+      />
     </div>
   </div>
 </template>
@@ -383,6 +405,37 @@ const toggleSubcategoria = (subcategoria: Subcategoria) => {
   actualizarSubcategorias(actuales)
 }
 
+// Modal de vista expandida
+const mostrarModalExpandido = ref(false)
+const muestraExpandida = ref<Muestra | null>(null)
+
+// Abrir vista expandida
+const abrirVistaExpandida = (muestra: Muestra) => {
+  muestraExpandida.value = muestra
+  mostrarModalExpandido.value = true
+}
+
+// Long press en móvil
+let longPressTimer: NodeJS.Timeout | null = null
+const LONG_PRESS_DURATION = 500 // ms
+
+const onTouchStart = (event: TouchEvent, muestra: Muestra) => {
+  longPressTimer = setTimeout(() => {
+    // Vibrar si está disponible
+    if (navigator.vibrate) {
+      navigator.vibrate(50)
+    }
+    abrirVistaExpandida(muestra)
+  }, LONG_PRESS_DURATION)
+}
+
+const onTouchEnd = () => {
+  if (longPressTimer) {
+    clearTimeout(longPressTimer)
+    longPressTimer = null
+  }
+}
+
 // Formatear fecha
 const formatearFecha = (fecha: string): string => {
   const date = new Date(fecha)
@@ -535,6 +588,45 @@ onMounted(() => {
   background-color: color-mix(in srgb, var(--cata-primary) 10%, transparent);
 }
 
+/* Wrapper de resumen con botón expandir */
+.resumen-wrapper {
+  position: relative;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  width: 100%;
+}
+
+.boton-expandir {
+  flex-shrink: 0;
+  padding: 0.5rem;
+  border-radius: 0.375rem;
+  background-color: color-mix(in srgb, var(--cata-primary) 10%, transparent);
+  border: 1px solid color-mix(in srgb, var(--cata-primary) 30%, transparent);
+  color: var(--cata-primary);
+  transition: all 0.2s ease;
+  cursor: pointer;
+  align-items: center;
+  justify-content: center;
+}
+
+.boton-expandir:hover {
+  background-color: color-mix(in srgb, var(--cata-primary) 20%, transparent);
+  transform: scale(1.05);
+}
+
+.boton-expandir:active {
+  transform: scale(0.95);
+}
+
+.dark .boton-expandir {
+  background-color: color-mix(in srgb, var(--cata-primary) 15%, transparent);
+}
+
+.dark .boton-expandir:hover {
+  background-color: color-mix(in srgb, var(--cata-primary) 25%, transparent);
+}
+
 /* Floating action button */
 .floating-action {
   position: fixed;