/* ficha.css — el <dialog> de un perfil.
   Se abre con showModal(), así que el fondo inerte, el foco atrapado y el
   cierre con Esc los pone el navegador; aquí solo está el aspecto. */

dialog.ficha{
  border:1px solid var(--line); border-radius:var(--radio); background:var(--card);
  color:var(--ink); padding:0; max-width:32rem; width:calc(100% - 2rem);
}
dialog.ficha::backdrop{background:rgba(20,10,16,.5)}
dialog.ficha .contenido{padding:1.5rem}
dialog.ficha .cerrar{
  position:absolute; top:.6rem; right:.7rem; border:0; background:none;
  font-size:1.4rem; line-height:1; color:var(--muted); cursor:pointer; padding:.2rem .4rem;
}
dialog.ficha h3{margin-top:1.1rem}

/* La cabecera (avatar + nombre) y la fila de botones del pie: estaban en un
   `style=` dentro del JS y son estilo, no lógica. */
.ficha-cabeza{display:flex; gap:1rem; align-items:center; margin-bottom:1rem}
.ficha-acciones{display:flex; gap:.6rem; margin-top:1.25rem; flex-wrap:wrap}

/* «Busca: un café y conversar» */
.dato{display:flex; gap:.5rem; font-size:.92rem; margin-bottom:.35rem}
.dato .etiqueta{color:var(--muted); min-width:6.5rem}