/* HERO ROYALE V8.2 — SAFE HUD ANCHORS + SHARED LEGEND CORE */
:root{
  --hr-safe-left:max(10px,env(safe-area-inset-left));
  --hr-safe-right:max(10px,env(safe-area-inset-right));
  --hr-safe-top:max(7px,env(safe-area-inset-top));
  --hr-safe-bottom:max(8px,env(safe-area-inset-bottom));
  --hr-action-gap:10px;
}

/* Center controls stay centered and never collide with the weapon card. */
#topbar{
  top:var(--hr-safe-top)!important;
  left:50%!important;
  right:auto!important;
  max-width:calc(100vw - var(--hr-safe-left) - var(--hr-safe-right) - 340px)!important;
  transform:translateX(-50%)!important;
}

/* Right action stack is anchored from the safe edge, not raw viewport pixels. */
#hrSwapTap{right:calc(var(--hr-safe-right) + 178px)!important;bottom:calc(var(--hr-safe-bottom) + 57px)!important}
#hrHealTap{right:calc(var(--hr-safe-right) + 238px)!important;bottom:calc(var(--hr-safe-bottom) + 10px)!important}
#grenadeRealV6{right:calc(var(--hr-safe-right) + 300px)!important;bottom:calc(var(--hr-safe-bottom) + 28px)!important}
#ult041{position:fixed!important;display:block!important;right:calc(var(--hr-safe-right) + 296px)!important;bottom:calc(var(--hr-safe-bottom) + 104px)!important;top:auto!important;left:auto!important;transform:none!important}
#grenadeAimBtnV70{right:calc(var(--hr-safe-right) + 100px)!important;bottom:calc(var(--hr-safe-bottom) + 98px)!important}
#grenadeThrowBtnV70{right:calc(var(--hr-safe-right) + 21px)!important;bottom:calc(var(--hr-safe-bottom) + 9px)!important}
#hrAmmoTap{right:var(--hr-safe-right)!important;top:var(--hr-safe-top)!important}

/* No duplicate status ribbon: cooldown/charges live in the canonical circular HUD. */
#v71DocStatus{display:none!important}

/* Panels respect both notch/Dynamic Island and Home Indicator. */
#dev,#leg041,#v71Inventory,#v71Death,#v71Settings{
  max-width:calc(100vw - var(--hr-safe-left) - var(--hr-safe-right))!important;
  max-height:calc(100dvh - var(--hr-safe-top) - var(--hr-safe-bottom) - 8px)!important;
}

@media(max-height:470px){
  #topbar .topBtn{min-height:29px!important;padding:5px 8px!important}
  #ult041{width:48px!important;height:48px!important;right:calc(var(--hr-safe-right) + 296px)!important;bottom:calc(var(--hr-safe-bottom) + 98px)!important}
  #grenadeRealV6{width:54px!important;height:54px!important}
}
