
.hp-ai {
  --hp-red: #b71923;
  --hp-red-deep: #821018;
  --hp-red-soft: #f7e9ea;
  --hp-gold: #f4b41f;
  --hp-ink: #202328;
  --hp-muted: #697077;
  --hp-card: #ffffff;
  position: fixed;
  right: 24px;
  bottom: 18px;
  z-index: 999999;
  color: var(--hp-ink);
  font: 14px/1.45 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.hp-ai *,
.hp-ai *::before,
.hp-ai *::after {
  box-sizing: border-box;
}

.hp-ai button,
.hp-ai input {
  font: inherit;
}

.hp-ai button:focus-visible,
.hp-ai a:focus-visible,
.hp-ai input:focus-visible {
  outline: 3px solid #f3b6bb;
  outline-offset: 3px;
}

/* =========================
   TORIBIO FLOTANTE
   ========================= */

.hp-toribio-launcher {
  position: relative;
  width: 390px;
  height: 280px;
  pointer-events: none;
  transition: width .3s ease, height .3s ease;
}

.hp-toribio-character,
.hp-toribio-bubble {
  pointer-events: auto;
}

.hp-toribio-glow {
  position: absolute;
  right: 10px;
  bottom: 2px;
  width: 190px;
  height: 190px;
  border-radius: 50%;
  background:
    radial-gradient(circle at center, rgba(183,25,35,.22) 0 26%, rgba(244,180,31,.11) 48%, transparent 72%);
  filter: blur(3px);
  animation: hp-toribio-glow 6.5s ease-in-out infinite;
}

.hp-toribio-character {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 185px;
  height: 250px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  transform-origin: 70% 100%;
  animation: hp-toribio-float 7.2s cubic-bezier(.45,.05,.55,.95) infinite;
  transition: transform .24s ease, opacity .24s ease, filter .24s ease;
}

.hp-toribio-character:hover {
  animation-play-state: paused;
  transform: translateY(-6px) rotate(-1.5deg) scale(1.04);
}

.hp-toribio-character.hp-toribio-greeting {
  animation: hp-toribio-greeting 2.6s cubic-bezier(.35,.05,.25,1) 1;
}

@keyframes hp-toribio-greeting {
  0%, 12%, 100% { transform: translateY(0) rotate(0deg) scale(1); }
  28% { transform: translateY(-4px) rotate(-1.1deg) scale(1.01); }
  42% { transform: translateY(-5px) rotate(1.25deg) scale(1.012); }
  56% { transform: translateY(-5px) rotate(-.75deg) scale(1.01); }
  70% { transform: translateY(-3px) rotate(.45deg) scale(1.006); }
  84% { transform: translateY(-1px) rotate(0deg) scale(1.002); }
}

.hp-toribio-image-wrap {
  position: absolute;
  inset: 0;
  display: block;
  overflow: hidden;
  border-radius: 44% 44% 28px 28px;
  filter: drop-shadow(0 15px 18px rgba(29,12,12,.23));
}

.hp-toribio-image-wrap::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 30%;
  background: linear-gradient(to bottom, transparent, rgba(255,255,255,.95) 72%, #fff 100%);
  pointer-events: none;
}

.hp-toribio-character img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 10%;
  transform: scale(1.16);
  transform-origin: 50% 10%;
  mix-blend-mode: multiply;
  user-select: none;
  -webkit-user-drag: none;
}

.hp-toribio-status {
  position: absolute;
  right: 18px;
  top: 20px;
  z-index: 3;
  width: 15px;
  height: 15px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #25c56a;
  box-shadow: 0 0 0 0 rgba(37,197,106,.55);
  animation: hp-toribio-status 3.6s infinite;
}

.hp-toribio-bubble {
  position: absolute;
  left: 0;
  bottom: 88px;
  width: 235px;
  min-height: 112px;
  padding: 15px 42px 14px 17px;
  border: 1px solid rgba(183,25,35,.12);
  border-radius: 22px 22px 5px 22px;
  background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(145deg, rgba(183,25,35,.4), rgba(244,180,31,.35)) border-box;
  box-shadow: 0 16px 38px rgba(54,15,18,.18), 0 3px 8px rgba(0,0,0,.07);
  color: var(--hp-ink);
  text-align: left;
  cursor: pointer;
  animation: hp-toribio-bubble-in .6s cubic-bezier(.2,.8,.2,1) both;
  transition: transform .2s ease, box-shadow .2s ease;
}

