/* Conversa com a Flora (doc 19 §26): folha que sobe de baixo no celular, cartão flutuante no computador.
   Tudo criado pelo assets/js/flora-chat.js; sem estilo inline (pronto para CSP). Cores do tema v2 (stylev2.css). */
.flora-chat{--fc-rosa:var(--brand,#C9447A);--fc-rosa-2:var(--brand-hover,#A8325F);--fc-tinta:var(--ink,#3B2A2F);--fc-tinta-2:var(--ink-2,#6E5A5F);
  --fc-papel:#FFFBF7;--fc-creme:#F6EFE6;--fc-salvia:#637352;--fc-salvia-claro:#EAF0E2;--fc-borda:var(--border-c,#F3DDE4);--fc-kb:0px;--fc-fonte:var(--font-body,'DM Sans',system-ui,sans-serif);
  position:fixed;z-index:1056;inset:auto max(18px,env(safe-area-inset-right)) calc(18px + var(--fc-kb)) auto;width:min(400px,calc(100vw - 36px));
  height:min(620px,calc(100dvh - 36px - var(--fc-kb)));display:flex;flex-direction:column;background:var(--fc-papel);color:var(--fc-tinta);
  border:1px solid var(--fc-borda);border-radius:24px;box-shadow:0 24px 60px rgba(59,42,47,.22),0 2px 6px rgba(59,42,47,.06);overflow:hidden;
  font:15px/1.45 var(--font-body,'DM Sans',system-ui,sans-serif);opacity:0;transform:translateY(16px) scale(.98);transform-origin:100% 100%;
  transition:opacity .22s ease,transform .26s cubic-bezier(.2,.8,.2,1)}
.flora-chat[hidden]{display:none}
.flora-chat--aberta{opacity:1;transform:none}
.flora-chat__fundo{position:fixed;inset:0;z-index:1055;background:rgba(59,42,47,.28);opacity:0;transition:opacity .22s}
.flora-chat__fundo[hidden]{display:none}
.flora-chat__fundo--on{opacity:1}

/* Cabeçalho: a carinha da Flora (recorte da própria folha de sprites) + nome + estado + menu + fechar. */
.flora-chat__topo{display:flex;align-items:center;gap:12px;padding:14px 12px 12px 16px;background:linear-gradient(180deg,#FFF4F7,var(--fc-papel));border-bottom:1px solid var(--fc-borda)}
.flora-chat__alca{display:none}
.flora-chat__rosto{flex:none;width:46px;height:46px;border-radius:50%;background:#F7EDE4 url(../img/flora/flora-rosto-v1.webp) center/cover no-repeat;
  box-shadow:inset 0 0 0 2px #fff,0 0 0 1px var(--fc-borda)}
.flora-chat__quem{flex:1;min-width:0}
.flora-chat__nome{margin:0;font:600 17px/1.2 var(--font-display,Fraunces,Georgia,serif);color:var(--fc-tinta)}
.flora-chat__estado{margin:2px 0 0;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--fc-salvia);display:flex;align-items:center;gap:6px}
.flora-chat__estado::before{content:"";width:7px;height:7px;border-radius:50%;background:#5FA463;box-shadow:0 0 0 3px rgba(95,164,99,.18)}
.flora-chat__acao{flex:none;width:40px;height:40px;border:0;border-radius:50%;background:transparent;color:var(--fc-tinta-2);display:grid;place-items:center;cursor:pointer}
.flora-chat__acao:hover,.flora-chat__acao:focus-visible{background:#fff;color:var(--fc-tinta)}
.flora-chat__acao svg{width:20px;height:20px}
.flora-chat__menu{position:absolute;top:62px;right:14px;z-index:2;min-width:220px;padding:6px;background:#fff;border:1px solid var(--fc-borda);border-radius:14px;box-shadow:0 12px 30px rgba(59,42,47,.16)}
.flora-chat__menu[hidden]{display:none}
.flora-chat__menu button,.flora-chat__menu a{display:block;width:100%;padding:10px 12px;border:0;border-radius:10px;background:transparent;color:var(--fc-tinta);font:500 14px/1.3 var(--fc-fonte);text-align:left;text-decoration:none;cursor:pointer}
.flora-chat__menu button:hover,.flora-chat__menu a:hover{background:#FFF4F7}

/* Mensagens */
.flora-chat__lista:focus{outline:none}
/* Coluna com rolagem: nada encolhe (sem isto, a fileira de cartões virava um risquinho). */
.flora-chat__lista>*{flex-shrink:0}
.flora-chat__lista{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:16px 14px 8px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.flora-chat__msg{max-width:86%;padding:10px 14px;border-radius:18px;white-space:pre-line;overflow-wrap:anywhere;animation:flora-chat-entra .24s ease both}
.flora-chat__msg--flora{align-self:flex-start;background:var(--fc-creme);border-bottom-left-radius:6px;color:var(--fc-tinta)}
.flora-chat__msg--pessoa{align-self:flex-end;background:var(--fc-rosa);color:#fff;border-bottom-right-radius:6px}
.flora-chat__msg--erro{background:#FCEBEA;color:#8A2A23}
.flora-chat__hora{display:block;margin-top:4px;font-size:11px;opacity:.6}
@keyframes flora-chat-entra{from{opacity:0;transform:translateY(6px)}}

.flora-chat__digitando{align-self:flex-start;display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--fc-creme);border-radius:18px;border-bottom-left-radius:6px;color:var(--fc-tinta-2);font-size:13px}
.flora-chat__digitando i{display:inline-flex;gap:3px}
.flora-chat__digitando i b{width:6px;height:6px;border-radius:50%;background:var(--fc-salvia);animation:flora-chat-ponto 1s infinite ease-in-out}
.flora-chat__digitando i b:nth-child(2){animation-delay:.15s}.flora-chat__digitando i b:nth-child(3){animation-delay:.3s}
@keyframes flora-chat-ponto{0%,80%,100%{transform:translateY(0);opacity:.45}40%{transform:translateY(-4px);opacity:1}}

/* Cartões de peças: carrossel na largura da conversa */
.flora-chat__cartoes{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 6px;margin:0 -14px;padding-left:14px;padding-right:14px;scrollbar-width:none}
.flora-chat__cartoes::-webkit-scrollbar{display:none}
.flora-chat__cartao{flex:none;width:148px;scroll-snap-align:start;background:#fff;border:1px solid var(--fc-borda);border-radius:16px;overflow:hidden;text-decoration:none;color:var(--fc-tinta);
  display:flex;flex-direction:column;transition:transform .15s ease,box-shadow .15s ease}
.flora-chat__cartao:hover,.flora-chat__cartao:focus-visible{transform:translateY(-2px);box-shadow:0 8px 20px rgba(59,42,47,.12)}
.flora-chat__cartao img{width:100%;aspect-ratio:1/1;object-fit:cover;background:#F7F1EA}
.flora-chat__cartao span{display:block;padding:8px 10px 0;font-size:13px;line-height:1.3;font-weight:500}
.flora-chat__cartao strong{display:block;padding:2px 10px 10px;font-size:14px;color:var(--fc-rosa-2)}
.flora-chat__cartao s{margin-left:4px;font-weight:400;color:var(--fc-tinta-2);font-size:12px}
.flora-chat__cartao em{display:block;margin:0 10px 10px;font-style:normal;font-size:11px;color:#8A2A23}

/* Sacola confirmada e botões de ação */
.flora-chat__sacola{align-self:flex-start;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border-radius:14px;background:var(--fc-salvia-claro);color:#3F5236;font-size:13px;max-width:92%}
.flora-chat__sacola svg{width:18px;height:18px;flex:none}
.flora-chat__sacola button{border:0;background:transparent;color:#2E5A2E;font:700 13px/1 var(--fc-fonte);text-decoration:underline;cursor:pointer;padding:4px 0}
.flora-chat__botoes{align-self:flex-start;display:flex;flex-wrap:wrap;gap:8px}
.flora-chat__botao{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:9px 14px;border-radius:999px;border:1px solid var(--fc-borda);background:#fff;color:var(--fc-tinta);font:600 13px/1.2 var(--fc-fonte);text-decoration:none}
.flora-chat__botao--equipe{background:#25D366;border-color:#25D366;color:#fff}
.flora-chat__botao--studio{background:var(--fc-tinta);border-color:var(--fc-tinta);color:#fff}
.flora-chat__botao:hover,.flora-chat__botao:focus-visible{filter:brightness(1.05);color:inherit}
.flora-chat__botao--equipe:hover,.flora-chat__botao--studio:hover{color:#fff}

/* Sugestões para começar */
.flora-chat__sugestoes{display:flex;flex-wrap:wrap;gap:8px;padding:0 14px 10px}
.flora-chat__sugestoes[hidden]{display:none}
.flora-chat__sugestoes button{border:1px solid var(--fc-borda);background:#fff;color:var(--fc-tinta);border-radius:999px;padding:8px 12px;font:500 13px/1.2 var(--fc-fonte);cursor:pointer}
.flora-chat__sugestoes button:hover,.flora-chat__sugestoes button:focus-visible{border-color:var(--fc-rosa);color:var(--fc-rosa-2)}

/* Campo de escrever */
.flora-chat__escrever{display:flex;align-items:flex-end;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--fc-borda);background:#fff}
.flora-chat__campo{flex:1;min-height:44px;max-height:120px;resize:none;overflow-y:hidden;border:1px solid var(--fc-borda);border-radius:22px;padding:11px 16px;font:16px/1.4 var(--fc-fonte);color:var(--fc-tinta);background:var(--fc-papel);outline:none}
.flora-chat__campo:focus{border-color:var(--fc-rosa);box-shadow:0 0 0 3px rgba(201,68,122,.12)}
.flora-chat__enviar{flex:none;width:44px;height:44px;border:0;border-radius:50%;background:var(--fc-rosa);color:#fff;display:grid;place-items:center;cursor:pointer;transition:transform .12s,background .15s}
.flora-chat__enviar:hover{background:var(--fc-rosa-2)}
.flora-chat__enviar:disabled{background:#E7C2CF;cursor:default}
.flora-chat__enviar svg{width:20px;height:20px}
.flora-chat__aviso{margin:0;padding:0 16px 8px;background:#fff;font-size:11px;color:var(--fc-tinta-2);text-align:center}
.flora-chat__sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Celular: folha que sobe de baixo, com alça; acompanha o teclado (var --fc-kb pelo visualViewport). */
@media (max-width:640px){
  .flora-chat{inset:auto 0 var(--fc-kb) 0;width:100%;height:min(86dvh,calc(100dvh - 40px - var(--fc-kb)));border-radius:24px 24px 0 0;border-bottom:0;transform:translateY(100%);transform-origin:50% 100%}
  .flora-chat--aberta{transform:none}
  .flora-chat__alca{display:block;position:absolute;top:7px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:2px;background:#E7C2CF}
  .flora-chat__topo{padding-top:18px}
  .flora-chat__msg{max-width:88%}
}
@media (max-height:520px) and (min-width:641px){.flora-chat{height:calc(100dvh - 24px);bottom:12px}}
/* A Flora em pé e o WhatsApp saem de cena enquanto a conversa está aberta. */
html.flora-chat-aberta .flora-site,html.flora-chat-aberta .whatsapp-float,html.flora-chat-aberta .cart-float,html.flora-chat-aberta .flora-lancador{visibility:hidden}

/* Studio: "Ver no meu look" (veste as peças no avatar aberto) e o balão que chama a Flora no canto do palco. */
button.flora-chat__botao{cursor:pointer}
.flora-chat__botao--look{background:var(--fc-rosa);border-color:var(--fc-rosa);color:#fff}
.flora-chat__botao--look:hover,.flora-chat__botao--look:focus-visible{background:var(--fc-rosa-2);color:#fff}
.flora-lancador{position:absolute;left:12px;bottom:14px;z-index:4;display:flex;flex-direction:column-reverse;align-items:flex-start;gap:6px;padding:0;border:0;background:none;cursor:pointer;
  font-family:var(--font-body,'DM Sans',system-ui,sans-serif);-webkit-tap-highlight-color:transparent;animation:flora-lancador-entra .5s cubic-bezier(.2,.9,.3,1.3) 1.2s both}
.flora-lancador__rosto{flex:none;width:44px;height:44px;border-radius:50%;border:2px solid #fff;box-shadow:0 4px 14px rgba(107,59,74,.18);
  background:#F7EDE4 url(../img/flora/flora-rosto-v1.webp) center/cover no-repeat}
.flora-lancador__balao{position:relative;padding:6px 11px 7px;border-radius:14px 14px 14px 4px;background:#fff;color:#3B2A2F;
  border:1px solid #F0DFE5;box-shadow:0 6px 18px rgba(107,59,74,.14);font-size:11px;line-height:1.25;text-align:left;white-space:nowrap}
.flora-lancador__balao strong{display:block;color:var(--brand,#C9447A);font-size:12.5px}
/* Rabinho do balão apontando para o rosto, embaixo. */
.flora-lancador__balao::after{content:"";position:absolute;left:14px;bottom:-6px;width:10px;height:10px;background:#fff;border-right:1px solid #F0DFE5;border-bottom:1px solid #F0DFE5;transform:rotate(45deg)}
.flora-lancador:hover .flora-lancador__balao,.flora-lancador:focus-visible .flora-lancador__balao{border-color:#E7C2CF;transform:translateY(-1px)}
.flora-lancador:focus-visible{outline:none}.flora-lancador:focus-visible .flora-lancador__rosto{outline:2px solid var(--brand,#C9447A);outline-offset:2px}
body.modo-jogo .flora-lancador{bottom:36px;left:10px}
/* Duas posições: no celular (modo-jogo) no canto do palco; no computador, na faixa acima do palco (o palco é alto e o
   canto de baixo ficava fora da primeira tela). */
.flora-lancador--palco{display:none}
body.modo-jogo .flora-lancador--palco{display:flex}
body.modo-jogo .flora-lancador--barra{display:none}
.flora-lancador--barra{position:static;flex-direction:row;align-items:center;gap:8px;margin:0 12px 0 auto;animation-delay:.6s}
.flora-lancador--barra .flora-lancador__rosto{width:38px;height:38px}
.flora-lancador--barra .flora-lancador__balao{border-radius:14px 14px 14px 4px;padding:7px 12px;font-size:12px}
.flora-lancador--barra .flora-lancador__balao strong{display:inline;font-size:13px}
.flora-lancador--barra .flora-lancador__balao::after{left:-6px;bottom:9px;border-right:0;border-top:1px solid #F0DFE5;border-left:1px solid #F0DFE5;border-bottom:1px solid #F0DFE5;transform:rotate(45deg);border-color:#F0DFE5;border-top-color:transparent;border-right-color:transparent}
@keyframes flora-lancador-entra{from{opacity:0;transform:translateY(10px) scale(.92)}to{opacity:1;transform:none}}
@media (max-width:640px){html.flora-chat-aberta,html.flora-chat-aberta body{overflow:hidden}}
@media (prefers-reduced-motion:reduce){.flora-chat,.flora-chat__fundo,.flora-chat__msg,.flora-lancador{transition:none;animation:none}.flora-chat__digitando i b{animation:none}.flora-chat__lista{scroll-behavior:auto}}