/** Ask Josephs floating page launcher. The conversation UI is on its own page. */
#josephs-ai {
    --jai-blue: #00a2ff;
    --jai-blue-dark: #0092e6;
    --jai-edge-spacing: 22px;
    --jai-footer-shift: 0px;
    position: fixed;
    right: var(--jai-edge-spacing);
    bottom: calc(var(--jai-edge-spacing) + env(safe-area-inset-bottom, 0px));
    z-index: 9999;
    text-align: left;
    transform: translateY(calc(-1 * var(--jai-footer-shift)));
    transition: transform 220ms ease-out;
}

#josephs-ai,
#josephs-ai * { box-sizing: border-box; }

#josephs-ai .jai-launch.ui.button {
    float: right;
    margin: 0;
    padding: 14px 22px;
    background: var(--jai-blue);
    color: #fff;
    border-radius: 0.285714rem;
    box-shadow: 0 6px 24px rgba(20, 53, 75, 0.19);
}

#josephs-ai .jai-launch.ui.button:hover,
#josephs-ai .jai-launch.ui.button:focus {
    background: var(--jai-blue-dark);
    color: #fff;
}

#josephs-ai .jai-launch.jai-launch-intro {
    animation: jai-launch-intro 1100ms cubic-bezier(0.22, 0.8, 0.3, 1);
    transform-origin: 82% 80%;
}

#josephs-ai .jai-launch.jai-launch-wiggle {
    animation: jai-launch-wiggle 760ms ease-in-out;
    transform-origin: 82% 80%;
}

@keyframes jai-launch-intro {
    0%, 100% { transform: scale(1) rotate(0deg); box-shadow: 0 6px 24px rgba(20, 53, 75, 0.19); }
    30% { transform: scale(1.5) rotate(-2deg); box-shadow: 0 10px 36px rgba(0, 162, 255, 0.42); }
    55% { transform: scale(1.3) rotate(2deg); box-shadow: 0 9px 32px rgba(0, 162, 255, 0.34); }
    78% { transform: scale(1.12) rotate(-1deg); box-shadow: 0 7px 27px rgba(0, 162, 255, 0.25); }
}

@keyframes jai-launch-wiggle {
    0%, 100% { transform: translateX(0) rotate(0deg); }
    22% { transform: translateX(-1px) rotate(-2deg); }
    48% { transform: translateX(1px) rotate(2deg); }
    72% { transform: translateX(-0.5px) rotate(-1deg); }
}

@media (max-width: 480px) {
    #josephs-ai { --jai-edge-spacing: 14px; }
}

@media (prefers-reduced-motion: reduce) {
    #josephs-ai { transition: none !important; }
    #josephs-ai .jai-launch.jai-launch-intro,
    #josephs-ai .jai-launch.jai-launch-wiggle { animation: none !important; }
}