/* Home-screen app (PWA) extras: safe areas for the notch / home bar + the Add to Home Screen hint.
   Layout and art of the games are untouched; this only adds breathing room around the edges. */
body {
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}
/* Nate's Perfect Pour: keep the POUR button and page bottom clear of the home bar */
body.pp #stage { padding-bottom: max(8px, env(safe-area-inset-bottom)); }
body.pp #below { margin-bottom: calc(40px + env(safe-area-inset-bottom)); }

/* ---------- Add to Home Screen hint (iPhone / iPad Safari, home page only) ---------- */
.a2hs {
  position: fixed; z-index: 50; left: 50%; transform: translateX(-50%);
  bottom: calc(12px + env(safe-area-inset-bottom));
  width: min(calc(100% - 24px), 420px);
  display: flex; align-items: center; gap: 12px;
  padding: 12px 40px 12px 12px; border-radius: 14px;
  background: rgba(36, 22, 25, 0.96); color: #f6eee6;
  border: 2px solid rgba(255, 79, 154, 0.85);
  box-shadow: 0 0 14px rgba(255, 79, 154, 0.45), 0 10px 30px rgba(0, 0, 0, 0.6);
  font-family: "Source Sans 3", system-ui, -apple-system, sans-serif; font-size: 15px; line-height: 1.3;
  animation: a2hs-in .35s ease-out both;
}
.a2hs img { width: 44px; height: 44px; border-radius: 10px; flex: none; }
.a2hs b { color: #F2C14E; }
.a2hs .share-ico { display: inline-block; width: 16px; height: 18px; vertical-align: -3px; margin: 0 1px; }
.a2hs-close {
  position: absolute; top: 6px; right: 6px; width: 30px; height: 30px; border: 0; border-radius: 15px;
  background: transparent; color: #cdbdb2; font-size: 20px; line-height: 30px; cursor: pointer; padding: 0;
}
.a2hs-close:active { background: rgba(255,255,255,0.1); }
@keyframes a2hs-in { from { opacity: 0; transform: translate(-50%, 16px); } to { opacity: 1; transform: translate(-50%, 0); } }