/* Keep this direct child outside toolbars: backdrop-filter traps fixed descendants. */
:is(#portalPanel, #shopPanel) > #refreshButton {
  position: fixed;
  right: max(.75rem, env(safe-area-inset-right));
  bottom: max(5.4rem, calc(env(safe-area-inset-bottom) + 5.4rem));
  z-index: 51;
  min-width: 7rem;
  max-width: calc(100vw - 1.5rem);
  min-height: 44px;
  padding: .55rem .75rem;
  border: 1px solid #76e2b8;
  border-radius: 999px;
  color: #06120e;
  background: #76e2b8;
  box-shadow: 0 3px 12px #0005;
  font-size: .82rem;
  font-weight: 800;
  white-space: nowrap;
}
:is(#portalPanel, #shopPanel) #refreshButton:hover,
:is(#portalPanel, #shopPanel) #refreshButton:focus-visible {
  color: #06120e;
  background: #b0f3d8;
}
:is(#portalPanel, #shopPanel) #refreshButton:active {
  color: #f4fbf8;
  background: #215c48;
}
:is(#portalPanel, #shopPanel) #refreshButton:disabled {
  color: #d9e6e0;
  background: #345448;
  border-color: #668c7c;
  opacity: 1;
}
/* Leave the last field above both the fixed refresh action and navigation. */
:is(#portalPanel, #shopPanel) { padding-bottom: 4rem; }
/* Status messages sit above the action instead of covering its click area. */
#toast { bottom: calc(env(safe-area-inset-bottom) + 9rem); }
body.tour-active :is(#portalPanel, #shopPanel) #refreshButton { visibility: hidden; }
