.login-page {
    min-height: 100vh;
    background: linear-gradient( 135deg, #dbeafe, #f8fafc );
}

.login-card {
    border: 0;
    border-radius: 24px;
    box-shadow: 0 20px 60px rgba(0,0,0,.08);
}

.guinea-pig {
    width: 220px;
    animation: breathe 3s ease-in-out infinite;
}

.shadow {
    fill: rgba(0,0,0,.12);
}

.head,
.body {
    fill: #d6a06b;
}

.eye {
    fill: white;
}

.pupil {
    fill: #111827;
}

.nose {
    fill: #fb7185;
}

.mouth {
    fill: none;
    stroke: #374151;
    stroke-width: 3;
}

.ear ellipse {
    fill: #8b5e3c;
}

.paw ellipse {
    fill: #f5d7b4;
}

.lid {
    fill: #d6a06b;
    transition: height .25s ease;
}

@keyframes breathe {

    0%,100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-6px);
    }
}

.password-mode #leftPaw {
    transform: translate(35px,-80px) rotate(-30deg);
    transform-origin: center;
    transition: .3s;
}

.password-mode #rightPaw {
    transform: translate(-35px,-80px) rotate(30deg);
    transform-origin: center;
    transition: .3s;
}

.password-mode #leftLid,
.password-mode #rightLid {
    height: 40px;
}

.success {
    animation: successJump .8s ease;
}

@keyframes successJump {

    0% {
        transform: translateY(0);
    }

    35% {
        transform: translateY(-30px);
    }

    100% {
        transform: translateY(0);
    }
}