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

/* Only active inside the Capacitor copy of these public pages. The normal website
   keeps its original spacing, while iPhone/iPad and Android get a protected top edge. */
html.moku-static-native {
  min-height: 100%;
  background: #080810;
  scroll-padding-top: calc(max(var(--moku-static-safe-top), 24px) + 72px);
}

html.moku-static-native body {
  min-height: 100%;
  box-sizing: border-box;
  padding-top: max(var(--moku-static-safe-top), 24px) !important;
  padding-right: var(--moku-static-safe-right) !important;
  padding-bottom: max(var(--moku-static-safe-bottom), 10px) !important;
  padding-left: var(--moku-static-safe-left) !important;
}

/* Sticky article navigation must remain below the Dynamic Island/status bar after scrolling. */
html.moku-static-native nav {
  top: max(var(--moku-static-safe-top), 24px) !important;
}

html.moku-static-native :is(main, article, section, [id]) {
  scroll-margin-top: calc(max(var(--moku-static-safe-top), 24px) + 76px);
}

@supports not (padding-top: max(1px, 2px)) {
  html.moku-static-native body { padding-top: 28px !important; }
  html.moku-static-native nav { top: 28px !important; }
}


/* Keep public/help pages visually separate from the app underneath. */
html.moku-static-native,
html.moku-static-native body {
  background-color: #080810 !important;
  background-image: none !important;
  opacity: 1 !important;
  isolation: isolate;
}
html.moku-static-native body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  background: #080810;
  pointer-events: none;
}
html.moku-static-native main,
html.moku-static-native .wrap {
  opacity: 1 !important;
}

html, body { min-height:100%; }
body.moku-static-page-opaque { background:#080810!important; opacity:1!important; isolation:isolate; }
