/* La IA que contesta: el panel de la llave maestra en Apps (public/respondedor.js). Clases con el prefijo rsp-. */
.rsp { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 14px; align-items: start; margin-bottom: 24px; }
.rsp-aj { display: flex; flex-direction: column; gap: 14px; }
.rsp-ico { width: 44px; height: 44px; border-radius: 13px; background: var(--aurora-1); color: var(--aurora); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.rsp-ico .ic { width: 23px; height: 23px; }
.rsp-nm { font: 700 15px var(--fm); color: var(--azul-9); }
.rsp-campo { display: flex; flex-direction: column; gap: 6px; padding-top: 12px; border-top: 1px solid var(--linea-2); }
.rsp-t { font-size: 12px; font-weight: 700; color: var(--tinta-2); text-transform: uppercase; letter-spacing: .04em; }
.rsp-sel { width: auto; min-width: 84px; padding: 8px 10px; }
.rsp-horas { gap: 8px; }
.rsp-mc { display: flex; align-items: center; gap: 6px; }
.rsp-mc .ic { width: 14px; height: 14px; }
.rsp-res { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.rsp-cab .icb[disabled] { opacity: .35; pointer-events: none; }
.rsp-atras .ic { transform: rotate(180deg); }
.rsp-cab .small::first-letter { text-transform: uppercase; }
.rsp-ks { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 8px; }
.rsp-k { background: var(--hielo-2); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.rsp-k b { font: 800 22px/1.1 var(--fm); color: var(--azul-9); }
.rsp-k span { font-size: 11.5px; color: var(--suave); font-weight: 600; }
.rsp-k.verde b { color: var(--verde); } .rsp-k.ambar b { color: var(--ambar); } .rsp-k.rojo b { color: var(--rojo); }
.rsp-lista { display: flex; flex-direction: column; gap: 10px; }
.rsp-c { border: 1px solid var(--linea-2); border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.rsp-c-cab { width: 100%; gap: 8px; }
.rsp-quien { overflow-wrap: anywhere; }
.rsp-corte { color: var(--tinta-2); overflow-wrap: anywhere; }
.rsp-det { width: 100%; }
.rsp-det summary { cursor: pointer; color: var(--azul); font-weight: 600; }
.rsp-burbujas { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.rsp-b { align-self: flex-start; max-width: 100%; background: var(--hielo); border-radius: 12px 12px 12px 4px; padding: 7px 10px; font-size: 13px; display: flex; gap: 8px; align-items: baseline; }
.rsp-b span { overflow-wrap: anywhere; }
.rsp-b i { font-style: normal; font-size: 10.5px; color: var(--suave); white-space: nowrap; }
@media (max-width: 900px) { .rsp { grid-template-columns: minmax(0, 1fr); } }