        :root {
            --mm-primary: #1f5aad;
            --mm-primary-dark: #052b61;
        }

        body {
            min-height: 100vh;
            background: radial-gradient(circle at top,
                #0b4aa3 0%,
                #07377c 45%,
                #041e45 100%);
        }

        /* Card */
        .login-card {
            border-radius: 16px;
            box-shadow: 0 30px 60px rgba(0,0,0,.35);
            animation: fadeUp .45s ease-out;
        }

        @keyframes fadeUp {
            from {
                opacity: 0;
                transform: translateY(12px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* Title */
        .login-title {
            font-weight: 700;
            letter-spacing: .3px;
            color: var(--mm-primary);
        }

        /* Inputs */
        .form-control:focus {
            border-color: var(--mm-primary);
            box-shadow: 0 0 0 .25rem rgba(7,55,124,.25);
        }

        .form-floating > label {
            color: #64748b;
        }

        /* Button */
        .btn-mm {
            background-color: var(--mm-primary);
            border-color: var(--mm-primary);
            font-weight: 600;
            letter-spacing: .3px;
            transition: all .25s ease;
        }

        .btn-mm:hover {
            background-color: var(--mm-primary-dark);
            border-color: var(--mm-primary-dark);
            box-shadow: 0 8px 20px rgba(7,55,124,.4);
            transform: translateY(-1px);
        }

        .btn-mm:active {
            transform: translateY(0);
            box-shadow: none;
        }
