* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, sans-serif; background: #f4f6f9; color: #222; }
.topo { background: #1f2937; color: #fff; padding: 1rem 1.5rem; display: flex; align-items: center; gap: 1rem; }
.topo h1 { margin: 0; font-size: 1.25rem; }
.badge { font-size: .8rem; background: #374151; padding: .2rem .6rem; border-radius: 1rem; }
.badge.ok { background: #065f46; }
.badge.erro { background: #991b1b; }
.conteudo { padding: 1.5rem; max-width: 720px; }
.card { background: #fff; border: 1px solid #e5e7eb; border-radius: .5rem; padding: 1rem 1.25rem; margin-bottom: 1.25rem; }
.card h2 { margin-top: 0; font-size: 1rem; }
label { display: block; margin: .5rem 0; font-size: .9rem; }
input { width: 100%; padding: .5rem; border: 1px solid #cbd5e1; border-radius: .375rem; margin-top: .25rem; }
button { background: #2563eb; color: #fff; border: 0; padding: .6rem 1rem; border-radius: .375rem; cursor: pointer; font-size: .9rem; }
button:hover { background: #1d4ed8; }
pre { background: #0b1020; color: #d1d5db; padding: 1rem; border-radius: .375rem; overflow: auto; font-size: .8rem; white-space: pre-wrap; }