:root{--bg:#0d0d10;--card:#141418;--line:#2a2a32;--fg:#ececed;--dim:#7c7c86;--acc:#7c7ff0;--acc2:#6366e6;--red:#ef5f47}
 *{box-sizing:border-box} html,body{height:100%;margin:0}
 body{background:radial-gradient(1100px 560px at 50% -10%,#17171d,#0d0d10);color:var(--fg);
  font:14px/1.5 -apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,sans-serif;
  display:flex;align-items:center;justify-content:center}
 .card{width:344px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:26px 26px 22px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
 .logo{font-size:26px} h1{font-size:19px;margin:8px 0 2px} .sub{color:var(--dim);font-size:13px;margin-bottom:14px}
 label{display:block;font-size:12px;color:var(--dim);margin:12px 0 5px}
 input{width:100%;background:#0f0f13;border:1px solid var(--line);border-radius:9px;padding:10px 12px;color:var(--fg);font:inherit}
 input:focus{outline:none;border-color:var(--acc)}
 button{width:100%;margin-top:18px;background:var(--acc2);border:none;color:#fff;padding:11px;border-radius:9px;font:inherit;font-weight:600;cursor:pointer}
 button:hover{background:var(--acc)}
 .err{color:var(--red);font-size:12.5px;min-height:16px;margin-top:10px}
 .alt{text-align:center;margin-top:16px;font-size:13px;color:var(--dim)} a{color:var(--acc);text-decoration:none}