/* ==========================================================================
   A5 · Nova conta
   Três passos. A conta só fica pronta com um destino confirmado, então o
   assistente não deixa concluir sem um — é a única trava aqui.
   ========================================================================== */

.a5 { grid-template-columns: 260rem minmax(0, 1fr); }
.mobile .a5 { grid-template-columns: minmax(0, 1fr); }

.a5__trilha { padding: 22rem 20rem; display: flex; flex-direction: column; gap: 4rem; }
.a5__passo {
  display: flex;
  gap: 12rem;
  padding: 11rem 12rem;
  border-left: 2rem solid transparent;
}
.a5__passo--atual { background: var(--panel); border-left-color: var(--invert-bg); }
.a5__passo--feito { border-left-color: var(--ok); }
.a5__passo-num { font-family: var(--font-mono); font-weight: 800; font-size: 12rem; width: 14rem; flex: none; color: var(--ink-3); }
.a5__passo-nome { font-size: 13rem; font-weight: 600; color: var(--ink-3); }
.a5__passo--atual .a5__passo-nome,
.a5__passo--atual .a5__passo-num { color: var(--ink); }
.a5__passo--feito .a5__passo-num { color: var(--ok); }
.a5__passo-frase { font-size: 12rem; color: var(--ink-3); margin-top: 2rem; line-height: 1.4; }

.a5__painel { padding: 26rem 28rem; min-height: 436rem; display: flex; flex-direction: column; }
.mobile .a5__painel { padding: 20rem 18rem; min-height: 0; }
.a5__campo-nota { font-size: 12rem; color: var(--ink-3); margin-top: 8rem; line-height: 1.5; }

.a5__caixa-nota {
  display: flex;
  gap: 12rem;
  margin-top: 22rem;
  padding: 14rem 16rem;
  border: 1rem solid var(--line);
  background: var(--bg);
  font-size: 12rem;
  color: var(--ink-2);
  line-height: 1.55;
}
.a5__caixa-nota--fail { border-color: var(--fail); background: var(--veu-fail); margin-top: 10rem; }
.a5__caixa-nota--warn { border-color: var(--warn); background: var(--veu-warn); margin-top: 10rem; }

.a5__resumo { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280rem, 100%), 1fr)); gap: 20rem; align-items: start; }
.a5__senha { border: 1rem solid var(--warn); background: var(--veu-warn-fraco); padding: 16rem 18rem; }
.a5__senha-valor {
  flex: 1;
  min-width: 0;
  font-family: var(--font-mono);
  font-weight: 800;
  font-size: 18rem;
  letter-spacing: -.01em;
  overflow: hidden;
  text-overflow: ellipsis;
}

.a5__rodape {
  display: flex;
  align-items: center;
  gap: 10rem;
  flex-wrap: wrap;
  margin-top: 24rem;
  padding-top: 20rem;
  border-top: 1rem solid var(--line);
}