.floating-widget{
    position:fixed;
    right:20px;
    bottom:calc(20px + env(safe-area-inset-bottom));
    z-index:999999;

    display:flex;
    flex-direction:column;
    align-items:flex-end;
}

.help-bubble{
    background:#fff;
    border-radius:14px;
    padding:12px 16px;
    margin-bottom:12px;
    box-shadow:0 8px 25px rgba(0,0,0,.18);
    font-size:14px;
    line-height:1.4;
    max-width:220px;

    transition:.3s;
}

.help-bubble small{
    color:#777;
}

.social-menu{

    display:flex;
    flex-direction:column;
    gap:12px;

    margin-bottom:14px;

    opacity:0;
    visibility:hidden;
    pointer-events:none;

    transform:translateY(10px);

    transition:.25s;
}

.floating-widget.open .social-menu{

    opacity:1;
    visibility:visible;
    pointer-events:auto;

    transform:translateY(0);

}

.social-btn{

    width:56px;
    height:56px;

    border-radius:50%;

    display:flex;
    justify-content:center;
    align-items:center;

    color:#fff;

    text-decoration:none;

    font-size:24px;

    box-shadow:0 8px 20px rgba(0,0,0,.25);

    transition:.25s;

}

.social-btn:hover{

    transform:scale(1.08);

}

.whatsapp{

    background:#25D366;

}

.telegram{

    background:#229ED9;

}

.messenger{

    background:#0084FF;

}

.line{

    background:#06C755;

}

#fc-toggle{

    width:64px;
    height:64px;

    border:none;

    border-radius:50%;

    background:#0d6efd;

    color:#fff;

    font-size:28px;

    cursor:pointer;

    box-shadow:0 10px 28px rgba(0,0,0,.25);

    transition:.25s;

}

#fc-toggle:hover{

    transform:scale(1.05);

}

@media(max-width:768px){

    .floating-widget{

        right:15px;
        bottom:calc(15px + env(safe-area-inset-bottom));

    }

}