.barra-a2a { grid-template-columns: 1fr auto 1fr; }
.barra-a2a > a { color: var(--acento); font-size: .85rem; }
.barra-a2a .idiomas { justify-self: end; }
.marco-a2a { width: min(58rem, calc(100% - 2rem)); margin: 2.5rem auto 4rem; }
.intro-a2a h1 { font-size: clamp(2rem, 4vw, 3.3rem); letter-spacing: -.045em; margin: .1rem 0 .45rem; }
.intro-a2a .claro { max-width: 44rem; }
.conexion-a2a { display: grid; grid-template-columns: 1fr 1fr auto; align-items: end; gap: .8rem; margin: 2rem 0; }
.conexion-a2a .campo { min-width: 0; }
.conexion-a2a .campo input { width: 100%; }
.conexion-a2a .pie { grid-column: 1 / -1; margin: 0; }
.conexion-a2a > a { grid-column: 1 / -1; width: fit-content; color: var(--acento); font-size: .85rem; }
.chat-a2a { border: 1px solid var(--borde); border-radius: 4px; box-shadow: var(--sombra); overflow: hidden; }
.chat-cabecera { display: flex; justify-content: space-between; align-items: start; gap: 1rem; padding: 1.1rem 1.3rem .5rem; }
.chat-cabecera h2 { margin: 0; font-size: 1.15rem; }
.chat-cabecera p { color: var(--tenue); font-size: .83rem; margin: .1rem 0; }
.chat-endpoint { color: var(--tenue); font-size: .78rem; margin: 0; padding: 0 1.3rem 1rem; overflow-wrap: anywhere; }
.chat-mensajes { display: flex; flex-direction: column; gap: .9rem; min-height: 13rem; max-height: 30rem; overflow-y: auto; padding: 1.3rem; background: var(--fondo-suave); border-block: 1px solid var(--borde); }
.chat-mensaje { max-width: min(85%, 40rem); border: 1px solid var(--borde); border-radius: 4px; background: white; padding: .75rem 1rem; overflow-wrap: anywhere; }
.chat-mensaje-user { align-self: end; background: var(--acento-suave); border-color: #e3c6c3; }
.chat-mensaje strong { display: block; color: var(--tenue); font-size: .7rem; letter-spacing: .07em; text-transform: uppercase; }
.chat-mensaje p { margin: .35rem 0 0; white-space: pre-wrap; }
.chat-mensaje details { margin-top: .7rem; font-size: .75rem; }
.chat-mensaje pre { max-height: 15rem; overflow: auto; white-space: pre-wrap; }
.chat-estado { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; padding: .75rem 1.3rem; border-bottom: 1px solid var(--borde); color: var(--tenue); font-size: .82rem; }
.chat-componer { display: grid; grid-template-columns: 1fr auto; gap: .55rem .8rem; padding: 1rem 1.3rem 1.3rem; align-items: end; }
.chat-componer label { grid-column: 1 / -1; font-size: .8rem; color: var(--tenue); }
.chat-componer textarea { width: 100%; resize: vertical; min-height: 4.5rem; border: 1px solid var(--borde); border-radius: 3px; padding: .65rem; font: inherit; }
.marco-a2a > .error { margin: 1rem 0; }
@media (max-width: 48rem) {
    .conexion-a2a { grid-template-columns: 1fr; }
    .conexion-a2a .pie { grid-column: 1; }
    .chat-cabecera { flex-direction: column; }
    .chat-mensaje { max-width: 95%; }
}