/* ── Truly IA · el chat del sitio ───────────────────────────────────────────────
   Anatomía del widget de Cata (la que Pablo aprobó en Londri), vestida de Truly Nolen.
   Toda la ropa sale de los tokens: si cambia el cobalto, cambia el chat. */
/* El chat esconde piezas con `hidden` y les pone `display` propio: sin esta regla, el
   atributo pierde contra la clase y la invitación, el contador y el reinicio se ven siempre.
   Vive AQUÍ porque el chat también se usa fuera del sitio completo. */
.tia [hidden]{display:none!important}
.tia{position:fixed;right:clamp(16px,3vw,24px);bottom:clamp(16px,3vw,24px);z-index:40;display:flex;flex-direction:column;align-items:flex-end;gap:12px;font-family:var(--font-body)}
.tia-marca{position:relative;display:inline-grid;place-items:center;flex:0 0 auto;width:var(--tia-px);height:var(--tia-px);border-radius:50%;isolation:isolate}
.tia-disco{position:absolute;inset:0;border-radius:50%;background:radial-gradient(120% 120% at 30% 25%,var(--brand-yellow-light) 0%,var(--surface-accent) 55%,var(--brand-yellow) 100%);box-shadow:var(--shadow-panel)}
.tia-marca svg{position:relative;width:58%;height:58%;color:var(--brand-ink);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tia-marca--saludo svg{animation:tia-bob 1.1s var(--ease-out) 2}
.tia-marca--pensando svg{animation:tia-tap 1.1s ease-in-out infinite}
.tia-marca--pensando .tia-disco{animation:tia-late 1.6s ease-in-out infinite}
.tia-marca--celebrando svg{animation:tia-pop .7s var(--ease-out) both}
@keyframes tia-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-12%)}}
@keyframes tia-tap{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
@keyframes tia-late{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes tia-pop{0%{transform:scale(.7)}60%{transform:scale(1.15)}100%{transform:scale(1)}}
/* El lanzador: muta a ✕ al abrir, y late hasta el primer contacto. */
.tia-fab{position:relative;width:56px;height:56px;border-radius:50%;border:0;cursor:pointer;padding:0;background:var(--surface-deep);color:var(--surface-accent);display:grid;place-items:center;box-shadow:var(--shadow-panel);transition:background var(--duration-fast),transform var(--duration-fast);--focus-color:var(--brand-yellow)}
.tia-fab:hover{transform:translateY(-2px)}
.tia-fab svg{grid-area:1/1;width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--duration-slow),opacity var(--duration-fast)}
.tia-fab .tia-fx{width:16px;height:16px;opacity:0;transform:rotate(-90deg) scale(.5)}
.tia--on .tia-fab>svg:first-of-type{opacity:0;transform:rotate(90deg) scale(.5)}
.tia--on .tia-fab .tia-fx{opacity:1;transform:none}
.tia:not(.tia--on):not(.tia--quieta) .tia-fab:before{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;box-shadow:0 0 0 0 color-mix(in srgb,var(--brand-yellow) 60%,transparent);animation:tia-pulso 3.4s var(--ease-out) 1.2s infinite}
@keyframes tia-pulso{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--brand-yellow) 55%,transparent)}70%{box-shadow:0 0 0 16px transparent}100%{box-shadow:0 0 0 0 transparent}}
.tia-badge{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 6px;border-radius:var(--radius-pill);background:var(--surface-accent);color:var(--text-primary);font-family:var(--font-mono);font-size:11px;font-weight:600;display:grid;place-items:center;box-shadow:0 0 0 2px var(--surface-deep)}
/* La invitación, a los ~6 s y una sola vez. */
.tia-nudge{display:flex;align-items:center;gap:6px;background:var(--surface-page);border:1px solid var(--rule-subtle);border-radius:var(--radius-pill);padding:6px 6px 6px 10px;box-shadow:var(--shadow-panel);animation:tia-entra var(--duration-slow) var(--ease-out) both;max-width:min(84vw,320px)}
.tia-nudge-open{display:flex;align-items:center;gap:10px;border:0;background:none;cursor:pointer;text-align:left;font:inherit;color:var(--text-primary);padding:2px 4px}
.tia-nudge-open b{display:block;font-size:var(--type-label);font-weight:600}
.tia-nudge-open span span{display:block;font-size:var(--type-index);color:var(--text-muted)}
.tia-nudge-x{border:0;background:none;cursor:pointer;color:var(--text-muted);display:grid;place-items:center;width:24px;height:24px;border-radius:50%;order:2}
.tia-nudge-x:hover{background:var(--hover-subtle);color:var(--text-primary)}
.tia-nudge-x svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
@keyframes tia-entra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* El panel. */
.tia-panel{width:min(92vw,380px);height:min(70vh,560px);display:none;flex-direction:column;background:var(--surface-page);border:1px solid var(--rule-subtle);border-radius:var(--radius-panel);overflow:hidden;box-shadow:var(--shadow-panel)}
.tia--on .tia-panel{display:flex;animation:tia-entra var(--duration-slow) var(--ease-out) both}
.tia-head{display:flex;align-items:center;gap:10px;padding:12px 12px 12px 14px;background:var(--surface-deep);color:var(--text-inverse)}
.tia-id{flex:1;min-width:0}
.tia-id b{display:block;font-family:var(--font-display);font-size:var(--type-label);font-weight:600}
.tia-stat{display:flex;align-items:center;gap:6px;font-size:var(--type-index);color:var(--text-inverse-muted)}
.tia-stat i{width:7px;height:7px;border-radius:50%;background:var(--surface-accent)}
.tia-x{border:0;background:none;cursor:pointer;color:var(--text-inverse-muted);width:30px;height:30px;display:grid;place-items:center;border-radius:50%;--focus-color:var(--brand-yellow)}
.tia-x:hover{background:var(--hover-inverse);color:var(--text-inverse)}
.tia-x svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.tia-body{flex:1;display:flex;flex-direction:column;min-height:0;background:var(--surface-soft)}
.tia-hilo{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;scroll-behavior:smooth}
.tia-msg{max-width:86%;padding:9px 12px;border-radius:var(--radius-panel);font-size:var(--type-label);line-height:1.5;background:var(--surface-page);border:1px solid var(--rule-subtle);color:var(--text-primary);white-space:pre-wrap;overflow-wrap:anywhere}
.tia-msg--yo{align-self:flex-end;background:var(--surface-deep);color:var(--text-inverse);border-color:transparent}
.tia-puntos{align-self:flex-start;display:flex;gap:4px;padding:11px 13px}
.tia-puntos i{width:6px;height:6px;border-radius:50%;background:var(--text-muted);animation:tia-punto 1.2s ease-in-out infinite}
.tia-puntos i:nth-child(2){animation-delay:.15s}.tia-puntos i:nth-child(3){animation-delay:.3s}
@keyframes tia-punto{0%,60%,100%{opacity:.28;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.tia-atajos{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 12px}
.tia-atajo{border:1px solid var(--rule-subtle);background:var(--surface-page);border-radius:var(--radius-pill);padding:7px 12px;font:inherit;font-size:var(--type-index);color:var(--text-primary);cursor:pointer;transition:border-color var(--duration-fast),transform var(--duration-fast)}
.tia-atajo:hover{border-color:var(--brand-cobalt);transform:translateY(-1px)}
.tia-form{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--rule-subtle);background:var(--surface-page)}
.tia-campo{flex:1;min-width:0;border:1px solid var(--rule-subtle);border-radius:var(--radius-pill);padding:10px 14px;font:inherit;font-size:16px;color:var(--text-primary);background:var(--surface-soft)}
.tia-campo:focus-visible{outline:none;border-color:var(--brand-cobalt);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand-cobalt) 22%,transparent)}
.tia-send{flex:0 0 auto;width:40px;height:40px;border:0;border-radius:50%;background:var(--brand-cobalt);color:var(--text-inverse);cursor:pointer;display:grid;place-items:center;transition:opacity var(--duration-fast)}
.tia-send[disabled]{opacity:.35;cursor:default}
.tia-send svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.tia-foot{display:flex;align-items:center;justify-content:center;padding:9px;border-top:1px solid var(--rule-subtle);background:var(--surface-page)}
.tia-wa{display:inline-flex;align-items:center;gap:7px;font-size:var(--type-index);color:var(--text-muted)}
.tia-wa:hover{color:var(--text-primary)}
.tia-wa svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8}
@media(max-width:700px){.tia{right:12px;bottom:12px;gap:9px}.tia-panel{width:calc(100vw - 24px);height:min(74vh,540px)}}
html:not(.js) .tia{display:none}
@media(prefers-reduced-motion:reduce){.tia-fab:before,.tia-marca svg,.tia-disco,.tia-puntos i{animation:none!important}.tia-nudge,.tia--on .tia-panel{animation:none!important}}