/* "Qual foi o golpe?" — complementa estilo.css (usa as mesmas variáveis) */
.qg-form {
  background: var(--nevoa); border-radius: var(--raio); padding: 1.25rem;
  border-left: 6px solid var(--alerta); margin: 1.5rem 0;
}
.qg-form fieldset { border: 0; margin: 0 0 1.25rem; padding: 0; }
.qg-form legend, .qg-titulo { display: block; font-weight: 700; margin-bottom: .6rem; }
.qg-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.qg-chips label {
  display: inline-flex; align-items: center; gap: .45rem; cursor: pointer;
  padding: .55rem .85rem; border: 2px solid var(--linha); border-radius: 999px;
  background: var(--papel); font-size: 1rem; line-height: 1.2;
}
.qg-chips label:has(input:checked) { border-color: var(--tinta); box-shadow: inset 0 0 0 1px var(--tinta); }
.qg-chips input { width: 1.1rem; height: 1.1rem; margin: 0; accent-color: var(--tinta); }
.qg-chips input:focus-visible { outline: 3px solid var(--alerta); outline-offset: 2px; }
.qg-form textarea, .qg-form input[type="text"] {
  width: 100%; border: 2px solid var(--linha); border-radius: 8px; padding: .8rem;
  font: inherit; color: var(--tinta); background: var(--papel);
}
.qg-form textarea { resize: vertical; }
.qg-form textarea:focus-visible, .qg-form input[type="text"]:focus-visible { outline: 3px solid var(--alerta); outline-offset: 2px; }
.qg-dica { font-size: .9rem; color: var(--tinta-suave); margin: .35rem 0 1.25rem; }
.qg-form input[type="text"] { margin-bottom: .25rem; }

.qg-resultado { margin: 1.5rem 0; padding: 1.25rem; border-radius: var(--raio); background: var(--papel); border: 2px solid var(--linha); scroll-margin-top: 1rem; }
.qg-provavel { background: var(--golpe-fundo); border-color: var(--golpe); }
.qg-possivel { background: var(--atencao-fundo); border-color: var(--alerta); }
.qg-rotulo { margin: 0; font-size: .9rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-suave); }
.qg-provavel .veredito { color: var(--golpe); }
.qg-por-que { margin: 0 0 .75rem; font-weight: 700; }
.qg-outros { margin: .5rem 0 0; color: var(--tinta-suave); }
.qg-bloco { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--linha); }
.qg-bloco h3 { font: 800 1.15rem/1.25 var(--titulo); margin: 0 0 .5rem; }
.qg-bloco h3 + p { margin-top: 0; }
.qg-host { font-family: ui-monospace, Consolas, monospace; word-break: break-all; margin: 0 0 .5rem; }
.qg-alertas { list-style: none; padding: 0; margin: 0 0 .75rem; }
.qg-alertas li { padding: .55rem .75rem; border-radius: 8px; margin-bottom: .4rem; border-left: 5px solid var(--linha); background: var(--nevoa); }
.qg-alertas .qg-alerta-golpe { border-left-color: var(--golpe); font-weight: 700; }
.qg-alertas .qg-alerta-atencao { border-left-color: var(--alerta); }
.qg-alertas .qg-alerta-info { border-left-color: var(--tinta-suave); }
.qg-explica { font-size: .95rem; color: var(--tinta-suave); }
.qg-consultas { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.qg-consulta {
  display: block; padding: .7rem .9rem; border: 2px solid var(--tinta); border-radius: 8px;
  text-decoration: none; font-weight: 700; background: var(--papel);
}
.qg-consulta::after { content: " ↗"; }
.qg-consulta:hover { background: var(--tinta); color: var(--papel); }
.qg-copiado { display: block; font-size: .85rem; color: var(--seguro); margin: .2rem 0 0 .2rem; word-break: break-all; }
.qg-copiado:empty { display: none; }
.qg-fazer .passos { margin-top: .25rem; }