/* Production floating Voca and WhatsApp buttons, used with assets/fab-drag.js. */
.dock{
  display:flex;flex-direction:column;align-items:flex-end;gap:10px;
  position:fixed;right:calc(20px + env(safe-area-inset-right,0px));top:50%;transform:translateY(-50%);z-index:60;
  touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;
}
.dock.dragging{cursor:grabbing;}
.dock.dragging .dock-btn{transform:none;pointer-events:none;}
.dock-btn svg{pointer-events:none;}
/* Icons only: the buttons sit mid-screen on the right edge, so labels would cover page content.
   With a mouse, the label slides out on hover. */
.dock .dock-btn{padding:13px;}
.dock .dock-btn span{display:none;}
@media (hover:hover){.dock:not(.dragging) .dock-btn:hover{padding:12px 20px;}.dock:not(.dragging) .dock-btn:hover span{display:inline;}}
.dock-btn{
  cursor:inherit;
  display:inline-flex;align-items:center;gap:9px;border-radius:999px;
  font-weight:700;font-size:14.5px;text-decoration:none;padding:12px 20px;
  box-shadow:0 12px 28px rgba(0,0,0,.28);transition:transform .15s ease;
}
.dock-btn:hover{transform:translateY(-1px);}
.dock-voca{background:#0E1B33;color:#fff;border:1px solid rgba(217,164,65,.55);}
.dock-voca svg{color:#D9A441;}
.dock-wa{background:#2FA06B;color:#fff;}
@media (prefers-reduced-motion:reduce){.dock-btn{transition:none}}