/* Configurações: o termo de abertura na contracapa, a capa Oxford com a etiqueta
   abre a folha; as seções abaixo são o verso. */
.config__capa { position: relative; overflow: hidden; isolation: isolate; background: var(--capa); color: var(--capa-ink); border-radius: var(--radius-etiqueta); padding: clamp(var(--s-5), 4vw, var(--s-7)); margin-bottom: var(--s-6); }
.config__marca { position: absolute; right: -10%; top: -24%; width: 56%; height: 136%; color: var(--capa-ink-faint); z-index: -1; }
.config__etiqueta { max-width: 32rem; }
.config .fh-bloco { padding: var(--s-6) 0; }
.config__conta { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--s-6); align-items: start; }
.config__foto { display: grid; gap: var(--s-2); justify-items: start; }
.config__foto-img, .config__foto-vazia { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; }
.config__foto-vazia { display: grid; place-items: center; background: var(--capa); color: var(--capa-ink); font-size: var(--fs-28); font-weight: var(--fw-bold); letter-spacing: 0.02em; }
.config__foto-btn { cursor: pointer; }
.config__foto-btn:focus-within { outline: 2px solid var(--gold); outline-offset: 3px; }
.config__campos { display: grid; gap: var(--s-4); }
.config__senha { display: grid; gap: var(--s-4); max-width: 26rem; }
.config__toggles { display: grid; gap: var(--s-3); }
.config__toggle { align-items: start; }
.config__toggle-texto { display: grid; gap: 2px; }
.config code { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 0.92em; background: var(--rule-soft); padding: 1px 6px; border-radius: 4px; }
@media (max-width: 599px) { .config__conta { grid-template-columns: minmax(0, 1fr); } }

/* Segundo fator (Onda C). O segredo sai em TEXTO, para colar no aplicativo autenticador: um QR
   exigiria uma dependencia, e colar a chave e o caminho que todo aplicativo aceita. */
.config__mfa { display: grid; gap: var(--s-4); justify-items: start; }
.config__mfa p { max-width: var(--measure); }
.config__mfa-passos { display: grid; gap: var(--s-4); width: 100%; }
.config__mfa-lista { display: grid; gap: var(--s-3); padding-left: var(--s-5); list-style: decimal; color: var(--ink); }
.config__mfa-chave { display: inline-block; margin-top: var(--s-2); padding: var(--s-2) var(--s-3); border: 1px solid var(--rule); border-radius: var(--radius-control); background: var(--paper-raised); font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: var(--fs-15); letter-spacing: 0.08em; overflow-wrap: anywhere; user-select: all; }
.config__mfa-form { display: grid; gap: var(--s-3); justify-items: start; }
.config__mfa-codigos h3 { font-size: var(--fs-19); line-height: var(--lh-19); color: var(--ink-strong); }
.config__mfa-recuperacao { display: grid; gap: var(--s-2); margin: var(--s-3) 0; list-style: none; }
.config__mfa-recuperacao code { font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: var(--fs-15); letter-spacing: 0.06em; user-select: all; }
.lg-lab__mfa { margin-top: var(--s-3); }
