/* Rolagem (ROLAGEM.md): regras de pesquisa. Carregado por último no index.html, ganha na cascata sem mexer nos CSS antigos. */
/* T3 · Pesquisa sem rolar em 844×390 e 740×360: 2 colunas, "Ameaça" e "Respostas" (research-ui.mjs monta). */

/* Cabeçalho e rodapé mais baixos: a altura vai para as colunas (orçamento de ≈ 290 px em 740×360). */
body.map-first #research-dialog[open]{padding-bottom:max(10px,env(safe-area-inset-bottom))}
body.map-first #research-dialog .dialog-top{margin:0 0 4px;padding:0}

#research-dialog .research-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
/* Retrato ou tela estreita: uma coluna (aí rolar é o de menos). */
@media(max-width:599px){#research-dialog .research-cols{grid-template-columns:minmax(0,1fr)}}
#research-dialog .research-col{display:flex;flex-direction:column;gap:3px;min-width:0}
#research-dialog .research-col-title{margin:0;font:600 11px/16px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#ecc486}

/* Ameaça · fase + gatilho numa linha, ritmo como subtítulo. */
#research-dialog #research-phase{display:block;padding:0;border:0;font-size:12px}
#research-dialog #research-phase>*{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#research-dialog #research-phase strong{font:600 14px/19px var(--body);color:#edc68c}
#research-dialog #research-phase span{font:11px/16px var(--body);color:#b4cacc}

/* Evidência como total; a decomposição fica atrás do "Por quê?". */
#research-dialog .research-evidence-row{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;padding:0 0 0 10px;border-radius:8px;background:#081f29aa}
#research-dialog #research-evidence-total{margin:0;min-width:0;font:12px/1.3 var(--body);color:#b4cacc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#research-dialog #research-evidence-total strong{font:600 14px var(--body);color:#edc68c;font-variant-numeric:tabular-nums}
#research-dialog #research-evidence-total span{font:600 12px var(--mono);color:#edc68c}
#research-dialog :is(#research-why,#research-map){flex:none;width:auto;height:44px;min-height:44px;margin:0;padding:0 12px;border:1px solid #c49c5b55;border-radius:8px;background:#ffffff0a;color:#edc68c;font:600 12px var(--body)}
#research-dialog #research-why{border-width:0 0 0 1px;border-radius:0 8px 8px 0;background:none}

/* Vista "Por quê?": troca os polos pelo gatilho, as parcelas da contenção e as fontes da evidência. */
#research-dialog .research-why{display:flex;flex-direction:column;gap:4px}
#research-dialog .research-why[hidden],#research-dialog .research-why [hidden]{display:none}
#research-dialog .research-threat.is-why :is(.research-leaders-head,#research-leaders){display:none}
#research-dialog .research-why>p,#research-dialog #research-trigger.research-notice{margin:0;font:11px/1.35 var(--body);color:#bdcfd0}
#research-dialog .research-why .research-evidence{margin:0;padding:6px 8px}
#research-dialog .research-why .research-evidence p{margin:0 0 2px;font-size:11px}
#research-dialog .research-why .research-evidence p strong{font-size:12px}
#research-dialog .research-why .research-evidence li,#research-dialog .research-why .research-evidence li b{font-size:11px;line-height:1.3}
#research-dialog .research-why .research-evidence>small{font-size:11px}

/* Polos: "↗ mapa" no cabeçalho da lista, linhas de 44 px. */
#research-dialog .research-leaders-head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px}
#research-dialog .research-leaders-head h4{margin:0;font:600 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#a9c0c4}
#research-dialog #research-leaders{grid-template-columns:minmax(0,1fr);gap:3px;margin:0}
#research-dialog #research-leaders button{min-width:0;height:44px;min-height:44px;padding:4px 8px;gap:10px}
#research-dialog #research-leaders button>b{font-size:20px}
#research-dialog #research-leaders strong{font-size:13px}
#research-dialog #research-leaders em{font-size:18px;line-height:1}
#research-dialog #research-leaders small{margin-top:1px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#research-dialog #research-leaders button>span:first-of-type{min-width:0}
#research-dialog .research-empty{margin:4px 0;font-size:12px}

/* Respostas · Campanha global e as duas influências em linhas de 48 px, subtítulo de 1 linha. */
#research-dialog .research-answers .cooperate-button{display:flex;align-items:center;gap:10px;width:100%;height:48px;min-height:48px;margin:0;padding:0 12px;text-align:left}
#research-dialog .research-answers .cooperate-button>span:first-child{flex:none;font-size:20px;line-height:1}
#research-dialog .research-answers .cooperate-button>span:last-child{flex:1;min-width:0;font-size:13px;line-height:1.25}
#research-dialog .research-answers .cooperate-button small{display:block;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:11px/1.3 var(--body);letter-spacing:0;color:#a9c0c4}
#research-dialog .research-answers.is-detail :is(#reassure,#influence-all,#auto-influence){display:none}

/* Reconfigurar: título + 1 linha de efeito (o "i" abre a conta) e o botão ao lado. */
#research-dialog #reconfiguration-panel:not([hidden]){display:block;margin:0;padding:6px 6px 6px 8px;border-radius:10px}
#research-dialog .counter-operation{display:flex;align-items:center;gap:6px}
#research-dialog #reconfiguration-panel .counter-info{flex:1;min-width:0;min-height:44px;display:grid;grid-template-columns:auto 1fr;column-gap:6px;align-items:center;padding:0;border:0;border-radius:6px;background:none;color:inherit;text-align:left}
#research-dialog .counter-info strong{font:600 13px/1.25 var(--body);color:#d3e8b6}
#research-dialog .counter-info span{grid-row:2;grid-column:1/-1;font:11px/1.3 var(--body);color:#bdcbaf}
#research-dialog .counter-info i{grid-column:2;grid-row:1;display:grid;place-items:center;width:18px;height:18px;border:1px solid #a9cb7b88;border-radius:50%;justify-self:start;font:italic 600 11px var(--body);color:#c3ed8c}
/* Botão em até 2 linhas ("Reconfigurar · 40 CP"): sobra largura para o efeito caber numa linha. */
#research-dialog #reconfigure-core{flex:none;max-width:104px;min-height:44px;padding:4px 10px;font:600 12px/1.2 var(--body)}
#research-dialog .counter-reason{display:block;margin-top:2px;font:11px/1.3 var(--body);color:#f0c27a}
#research-dialog .counter-urgent[hidden],#research-dialog .counter-detail[hidden]{display:none}
#research-dialog .counter-detail p{margin:4px 0 2px;line-height:1.35}
#research-dialog .counter-detail small{display:block;line-height:1.35}
#research-dialog #reconfiguration-panel .counter-alerts{gap:3px;margin:4px 0 0}
#research-dialog #reconfiguration-panel .counter-alerts li{padding:3px 6px;font-size:11px;line-height:1.3}