#app,
#gameShell {
  width: 100vw;
  height: 100vh;
  width: 100dvw;
  height: 100dvh;
}

.pwa-fullscreen-button {
  position: absolute;
  z-index: 1000;
  top: max(12px, env(safe-area-inset-top));
  left: 50%;
  min-height: 48px;
  padding: 8px 18px;
  transform: translateX(-50%);
  border: 4px solid #fff3ce;
  border-radius: 20px;
  color: #fff8dc;
  background: rgb(13 76 79 / 90%);
  box-shadow: 0 6px 0 rgb(20 12 8 / 38%);
  font: 900 16px/1.2 "Trebuchet MS", sans-serif;
  letter-spacing: 0.06em;
  touch-action: manipulation;
}

.pwa-fullscreen-button.is-corner {
  right: max(14px, env(safe-area-inset-right));
  left: auto;
  transform: none;
}

.pwa-fullscreen-button.is-hidden {
  display: none;
}

.pwa-install-help {
  position: absolute;
  z-index: 1100;
  inset: 0;
  display: grid;
  place-items: center;
  padding:
    max(24px, env(safe-area-inset-top))
    max(24px, env(safe-area-inset-right))
    max(24px, env(safe-area-inset-bottom))
    max(24px, env(safe-area-inset-left));
  background: rgb(8 13 18 / 64%);
  touch-action: manipulation;
}

.pwa-install-card {
  width: min(92vw, 560px);
  padding: 24px 28px;
  border: 6px solid #fff1cf;
  border-radius: 28px;
  color: #2b211d;
  background: #f4e4c9;
  box-shadow: 0 12px 0 rgb(29 17 12 / 42%);
  font: 700 18px/1.55 "Trebuchet MS", sans-serif;
}

.pwa-install-card strong {
  display: block;
  font-size: 24px;
  text-align: center;
}

.pwa-install-card button {
  display: block;
  min-width: 150px;
  margin: 18px auto 0;
  padding: 12px 20px;
  border: 4px solid #fff7df;
  border-radius: 18px;
  color: #fff;
  background: #147d78;
  font: inherit;
  font-weight: 900;
}

.hidden {
  display: none !important;
}