/* On tablet and mobile, use a 44px launcher with a 16px right inset.
   Individual transforms preserve Beacon's own animation transform. */
@media (width < 1200px) {
  .BeaconFabButtonFrame {
    translate: 24px -24px;
    scale: calc(44 / 60);
    transform-origin: bottom right;
  }
}

@media (width <= 768px) {
  .BeaconFabButtonFrame {
    translate: 24px -8px;
  }
}

@media (width >= 1200px) {
  .BeaconFabButtonFrame {
    translate: 0 -12px;
  }
}