.hp-toribio-bubble:hover {
  transform: translateY(-3px);
  box-shadow: 0 19px 42px rgba(54,15,18,.23), 0 4px 10px rgba(0,0,0,.08);
}

.hp-toribio-bubble::after {
  content: "";
  position: absolute;
  right: -14px;
  bottom: 20px;
  width: 28px;
  height: 28px;
  background: #fff;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}

.hp-toribio-bubble-kicker {
  display: block;
  margin-bottom: 4px;
  color: var(--hp-red);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .09em;
}

.hp-toribio-bubble-title {
  display: block;
  margin-bottom: 5px;
  color: #241f20;
  font-size: 16px;
  line-height: 1.2;
}

.hp-toribio-bubble-message {
  display: block;
  color: #5f6268;
  font-size: 12px;
  line-height: 1.4;
  transition: opacity .18s ease, transform .18s ease;
}

.hp-toribio-bubble-message.hp-toribio-bubble-fade {
  opacity: 0;
  transform: translateY(4px);
}

.hp-toribio-bubble-arrow {
  position: absolute;
  right: 15px;
  top: 50%;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  margin-top: -13px;
  border-radius: 50%;
  background: var(--hp-red);
  color: #fff;
  font-size: 15px;
  font-weight: 900;
}

.hp-toribio-launcher-open {
  width: 120px;
  height: 115px;
}

.hp-toribio-launcher-open .hp-toribio-bubble,
.hp-toribio-launcher-open .hp-toribio-glow {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.hp-toribio-launcher-open .hp-toribio-character {
  width: 92px;
  height: 112px;
  right: 0;
  bottom: 0;
  animation: hp-toribio-mini 7s ease-in-out infinite;
}

.hp-toribio-launcher-open .hp-toribio-status {
  width: 13px;
  height: 13px;
  right: 7px;
  top: 7px;
}

/* =========================
   PANEL DE CHAT
   ========================= */

.hp-ai-panel {
  position: absolute;
  right: 0;
  bottom: 126px;
  display: flex;
  flex-direction: column;
  width: min(410px, calc(100vw - 28px));
  height: min(610px, calc(100dvh - 154px));
  min-height: 360px;
  overflow: hidden;
  border: 1px solid #eadfe0;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 26px 75px rgba(43,12,15,.3), 0 6px 18px rgba(0,0,0,.08);
  transform-origin: 90% 100%;
  animation: hp-ai-panel-in .28s cubic-bezier(.2,.8,.2,1);
}

.hp-ai-panel[hidden] {
  display: none;
}

.hp-ai .hp-ai-header {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 78px;
  padding: 12px 15px;
  background:
    radial-gradient(circle at 92% -10%, rgba(244,180,31,.36), transparent 34%),
    linear-gradient(120deg, var(--hp-red-deep), var(--hp-red));
  color: #fff;
  flex: none;
}

.hp-ai-avatar {
  display: grid;
  place-items: center;
  width: 50px;
  height: 50px;
  overflow: hidden;
  border: 2px solid rgba(255,255,255,.78);
  border-radius: 50%;
  background: #fff;
  flex: none;
  box-shadow: 0 4px 12px rgba(0,0,0,.18);
}

.hp-ai-avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 10%;
  transform: scale(1.2);
  mix-blend-mode: multiply;
}

.hp-ai-heading {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.22;
}

.hp-ai-heading strong {
  color: #fff;
  font-size: 18px;
  font-weight: 850;
}

.hp-ai-heading small {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
  color: #fff;
  font-size: 11px;
  opacity: .94;
}

.hp-ai-online-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #5df29a;
  box-shadow: 0 0 0 3px rgba(93,242,154,.16);
}

.hp-ai-close {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin-left: auto;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: rgba(255,255,255,.14);
  color: #fff;
  font-size: 25px !important;
  line-height: 1;
  cursor: pointer;
}

.hp-ai-close:hover {
  background: rgba(255,255,255,.26);
}

