/* A abertura (login, lead) e o link para a família.
 *
 * Só tokens do v9.css: nenhuma cor literal nova, para a abertura envelhecer junto
 * com o deck quando a marca mudar. Os três degraus de contraste da régua valem
 * aqui também: fundo escuro, painel acima dele com fio de destaque, e a opção
 * tocável mais um degrau acima, com borda. Cartão nunca na cor do fundo.
 */

#abGate{
  position:fixed; inset:0; z-index:90; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(1100px 700px at 18% 8%, rgba(60,72,128,.5), transparent 60%),
    radial-gradient(900px 620px at 86% 92%, rgba(156,118,90,.26), transparent 62%),
    var(--navy-9);
  padding:24px; transition:opacity .4s var(--ease), transform .4s var(--ease);
}
#abGate.fora{ opacity:0; transform:scale(1.02); pointer-events:none; }

.ab-box{
  width:min(460px,100%); padding:38px 34px 30px; border-radius:18px;
  background:var(--painel); box-shadow:var(--painel-borda), 0 30px 70px rgba(0,0,0,.45);
  font-family:var(--sans); color:var(--t2); text-align:center;
}
.ab-box h1{
  margin:0 0 8px; font-family:var(--display); font-weight:250; font-size:30px; line-height:1.15;
  color:var(--branco); letter-spacing:-.01em;
}
.ab-sub{ margin:0 0 22px; font-size:14.5px; line-height:1.5; color:var(--t3); }
.ab-erro{
  margin:0 0 18px; padding:10px 12px; border-radius:9px; font-size:13.5px;
  background:rgba(226,73,59,.14); color:var(--alerta-2); box-shadow:inset 0 0 0 1px rgba(226,73,59,.34);
}
.ab-simb{ width:46px; height:46px; margin:0 auto 18px; opacity:.9; }

.ab-box label{ display:block; text-align:left; margin-bottom:14px; font-size:11px;
  text-transform:uppercase; letter-spacing:.14em; color:var(--t3); }
.ab-box input{
  display:block; width:100%; margin-top:7px; padding:12px 14px; border:0; border-radius:10px;
  background:var(--op); box-shadow:var(--op-borda); color:var(--branco);
  font:400 15px/1.3 var(--sans); letter-spacing:normal; text-transform:none;
}
.ab-box input:focus{ outline:0; box-shadow:inset 0 0 0 1px var(--creme); }
#abBusca{ margin-bottom:14px; }

/* Botão com cara de botão: degradê que anda, e escuro sobre papel claro. */
.ab-cta{
  display:inline-block; padding:13px 22px; border:0; border-radius:11px; cursor:pointer;
  background:var(--grad-anda); background-size:220% 100%; color:var(--tinta);
  font:600 14.5px/1 var(--sans); letter-spacing:.01em;
  transition:background-position .5s var(--ease), transform .15s var(--ease), filter .2s;
}
.ab-cta:hover{ background-position:100% 0; transform:translateY(-1px); }
.ab-cta:disabled{ filter:saturate(.3) brightness(.8); cursor:default; transform:none; }
form .ab-cta{ width:100%; margin-top:6px; }
.ab-sec{ background:var(--op); box-shadow:var(--op-borda); color:var(--t2); }
.ab-sec:hover{ background:var(--op-h); }
.ab-zap{ background:linear-gradient(115deg,#2bb673 0%,#1f9e62 100%); color:#fff; }

.ab-nota{ margin:16px 0 0; font-size:12.5px; line-height:1.6; color:var(--t3); }
.ab-pe{ margin-top:20px; padding-top:14px; border-top:1px solid var(--linha); }
.ab-link{
  border:0; background:none; padding:0; cursor:pointer; font:inherit;
  color:var(--bronze-3); text-decoration:underline; text-underline-offset:2px;
}
.ab-link:hover{ color:var(--creme); }

/* A lista de leads: cada item é opção tocável, um degrau acima do painel. */
.ab-lista{ max-height:272px; overflow:auto; text-align:left; }
.ab-item{
  display:flex; justify-content:space-between; align-items:center; gap:12px;
  width:100%; margin-bottom:7px; padding:12px 14px; border:0; border-radius:10px; cursor:pointer;
  background:var(--op); box-shadow:var(--op-borda); color:var(--branco);
  font:400 14.5px/1.2 var(--sans); text-align:left;
  transition:background .2s var(--ease), transform .15s var(--ease);
}
.ab-item:hover{ background:var(--op-h); transform:translateX(2px); }
.ab-item b{ font-weight:500; }
.ab-item span{ font-size:12.5px; color:var(--t3); white-space:nowrap; }
.ab-novo{
  display:block; width:100%; margin-top:10px; padding:11px 14px; border:0; border-radius:10px; cursor:pointer;
  background:none; box-shadow:inset 0 0 0 1px var(--linha-b); color:var(--t3);
  font:400 13px/1.4 var(--sans); text-align:left;
}
.ab-novo:hover{ color:var(--t2); box-shadow:inset 0 0 0 1px var(--linha-f); }
.ab-novo b{ color:var(--bronze-3); font-weight:500; }

/* ── o painel do link ─────────────────────────────────────────────────────── */

#abLink{
  position:fixed; inset:0; z-index:95; display:none; align-items:center; justify-content:center;
  background:rgba(9,12,24,.76); padding:24px;
}
#abLink.on{ display:flex; }
.al-box{
  position:relative; width:min(520px,100%); padding:34px 32px 26px; border-radius:18px;
  background:var(--painel); box-shadow:var(--painel-borda), 0 30px 70px rgba(0,0,0,.5);
  font-family:var(--sans); color:var(--t2); text-align:center;
}
.al-box h2{
  margin:0 0 8px; font-family:var(--display); font-weight:250; font-size:26px;
  color:var(--branco); letter-spacing:-.01em;
}
.al-box input{
  width:100%; margin:4px 0 16px; padding:12px 14px; border:0; border-radius:10px;
  background:var(--navy-9); box-shadow:inset 0 0 0 1px var(--linha-b); color:var(--creme-1);
  font:400 13px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace; text-align:center;
}
.al-acoes{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.al-x{
  position:absolute; top:12px; right:14px; width:32px; height:32px; border:0; border-radius:50%;
  background:none; color:var(--t3); font-size:22px; line-height:1; cursor:pointer;
}
.al-x:hover{ background:var(--op); color:var(--branco); }

/* ── modo visitante ──────────────────────────────────────────────────────── */
/* O que registra resposta sai do alcance: a família recebeu para rever o que
 * montaram, não para refazer o diagnóstico. Navegar e girar o 3D continua livre. */

body.visita #ambOps,
body.visita .ops,
body.visita .faixas,
body.visita .regua,
body.visita input,
body.visita textarea,
body.visita .ficha-tags span,
body.visita #mtChips [data-tira]{ pointer-events:none; }
body.visita .q-grade button{ pointer-events:none; }

#abSync{
  position:fixed; bottom:10px; left:12px; z-index:60; padding:4px 9px; border-radius:7px;
  background:rgba(226,73,59,.16); box-shadow:inset 0 0 0 1px rgba(226,73,59,.3);
  color:var(--alerta-2); font:400 11px/1.4 var(--sans); letter-spacing:.04em; cursor:help;
}

@media (prefers-reduced-motion: reduce){
  #abGate, .ab-cta, .ab-item{ transition:none; }
}