/* Desktop ability HUD. Button opacity shows authoritative cooldown state. */
#hud:not(.touch-active) #dashBtn,
#hud:not(.touch-active) #suckBtn{
  min-width:115px;
  min-height:43px;
  padding:9px 13px;
  font-size:13px;
  border-radius:14px;
  border:1px solid rgba(156,240,255,.88);
  color:#e9ffff;
  background:linear-gradient(130deg,rgba(9,106,148,.89),rgba(1,47,80,.89));
  box-shadow:0 3px 12px rgba(0,12,35,.5),inset 0 1px 0 rgba(238,255,255,.17);
  z-index:7;
  transition:opacity .15s,filter .15s,transform .12s;
}
#hud:not(.touch-active) #dashBtn{bottom:calc(24px + env(safe-area-inset-bottom))}
#hud:not(.touch-active) #suckBtn{bottom:calc(79px + env(safe-area-inset-bottom))}
#hud:not(.touch-active) #dashBtn:not(:disabled){
  background:linear-gradient(130deg,#0c8cbb,#064562);
  text-shadow:0 0 7px rgba(179,249,255,.65);
}
#hud:not(.touch-active) #suckBtn:not(:disabled){
  background:linear-gradient(130deg,#5a72bc,#254476);
  text-shadow:0 0 7px rgba(185,199,255,.65);
}
#hud:not(.touch-active) .hud-control:disabled{
  opacity:.65;filter:saturate(.45);cursor:wait;
}
#hud:not(.touch-active) #dashBtn:active,
#hud:not(.touch-active) #suckBtn:active{transform:translateY(1px) scale(.96)}
@media(max-width:640px){
  #hud:not(.touch-active) #dashBtn,#hud:not(.touch-active) #suckBtn {
    min-width:95px;font-size:12px;
  }
}