/* Global safe-area guards for native overlays (status bar / home indicator). */
:root {
  --safe-top-effective: var(--safe-top, env(safe-area-inset-top, 0px));
  --safe-bottom-effective: var(--safe-bottom, env(safe-area-inset-bottom, 0px));
}

/* Home + lock-screen status header */
.screen-header {
  padding-top: var(--safe-top-effective) !important;
  height: calc(54px + var(--safe-top-effective)) !important;
}

/* Unified app navbar (chat header has dedicated safe-area layout in chat.css). */
.app-navbar:not(.chat-header) {
  top: 0 !important;
  padding-top: var(--safe-top-effective) !important;
  height: calc(44px + var(--safe-top-effective)) !important;
  min-height: calc(44px + var(--safe-top-effective)) !important;
}

/* Header families still using fixed top spacing */
.settings-header,
.theme-header,
.chat-settings-header,
.question-box-header {
  padding-top: calc(12px + var(--safe-top-effective)) !important;
  min-height: calc(44px + var(--safe-top-effective));
}

.settings-header {
  position: sticky;
  top: 0;
  z-index: 20;
}

/* Standalone browser and global-search headers */
.browser-header {
  padding-top: calc(10px + var(--safe-top-effective)) !important;
  min-height: calc(56px + var(--safe-top-effective));
}

.search-header {
  padding-top: calc(10px + var(--safe-top-effective)) !important;
  min-height: calc(44px + var(--safe-top-effective));
}

/* Browser bottom controls: keep tappable above home indicator. */
.browser-toolbar {
  height: calc(64px + var(--safe-bottom-effective)) !important;
  padding-bottom: calc(20px + var(--safe-bottom-effective)) !important;
}

/* Shopping module */
#shoppingView .shopping-header {
  padding-top: calc(14px + var(--safe-top-effective)) !important;
}

/* Music module */
#musicView .music-cloud-header {
  padding-top: calc(14px + var(--safe-top-effective)) !important;
}

/* Profile "我的" */
[data-project="profile"] .profile-page-header {
  padding-top: calc(16px + var(--safe-top-effective)) !important;
}

/* Moments top action (plus button) */
[data-project="moments"] .moments-post-btn-float {
  top: calc(16px + var(--safe-top-effective)) !important;
}
[data-project="moments"] .moments-summon-comment-btn {
  top: calc(18px + var(--safe-top-effective)) !important;
}
[data-project="moments"] .moments-summon-post-btn {
  top: calc(54px + var(--safe-top-effective)) !important;
}

/* Personas pages: prevent title overlap under notch */
#userPersonasView .settings-viewport {
  padding-top: calc(80px + var(--safe-top-effective)) !important;
}

#userPersonaEditorView .ios-modal {
  margin-top: calc(60px + var(--safe-top-effective)) !important;
}
