/* ==============================================================
   Correções mobile finais — iframe RV do hero
   ============================================================== */

html,
body {
  width: 100%;
  height: 100%;
  max-width: 100%;
  overflow: hidden;
  overscroll-behavior: none;
  touch-action: none;
}

#viewer {
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  touch-action: none !important;
}

body.hero-embed-mode .cameraBox.hidden,
body.hero-embed-mode .hint.hidden,
body.hero-embed-mode .hero-camera-controls.hidden {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

@media (max-width: 767px) {
  body.hero-embed-mode {
    --hero-camera-width: min(160px, calc(100vw - 28px)) !important;
    --hero-camera-bottom: max(12px, env(safe-area-inset-bottom)) !important;
    --hero-controls-height: 32px !important;
    --hero-stack-gap: 7px !important;
    --hero-guide-image-width: 92px !important;
  }

  body.hero-embed-mode .cameraBox,
  body.hero-embed-mode .hero-camera-controls,
  body.hero-embed-mode .hint.gesture-guide.gesture-guide--minimal {
    right: 12px !important;
    width: var(--hero-camera-width) !important;
    max-width: var(--hero-camera-width) !important;
  }

  body.hero-embed-mode .cameraBox {
    bottom: var(--hero-camera-bottom) !important;
    border-radius: 12px !important;
  }

  body.hero-embed-mode .hero-camera-controls {
    bottom: calc(var(--hero-camera-bottom) + (var(--hero-camera-width) * .75) + var(--hero-stack-gap)) !important;
    gap: 5px !important;
  }

  body.hero-embed-mode .hero-camera-controls button {
    height: var(--hero-controls-height) !important;
    min-height: var(--hero-controls-height) !important;
    padding: 5px 6px !important;
    font-size: 9.5px !important;
    line-height: 1.1 !important;
  }

  body.hero-embed-mode .hint.gesture-guide.gesture-guide--minimal {
    bottom: calc(var(--hero-camera-bottom) + (var(--hero-camera-width) * .75) + var(--hero-stack-gap) + var(--hero-controls-height) + var(--hero-stack-gap)) !important;
  }

  body.hero-embed-mode .gesture-guide__eyebrow {
    font-size: 7.5px !important;
    letter-spacing: .14em !important;
  }

  body.hero-embed-mode .gesture-guide__visual img {
    width: var(--hero-guide-image-width) !important;
    max-width: var(--hero-guide-image-width) !important;
  }

  body.hero-embed-mode .gesture-guide--minimal .gesture-guide__stage {
    gap: 6px !important;
  }

  body.hero-embed-mode .gesture-guide--minimal .gesture-guide__content h4 {
    font-size: 10.5px !important;
    line-height: 1.12 !important;
  }

  body.hero-embed-mode .gesture-guide--minimal .gesture-guide__content p {
    font-size: 9px !important;
    line-height: 1.2 !important;
  }

  body.hero-embed-mode.hero-camera-preview-hidden .hero-camera-controls {
    bottom: var(--hero-camera-bottom) !important;
  }

  body.hero-embed-mode.hero-camera-preview-hidden .hint.gesture-guide.gesture-guide--minimal {
    bottom: calc(var(--hero-camera-bottom) + var(--hero-controls-height) + var(--hero-stack-gap)) !important;
  }
}

@media (max-width: 767px) and (orientation: landscape) {
  body.hero-embed-mode {
    --hero-camera-width: min(138px, calc(100vw - 24px)) !important;
    --hero-guide-image-width: 70px !important;
    --hero-controls-height: 30px !important;
    --hero-stack-gap: 5px !important;
  }

  body.hero-embed-mode .hint.gesture-guide.gesture-guide--minimal {
    display: none !important;
  }

  body.hero-embed-mode .hero-camera-controls {
    bottom: calc(var(--hero-camera-bottom) + (var(--hero-camera-width) * .75) + var(--hero-stack-gap)) !important;
  }
}