body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; margin: 0; padding: 0; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); min-height: 100vh; display: flex; align-items: center; justify-content: center; }
            .login-container { background: white; padding: 3rem; border-radius: 15px; box-shadow: 0 15px 35px rgba(0,0,0,0.1); max-width: 400px; width: 100%; }
            .logo { text-align: center; margin-bottom: 2rem; }
            .logo h1 { color: #333; font-size: 2rem; margin: 0; }
            .logo p { color: #666; margin: 0.5rem 0 0 0; }
            .form-group { margin-bottom: 1.5rem; }
            label { display: block; margin-bottom: 0.5rem; font-weight: 600; color: #333; }
            input { width: 100%; padding: 1rem; border: 2px solid #e1e5e9; border-radius: 8px; font-size: 1rem; transition: border-color 0.3s; }
            input:focus { outline: none; border-color: #667eea; }
            button { width: 100%; padding: 1rem; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; border: none; border-radius: 8px; font-size: 1rem; font-weight: 600; cursor: pointer; transition: transform 0.2s; }
            button:hover { transform: translateY(-2px); }
            .error { color: #e74c3c; margin-top: 1rem; text-align: center; padding: 0.75rem; background: #fdf2f2; border-radius: 6px; }