:root {
  --qimah-native-header-height: 72px;
}

.qimah-native-shell-host {
  position: fixed;
  z-index: 2147482000;
  inset: 0;
  pointer-events: none;
}

.qimah-native-shell-clip {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.qimah-native-shell-frame {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  opacity: 0;
  pointer-events: auto;
  background: transparent;
  color-scheme: light;
  -webkit-clip-path: url("#qimah-native-shell-interactive-clip");
  clip-path: url("#qimah-native-shell-interactive-clip");
  transition: opacity 120ms ease;
}

.qimah-native-shell-hit-layer {
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
}

.qimah-native-shell-hit {
  position: absolute;
  display: block;
  padding: 0;
  border: 0;
  margin: 0;
  appearance: none;
  background: transparent;
  border-radius: 16px;
  color: transparent;
  font: inherit;
  opacity: 0.01;
  pointer-events: auto;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.qimah-native-shell-host.is-ready .qimah-native-shell-frame {
  opacity: 1;
}

.qimah-native-shell-host[data-mobile="true"]:not([data-overlay-open="true"]) .qimah-native-shell-frame {
  pointer-events: none;
}

.qimah-native-shell-host[data-overlay-open="true"] .qimah-native-shell-hit-layer {
  pointer-events: none;
}

@media (max-width: 740px) {
  :root {
    --qimah-native-header-height: 70px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .qimah-native-shell-frame {
    transition: none;
  }
}
