.lab-bar {
  position: fixed;
  z-index: 6;
  top: max(4px, env(safe-area-inset-top));
  left: 4.7%;
  right: 4.7%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  pointer-events: none;
  font-size: 10px;
  letter-spacing: 0.08em;
  color: #546563;
}

.lab-back,
.lab-prompt {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  pointer-events: auto;
  color: #546563;
  text-decoration: none;
}

.lab-back { gap: 7px; }

.lab-back:hover,
.lab-prompt:hover { color: #152f30; }

.lab-back:focus-visible,
.lab-prompt:focus-visible {
  outline: 2px solid #38745f;
  outline-offset: 3px;
}

.masthead { top: max(48px, calc(env(safe-area-inset-top) + 44px)); }

@media (max-width: 640px) {
  .lab-bar { left: 6%; right: 6%; }
  .masthead { top: max(47px, calc(env(safe-area-inset-top) + 43px)); }
}

@media (max-height: 550px) and (min-width: 641px) {
  .masthead { top: max(43px, calc(env(safe-area-inset-top) + 39px)); }
}