:root {
  --fundo: #f5f7fb; --cartao: #ffffff; --texto: #1d2433; --suave: #5b6478;
  --borda: #d9dee8; --marca: #2f5bd3; --marca-texto: #ffffff;
  --erro-fundo: #fdecec; --erro-texto: #9b1c1c; --aviso-fundo: #e8f3ec; --aviso-texto: #1d6b3a;
}
@media (prefers-color-scheme: dark) {
  :root {
    --fundo: #11151f; --cartao: #1a2030; --texto: #e8ecf4; --suave: #a3acbf;
    --borda: #2e3648; --marca: #7c9cff; --marca-texto: #0b1020;
    --erro-fundo: #3a1a1d; --erro-texto: #f5b5b5; --aviso-fundo: #16301f; --aviso-texto: #9fe0b4;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--fundo); color: var(--texto);
       font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .5rem;
         padding: 12px 16px; border-bottom: 1px solid var(--borda); background: var(--cartao); }
header a.marca { color: var(--texto); font-weight: 700; text-decoration: none; }
header form { margin: 0; }
main { max-width: 30rem; margin: 2rem auto; padding: 0 16px; }
main.largo { max-width: 48rem; }
.cartao { background: var(--cartao); border: 1px solid var(--borda); border-radius: 10px;
          padding: 1.5rem; }
h1 { font-size: 1.5rem; margin: 0 0 1rem; }
p { margin: 0 0 1rem; }
.suave { color: var(--suave); }
label { display: block; font-weight: 600; margin: 0 0 .25rem; }
input[type=text], input[type=email], input[type=password], input[type=file] {
  width: 100%; padding: .6rem .7rem; margin: 0 0 1rem; font: inherit; color: var(--texto);
  background: var(--fundo); border: 1px solid var(--borda); border-radius: 6px; }
.aceite { display: flex; gap: .5rem; align-items: flex-start; font-weight: 400;
          font-size: .9rem; color: var(--suave); }
.aceite input { margin-top: .3rem; }
button, .botao { display: inline-block; padding: .65rem 1.2rem; border: 0; border-radius: 6px;
  background: var(--marca); color: var(--marca-texto); font: inherit; font-weight: 600;
  text-decoration: none; cursor: pointer; }
button.secundario, .botao.secundario { background: transparent; color: var(--marca);
  border: 1px solid var(--borda); }
.acoes { display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; margin-top: .5rem; }
.anti-robo { margin-top: 1rem; min-height: 65px; }
.erro { background: var(--erro-fundo); color: var(--erro-texto); padding: .75rem 1rem;
        border-radius: 6px; margin: 0 0 1rem; }
.aviso { background: var(--aviso-fundo); color: var(--aviso-texto); padding: .75rem 1rem;
         border-radius: 6px; margin: 0 0 1rem; }
dl { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1rem; margin: 0 0 1rem; }
dt { color: var(--suave); }
dd { margin: 0; }
h2 { font-size: 1.2rem; margin: 0 0 1rem; }
a { color: var(--marca); }
.menu { display: flex; gap: .5rem 1rem; align-items: center; flex-wrap: wrap; }
.menu a { text-decoration: none; font-weight: 600; }
.menu a[aria-current=page] { color: var(--texto); }
.lista { list-style: none; margin: 0 0 1rem; padding: 0; }
.lista > li { border-top: 1px solid var(--borda); padding: .9rem 0; }
.lista > li.inativo { opacity: .7; }
.linha { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start;
         flex-wrap: wrap; }
.linha form { margin: 0; }
.etiqueta { font-size: .8rem; padding: .1rem .45rem; border-radius: 4px;
            background: var(--fundo); border: 1px solid var(--borda); color: var(--suave); }
details { margin-top: .6rem; }
details summary { cursor: pointer; color: var(--marca); font-size: .95rem; }
details form { margin-top: .75rem; }
select { width: 100%; padding: .6rem .7rem; margin: 0 0 1rem; font: inherit; color: var(--texto);
  background: var(--fundo); border: 1px solid var(--borda); border-radius: 6px; }
fieldset { border: 1px solid var(--borda); border-radius: 6px; margin: 0 0 1rem; padding: .5rem .9rem .7rem; }
legend { font-weight: 600; padding: 0 .3rem; }
label.opcao { display: flex; gap: .5rem; align-items: center; font-weight: 400; margin: .35rem 0; }
.etiqueta.ok { color: var(--aviso-texto); background: var(--aviso-fundo); border-color: transparent; }
button.perigo { background: transparent; color: var(--erro-texto); border: 1px solid var(--borda); }
form.excluir { margin-top: .75rem; }
.linha > div { flex: 1 1 18rem; min-width: 0; }
label.opcao + button { margin-top: .75rem; }
.com-botao { display: flex; gap: .5rem; align-items: flex-start; }
.com-botao input { flex: 1; min-width: 0; }
.com-botao button { white-space: nowrap; }
.fora-da-tela { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
dl.buscas { margin: .5rem 0 0; font-size: .95rem; }
dd.ok { color: var(--aviso-texto); }
dd.falha { color: var(--erro-texto); font-weight: 600; }
dd.andamento { color: var(--marca); }