/* =====================================================================
   As páginas de conta (Task 18a), por cima do m1l.css: /minha-conta (os ajustes em cupons; o tazo e a ficha são do ficha.css), os
   links do e-mail e a recuperação (o cupom de /entrar), e o pedido de exclusão de /privacidade (o texto é do leitura.css). Cor só
   por token.
   ===================================================================== */

/* ===== recados dos formulários: o erro é o .aviso do m1l.css; o que deu certo, em borda sólida da tinta do carimbo ===== */
.feito{margin:0 0 16px;display:flex;gap:8px;align-items:flex-start;padding:12px 14px;border-radius:12px;border:3px solid var(--carimbo);
  background:color-mix(in srgb,var(--carimbo) 10%,var(--papel));color:var(--sobre-papel);font-size:15px;font-weight:600;line-height:1.35}
.feito svg{flex:none;width:18px;height:18px;margin-top:1px;color:var(--carimbo)}
.feito[hidden]{display:none}
.aviso a{margin-left:.2em}

/* o botão do que não tem volta: a tinta do erro, nunca a do JOGAR */
.botao-perigo{color:var(--papel);background:var(--erro);border-color:var(--erro)}
.botao-perigo:hover{background:color-mix(in srgb,var(--erro) 82%,var(--tinta))}

/* ===== os links do e-mail e a recuperação: o cupom de /entrar ===== */
/* o cupom fica no meio de uma faixa de pacote com altura de página: a mensagem curta não vira uma tira entre o menu e o rodapé */
.acesso:has(.cupom-link){min-height:clamp(440px,64vh,720px);display:grid;align-content:center}
.cupom-link .cupom-topo{flex-direction:column;align-items:flex-start;gap:10px}
.cupom-link .carimbo-ok{margin:0}
.cupom-texto{margin:0 0 18px;font-size:17px;line-height:1.45;max-width:52ch}
.cupom-acoes{margin:6px 0 0;display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center}
.cupom-rodape{margin:18px 0 0;font-size:15px}
.cupom-rodape .link{padding:10px 2px}
/* o pedido de outro link, destacado do resto pela linha picotada */
.reenvio{margin-top:22px;padding-top:20px;border-top:3px dashed var(--contorno)}
.reenvio h2{margin:0 0 14px}

/* ===== os ajustes: um cupom por assunto ===== */
.conta-ajustes h2{margin-bottom:clamp(20px,2.6vw,32px)}
.conta-ajustes{background:var(--zebra);color:var(--sobre-papel);border-top:4px solid var(--tinta)}
.ajustes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,2.4vw,32px);align-items:start}
.ajuste h3{margin:0 0 16px;font-size:19px}
.ajuste-largo{grid-column:1/-1}
.ajuste-texto{margin:0 0 16px;font-size:16px;line-height:1.45;max-width:62ch}
.ajuste .regra-campo{margin:12px 0 0;font-size:14px;color:var(--apagado);line-height:1.35}
.ajuste-acoes{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:center}
.ajuste-acoes form{margin:0}
.ficha-limpa{font-weight:700}
.ban{margin:0;display:flex;flex-direction:column}
.ban>div{display:grid;grid-template-columns:8.5em minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1.5px solid var(--linha-tabela)}
.ban dt{font-weight:800;font-stretch:80%;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--apagado)}
.ban dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.ban-vigor{color:var(--erro)}
.excluir-conta{margin:clamp(28px,3vw,40px) 12px 0;font-size:16px}
.excluir-conta .link{padding:10px 2px}

/* o 2FA: o segredo é dado para digitar, então vai em fonte de largura fixa, selecionável de uma vez */
.passos-totp{margin:0 0 18px;padding-left:1.4em;display:flex;flex-direction:column;gap:10px;font-size:16px;line-height:1.45}
.passos-totp .link{padding:6px 2px}
.segredo{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-weight:700;font-size:17px;letter-spacing:.06em;
  background:var(--campo);color:var(--sobre-papel);border:2px solid var(--contorno);border-radius:8px;padding:3px 10px;user-select:all;overflow-wrap:anywhere}
.totp-novo[hidden],#totp form[hidden],#totp-gerar[hidden]{display:none}
#totp noscript .aviso{margin:6px 0 0}

/* ===== /privacidade: o pedido de exclusão (o texto é a Leitura, leitura.css) ===== */
.excluir-sec{--sol-x:50%;--sol-y:18%;padding:clamp(40px,6vw,80px) var(--calha) clamp(56px,8vw,96px)}
.excluir-in{position:relative;z-index:2;max-width:640px;margin:0 auto}
.exclusao h2{margin:0 0 14px}
.exclusao p{margin:0 0 14px}
.exclusao:focus{outline:none}
.exclusao .marca-caixa{font-weight:600}
.perigo{margin:0 0 18px;display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;border:3px solid var(--erro);
  background:var(--erro-fundo);color:var(--sobre-papel);font-size:16px;font-weight:700;line-height:1.4}
.perigo svg{flex:none;width:20px;height:20px;margin-top:1px;color:var(--erro)}

/* ===== telas estreitas ===== */
@media (max-width:860px){
  .ajustes{grid-template-columns:1fr}
}
@media (max-width:600px){
  .ban>div{grid-template-columns:1fr;gap:2px}
}