/* Additive only: the existing wordmark, navigation, fonts and layout remain intact. */
html { background-color: #0f0f0f; }
.status-bar .fetch-link, .state-msg .fetch-link {
  color: #d4a053; background: none; border: 0; font: inherit;
  padding: .5rem; text-decoration: underline; cursor: pointer;
}
@media (display-mode: standalone) {
  .container {
    padding-top: calc(2rem + env(safe-area-inset-top, 0px));
    padding-right: calc(1.25rem + env(safe-area-inset-right, 0px));
    padding-bottom: calc(4rem + env(safe-area-inset-bottom, 0px));
    padding-left: calc(1.25rem + env(safe-area-inset-left, 0px));
  }
  .modal-backdrop {
    padding: calc(1rem + env(safe-area-inset-top, 0px)) calc(1rem + env(safe-area-inset-right, 0px)) calc(1rem + env(safe-area-inset-bottom, 0px)) calc(1rem + env(safe-area-inset-left, 0px));
  }
  .modal { max-height: calc(100dvh - 2rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
}
