:root {
  --app-safe-area-top: env(safe-area-inset-top, 0px);
  --app-safe-area-right: env(safe-area-inset-right, 0px);
  --app-safe-area-bottom: env(safe-area-inset-bottom, 0px);
  --app-safe-area-left: env(safe-area-inset-left, 0px);
}

/* The tab bar occupies layout space: do not add another fixed bottom spacer. */
html [data-testid="mobile-tab-bar"] {
  flex-shrink: 0;
  padding-top: 4px;
  padding-bottom: calc(8px + var(--app-safe-area-bottom));
  padding-left: max(4px, var(--app-safe-area-left));
  padding-right: max(4px, var(--app-safe-area-right));
}

/* Full-screen sheets must also clear the notch and home indicator. */
html [data-testid="sheet-header"] {
  padding-top: calc(12px + var(--app-safe-area-top));
  padding-left: max(16px, var(--app-safe-area-left));
  padding-right: max(16px, var(--app-safe-area-right));
}

html [data-testid="sheet-footer"] {
  padding-bottom: calc(24px + var(--app-safe-area-bottom));
  padding-left: max(16px, var(--app-safe-area-left));
  padding-right: max(16px, var(--app-safe-area-right));
}