/* Assistente animado (o cérebro do logo): ajuda com textos prontos, sem IA e sem custo */
.mascote { position: fixed; right: 14px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); z-index: 35; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; pointer-events: none; }
.mascote > * { pointer-events: auto; }
.mascote[hidden] { display: none; }
.mascote.entra { animation: mascote-entra .7s cubic-bezier(.2, 1.4, .4, 1) both; }

.mascote-corpo { position: relative; width: 68px; height: 68px; padding: 0; border: 0; border-radius: 50%; background: none; cursor: pointer; animation: mascote-flutua 4.2s ease-in-out infinite; filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .55)) drop-shadow(0 0 16px rgba(200, 62, 250, .45)); -webkit-tap-highlight-color: transparent; }
.mascote-corpo img { display: block; width: 100%; height: 100%; box-sizing: border-box; border: 2px solid rgba(255, 255, 255, .88); border-radius: 50%; background: #fff; }
.mascote-corpo:focus-visible { outline: 3px solid #E7A6FF; outline-offset: 3px; }
.mascote-corpo::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid rgba(231, 166, 255, .9); opacity: 0; pointer-events: none; }
.mascote.chama .mascote-corpo::after { animation: mascote-anel 1.8s ease-out infinite; }
.mascote.pula .mascote-corpo { animation: mascote-pula .75s ease; }
.mascote.fala .mascote-corpo { animation: mascote-fala .45s ease-in-out 3 alternate; }

.mascote-balao, .mascote-painel { position: relative; box-sizing: border-box; color: #f3ecff; background: linear-gradient(180deg, #241a36, #17111f); border: 1px solid rgba(231, 166, 255, .45); box-shadow: 0 14px 34px rgba(0, 0, 0, .6), 0 0 24px rgba(200, 62, 250, .22); font-size: .86rem; line-height: 1.5; }
.mascote-balao { max-width: min(300px, calc(100vw - 96px)); padding: 12px 34px 12px 14px; border-radius: 16px 16px 4px 16px; transform-origin: 90% 100%; animation: mascote-balao .35s cubic-bezier(.2, 1.3, .4, 1) both; }
.mascote-balao::after { content: ""; position: absolute; right: 22px; bottom: -8px; width: 14px; height: 14px; background: #17111f; border-right: 1px solid rgba(231, 166, 255, .45); border-bottom: 1px solid rgba(231, 166, 255, .45); transform: rotate(45deg); }
.mascote-balao p { margin: 0; }
.mascote-x { position: absolute; top: 6px; right: 8px; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #cbb8ea; font-size: 1.15rem; line-height: 1; cursor: pointer; }
.mascote-x:hover { background: rgba(255, 255, 255, .1); color: #fff; }

.mascote-painel { width: min(330px, calc(100vw - 28px)); max-height: min(62vh, 440px); overflow: auto; padding: 14px 14px 12px; border-radius: 18px 18px 6px 18px; transform-origin: 90% 100%; animation: mascote-balao .3s cubic-bezier(.2, 1.3, .4, 1) both; }
.mascote-painel h3 { margin: 0 24px 2px 0; font-size: 1rem; color: #fff; }
.mascote-painel .mascote-sub { margin: 0 0 8px; color: #cbb8ea; font-size: .8rem; }
.mascote-painel b { color: #E7A6FF; }
.mascote-item { display: block; width: 100%; margin-top: 6px; padding: 9px 12px; box-sizing: border-box; border: 1px solid rgba(255, 255, 255, .12); border-radius: 10px; background: rgba(255, 255, 255, .05); color: #f3ecff; font: inherit; text-align: left; cursor: pointer; transition: background .2s, border-color .2s; }
.mascote-item:hover, .mascote-item:focus-visible { background: linear-gradient(90deg, rgba(200, 62, 250, .35), rgba(124, 92, 255, .25)); border-color: rgba(231, 166, 255, .6); outline: none; }
.mascote-resp { margin: 8px 0 12px; padding: 10px 12px; border-left: 3px solid #C83EFA; border-radius: 0 10px 10px 0; background: rgba(255, 255, 255, .05); }
.mascote-acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.mascote-acoes .mascote-item { width: auto; margin-top: 0; flex: 1 1 auto; text-align: center; }
.mascote-rodape { display: block; margin: 10px 0 0 auto; padding: 4px 2px; border: 0; background: none; color: #a894c9; font: inherit; font-size: .76rem; text-decoration: underline; cursor: pointer; }
.mascote-rodape:hover { color: #fff; }

@keyframes mascote-flutua { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-7px) rotate(2deg); } }
@keyframes mascote-pula { 0% { transform: translateY(0) scale(1); } 20% { transform: translateY(0) scale(1.08, .9); } 45% { transform: translateY(-24px) scale(.95, 1.07); } 70% { transform: translateY(0) scale(1.06, .93); } 100% { transform: translateY(0) scale(1); } }
@keyframes mascote-fala { from { transform: translateY(-2px) rotate(-5deg) scale(1.03); } to { transform: translateY(-5px) rotate(5deg) scale(1.06); } }
@keyframes mascote-entra { from { opacity: 0; transform: translateY(90px) scale(.7); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes mascote-balao { from { opacity: 0; transform: scale(.6); } to { opacity: 1; transform: scale(1); } }
@keyframes mascote-anel { 0% { opacity: .9; transform: scale(1); } 100% { opacity: 0; transform: scale(1.5); } }

@media (max-width: 640px) {
  .mascote { right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); }
  .mascote-corpo { width: 58px; height: 58px; }
}
@media (prefers-reduced-motion: reduce) {
  .mascote, .mascote *, .mascote *::after { animation: none !important; transition: none !important; }
}
@media print { .mascote { display: none !important; } }