.hp-ai-welcome {
  display: grid;
  gap: 3px;
  padding: 12px 16px;
  border-bottom: 1px solid #f0e7e7;
  background: linear-gradient(135deg,#fff8f8,#fffdf7);
  color: #4e4244;
  flex: none;
}

.hp-ai-welcome strong {
  color: var(--hp-red);
  font-size: 13px;
}

.hp-ai-welcome span {
  font-size: 11px;
  line-height: 1.45;
}

.hp-ai-messages {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 16px 15px 10px;
  background:
    radial-gradient(circle at 90% 5%, rgba(183,25,35,.035), transparent 28%),
    #fbf8f7;
  overscroll-behavior: contain;
}

.hp-ai-line {
  max-width: 88%;
  width: fit-content;
  margin: 0 0 11px;
  padding: 11px 13px;
  border-radius: 16px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  line-height: 1.5;
}

.hp-ai-assistant {
  border: 1px solid #eee5e3;
  border-bottom-left-radius: 5px;
  background: #fff;
  box-shadow: 0 3px 9px rgba(41,24,23,.05);
}

.hp-ai-user {
  margin-left: auto;
  border-bottom-right-radius: 5px;
  background: linear-gradient(135deg,var(--hp-red),var(--hp-red-deep));
  color: #fff;
  box-shadow: 0 4px 10px rgba(135,16,25,.16);
}

.hp-ai-product {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 0 0 9px;
  padding: 9px;
  border: 1px solid #eee4e2;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 3px 10px rgba(41,24,23,.05);
  color: var(--hp-ink) !important;
  text-decoration: none !important;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.hp-ai-product:hover {
  border-color: #d7a4a8;
  transform: translateY(-2px);
  box-shadow: 0 7px 18px rgba(74,23,27,.1);
}

.hp-ai-product img {
  width: 64px;
  height: 64px;
  flex: none;
  object-fit: cover;
  border-radius: 11px;
  background: #f6f1ef;
}

.hp-ai-product span {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.hp-ai-product strong {
  color: var(--hp-ink);
  font-size: 13px;
  line-height: 1.3;
}

.hp-ai-product small {
  color: var(--hp-muted);
  font-size: 12px;
}

.hp-ai-product .hp-ai-buy-label {
  margin-top: 2px;
  color: var(--hp-red);
  font-weight: 800;
}

.hp-ai-location {
  display: grid;
  gap: 3px;
  margin: 0 0 9px;
  padding: 11px 12px;
  border: 1px solid #eadfe0;
  border-radius: 14px;
  background: #fff;
  color: var(--hp-ink) !important;
  text-decoration: none !important;
}

.hp-ai-location strong {
  font-size: 13px;
}

.hp-ai-location small {
  color: var(--hp-muted);
  font-size: 12px;
}

.hp-ai-location span {
  color: var(--hp-red);
  font-size: 12px;
  font-weight: 800;
}

.hp-ai-whatsapp {
  display: block;
  margin: 10px 0 14px;
  padding: 10px 12px;
  border: 1px solid #b8dec5;
  border-radius: 11px;
  background: #eef9f1;
  color: #176537 !important;
  text-align: center;
  text-decoration: none !important;
  font-weight: 750;
}

.hp-ai-suggestions {
  display: flex;
  gap: 7px;
  padding: 8px 12px 2px;
  overflow-x: auto;
  background: #fff;
  flex: none;
  scrollbar-width: none;
}

.hp-ai-suggestions::-webkit-scrollbar {
  display: none;
}

.hp-ai-suggestions button {
  flex: none;
  padding: 7px 10px;
  border: 1px solid #eadadb;
  border-radius: 999px;
  background: #fff8f8;
  color: #6e3035;
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}

.hp-ai-suggestions button:hover {
  border-color: #d6a0a4;
  background: #fff0f1;
  transform: translateY(-1px);
}

.hp-ai-form {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 10px 12px 5px;
  background: #fff;
  flex: none;
}

.hp-ai-form input {
  flex: 1;
  min-width: 0;
  height: 44px;
  margin: 0;
  padding: 0 13px;
  border: 1px solid #ddd5d5;
  border-radius: 13px;
  background: #fff;
  color: var(--hp-ink);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.02);
  outline: none;
}

.hp-ai-form input:focus {
  border-color: var(--hp-red);
  box-shadow: 0 0 0 3px rgba(183,25,35,.08);
}

.hp-ai-form input::placeholder {
  color: #909399;
}

.hp-ai-form button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 88px;
  height: 44px;
  padding: 0 12px;
  border: 0;
  border-radius: 13px;
  background: linear-gradient(135deg,var(--hp-red),var(--hp-red-deep));
  color: #fff;
  font-weight: 800;
  cursor: pointer;
}

.hp-ai-form button svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.hp-ai-form button:disabled {
  opacity: .6;
  cursor: wait;
}

.hp-ai-note {
  margin: 0;
  padding: 5px 14px 10px;
  background: #fff;
  color: #8a8587;
  font-size: 9.5px;
  line-height: 1.3;
  text-align: center;
  flex: none;
}

.hp-ai-line.hp-ai-pending {
  min-width: 185px;
}

.hp-ai-typing {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #8e454b;
  font-weight: 650;
}

.hp-ai-typing i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  animation: hp-ai-typing-dot 1.15s ease-in-out infinite;
}

