/* Mobile 3D viewer: native landscape fullscreen with a rotated fallback. */
html.ems-mobile-model-landscape-open,
html.ems-mobile-model-landscape-open body {
  overflow: hidden !important;
  overscroll-behavior: none;
}

html.ems-mobile-model-landscape-open #root {
  overflow: hidden !important;
}

/* Lift the model branch above the shared header/navigation stacking contexts
   and remove mobile scroll clipping only while the fallback is open. */
html.ems-mobile-model-landscape-open .ems-shared-content,
html.ems-mobile-model-landscape-open .ems-mobile-dashboard {
  z-index: 2147483600 !important;
}

html.ems-mobile-model-landscape-open .ems-mobile-scroll,
html.ems-mobile-model-landscape-open .ems-mobile-section--model {
  overflow: visible !important;
}

.ems-digital-twin.ems-mobile-landscape-active,
.ems-digital-twin.ems-mobile-landscape-fallback {
  color-scheme: dark;
  background: #020705 !important;
}

.ems-digital-twin.ems-mobile-landscape-active:fullscreen {
  width: 100vw !important;
  height: 100vh !important;
  max-width: none !important;
  max-height: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}

.ems-digital-twin.ems-mobile-landscape-fallback {
  position: fixed !important;
  z-index: 2147483647 !important;
  margin: 0 !important;
  max-width: none !important;
  max-height: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.ems-mobile-landscape-exit {
  position: absolute;
  z-index: 2147483646;
  top: max(10px, env(safe-area-inset-top));
  right: max(10px, env(safe-area-inset-right));
  display: inline-flex;
  gap: 6px;
  align-items: center;
  justify-content: center;
  min-width: 86px;
  height: 34px;
  padding: 0 12px;
  border: 1px solid var(--skin-accent, #e8ba55);
  border-radius: 5px;
  color: var(--skin-title, #fff1cc);
  background: color-mix(in srgb, var(--skin-panel-bg, #10100d) 90%, transparent);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.38);
  font: 600 12px/1 "Microsoft YaHei", "PingFang SC", sans-serif;
  cursor: pointer;
  backdrop-filter: blur(8px);
}

.ems-mobile-landscape-exit::before {
  content: '×';
  font-size: 19px;
  font-weight: 400;
  line-height: 1;
}

.ems-mobile-landscape-exit:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

.ems-digital-twin.ems-mobile-landscape-active .ems-twin-canvas-wrapper,
.ems-digital-twin.ems-mobile-landscape-fallback .ems-twin-canvas-wrapper,
.ems-digital-twin.ems-mobile-landscape-active canvas,
.ems-digital-twin.ems-mobile-landscape-fallback canvas {
  width: 100% !important;
  height: 100% !important;
}

@media (max-width: 900px) {
  .ems-digital-twin.ems-mobile-landscape-rotate:fullscreen,
  .ems-digital-twin.ems-mobile-landscape-fallback.ems-mobile-landscape-rotate {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    width: 100dvh !important;
    height: 100dvw !important;
    transform: translate(-50%, -50%) rotate(90deg) !important;
    transform-origin: center center !important;
  }

  .ems-digital-twin.ems-mobile-landscape-rotate .ems-twin-toolbar,
  .ems-digital-twin.ems-mobile-landscape-fallback.ems-mobile-landscape-rotate .ems-twin-toolbar {
    top: 10px;
    max-width: calc(100% - 116px);
  }
}

@media (max-width: 900px) {
  .ems-digital-twin.ems-mobile-landscape-fallback:not(.ems-mobile-landscape-rotate) {
    inset: 0 !important;
    width: 100dvw !important;
    height: 100dvh !important;
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ems-digital-twin.ems-mobile-landscape-active,
  .ems-digital-twin.ems-mobile-landscape-fallback {
    transition: none !important;
  }
}
