:root{
  --ground:#101618; --surface:#172023; --line:#2C3A3E; --line-control:#9AAAAE;
  --ink:#E3EBEB; --ink-2:#A9BAC2; --ink-3:#9AAAAE;
  --accent:#86B8CB; --accent-ink:#172023; --erro:#EE8080;
  color-scheme:dark;
  /* paleta e famílias da identidade do portal (identidade/tokens.css; test_identidade.py confere) */
  --serif:"Newsreader", Georgia, "Times New Roman", serif; --sans:"IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif; --mono:"IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
}
@media (prefers-color-scheme:light){
  :root{
    --ground:#EEF1EF; --surface:#FFFFFF; --line:#D5DCDA; --line-control:#5A6A6F;
    --ink:#16242A; --ink-2:#4B5D66; --ink-3:#5A6A6F;
    --accent:#2E5A6E; --accent-ink:#FFFFFF; --erro:#B23B3B;
    color-scheme:light;
  }
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;min-height:100vh;display:grid;place-items:center;background:var(--ground);color:var(--ink);
  font:15px/1.5 var(--sans);padding:20px}
.caixa{width:100%;max-width:380px;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:28px 26px 22px}
.marca{display:flex;align-items:baseline;gap:8px;margin:0 0 22px}
.marca b{font-family:var(--serif);font-size:19px;font-weight:600;letter-spacing:-.01em}
.marca span{font-size:12px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.09em}
h1{font-family:var(--serif);font-weight:600;font-size:21px;margin:0 0 4px}
.sub{color:var(--ink-2);margin:0 0 18px;font-size:14px}
.sub b{color:var(--ink);font-weight:600;word-break:break-all}
label{display:block;font-size:13px;color:var(--ink-2);margin:0 0 4px}
input{width:100%;padding:10px 12px;background:var(--ground);color:var(--ink);font:inherit;
  border:1px solid var(--line-control);border-radius:4px;margin:0 0 14px}
input.mono{font-family:var(--mono);font-size:20px;letter-spacing:.3em}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.btn{width:100%;padding:10px 12px;border:1px solid var(--accent);border-radius:4px;background:var(--accent);
  color:var(--accent-ink);font:inherit;font-weight:600;cursor:pointer}
.btn:disabled{opacity:.6;cursor:progress}
.acoes{display:flex;justify-content:space-between;gap:10px;margin:12px 0 0}
.link{background:none;border:0;padding:0;color:var(--accent);font:inherit;font-size:13px;cursor:pointer;text-decoration:underline}
.link:disabled{color:var(--ink-3);cursor:default;text-decoration:none}
.aviso{min-height:1.5em;margin:14px 0 0;font-size:14px;color:var(--ink-2)}
.aviso.erro{color:var(--erro)}
.rodape{margin:18px 0 0;padding-top:12px;border-top:1px solid var(--line);font-size:12px;color:var(--ink-3)}