/* Tutorial guiado e "Como funciona" (web/assets/tour.js). Arquivo NOSSO.
   Mesmas cores do site: azul-noite, ouro da Liga e o rosto do GARRA. */
:root{
  --lfa-tour-noite:#0A1628; --lfa-tour-carta:#111E2E; --lfa-tour-linha:#22364d;
  --lfa-tour-tinta:#E8EDF5; --lfa-tour-fraca:#93A4BA; --lfa-tour-ouro:#F5C518;
  --lfa-tour-balao:#F7F9FC; --lfa-tour-balao-tinta:#0A1628; --lfa-tour-balao-fraca:#4A5A70;
}

/* O véu escurece a tela e o foco abre um buraco iluminado em volta do botão. */
.lfa-tour-veu{position:fixed;inset:0;z-index:9000;background:transparent}
.lfa-tour-foco{position:fixed;z-index:9001;border-radius:12px;pointer-events:none;
  box-shadow:0 0 0 3px var(--lfa-tour-ouro),0 0 0 9999px rgba(4,10,20,.74);
  transition:left .28s ease,top .28s ease,width .28s ease,height .28s ease}
.lfa-tour-foco::after{content:"";position:absolute;inset:-3px;border-radius:14px;border:3px solid var(--lfa-tour-ouro);
  animation:lfa-tour-pulso 1.6s ease-out infinite}
.lfa-tour-foco.sem-alvo{left:50%;top:50%;width:0;height:0;box-shadow:0 0 0 9999px rgba(4,10,20,.74)}
.lfa-tour-foco.sem-alvo::after{display:none}
@keyframes lfa-tour-pulso{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.06)}}

/* O balão de conversa. */
.lfa-tour-balao{position:fixed;z-index:9002;width:min(380px,calc(100vw - 32px));background:var(--lfa-tour-balao);
  color:var(--lfa-tour-balao-tinta);border-radius:16px;padding:16px 18px 14px;border:2px solid var(--lfa-tour-ouro);
  box-shadow:0 18px 50px rgba(0,0,0,.45);font:400 15px/1.5 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;outline:none}
