/* Android supplies actual system insets. One continuous background; content
   keeps its previous safe viewport instead of moving under system controls. */
html.native-edge-shell {
  --native-content-height: max(0px, calc(var(--native-viewport-height, 100dvh) - var(--native-safe-top, 0px) - var(--native-safe-bottom, 0px)));
  background: #071126;
  overflow: hidden;
}
html.native-edge-shell body[data-nexora-page="home"] {
  position: relative;
  width: calc(100% - var(--native-safe-left, 0px) - var(--native-safe-right, 0px));
  height: var(--native-content-height) !important;
  min-height: 0;
  transform: translate(var(--native-safe-left, 0px), var(--native-safe-top, 0px));
  overflow: visible !important;
  background: transparent !important;
  isolation: isolate;
}
html.native-edge-shell body[data-nexora-page="home"]::before {
  content: "";
  position: absolute;
  top: calc(-1 * var(--native-safe-top, 0px));
  bottom: calc(-1 * var(--native-safe-bottom, 0px));
  left: calc(-1 * var(--native-safe-left, 0px));
  right: calc(-1 * var(--native-safe-right, 0px));
  z-index: -1;
  pointer-events: none;
  background: var(--nexora-home-background);
}
/* Each page carries its backdrop in the same composited transition surface.
   The homepage backdrop stays intact underneath throughout enter/return. */
html.native-edge-shell .nexora-workspace-scene {
  display: block;
  position: fixed;
  top: calc(-1 * var(--native-safe-top, 0px));
  bottom: calc(-1 * var(--native-safe-bottom, 0px));
  left: calc(-1 * var(--native-safe-left, 0px));
  right: calc(-1 * var(--native-safe-right, 0px));
  z-index: 17;
  isolation: isolate;
  opacity: 1;
  transition: opacity .28s ease-in-out;
  background-color: var(--native-workspace-base);
  background-image: var(--native-workspace-image);
  background-position: var(--native-workspace-position);
  background-size: var(--native-workspace-size);
  background-repeat: var(--native-workspace-repeat);
  background-attachment: var(--native-workspace-attachment);
  background-origin: var(--native-workspace-origin);
  background-clip: var(--native-workspace-clip);
}
html.native-edge-shell[data-home-theme] body[data-nexora-page="home"] > .cover {
  height: var(--native-content-height) !important;
  min-height: 0 !important;
  background: transparent !important;
}
html.native-edge-shell .nexora-workspace-scene:has(> .nexora-workspace-frame[hidden]) { display: none; }
html.native-edge-shell .nexora-workspace-scene:has(> .is-workspace-stage) { z-index: 18; opacity: 0; pointer-events: none; }
html.native-edge-shell .nexora-workspace-scene:has(> .is-workspace-revealing) { opacity: 1; pointer-events: auto; }
html.native-edge-shell .nexora-workspace-scene:has(> .is-workspace-leaving) { opacity: 0; pointer-events: none; }
html.native-edge-shell body.is-workspace-transitioning .nexora-workspace-scene { will-change: opacity; }
@media (prefers-reduced-motion: reduce) {
  html.native-edge-shell .nexora-workspace-scene { transition-duration: .01ms; }
}
/* The active child delegates its page background to the full-screen shell. */
html.native-edge-shell .nexora-workspace-frame[data-native-backdrop] {
  background: transparent !important;
}
/* Fixed frames live in the translated home shell. Use the safe viewport
   explicitly, not a percentage of a potentially expanded body. */
html.native-edge-shell .nexora-workspace-frame {
  box-sizing: border-box;
  position: absolute;
  top: var(--native-safe-top, 0px);
  left: var(--native-safe-left, 0px);
  width: calc(100% - var(--native-safe-left, 0px) - var(--native-safe-right, 0px)) !important;
  opacity: 1 !important;
  transition: none !important;
  height: var(--native-content-height) !important;
  max-height: var(--native-content-height);
}
@media (max-width: 760px) {
  html.native-edge-shell[data-layout="mobile"] .hero {min-height: calc(var(--native-content-height) - 138px);}
  /* Native insets are already outside the content viewport, never add twice. */
  html.native-edge-shell body[data-nexora-page="home"] > .cover {padding-bottom:18px;}
}
html.native-edge-shell #nexoraFloat {max-height: calc(var(--native-content-height) - 24px);}
html.native-edge-shell.native-secretary-overlay body {transform:none!important;width:100%!important;height:100dvh!important;}
