/* Ayuda de ChecaHub: botón flotante y panel de conversación */
.chh-fab {
  position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); z-index: 30;
  font: inherit; font-weight: 700; border: 0; cursor: pointer; border-radius: 999px; min-height: 52px; padding: 0 20px 0 16px;
  display: inline-flex; align-items: center; gap: 8px; background: var(--ink); color: var(--paper);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--ink) 30%, transparent);
}
.chh-fab svg { width: 22px; height: 22px; }
body.chh-low .chh-fab { bottom: calc(max(16px, env(safe-area-inset-bottom)) + 0px); }
.chh-panel { padding: 0 !important;
  position: fixed; z-index: 31; right: 16px; bottom: 16px; width: min(400px, calc(100vw - 32px)); height: min(620px, calc(100dvh - 32px));
  background: var(--sheet); border: 1px solid var(--rule); border-radius: var(--r-l); display: grid; grid-template-rows: auto 1fr auto;
  box-shadow: 0 18px 48px color-mix(in srgb, var(--ink) 28%, transparent); overflow: hidden; animation: chh-in .2s ease-out;
}
@media (max-width: 560px) { .chh-panel { inset: 0; width: 100%; height: 100dvh; border-radius: 0; border: 0; } }
@keyframes chh-in { from { transform: translateY(16px); opacity: 0; } to { transform: none; opacity: 1; } }
.chh-head { display: flex; align-items: center; gap: 12px; padding: calc(12px + env(safe-area-inset-top)) 14px 12px 18px; background: var(--in); color: #fff; }
.chh-head div { flex: 1; display: grid; line-height: 1.25; }
.chh-head small { opacity: .85; }
.chh-head button { font: inherit; background: transparent; border: 1.5px solid rgba(255,255,255,.45); color: #fff; border-radius: var(--r-s); min-height: 40px; padding: 0 12px; cursor: pointer; }
.chh-log { overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; overscroll-behavior: contain; }
.chh-msg { max-width: 88%; padding: 10px 14px; border-radius: 16px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.chh-bot { background: var(--card); align-self: flex-start; border-bottom-left-radius: 4px; }
.chh-me { background: var(--in); color: #fff; align-self: flex-end; border-bottom-right-radius: 4px; }
.chh-bot strong { display: block; margin-bottom: 4px; }
.chh-chips { display: flex; flex-wrap: wrap; gap: 6px; align-self: flex-start; max-width: 100%; }
.chh-chip { font: inherit; font-size: .88rem; border: 1.5px solid var(--rule); background: var(--sheet); color: var(--ink); border-radius: 999px; padding: 6px 12px; cursor: pointer; text-align: left; min-height: 36px; }
.chh-chip:hover { border-color: var(--in); }
.chh-chip.primary { background: var(--in); color: #fff; border-color: var(--in); }
.chh-form { align-self: stretch; display: grid; gap: 8px; background: var(--card); padding: 14px; border-radius: 16px; }
.chh-form input, .chh-form textarea { min-height: 44px; }
.chh-form textarea { min-height: 90px; resize: vertical; }
.chh-form .hp { position: absolute; left: -9999px; }
.chh-input { display: flex; gap: 8px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid var(--rule); }
.chh-input input { flex: 1; }
.chh-input button { flex: none; }
.chh-typing { color: var(--ink-2); font-size: .9rem; align-self: flex-start; }