body, html {
            height: 100%;
            margin: 0;
            font-family: "Segoe UI", sans-serif;
            background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%) no-repeat center center fixed;
            background-size: cover;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .login-container { width: 100%; max-width: 420px; padding: 20px; }
        .card {
            border: none; border-radius: 20px; overflow: hidden;
            backdrop-filter: blur(12px);
            background: rgba(255, 255, 255, 0.15);
            box-shadow: 0 8px 32px rgba(0,0,0,0.2);
            animation: fadeIn 1s ease-in-out;
        }
        .card-header {
            background: transparent; color: #fff; text-align: center;
            border-bottom: none; padding: 30px 20px 10px;
        }
        .card-header h5 { font-weight: bold; font-size: 1.4rem; }
        .card-header small { font-size: 0.9rem; opacity: 0.85; }
        .card-body { padding: 25px 30px; }
        .input-group-text {
            border-radius: 12px 0 0 12px; border: none;
            background: rgba(255,255,255,0.8);
        }
        .form-control {
            border-radius: 0 12px 12px 0; border: none;
            box-shadow: none; background: rgba(255,255,255,0.7);
        }
        .form-control:focus {
            background: rgba(255,255,255,0.95);
            outline: none; box-shadow: 0 0 0 2px #38ef7d;
        }
        .btn-login {
            border-radius: 12px; font-weight: bold;
            background: linear-gradient(135deg, #11998e, #38ef7d);
            border: none; color: #fff; transition: all 0.3s ease;
        }
        .btn-login:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 15px rgba(0,0,0,0.2);
        }
        .card-footer {
            background: transparent; border-top: none; text-align: center; padding: 15px;
        }
        .card-footer small { color: rgba(255,255,255,0.8); }
        @keyframes fadeIn {
            from {opacity: 0; transform: translateY(-15px);}
            to {opacity: 1; transform: translateY(0);}
        }