/* Marcadores i18n — invisíveis na tela */
.gqz-i18n{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden }
.gqz-data{ display:none !important; }

/* ── Overlay ── */
#gate-ov{
  position:fixed; inset:0;
  background:rgba(7,3,18,.72);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  z-index:999999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:16px;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

/* ── Card ── */
#gate-card{
  width:92%;
  max-width:540px;
  background:#fff;
  border-radius:24px;
  box-shadow:0 32px 80px rgba(0,0,0,.30);
  overflow:hidden;
}

/* ── Topo / barra de progresso ── */
.g-top{
  display:flex; align-items:center; gap:12px;
  padding:16px 20px 0;
}
.g-bar{
  flex:1; height:8px; border-radius:999px;
  background:#e9eaf2; overflow:hidden; position:relative;
}
.g-bar-fill{
  height:100%; width:50%; border-radius:999px;
  transition:width .4s ease;
}
.g-step{
  padding:2px 0 12px;
  color:#64748b; font-size:12px; font-weight:600;
  white-space:nowrap;
}

/* ── Seção conteúdo ── */
.g-sec{ padding:4px 20px 20px; }
.g-title{
  margin:0 0 16px;
  font-weight:800; font-size:21px; line-height:1.25;
  color:#0f172a;
}

/* ════════════════════════════════════════
   MODO BOTÕES — visual melhorado
   ════════════════════════════════════════ */
.g-opts{ display:grid; grid-template-columns:1fr; gap:12px; }

.g-mode-buttons .g-opt{
  display:block; width:100%; padding:0;
  border:2px solid #e2e8f0;
  border-radius:16px;
  background:#f8fafc;
  cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
  overflow:hidden;
  text-align:center;
}
.g-mode-buttons .g-opt:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(0,0,0,.10);
  border-color:#cbd5e1;
}
.g-mode-buttons .g-opt:active{ transform:translateY(0); }
.g-mode-buttons .g-opt-media{ display:none; }

.g-mode-buttons .g-opt-footer{
  display:flex; align-items:center; justify-content:center;
  min-height:58px;
  padding:14px 18px;
  background:transparent;
  color:#1e293b;
  font-size:17px; font-weight:700; line-height:1.3;
}

/* Primeiro botão: colorido por padrão */
.g-mode-buttons .g-opt:first-child{
  border-color:transparent;
  box-shadow:0 10px 28px rgba(0,0,0,.16);
}
.g-mode-buttons .g-opt:first-child .g-opt-footer{
  color:#fff;
}

/* Selecionado */
.g-mode-buttons .g-opt.sel{
  border-color:transparent;
  box-shadow:0 12px 32px rgba(0,0,0,.16);
}
.g-mode-buttons .g-opt.sel .g-opt-footer{
  color:#fff;
}

/* Não-selecionado (quando outro está selecionado): volta ao branco */
.g-mode-buttons.has-selection .g-opt:not(.sel){
  background:#f8fafc;
  border-color:#e2e8f0;
  box-shadow:none;
}
.g-mode-buttons.has-selection .g-opt:not(.sel) .g-opt-footer{
  color:#1e293b;
}

/* ════════════════════════════════════════
   MODO IMAGENS — visual melhorado
   ════════════════════════════════════════ */
.g-opts.g-opts-2col{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
@media (max-width:420px){ .g-opts.g-opts-2col{ gap:10px; } }

.g-opt{
  position:relative; display:block; width:100%; padding:0;
  border:2px solid #e5e7eb; border-radius:18px;
  background:#fff; cursor:pointer;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
  overflow:hidden; text-align:center;
}
.g-opt:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(0,0,0,.13);
  border-color:rgba(0,0,0,.14);
}
.g-opt:active{ transform:translateY(0); }
.g-opt.sel{
  border-color:transparent;
  box-shadow:0 16px 40px rgba(0,0,0,.18);
}

.g-opt-media img{
  display:block; width:100%; height:auto;
  aspect-ratio:4/5; object-fit:cover;
}

.g-opt-footer{
  display:flex; align-items:center; justify-content:center;
  min-height:58px; padding:12px 14px;
  font-weight:800; font-size:15px; letter-spacing:.2px;
  line-height:1.2; color:#fff;
}
.g-opt:hover .g-opt-footer{ filter:brightness(.97); }
.g-opt.sel .g-opt-footer{ filter:brightness(.92); }

@media (max-width:420px){
  .g-opt-footer{ min-height:52px; font-size:13px; }
  .g-opts-2col .g-opt-footer{ min-height:48px; font-size:12px; padding:10px; }
  .g-mode-buttons .g-opt-footer{ min-height:54px; font-size:15px; }
}

/* ── Loading ── */
#g-loading{
  display:none; text-align:center;
  padding:28px 20px 36px;
}
.g-loader{
  display:flex; justify-content:center; gap:10px;
  margin:0 0 16px;
}
.g-dot{
  width:11px; height:11px; border-radius:999px;
  background:#a78bfa; opacity:.7;
  animation:gqz-b 1s infinite;
}
.g-dot:nth-child(2){ animation-delay:.15s; }
.g-dot:nth-child(3){ animation-delay:.30s; }
@keyframes gqz-b{
  0%,80%,100%{ transform:scale(.55); }
  40%{ transform:scale(1); }
}
.g-loadmsg{
  font-weight:800; font-size:15px; color:#4c1d95;
}

/* ── Resultado ── */
#g-result{
  display:none;
  padding:16px 20px 26px;
}
.g-r-title{
  font-weight:800; font-size:22px; color:#0f172a;
  text-align:center; margin:0 0 18px; line-height:1.2;
}
.g-final{
  display:block; width:100%;
  text-align:center;
  padding:17px 20px;
  border-radius:16px;
  font-weight:800; font-size:17px;
  color:#fff;
  text-decoration:none;
  box-shadow:0 12px 28px rgba(0,0,0,.18), inset 0 -3px 0 rgba(0,0,0,.12);
  transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.g-final:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 36px rgba(0,0,0,.22), inset 0 -3px 0 rgba(0,0,0,.12);
}
.g-final:active{ transform:translateY(0); }

/* ── Desktop ── */
@media (min-width:768px){
  #gate-card{ width:86%; max-width:540px; }
  .g-title{ font-size:22px; }
}