.rp2-host { isolation: isolate; }
  .rp2-host.rp2-positioned { position: relative; }
  .rp2-host.rp2-height-managed {
    box-sizing: border-box;
    height: var(--rp2-height, 100vh) !important;
    min-height: var(--rp2-height, 100vh) !important;
    max-height: none !important;
  }
  .rp2-host > .rp2-layer {
    position: absolute; inset: 0; z-index: -1; overflow: hidden;
    border-radius: inherit; pointer-events: none; user-select: none;
    opacity: 0; transition: opacity 180ms ease-out; contain: layout paint;
  }
  .rp2-host > .rp2-layer.rp2-ready { opacity: 1; }
  .rp2-layer > .rp2-viewport {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    overflow: hidden; pointer-events: none;
  }
  .rp2-viewport::after {
    content: ''; position: absolute; inset: 0; z-index: 4; pointer-events: none;
    opacity: var(--rp2-edge-opacity, 0);
    background: linear-gradient(90deg,
      var(--rp2-background, #d8dce6) 0%,
      transparent var(--rp2-side-fade, 0px),
      transparent calc(100% - var(--rp2-side-fade, 0px)),
      var(--rp2-background, #d8dce6) 100%);
  }
  .rp2-viewport > .rp2-base, .rp2-viewport > .rp2-magic,
  .rp2-viewport > .rp2-scene {
    position: absolute; inset: 0; display: block; width: 100%; height: 100%;
    max-width: none; margin: 0; padding: 0; border: 0; pointer-events: none;
  }
  .rp2-viewport > img { object-fit: fill; } /* Dimensões proporcionais calculadas abaixo. */
  .rp2-viewport > .rp2-base { z-index: 0; }
  .rp2-viewport > .rp2-magic { z-index: 1; opacity: 0; }
  .rp2-viewport > .rp2-scene { z-index: 2; }
  .rp2-scan { display: none; }
  .rp2-fallback .rp2-scan {
    display: block; position: absolute; inset: 0; z-index: 3; pointer-events: none;
    opacity: var(--rp2-scan-opacity, 0);
    clip-path: ellipse(var(--rp2-head-rx, 0px) var(--rp2-head-ry, 0px) at var(--rp2-head-x, 50%) var(--rp2-head-y, 50%));
    background-image: repeating-linear-gradient(0deg, var(--rp2-line-color, #B9C1D055) 0 var(--rp2-line-width, 0.65px), transparent var(--rp2-line-width, 0.65px) 24px),
      repeating-linear-gradient(90deg, var(--rp2-line-color, #B9C1D055) 0 var(--rp2-line-width, 0.65px), transparent var(--rp2-line-width, 0.65px) 28px);
    background-position: 0 var(--rp2-grid-shift, 0px);
    -webkit-mask-image: linear-gradient(transparent calc(var(--rp2-scan-y, 0px) - var(--rp2-scan-band, 150px)), #000 var(--rp2-scan-y, 0px), transparent calc(var(--rp2-scan-y, 0px) + 65px));
    mask-image: linear-gradient(transparent calc(var(--rp2-scan-y, 0px) - var(--rp2-scan-band, 150px)), #000 var(--rp2-scan-y, 0px), transparent calc(var(--rp2-scan-y, 0px) + 65px));
  }
  .rp2-layer.rp2-fallback .rp2-scene { display: none; }
  .rp2-layer.rp2-fallback .rp2-viewport > img {
    transform: translate3d(var(--shift-x, 0px), var(--shift-y, 0px), 0);
  }
  .rp2-layer.rp2-fallback .rp2-magic {
    opacity: var(--rp2-reveal, 0);
    clip-path: inset(0 calc(100% - var(--rp2-brush-front, 0%)) 0 0);
    -webkit-mask-image: radial-gradient(ellipse var(--reveal-width, 0px) var(--reveal-radius, 0px) at var(--pointer-x, 50%) var(--pointer-y, 50%), #000 65%, transparent 100%);
    mask-image: radial-gradient(ellipse var(--reveal-width, 0px) var(--reveal-radius, 0px) at var(--pointer-x, 50%) var(--pointer-y, 50%), #000 65%, transparent 100%);
  }
  @media (prefers-reduced-motion: reduce) {
    .rp2-host > .rp2-layer { transition: none; }
  }
.rp2-host > .rp2-content { position: relative; z-index: 1; width: 100%; height: 100%; pointer-events: auto; }
