* { box-sizing:border-box; }
body { margin:0; font-family:Arial, Helvetica, sans-serif; background:#f4f3ee; color:#222; }
.wrap { max-width:420px; margin:0 auto; padding:2rem 1.25rem; }
h1 { text-align:center; font-size:1.4rem; margin-bottom:2px; }
.sub { text-align:center; color:#666; font-size:.85rem; margin-bottom:1.5rem; }

.card { background:#fff; border:1px solid #e5e3dc; border-radius:12px; padding:1.25rem; }
.card label { display:block; font-size:.8rem; font-weight:600; margin:.75rem 0 4px; }
.card input, .card select { width:100%; padding:10px; border:1px solid #ccc; border-radius:6px; font-size:.9rem; }

.btn { display:block; text-align:center; border:none; border-radius:8px; padding:12px; font-size:.9rem; cursor:pointer; text-decoration:none; }
.btn-primary { background:#1a3a5c; color:#fff; }
.btn-outline { background:#fff; border:1px solid #1a3a5c; color:#1a3a5c; }

.alert { padding:12px 16px; border-radius:8px; margin-bottom:1rem; font-size:.85rem; }
.alert-success { background:#eaf6ec; color:#1e7b34; border:1px solid #c3e6cb; }
.alert-error { background:#fdecea; color:#a12622; border:1px solid #f5c2c0; }

.badge { display:inline-block; padding:3px 10px; border-radius:20px; font-size:.75rem; font-weight:600; margin-bottom:.75rem; }
.nota { text-align:center; font-size:.75rem; color:#999; margin-top:1rem; }