
:root{--app-bg:#f1f5f9;--app-surface:#ffffff;--app-text:#0f172a;--app-muted:#64748b;--app-border:#e2e8f0;--app-primary:#2563eb;--sidebar-bg:#1e293b;--sidebar-hover:#334155}*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:24px;background:var(--app-bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--app-text)}.wrap{width:min(920px,94vw);display:grid;grid-template-columns:minmax(0,1fr) 410px;background:var(--app-surface);border:1px solid var(--app-border);border-radius:1rem;box-shadow:0 10px 30px rgba(15,23,42,.10);overflow:hidden}.wrap:before{content:"Master ISP\A Centro SuperAdmin";white-space:pre-line;display:grid;align-content:end;padding:2rem;color:white;font-size:2.25rem;line-height:1.05;font-weight:800;letter-spacing:-.04em;background:linear-gradient(135deg,var(--sidebar-bg),var(--sidebar-hover));min-height:560px}.box{display:grid;align-content:center;background:var(--app-surface)}.head{padding:2.25rem 2.25rem 1rem}.logo{width:52px;height:52px;border-radius:.85rem;background:var(--app-primary);color:#fff;display:grid;place-items:center;font-size:1.35rem;margin-bottom:1rem}.head h1{font-size:1.75rem;line-height:1.1;margin:0;font-weight:800;letter-spacing:-.03em}.head p{color:var(--app-muted);margin:.55rem 0 0;font-size:.9rem}.body{padding:.5rem 2.25rem 2.25rem}.field{margin-bottom:1rem}label{display:block;font-size:.85rem;font-weight:700;margin-bottom:.45rem}input{width:100%;padding:.75rem .85rem;border-radius:.65rem;border:1px solid var(--app-border);background:#fff;color:#111827;font-size:.95rem}input:focus{outline:0;box-shadow:0 0 0 .22rem rgba(37,99,235,.18);border-color:var(--app-primary)}.btn{width:100%;border:0;border-radius:.65rem;padding:.75rem .9rem;background:var(--app-primary);color:white;font-weight:800;cursor:pointer;font-size:.95rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.btn:hover{background:#1d4ed8}.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.38);border-top-color:#fff;border-radius:50%;display:inline-block;animation:spin .75s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.err{background:#fef2f2;color:#b91c1c;padding:.7rem .8rem;border-radius:.65rem;margin-bottom:1rem;border:1px solid #fecaca;font-size:.9rem}.security{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}.badge{font-size:.7rem;color:#1d4ed8;background:#dbeafe;border:1px solid #bfdbfe;border-radius:999px;padding:.3rem .55rem;font-weight:700}.hint{text-align:center;font-size:.75rem;color:#94a3b8;margin-top:1rem}html[data-theme="dark"]{--app-bg:#0b1120;--app-surface:#111827;--app-text:#f1f5f9;--app-muted:#b6c2d2;--app-border:#243044;--app-primary:#60a5fa;--sidebar-bg:#020617;--sidebar-hover:#111827;color-scheme:dark}html[data-theme="dark"] input{background:#0f172a;border-color:#334155;color:#f8fafc}html[data-theme="dark"] .wrap{box-shadow:0 18px 50px rgba(0,0,0,.34)}@media(max-width:860px){.wrap{grid-template-columns:1fr}.wrap:before{display:none}.head,.body{padding-left:1.5rem;padding-right:1.5rem}}@media(max-width:520px){body{padding:12px}.wrap{border-radius:.8rem}.head h1{font-size:1.45rem}}
