:root{
  --bubble:#1a1b1f;
  --line:#2a2c31;
  --orange:#ff8a00;
  --text:#fff;
  --muted:#a7a7aa;
}
.roq-fluffy{
  position:fixed; right:16px; bottom:20px; z-index:9998;
  display:flex; align-items:flex-end; gap:8px;
  filter: drop-shadow(0 8px 24px rgba(0,0,0,.45));
}
.fluffy-img{ width:72px; height:auto; animation: float 5s ease-in-out infinite }
@keyframes float{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-5px) } }
.fluffy-bubble{
  background:var(--bubble); color:var(--text);
  border:1px solid var(--line); border-radius:14px;
  padding:10px 12px; min-width:220px; max-width:280px;
  text-align:center; position:relative;
}
.fluffy-text{ font-size:14px; color:var(--muted); margin-bottom:8px; font-weight:600 }
.fluffy-cta{
  display:block;
  text-align:center;
  background:transparent;
  border:1px solid var(--orange);
  color:var(--orange);
  font-weight:600;
  padding:6px 10px;
  border-radius:8px;
  text-decoration:none;
  transition:all .25s ease;
  margin-top:6px;
}
.fluffy-cta:hover{
  background:var(--orange);
  color:#000;
}
.fluffy-close{
  position:absolute;
  right:-10px;
  top:-10px;
  width:26px;
  height:26px;
  border-radius:50%;
  background:#2b2d33;
  border:1px solid #3a3c43;
  color:#ddd;
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  transition:all .2s ease;
}
.fluffy-close:hover{
  background:#ff8a00;
  color:#000;
}
@media (max-width:640px){
  .fluffy-img{ width:60px }
  .fluffy-bubble{ min-width:200px }
}