.lfa-tour-cabeca{display:flex;align-items:center;gap:10px}
.lfa-tour-cabeca img{width:40px;height:40px;border-radius:50%;border:2px solid var(--lfa-tour-ouro);background:var(--lfa-tour-noite);flex:none}
.lfa-tour-quem{display:block;font:700 .95rem/1.1 Rajdhani,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.lfa-tour-conta{display:block;font-size:.78rem;color:var(--lfa-tour-balao-fraca);font-variant-numeric:tabular-nums}
.lfa-tour-titulo{margin:12px 0 4px;font:700 1.25rem/1.15 Rajdhani,system-ui,sans-serif;text-wrap:balance}
.lfa-tour-texto{margin:0;color:#1f2d40}
.lfa-tour-pontos{display:flex;gap:5px;margin-top:12px;flex-wrap:wrap}
.lfa-tour-pontos span{width:8px;height:8px;border-radius:50%;background:#cfd8e3}
.lfa-tour-pontos span.feito{background:#8a9bb0}
.lfa-tour-pontos span.agora{background:var(--lfa-tour-noite);width:22px;border-radius:4px}
.lfa-tour-botoes{display:flex;align-items:center;gap:8px;margin-top:14px;flex-wrap:wrap}
.lfa-tour-espaco{flex:1}
.lfa-tour-botoes button{min-height:42px;border-radius:10px;padding:8px 14px;font:600 .9rem/1 Inter,system-ui,sans-serif;cursor:pointer}
.lfa-tour-pular{background:transparent;border:0;color:var(--lfa-tour-balao-fraca);text-decoration:underline;padding-inline:4px !important}
.lfa-tour-voltar{background:#fff;border:1px solid #c5cfdb;color:var(--lfa-tour-balao-tinta)}
.lfa-tour-proximo{background:var(--lfa-tour-noite);border:1px solid var(--lfa-tour-noite);color:#fff}
.lfa-tour-botoes button:focus-visible{outline:3px solid var(--lfa-tour-ouro);outline-offset:2px}
.lfa-tour-seta{position:absolute;width:14px;height:14px;background:var(--lfa-tour-balao);transform:rotate(45deg)}
.lfa-tour-seta.em-cima{top:-9px;border-left:2px solid var(--lfa-tour-ouro);border-top:2px solid var(--lfa-tour-ouro)}
.lfa-tour-seta.embaixo{bottom:-9px;border-right:2px solid var(--lfa-tour-ouro);border-bottom:2px solid var(--lfa-tour-ouro)}
.lfa-tour-seta.some,.lfa-tour-balao.folha .lfa-tour-seta{display:none}
/* Celular: folha presa embaixo (ou em cima, quando o alvo está embaixo). */
.lfa-tour-balao.folha{left:12px !important;right:12px;width:auto;top:auto !important;bottom:calc(12px + env(safe-area-inset-bottom,0px))}
.lfa-tour-balao.folha.em-cima{bottom:auto;top:calc(12px + env(safe-area-inset-top,0px)) !important}

/* O painel "Como funciona". */
.lfa-ajuda{position:fixed;inset:0;z-index:8990;background:rgba(4,10,20,.6);display:flex;justify-content:flex-end}
.lfa-ajuda-caixa{width:min(440px,100%);height:100%;overflow-y:auto;background:var(--lfa-tour-carta);color:var(--lfa-tour-tinta);
  border-left:1px solid var(--lfa-tour-linha);padding:20px 20px calc(24px + env(safe-area-inset-bottom,0px));
  font:400 15px/1.55 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;animation:lfa-ajuda-entra .22s ease-out}
@keyframes lfa-ajuda-entra{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
.lfa-ajuda-topo{display:flex;gap:12px;align-items:center}
.lfa-ajuda-topo img{width:48px;height:48px;border-radius:50%;border:2px solid var(--lfa-tour-ouro);flex:none}
.lfa-ajuda-topo>div{flex:1;min-width:0}
.lfa-ajuda-olho{display:block;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--lfa-tour-ouro)}
.lfa-ajuda-topo h2{margin:0;font:700 1.35rem/1.15 Rajdhani,system-ui,sans-serif;text-wrap:balance}
.lfa-ajuda-x{width:44px;height:44px;border-radius:10px;border:1px solid var(--lfa-tour-linha);background:transparent;color:var(--lfa-tour-tinta);
  font-size:1.6rem;line-height:1;cursor:pointer;flex:none}
.lfa-ajuda-resumo{margin:16px 0 0;color:var(--lfa-tour-tinta)}
.lfa-ajuda-itens{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:2px}
.lfa-ajuda-itens li{display:grid;gap:2px;padding:10px 0;border-top:1px solid var(--lfa-tour-linha)}
.lfa-ajuda-itens b{font-weight:700;color:var(--lfa-tour-ouro)}
.lfa-ajuda-itens span{color:#c9d4e2;font-size:.92rem}
.lfa-ajuda-pe{margin-top:18px;display:grid;gap:12px}
.lfa-ajuda-pe p{margin:0;font-size:.85rem;color:var(--lfa-tour-fraca)}
.lfa-ajuda-pe a{color:var(--lfa-tour-ouro);overflow-wrap:anywhere}
.lfa-ajuda-tour{min-height:48px;border-radius:10px;border:0;background:var(--lfa-tour-ouro);color:var(--lfa-tour-noite);
  font:700 1rem/1.2 Inter,system-ui,sans-serif;cursor:pointer;padding:10px 14px}
.lfa-ajuda :focus-visible{outline:3px solid var(--lfa-tour-ouro);outline-offset:2px}
@media (max-width:640px){
  .lfa-ajuda{align-items:flex-end}
  .lfa-ajuda-caixa{height:auto;max-height:88vh;border-left:0;border-top:1px solid var(--lfa-tour-linha);border-radius:18px 18px 0 0;
    animation-name:lfa-ajuda-sobe}
  @keyframes lfa-ajuda-sobe{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
}

/* Botões "Como funciona". */
.lfa-como-funciona{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:4px 14px 4px 4px;border-radius:999px;white-space:nowrap;
  border:1px solid rgba(245,197,24,.55);background:rgba(245,197,24,.08);color:var(--lfa-tour-tinta);font:600 .88rem/1 Inter,system-ui,sans-serif;cursor:pointer}
.lfa-como-ic{width:30px;height:30px;border-radius:50%;border:1px solid var(--lfa-tour-ouro);flex:none}
.lfa-como-funciona:hover{background:rgba(245,197,24,.16)}
.lfa-como-funciona:focus-visible,.lfa-ajuda-flutuante:focus-visible{outline:3px solid var(--lfa-tour-ouro);outline-offset:2px}
.lfa-ajuda-flutuante{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:8980;display:flex;align-items:center;gap:8px;
  min-height:48px;padding:6px 16px 6px 6px;border-radius:999px;border:2px solid var(--lfa-tour-ouro);background:var(--lfa-tour-noite);color:#fff;
  font:700 .9rem/1 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 8px 26px rgba(0,0,0,.45)}
.lfa-ajuda-flutuante img{width:34px;height:34px;border-radius:50%}
@media (max-width:640px){.lfa-ajuda-flutuante span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .lfa-ajuda-flutuante{padding:6px}}
@media print{.lfa-ajuda-flutuante,.lfa-como-funciona{display:none !important}}
@media (prefers-reduced-motion:reduce){.lfa-tour-foco,.lfa-ajuda-caixa{transition:none;animation:none}.lfa-tour-foco::after{animation:none}}
/* Na barra do /plataforma: menor, e só o rosto do GARRA no celular. */
.lfa-como-funciona.compacto{min-height:34px;padding:3px 12px 3px 3px;font-size:.8rem;margin-right:6px}
.lfa-como-funciona.compacto .lfa-como-ic{width:26px;height:26px}
@media (max-width:640px){.lfa-como-funciona.compacto{padding:3px}.lfa-como-funciona.compacto span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}