*{margin:0;padding:0;box-sizing:border-box;font-family:sans-serif;}
body{background:#f5f6fa;display:flex;justify-content:center;align-items:center;height:100vh;}
.container{background:#fff;padding:30px;border-radius:12px;box-shadow:0 5px 15px rgba(0,0,0,0.1);width:320px;text-align:center;}
h2{margin-bottom:20px;color:#333;}
input{width:100%;padding:10px;margin:8px 0 15px;border:1px solid #ccc;border-radius:8px;transition:border-color 0.3s;}
input:focus{border-color:#2980b9;outline:none;}
button{width:100%;padding:10px;background:#2980b9;color:#fff;font-size:16px;border:none;border-radius:8px;cursor:pointer;transition:background 0.3s;}
button:hover{background:#3498db;}
a{display:inline-block;margin-top:15px;color:#2980b9;text-decoration:none;}
a:hover{text-decoration:underline;}
.alert{position:relative;padding:12px 35px 12px 12px;border-radius:8px;margin-bottom:15px;font-size:14px;text-align:left;opacity:1;transition:opacity 1s ease-out;}
.alert.hide{opacity:0;}
.alert-success{background:#eafaf1;border:1px solid #27ae60;color:#27ae60;}
.alert-error{background:#fdecea;border:1px solid #e74c3c;color:#e74c3c;}
.alert .close-btn{position:absolute;top:8px;right:10px;cursor:pointer;font-weight:bold;color:inherit;background:none;border:none;font-size:16px;}