.hp-ai-typing i:nth-child(2) { animation-delay: .12s; }
.hp-ai-typing i:nth-child(3) { animation-delay: .24s; }

@keyframes hp-toribio-float {
  0%, 14%, 100% { transform: translateY(0) rotate(0deg) scale(1); }
  28% { transform: translateY(-4px) rotate(-0.35deg) scale(1.004); }
  42% { transform: translateY(-7px) rotate(0.45deg) scale(1.008); }
  56% { transform: translateY(-5px) rotate(0deg) scale(1.006); }
  72% { transform: translateY(-2px) rotate(-0.2deg) scale(1.002); }
  86% { transform: translateY(0) rotate(0deg) scale(1); }
}

@keyframes hp-toribio-mini {
  0%, 18%, 100% { transform: translateY(0) rotate(0deg); }
  42% { transform: translateY(-3px) rotate(.25deg); }
  65% { transform: translateY(-1px) rotate(-.15deg); }
}

@keyframes hp-toribio-glow {
  0%,100% { transform: scale(.96); opacity: .72; }
  50% { transform: scale(1.06); opacity: 1; }
}

@keyframes hp-toribio-status {
  0% { box-shadow: 0 0 0 0 rgba(37,197,106,.55); }
  70% { box-shadow: 0 0 0 8px rgba(37,197,106,0); }
  100% { box-shadow: 0 0 0 0 rgba(37,197,106,0); }
}

@keyframes hp-toribio-bubble-in {
  from { opacity: 0; transform: translateX(12px) translateY(10px) scale(.96); }
  to { opacity: 1; transform: translateX(0) translateY(0) scale(1); }
}

