.login-shell {
    zoom: 0.85;
    background:
        radial-gradient(circle at top left, rgba(23, 99, 214, 0.18), transparent 32%),
        radial-gradient(circle at bottom right, rgba(15, 76, 184, 0.14), transparent 28%),
        linear-gradient(180deg, #f7fbff 0%, #eef5ff 100%);
}

.register-shell {
    zoom: 0.85;
    background:
        radial-gradient(circle at top left, rgba(23, 99, 214, 0.16), transparent 30%),
        radial-gradient(circle at bottom right, rgba(16, 185, 129, 0.12), transparent 28%),
        linear-gradient(180deg, #f7fbff 0%, #eef5ff 100%);
}

.glass-card {
    box-shadow: 0 24px 80px rgba(9, 30, 66, 0.14);
    backdrop-filter: blur(18px);
}

.soft-grid {
    background-image:
        linear-gradient(rgba(15, 76, 184, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 76, 184, 0.06) 1px, transparent 1px);
    background-size: 28px 28px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.45), transparent 88%);
}

.float-slow {
    animation: float 8s ease-in-out infinite;
}

.float-slower {
    animation: float 12s ease-in-out infinite;
}

.step-transition {
    transition: max-height 550ms ease, opacity 350ms ease, transform 350ms ease, margin-top 350ms ease;
}

@keyframes float {
    0%,
    100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-12px);
    }
}