/* =====================================================================
   FEMAC 2026 — v37 · Palpites flutuando sobre a foto misteriosa
   ===================================================================== */

/* O loop antigo (texto embaixo do card) foi aposentado. */
.mystery-guess-loop{display:none!important}

.atracao .foto{position:relative}

.guess-float{
  position:absolute;inset:0;z-index:4;overflow:hidden;pointer-events:none;
  border-radius:inherit;
}

.guess-bubble{
  position:absolute;bottom:6%;display:block;max-width:64%;
}
.guess-bubble.is-left{left:5%}
.guess-bubble.is-right{right:5%}
.guess-bubble.is-center{left:50%;margin-left:-32%}

.guess-bubble__in{
  display:block;padding:.5rem .72rem;
  border:1px solid rgba(255,255,255,.18);
  border-radius:14px 14px 14px 4px;
  background:rgba(10,11,16,.72);
  -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
  box-shadow:0 12px 30px rgba(0,0,0,.4);
  color:#f2ece2;font-size:.68rem;font-style:normal;line-height:1.42;
  word-break:break-word;
  opacity:0;
  animation:guessRise var(--guess-life,7.2s) cubic-bezier(.22,.61,.36,1) forwards;
}
.guess-bubble.is-right .guess-bubble__in{border-radius:14px 14px 4px 14px}
.guess-bubble__in b{
  display:block;margin-bottom:2px;
  color:var(--guess-name-color,#f0a84a);font-size:.56rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;
}

@keyframes guessRise{
  0%   {opacity:0;transform:translate3d(0,26px,0) scale(.94)}
  12%  {opacity:1;transform:translate3d(0,0,0) scale(1)}
  72%  {opacity:1;transform:translate3d(var(--guess-drift,0),-96px,0) scale(1)}
  100% {opacity:0;transform:translate3d(var(--guess-drift,0),-142px,0) scale(.97)}
}

/* Fundo claro: o balão inverte para continuar legível. */
.foto--silhueta-bg-branco .guess-bubble__in{
  border-color:rgba(20,18,16,.14);
  background:rgba(255,255,255,.82);
  color:#221b16;
  box-shadow:0 12px 30px rgba(40,30,20,.18);
}
.foto--silhueta-bg-branco .guess-bubble__in b{color:var(--guess-name-color-light,#c2461a)}

/* Revelada: nunca mostra balão nem formulário. */
.atracao[data-atracao-estado="revelada"] .guess-float,
.atracao[data-atracao-estado="revelada"] .mystery-guess-zone{display:none!important}

@media (max-width:760px){
  .guess-bubble{max-width:74%}
  .guess-bubble.is-center{margin-left:-37%}
  .guess-bubble__in{font-size:.64rem}
}

@media (prefers-reduced-motion:reduce){
  .guess-bubble__in{animation:guessFade var(--guess-life,7.2s) linear forwards}
  @keyframes guessFade{0%{opacity:0}10%{opacity:1}80%{opacity:1}100%{opacity:0}}
}