* { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: 'Poppins', sans-serif; background: linear-gradient(135deg, #c8a2c8, #6c4675); display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; color: #fff; } form { background: rgba(255, 255, 255, 0.9); padding: 30px; border-radius: 8px; box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); max-width: 400px; width: 100%; transition: all 0.3s ease; } form:hover { transform: scale(1.02); } h2 { font-size: 24px; margin-bottom: 20px; color: #333; font-weight: 600; } label { display: block; margin-bottom: 8px; font-weight: 500; color: #555; } input { width: 100%; padding: 12px; margin-bottom: 20px; border: 1px solid #ccc; border-radius: 8px; font-size: 16px; box-sizing: border-box; transition: all 0.3s ease; } input:focus { border-color: #ffbd25; outline: none; box-shadow: 0 0 10px rgba(255, 189, 37, 0.5); } button { background-color: #ffd700; color: #454545; padding: 12px; border: none; border-radius: 8px; cursor: pointer; width: 100%; font-size: 16px; transition: all 0.3s ease; } button:hover { background-color: #f9c208; transform: translateY(-2px); } .message { margin-bottom: 20px; padding: 12px; border-radius: 8px; text-align: center; font-size: 14px; } .error { background-color: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; } .success { background-color: #d4edda; color: #155724; border: 1px solid #c3e6cb; } .link { margin-top: 15px; } .link a { color: #007bff; text-decoration: none; font-size: 14px; } .link a:hover { text-decoration: underline; } .tag { margin-top: 30px; font-size: 12px; color: #777; } .tag center { font-weight: 400; }