this is for a floating chibi that has a phrase when you click on it, it can be anything:

<style>
.page-doll-static {
position: fixed;
top: 50%;
right: 12px;
width: 100px;
z-index: 9999;
transform: translateY(-50%);
animation: floatUpDown 3.2s ease-in-out infinite;
}

.page-doll-static img {
width: 100%;
height: auto;
display: block;
cursor: pointer;
pointer-events: none;
}

.hover-status-box-bg {
position: absolute;
bottom: -5px;
right: 0;
background: orange;
content: "";
height: 20px;
width: 100%;
}

.hover-status-text {
position: relative;
color: black;
display: flex;
align-items: center;
justify-content: center;
font-size: 1rem;
height: 20px;
width: 100%;
transition: all 400ms ease-in-out;
}

.hover-status-text::before {
position: absolute;
bottom: 1px;
content: "blahblahblah!";
color: black;
}

.page-doll-static:hover .hover-status-text::before {
content: "nanni blahblah";
}
</style>

<div class="page-doll-static">
<img src="LINK OF IMAGE HERE" alt="Floating Page Doll">
<div class="hover-status-box-cont">
<div class="hover-status-box-bg">
<div class="hover-status-text"></div>
</div>
</div>
</div>

also to make it bigger or smaller you change the width