feat(admin): vista respuestas mejorada + vista detallada [admin]

/admin/responses: filtro survey dinámico (select, no hardcodeado),
paginación 50/página, link a vista detallada, conteos consistentes con
el filtro de preguntas permitidas (evita página fantasma al final).
/admin/responses/[id]: respuestas agrupadas por sección (derivado de
type='section', igual que el wizard — no existen section_number/
section_title, ver TECH-DEBT-011), instancias bajo "Familiar N".
RLS y exclusión de sensibles intactos en ambas vistas.

Fixes de revisión antes de cerrar: toggle expandir/colapsar movido a
un <button> real (evita anidar el link "Ver" dentro de un role=button),
formatDate/renderValue unificados en admin-format.ts, queries
independientes en paralelo (Promise.all).

app/admin/responses/responses-table.tsx

@@ -1,9 +1,11 @@
 'use client'
 
 import { useState } from 'react'
+import Link from 'next/link'
 
 export interface DisplayRow {
   key: string
+  responseId: string
   submissionNum: number
   isFirstInGroup: boolean
   date: string
@@ -14,7 +16,15 @@ export interface DisplayRow {
   sector: string
 }
 
-export function ResponsesTable({ rows }: { rows: DisplayRow[] }) {
+export function ResponsesTable({
+  rows,
+  surveyId,
+  page,
+}: {
+  rows: DisplayRow[]
+  surveyId?: string
+  page: number
+}) {
   const [expanded, setExpanded] = useState<Set<number>>(new Set())
 
   function toggle(submissionNum: number) {
@@ -26,6 +36,13 @@ export function ResponsesTable({ rows }: { rows: DisplayRow[] }) {
     })
   }
 
+  function detailHref(responseId: string): string {
+    const params = new URLSearchParams()
+    if (surveyId) params.set('survey_id', surveyId)
+    params.set('page', String(page))
+    return `/admin/responses/${responseId}?${params.toString()}`
+  }
+
   return (
     <table className="admin-table">
       <thead>
@@ -37,6 +54,7 @@ export function ResponsesTable({ rows }: { rows: DisplayRow[] }) {
           <th>Valor</th>
           <th className="admin-col-optional">Departamento</th>
           <th className="admin-col-optional">Sector</th>
+          <th>Ver</th>
         </tr>
       </thead>
       <tbody>
@@ -54,28 +72,32 @@ export function ResponsesTable({ rows }: { rows: DisplayRow[] }) {
               <tr
                 key={row.key}
                 className={trClass}
+                // Conveniencia para mouse — sin semántica ARIA en la fila (evita
+                // anidar un control interactivo real, el Link "Ver", dentro de un
+                // elemento expuesto como role="button" a lectores de pantalla).
+                // El toggle accesible por teclado vive en el <button> de abajo.
                 onClick={row.isFirstInGroup ? () => toggle(row.submissionNum) : undefined}
-                onKeyDown={
-                  row.isFirstInGroup
-                    ? (e) => {
-                        if (e.key === 'Enter' || e.key === ' ') {
-                          e.preventDefault()
-                          toggle(row.submissionNum)
-                        }
-                      }
-                    : undefined
-                }
-                role={row.isFirstInGroup ? 'button' : undefined}
-                tabIndex={row.isFirstInGroup ? 0 : undefined}
-                aria-expanded={row.isFirstInGroup ? isExpanded : undefined}
               >
                 <td>
-                  {row.isFirstInGroup && (
-                    <span className="admin-toggle-icon" aria-hidden="true">
-                      {isExpanded ? '▼' : '▶'}
-                    </span>
+                  {row.isFirstInGroup ? (
+                    <button
+                      type="button"
+                      className="admin-row-toggle-btn"
+                      onClick={(e) => {
+                        e.stopPropagation()
+                        toggle(row.submissionNum)
+                      }}
+                      aria-expanded={isExpanded}
+                      aria-label={isExpanded ? 'Colapsar respuesta' : 'Expandir respuesta'}
+                    >
+                      <span className="admin-toggle-icon" aria-hidden="true">
+                        {isExpanded ? '▼' : '▶'}
+                      </span>
+                      {row.submissionNum}
+                    </button>
+                  ) : (
+                    row.submissionNum
                   )}
-                  {row.submissionNum}
                 </td>
                 <td>{row.date}</td>
                 <td>{row.code}</td>
@@ -89,6 +111,13 @@ export function ResponsesTable({ rows }: { rows: DisplayRow[] }) {
                 </td>
                 <td className="admin-col-optional">{row.zone}</td>
                 <td className="admin-col-optional">{row.sector}</td>
+                <td onClick={(e) => e.stopPropagation()}>
+                  {row.isFirstInGroup && (
+                    <Link href={detailHref(row.responseId)} className="admin-action-link">
+                      Ver
+                    </Link>
+                  )}
+                </td>
               </tr>
             )
           })}