*{box-sizing:border-box}html,body{height:100%}body{margin:0;font:14px/1.6 "Segoe UI",Roboto,Arial,sans-serif;color:#2b2b2b;background:linear-gradient(135deg,#eef2f7,#e4edf9);display:flex;align-items:center;justify-content:center}.box.login{width:360px;max-width:92%;background:#fff;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.08);padding:24px 22px 18px;border:1px solid #eef0f4}.boxBody{margin:0;padding:0;border:0}.boxBody label{display:block;font-weight:600;margin:10px 0 6px}.boxBody label .rLink{float:right;font-weight:500;font-size:12px;color:#3b82f6;text-decoration:none}.boxBody label .rLink:hover{text-decoration:underline}.boxBody input[type="text"],.boxBody input[type="password"]{width:100%;height:44px;padding:0 14px;border:1px solid #d8dee9;border-radius:10px;outline:none;transition:border-color .2s,box-shadow .2s;background:#fafcff}.boxBody input:focus{border-color:#60a5fa;box-shadow:0 0 0 3px rgba(96,165,250,.25)}::placeholder{color:#9aa4b2}footer{margin-top:14px;display:flex;align-items:center;justify-content:space-between;gap:12px}footer label{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:500;color:#4b5563;margin:0}.btnLogin{border:0;height:42px;padding:0 18px;border-radius:10px;background:#2563eb;color:#fff;font-weight:700;cursor:pointer;transition:transform .02s ease,box-shadow .2s ease,background .2s;box-shadow:0 6px 14px rgba(37,99,235,.25)}.btnLogin:hover{background:#1e4fd6}.btnLogin:active{transform:translateY(1px);box-shadow:0 4px 10px rgba(37,99,235,.22)}@media(max-width:420px){.box.login{padding:20px 16px 16px}.boxBody label .rLink{float:none;display:inline-block;margin-left:6px}footer{flex-direction:column;align-items:stretch}.btnLogin{width:100%}}