/* ================== SGP — Telas de autenticação ================== */
:root{--brand:var(--primary,#4f46e5);--ink:#111827;--muted:#6b7280;--line:#e5e7eb;--bad:#dc2626}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  min-height:100vh;color:var(--ink);background:#f5f6fa;-webkit-text-size-adjust:100%}
input,button{font:inherit}
a{color:var(--brand);text-decoration:none;font-weight:600}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}

body{display:grid;place-items:center;padding:28px 20px}
.box{width:100%;max-width:410px;background:#fff;border:1px solid var(--line);border-radius:16px;
  padding:38px 34px;box-shadow:0 10px 34px rgba(17,24,39,.06)}
.brand{display:grid;place-items:center;margin-bottom:22px}
.brand img{max-width:220px;width:100%;height:auto}
h1{font-size:1.4rem;letter-spacing:-.02em;margin-bottom:7px;text-align:center}
.sub{color:var(--muted);font-size:.93rem;line-height:1.6;margin-bottom:26px;text-align:center}
label{display:block;font-size:.85rem;font-weight:600;margin-bottom:6px}
.field{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-size:.95rem;
  transition:border-color .15s,box-shadow .15s;background:#fff;color:inherit}
.field:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(79,70,229,.15)}
.btn{width:100%;padding:13px;border:0;border-radius:10px;background:var(--brand);color:#fff;
  font-size:.97rem;font-weight:700;cursor:pointer;transition:background .15s,filter .15s,color .15s;
  position:relative}
.btn:hover{filter:brightness(.92)}
.btn.loading{color:transparent;pointer-events:none}
.btn.loading::after{content:'';position:absolute;left:50%;top:50%;width:18px;height:18px;
  margin:-9px 0 0 -9px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;
  border-radius:50%;animation:sgp-spin .65s linear infinite}
@keyframes sgp-spin{to{transform:rotate(360deg)}}

.alert{transition:opacity .25s ease,transform .25s ease}
.alert.hide{opacity:0;transform:translateY(-4px)}

.alert{display:flex;gap:11px;background:#fef2f2;border:1px solid #fecaca;border-radius:11px;
  padding:13px 15px;margin-bottom:24px;font-size:.88rem;color:#991b1b;line-height:1.55}
.alert svg{width:18px;height:18px;stroke:var(--bad);fill:none;stroke-width:2.2;flex-shrink:0;margin-top:1px}
.alert-ok{background:#f0fdf4;border-color:#bbf7d0;color:#166534}
.alert-ok svg{stroke:#15803d}
.grp{margin-bottom:18px}
.field[aria-invalid="true"]{border-color:var(--bad);background:#fffafa}
.field[aria-invalid="true"]:focus{box-shadow:0 0 0 3px rgba(220,38,38,.14)}
.caps{font-size:.82rem;color:#92400e;background:#fffbeb;border:1px solid #fde68a;border-radius:8px;
  padding:7px 11px;margin-top:7px}
.row{display:flex;justify-content:center;margin-top:18px;font-size:.88rem}
.foot{margin-top:24px;text-align:center;font-size:.89rem;color:var(--muted)}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
