/* Estilo empresarial: gradiente oscuro, minimal y sobrio */
:root{--bg1:#0b1220;--bg2:#0f1a2e;--card:#121a2b;--stroke:rgba(255,255,255,.08);--text:#e5e7eb;--muted:#94a3b8;--accent:#f43f5e}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,Segoe UI,Roboto,Ubuntu,'Noto Sans',sans-serif;color:var(--text);background:linear-gradient(180deg,var(--bg2),var(--bg1));display:flex;align-items:center;justify-content:center}
.wrap{width:100%;max-width:400px;padding:32px}
.card{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));border:1px solid var(--stroke);border-radius:16px;padding:24px 22px;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.brand{display:flex;flex-direction:column;align-items:center;margin-bottom:14px}
.brand img{width:96px;height:auto;margin-bottom:10px}
.brand h1{font-size:18px;margin:0 0 2px 0;font-weight:700;letter-spacing:.2px}
.brand p{margin:0;color:var(--muted);font-size:12px}
.field{display:flex;flex-direction:column;gap:6px;margin:10px 0}
.field label{font-size:12px;color:var(--muted)}
.input{position:relative}
.input input{width:100%;padding:12px;border-radius:12px;border:1px solid var(--stroke);background:#0a1020;color:var(--text);outline:none;transition:border .2s}
.input input:focus{border-color:#64748b}
.btn{width:100%;padding:12px 14px;border:none;border-radius:12px;background:#fb7185;color:#1b0b11;font-weight:800;cursor:pointer}
.msg{color:#fca5a5;font-size:12px;margin:4px 0 0 0;text-align:center}
.foot{margin-top:10px;text-align:center;color:var(--muted);font-size:12px}