/* Supplied artwork with larger, responsive menu targets. */
#mmbtns{grid-template-columns:repeat(3,44px);gap:7px}
#mmbtns button{width:44px;height:44px}
#mmbtns button.menu-art{border:0;background:var(--menu-icon) center/contain no-repeat;box-shadow:none;font-size:0;padding:0;border-radius:0}
#mmbtns button.menu-art:disabled{opacity:.65;cursor:default}
#mmbtns button.menu-art:disabled:hover{filter:none}
#mmbtns button.menu-art:disabled:active{transform:none}
#mmbtns .coming-soon{position:absolute;bottom:-2px;left:0;right:0;padding:1px 0;background:rgba(13,20,38,.92);border:1px solid #b89244;border-radius:4px;color:#ffe5a1;font:7px/1.25 Tahoma,sans-serif;white-space:nowrap;pointer-events:none}
#mmbtns button.tog{order:100}
@media (max-width:560px), (max-height:520px){
  #mmbtns{grid-template-columns:repeat(3,32px);gap:5px}
  #mmbtns button{width:32px;height:32px}
}
html[data-mobile-landscape="1"] #mmbtns{grid-template-columns:repeat(4,32px);gap:5px}
html[data-mobile-landscape="1"] #mmbtns.col{grid-template-columns:repeat(3,32px)}
html[data-mobile-landscape="1"] #mmbtns button{width:32px;height:32px}
html[data-mobile-landscape="1"] #mmbtns button.menu-art{font-size:0}
#mmbtns .coming-soon{font-size:8px}
@media (max-width:560px), (max-height:520px){#mmbtns .coming-soon{font-size:7px}}

/* Labels survive HUD badge updates because they come from button attributes. */
#mmbtns{grid-template-columns:repeat(3,56px);column-gap:4px;row-gap:22px}
#mmbtns button{justify-self:center}
#mmbtns button[data-menu-label]::after{content:attr(data-menu-label);position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:2px;padding:1px 3px;border-radius:3px;background:rgba(9,6,0,.8);color:#fcfef4;font:11px/1.35 Tahoma,sans-serif;white-space:nowrap;text-shadow:0 1px 2px #000;pointer-events:none}
#mmbtns .coming-soon{bottom:0}
@media (max-width:560px), (max-height:520px){
  #mmbtns{grid-template-columns:repeat(3,44px);column-gap:2px;row-gap:19px}
  #mmbtns button[data-menu-label]::after{font-size:9px;padding:1px 2px}
}
html[data-mobile-landscape="1"] #mmbtns{grid-template-columns:repeat(4,44px);column-gap:2px;row-gap:19px}
html[data-mobile-landscape="1"] #mmbtns.col{grid-template-columns:repeat(3,44px)}

/* Supplied gold and ruby nameplate; menu names remain live text. */
#mmbtns{grid-template-columns:repeat(3,64px);row-gap:25px}
#mmbtns button[data-menu-label]::after{box-sizing:border-box;width:54px;height:18px;margin-top:-5px;padding:1px 3px 1px;border-radius:0;background:transparent none center/100% 200% no-repeat;color:#fcfef4;font:bold 10px/16px Tahoma,sans-serif;text-shadow:0 1px 2px #000}
@media (max-width:560px), (max-height:520px){
  #mmbtns{grid-template-columns:repeat(3,54px);row-gap:23px}
  #mmbtns button[data-menu-label]::after{width:48px;height:17px;padding:1px 3px 1px;font-size:9px;line-height:15px}
}
html[data-mobile-landscape="1"] #mmbtns{grid-template-columns:repeat(4,54px);row-gap:23px}
html[data-mobile-landscape="1"] #mmbtns.col{grid-template-columns:repeat(3,54px)}
@media (max-width:560px) and (orientation:portrait){
  #mmbtns{right:8px;top:calc(174px + env(safe-area-inset-top,0px));grid-template-columns:repeat(3,54px)}
}