/* Auth pages — "Canvas Split" visual concept */

.auth-canvas {
    background-color: #F5F8FF;
    background-image:
        radial-gradient(ellipse 80% 50% at 10% 0%, rgba(47, 108, 209, 0.06), transparent 55%),
        linear-gradient(rgba(47, 108, 209, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(47, 108, 209, 0.03) 1px, transparent 1px);
    background-size: 100% 100%, 28px 28px, 28px 28px;
}

.auth-preview-card {
    box-shadow:
        0 4px 6px -1px rgba(33, 43, 54, 0.06),
        0 24px 48px -12px rgba(47, 108, 209, 0.14);
}

.auth-form-card {
    box-shadow:
        0 1px 2px rgba(33, 43, 54, 0.04),
        0 12px 40px -8px rgba(33, 43, 54, 0.12);
}

.auth-input {
    transition: box-shadow 0.2s, border-color 0.2s;
}

.auth-input:focus {
    box-shadow: 0 0 0 3px rgba(47, 108, 209, 0.15);
}

/* Before/after compare (matches landing ba-slider) */
.auth-ba-slider {
    touch-action: none;
    user-select: none;
}

.auth-ba-slider__after {
    clip-path: inset(0 0 0 50%);
}

.auth-ba-handle {
    transform: translateX(-50%);
    z-index: 10;
}

.auth-ba-handle__knob {
    border: 2px solid rgba(47, 108, 209, 0.35);
}