@keyframes hp-ai-panel-in {
  from { opacity: 0; transform: translateY(12px) scale(.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes hp-ai-typing-dot {
  0%,60%,100% { transform: translateY(0); opacity: .35; }
  30% { transform: translateY(-4px); opacity: 1; }
}

@media (max-width: 720px) {
  .hp-ai {
    right: 10px;
    bottom: max(8px, env(safe-area-inset-bottom));
  }

  .hp-toribio-launcher {
    width: 285px;
    height: 205px;
  }

  .hp-toribio-character {
    width: 128px;
    height: 182px;
  }

  .hp-toribio-glow {
    width: 135px;
    height: 135px;
  }

  .hp-toribio-bubble {
    width: 178px;
    min-height: 92px;
    bottom: 62px;
    padding: 12px 34px 11px 13px;
    border-radius: 18px 18px 5px 18px;
  }

  .hp-toribio-bubble-kicker {
    font-size: 8px;
  }

  .hp-toribio-bubble-title {
    font-size: 13px;
  }

  .hp-toribio-bubble-message {
    font-size: 10px;
  }

  .hp-toribio-bubble-arrow {
    right: 10px;
    width: 23px;
    height: 23px;
  }

  .hp-toribio-launcher-open {
    width: 84px;
    height: 92px;
  }

  .hp-toribio-launcher-open .hp-toribio-character {
    width: 72px;
    height: 88px;
  }

  .hp-ai-panel {
    position: fixed;
    right: 10px;
    bottom: calc(96px + env(safe-area-inset-bottom));
    width: calc(100vw - 20px);
    height: min(650px, calc(100dvh - 116px - env(safe-area-inset-bottom)));
    border-radius: 20px;
  }

  .hp-ai-welcome {
    padding: 10px 13px;
  }

  .hp-ai-form button span {
    display: none;
  }

  .hp-ai-form button {
    min-width: 46px;
    width: 46px;
    justify-content: center;
  }
}

@media (max-width: 380px) {
  .hp-toribio-launcher {
    width: 250px;
  }

  .hp-toribio-bubble {
    width: 158px;
  }

  .hp-toribio-character {
    width: 116px;
    height: 165px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hp-toribio-character,
  .hp-toribio-glow,
  .hp-toribio-status,
  .hp-toribio-bubble,
  .hp-ai-panel,
  .hp-ai-typing i {
    animation: none !important;
  }

  .hp-toribio-bubble,
  .hp-toribio-character,
  .hp-ai-product,
  .hp-ai-suggestions button {
    transition: none !important;
  }
}


/* ===== Toribio v0.9.0: personaje vivo por estados ===== */
.hp-toribio-image-wrap {
  overflow: visible !important;
}
.hp-toribio-pose {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  display: block;
  object-fit: contain !important;
  object-position: center bottom !important;
  transform: none !important;
  mix-blend-mode: normal !important;
  opacity: 1;
  transition: opacity .52s cubic-bezier(.22,.61,.36,1);
  will-change: opacity;
}
.hp-toribio-pose-b { opacity: 0; }

.hp-ai[data-toribio-pose="wave"] .hp-toribio-character {
  animation: hp-pose-wave 3.6s ease-in-out infinite !important;
}
.hp-ai[data-toribio-pose="thinking"] .hp-toribio-character {
  animation: hp-pose-thinking 4.8s ease-in-out infinite !important;
}
.hp-ai[data-toribio-pose="listening"] .hp-toribio-character {
  animation: hp-pose-listening 5.2s ease-in-out infinite !important;
}
.hp-ai[data-toribio-pose="pointing"] .hp-toribio-character {
  animation: hp-pose-pointing 4.2s ease-in-out infinite !important;
}
.hp-ai[data-toribio-pose="thumbsup"] .hp-toribio-character {
  animation: hp-pose-thumbsup 3.8s ease-in-out infinite !important;
}
.hp-ai[data-toribio-pose="idle"] .hp-toribio-character {
  animation: hp-pose-idle 6.8s ease-in-out infinite !important;
}

@keyframes hp-pose-idle {
  0%,100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-2px) scale(1.003); }
}
@keyframes hp-pose-wave {
  0%,100% { transform: translateY(0) rotate(0deg); }
  40% { transform: translateY(-4px) rotate(-.6deg); }
  65% { transform: translateY(-3px) rotate(.45deg); }
}
@keyframes hp-pose-thinking {
  0%,100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-2px) rotate(.28deg); }
}
@keyframes hp-pose-listening {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
@keyframes hp-pose-pointing {
  0%,100% { transform: translateX(0) translateY(0); }
  50% { transform: translateX(-3px) translateY(-2px); }
}
@keyframes hp-pose-thumbsup {
  0%,100% { transform: translateY(0) scale(1); }
  45% { transform: translateY(-3px) scale(1.007); }
}

/* Toribio 0.9.1: una textura continua; el movimiento está en el personaje. */
.hp-toribio-canvas{display:block;width:100%;height:100%;object-fit:contain}
.hp-toribio-image-wrap,.hp-toribio-character,.hp-toribio-pose{animation:none!important;transform:none!important}
.hp-toribio-image-wrap{aspect-ratio:2/3}
.hp-ai .hp-toribio-character{width:168px;height:252px}
.hp-ai .hp-toribio-image-wrap{width:100%;height:100%;aspect-ratio:auto;border-radius:0;inset:0}
.hp-ai .hp-toribio-image-wrap::after{display:none}
.hp-ai .hp-toribio-launcher-open .hp-toribio-character{width:64px;height:96px}
@media(max-width:600px){.hp-ai .hp-toribio-character{width:112px;height:168px}.hp-ai .hp-toribio-launcher-open .hp-toribio-character{width:56px;height:84px}}


/* =========================================================
   TORIBIO 0.9.4 — MOTOR CANVAS2D ESTABLE (SIN WEBGL)
   ========================================================= */
.hp-ai .hp-toribio-character{
  width:168px !important;
  height:252px !important;
  animation:none !important;
  transform:none !important;
}
.hp-ai .hp-toribio-image-wrap{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  overflow:visible !important;
  border-radius:0 !important;
  filter:none !important;
  animation:none !important;
  transform:none !important;
}
.hp-ai .hp-toribio-image-wrap::after{display:none !important}
.hp-ai .hp-toribio-fallback,
.hp-ai .hp-toribio-canvas{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  display:block !important;
}
.hp-ai .hp-toribio-fallback{
  z-index:1 !important;
  object-fit:contain !important;
  object-position:center bottom !important;
  transform:none !important;
  mix-blend-mode:normal !important;
  opacity:1 !important;
  visibility:visible !important;
  filter:drop-shadow(0 14px 16px rgba(29,12,12,.20));
}
.hp-ai .hp-toribio-canvas{
  z-index:2 !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  background:transparent !important;
}
.hp-ai .hp-toribio-launcher-open .hp-toribio-character{
  width:64px !important;
  height:96px !important;
}
@media(max-width:600px){
  .hp-ai .hp-toribio-character{width:112px !important;height:168px !important}
  .hp-ai .hp-toribio-launcher-open .hp-toribio-character{width:56px !important;height:84px !important}
}

/* 0.9.5: reserva de espacio y margen para gestos. */
.hp-ai .hp-toribio-fallback{padding:2%;box-sizing:border-box}
.hp-ai .hp-toribio-canvas{max-width:none!important;max-height:none!important}

/* 0.9.6: fixed frame; movement belongs only to the articulated pixels. */
.hp-ai .hp-toribio-launcher,.hp-ai .hp-toribio-character,
.hp-ai .hp-toribio-image-wrap,.hp-ai .hp-toribio-canvas{
 animation:none!important;transform:none!important;transition:none!important;
}
.hp-ai .hp-toribio-glow{animation:none!important;transform:none!important}
.hp-ai .hp-toribio-fallback{padding:5%!important}

/* 0.9.7: portrait in the header, from the original high-resolution image. */
.hp-ai .hp-ai-avatar{position:relative!important;overflow:hidden!important}
.hp-ai .hp-ai-avatar img{
 position:absolute!important;width:219.5122%!important;height:329.2683%!important;
 max-width:none!important;max-height:none!important;min-width:0!important;
 left:-63.4146%!important;top:-9.7561%!important;
 object-fit:fill!important;object-position:center!important;
 transform:none!important;mix-blend-mode:normal!important;
 filter:none!important;image-rendering:auto!important;
}

/* 0.9.8: left placement, above the existing WhatsApp button. */
.hp-ai{left:24px!important;right:auto!important;bottom:88px!important}
.hp-ai .hp-toribio-character{left:0!important;right:auto!important}
.hp-ai .hp-toribio-glow{left:0;right:auto}
.hp-ai .hp-toribio-bubble{left:auto;right:0;border-radius:22px 22px 22px 5px}
.hp-ai .hp-toribio-bubble::after{left:-14px;right:auto;clip-path:polygon(100% 0,100% 100%,0 50%)}
.hp-ai .hp-ai-panel{left:0;right:auto;bottom:112px;transform-origin:10% 100%;min-height:0;height:min(610px,calc(100dvh - 224px))}
@media(max-width:600px){
 .hp-ai{left:10px!important;bottom:calc(88px + env(safe-area-inset-bottom))!important}
 .hp-ai .hp-ai-panel{left:10px;right:auto;bottom:calc(184px + env(safe-area-inset-bottom));height:min(650px,calc(100dvh - 204px - env(safe-area-inset-bottom)))}
 .hp-ai .hp-toribio-bubble{border-radius:18px 18px 18px 5px}
}
