* { box-sizing: border-box; margin: 0; padding: 0; font-family: 'Segoe UI', Tahoma, sans-serif; }
body {
    background: linear-gradient(135deg, #0f2027, #203a43, #2c5364);
    height: 100vh; display: flex; justify-content: center; align-items: center; color: #fff;
}
.card {
    background: rgba(255,255,255,0.1); backdrop-filter: blur(10px);
    padding: 2rem 3rem; border-radius: 1rem; box-shadow: 0 8px 32px 0 rgba(31,38,135,0.37);
    width: 320px; text-align: center;
}
.card h1 { margin-bottom: 1.5rem; font-size: 1.5rem; }
.card label { display: block; text-align: left; margin: 1rem 0 0.5rem; font-size: 0.9rem; }
.card input {
    width: 100%; padding: 0.7rem; border: none; border-radius: 0.5rem; margin-bottom: 0.5rem;
}
.card button {
    width: 100%; padding: 0.8rem; margin-top: 1rem; border: none; border-radius: 0.5rem;
    background: linear-gradient(to right, #ff5f6d, #ffc371); color: #fff; font-weight: bold;
    cursor: pointer; transition: opacity 0.2s ease;
}
.card button:hover { opacity: 0.85; }
.error { color: #ff6b6b; margin-bottom: 1rem; }
