*{margin:0;padding:0;box-sizing:border-box}body{height:100vh;background:#f0f0f0;display:flex;justify-content:center;align-items:center;overflow:hidden}.notelogin{display:flex;align-items:center;justify-content:center;gap:8px;font-size:15px;color:#0000008c;text-align:center;margin:-13px -45px 30px 0}.login-attribution{font-size:13px;font-weight:500;letter-spacing:.02em}.login-attribution a{color:#2c79dd;font-weight:600;text-decoration:none}.login-attribution a:hover{text-decoration:underline}.container{display:flex;flex-direction:row;width:100%;height:100vh;overflow:hidden}.login-section{flex:1;width:100%;max-width:400px;padding:40px 70px;display:flex;flex-direction:column;justify-content:center;background:#f0f0f0;overflow:hidden}.login-section h1{margin-bottom:30px;color:#333;text-align:center}form{display:flex;flex-direction:column}label{margin-bottom:5px;color:#555;font-size:14px}input{padding:12px;margin-bottom:20px;border:none;border-radius:6px;background:#f0f0f0;box-shadow:inset 2px 2px 5px #d0d0d0,inset -2px -2px 5px #fff;transition:.2s ease-in-out}input:focus{outline:none;box-shadow:inset 3px 3px 5px #ffffff2a,inset -3px -3px 5px #d0d0d02f}button{background:#f0f0f0;color:#333;margin-bottom:15px;padding:9px 30px;font-size:16px;font-weight:600;border:none;border-radius:12px;box-shadow:6px 6px 12px #00000012,-6px -6px 12px #ffffffb3;cursor:pointer;transition:box-shadow .4s ease,transform .2s ease}button:hover{box-shadow:3px 3px 6px #00000009,-3px -3px 6px #ffffff80;transform:translateY(-1px)}button:active{box-shadow:inset 4px 4px 8px #00000007,inset -4px -4px 8px #ffffff67;transform:scale(.99)}.back-link{text-align:center;display:block;color:#333;text-decoration:none;margin-top:10px;font-size:14px}.back-link:hover{text-decoration:underline}.image-section{flex:2;position:relative}.image-section img{width:100%;height:100%;object-fit:cover;object-position:center center}@media (max-width: 768px){.container{flex-direction:column;height:auto}.image-section{display:none}.login-section{padding:30px 20px;max-width:300px;width:100%;margin:0 auto}}@media (min-width: 1024px){.image-section{width:100%;object-fit:cover;object-position:center center}}.icon-button{display:flex;justify-content:center;width:100%;margin-top:30px}.icon-glow{fill:#505050;animation:glowAnimation 20s ease-in-out infinite}@keyframes glowAnimation{0%{fill:#505050}50%{fill:#2c79dd}to{fill:#505050}}.icon-glow:hover{animation:none;fill:#2c79dd}.judul-changepw{padding:50px}
