/* ============================================================
   NAWI · Asistente flotante — estilos compartidos (público + comando)
   ============================================================ */
.ai-fab { position: fixed; right: 18px; bottom: calc(84px + env(safe-area-inset-bottom, 0px)); z-index: 160; width: 54px; height: 54px;
  border-radius: 50%; border: 1px solid rgba(201,164,92,.5); cursor: pointer;
  background: linear-gradient(145deg, #1a1712, #0f0d0a);
  box-shadow: 0 8px 26px rgba(0,0,0,.5), 0 0 0 0 rgba(201,164,92,.35);
  display: flex; align-items: center; justify-content: center;
  transition: transform .18s ease, box-shadow .25s ease; }
.ai-fab:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(0,0,0,.55), 0 0 22px rgba(201,164,92,.28); }
.ai-fab.open { transform: rotate(45deg); }
.ai-fab-ic { font-size: 21px; color: var(--gold); line-height: 1; }

.ai-panel { position: fixed; right: 18px; bottom: calc(148px + env(safe-area-inset-bottom, 0px)); z-index: 170; width: min(380px, calc(100vw - 36px));
  height: min(520px, calc(100vh - 200px)); display: flex; flex-direction: column;
  background: var(--panel, #12100c); border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 20px 60px rgba(0,0,0,.6); overflow: hidden; }
.ai-panel.hidden { display: none; }
.ai-head { display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 12px 14px; border-bottom: 1px solid var(--line); flex: none; }
.ai-ttl { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--cream); }
.ai-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ok, #3CB478); flex: none; }
.ai-x { background: transparent; border: none; color: var(--muted); font-size: 15px; cursor: pointer; padding: 2px 6px; }
.ai-banner { padding: 9px 14px; background: rgba(201,164,92,.07); border-bottom: 1px solid var(--line);
  font-size: 11px; line-height: 1.5; color: var(--muted); flex: none; }
.ai-log { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.ai-msg { display: flex; }
.ai-msg.me { justify-content: flex-end; }
.ai-bubble { max-width: 84%; padding: 9px 12px; border-radius: 13px; font-size: 13px; line-height: 1.55;
  white-space: pre-wrap; word-break: break-word; }
.ai-msg.ai .ai-bubble { background: rgba(255,255,255,.05); border: 1px solid var(--line);
  color: var(--cream); border-bottom-left-radius: 4px; }
.ai-msg.me .ai-bubble { background: rgba(201,164,92,.16); border: 1px solid rgba(201,164,92,.32);
  color: var(--cream); border-bottom-right-radius: 4px; }
.ai-bar { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--line); flex: none; }
.ai-input { flex: 1; min-width: 0; background: rgba(255,255,255,.04); border: 1px solid var(--line);
  border-radius: 10px; padding: 9px 11px; color: var(--cream); font-size: 13px; font-family: inherit; }
.ai-input:focus { outline: none; border-color: rgba(201,164,92,.5); }
.ai-send { flex: none; width: 38px; border: 1px solid rgba(201,164,92,.4); border-radius: 10px;
  background: rgba(201,164,92,.14); color: var(--gold); font-size: 14px; cursor: pointer; }
.ai-send:hover { background: rgba(201,164,92,.24); }

@media (max-width: 480px) {
  .ai-panel { right: 10px; left: 10px; width: auto; bottom: calc(140px + env(safe-area-inset-bottom, 0px)); height: min(64vh, 460px); }
  .ai-fab { right: 14px; bottom: calc(80px + env(safe-area-inset-bottom, 0px)); width: 50px; height: 50px; }
}
/* El asistente no va en el PDF del certificado ni en ningún impreso. */
@media print { .ai-fab, .ai-panel { display: none !important; } }

/* El botón flotante lleva la marca NAWI (anillo + punto), no un emoji.
   El anillo gira despacio: está vivo, pero no distrae. */
.ai-fab-mark { width: 26px; height: 26px; }
.ai-fab-mark circle:nth-child(2) { transform-origin: 50% 50%; animation: ai-spin 8s linear infinite; }
@keyframes ai-spin { from { transform: rotate(-90deg); } to { transform: rotate(270deg); } }
@media (prefers-reduced-motion: reduce) { .ai-fab-mark circle:nth-child(2) { animation: none; } }
.ai-fab.open .ai-fab-mark { animation: none; }
.ai-name { font-weight: 600; letter-spacing: .02em; }