*{box-sizing:border-box}:root{--primary:#2563eb;--primary2:#1d4ed8;--text:#172033;--muted:#718096;--border:#e5eaf1}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--text);background:#f4f7fb}.page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.login-card{width:min(460px,100%);background:#fff;border:1px solid #e8edf4;border-radius:22px;padding:34px;box-shadow:0 18px 55px rgba(22,34,55,.10)}.brand{display:flex;align-items:center;gap:14px;padding-bottom:25px;border-bottom:1px solid #edf0f5}.logo{width:52px;height:52px;border-radius:15px;background:linear-gradient(135deg,#2563eb,#173ea5);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:19px;letter-spacing:-1px}.brand h1{font-size:16px;margin:0 0 4px;font-weight:750}.brand p{font-size:12px;margin:0;color:var(--muted)}.heading{text-align:center;padding:27px 0 22px}.lock{font-size:28px}.heading h2{font-size:26px;margin:8px 0 5px}.heading p{margin:0;color:var(--muted);font-size:13px}label{display:block;font-size:13px;font-weight:650;margin:14px 0 7px}.input-box{height:50px;border:1px solid var(--border);border-radius:11px;display:flex;align-items:center;padding:0 13px;gap:10px;background:#fbfcfe}.input-box:focus-within{border-color:#8db2ff;box-shadow:0 0 0 3px rgba(37,99,235,.08)}.input-box input{border:0;outline:0;background:transparent;width:100%;font-size:14px}.eye{border:0;background:transparent;cursor:pointer;font-size:16px}.login-btn{width:100%;height:50px;margin-top:22px;border:0;border-radius:11px;background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;font-size:14px;font-weight:750;cursor:pointer}.change-btn{width:100%;height:44px;margin-top:10px;border:1px solid #dbe3ef;border-radius:11px;background:#fff;color:#34506f;font-weight:650;cursor:pointer}.message{min-height:18px;text-align:center;font-size:12px;color:#d13d3d;margin:12px 0 0}.footer{display:flex;justify-content:space-between;gap:10px;margin-top:27px;padding-top:18px;border-top:1px solid #edf0f5;color:#9aa5b5;font-size:10px}.modal{position:fixed;inset:0;background:rgba(15,23,42,.48);display:flex;align-items:center;justify-content:center;padding:20px}.hidden{display:none}.modal-card{width:min(420px,100%);background:#fff;border-radius:18px;padding:28px;position:relative;box-shadow:0 22px 70px rgba(0,0,0,.2)}.modal-card h3{margin:0;font-size:22px}.modal-subtitle{font-size:12px;color:var(--muted);margin:5px 0 20px}.modal-card input{width:100%;height:46px;border:1px solid var(--border);border-radius:10px;padding:0 12px;outline:0;font-size:14px}.close{position:absolute;right:16px;top:12px;border:0;background:transparent;font-size:27px;color:#8993a3;cursor:pointer}@media(max-width:520px){.page{padding:14px}.login-card{padding:25px 20px}.brand h1{font-size:14px}.footer{flex-direction:column}}