.inreal-fp-front{width:100%;max-width:none;margin:0 auto;position:relative;}
.inreal-fp-bar{display:flex;align-items:center;gap:12px;margin:0 0 10px 0;}
.inreal-fp-title{font-size:16px;font-weight:700;line-height:1.2;color:#111;}
.inreal-fp-back{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(0,0,0,.12);background:#fff;border-radius:10px;padding:8px 12px;cursor:pointer;font-weight:600;}
.inreal-fp-back:hover{border-color:rgba(0,0,0,.22);}

.inreal-fp-stage{position:relative;border-radius:16px;overflow:hidden;background:#f3f4f6;box-shadow:0 8px 28px rgba(0,0,0,.08);}
/*
  IMPORTANT:
  Do NOT force a fixed aspect ratio (16:9). It causes letterboxing on floor plans
  and polygons drift away from the image.
  We keep the image in normal flow (width:100%; height:auto) and place the SVG overlay
  absolutely on top – exactly like the admin editor.
*/
.inreal-fp-bg{position:relative;width:100%;height:auto;display:block;}
.inreal-fp-canvas{position:absolute;left:0;top:0;right:0;bottom:0;}
.inreal-fp-canvas svg{width:100%;height:100%;display:block;}

.inreal-fp-hint{margin:10px 0 0 0;color:#6b7280;font-size:14px;}

.cds-modalOverlay{position:fixed;left:0;top:0;right:0;bottom:0;background:rgba(0,0,0,.6);display:none;z-index:99999;padding:18px;overflow:auto;}

.inreal-fp-popup{max-width:980px;margin:40px auto;background:#fff;border-radius:16px;overflow:hidden;display:flex;box-shadow:0 10px 40px rgba(0,0,0,.25);}
.inreal-fp-popup-left{width:58%;padding:18px;background:#f7f7f7;}
.inreal-fp-popup-right{width:42%;padding:18px;}
.inreal-fp-popup-img{width:100%;height:auto;border-radius:12px;border:1px solid rgba(0,0,0,.10);background:#fff;}
.inreal-fp-popup-meta{margin-top:12px;font-size:14px;line-height:1.55;color:#111;}
.inreal-fp-popup-title{font-size:18px;font-weight:800;margin-bottom:10px;color:#111;}
.inreal-fp-input{width:100%;padding:10px 12px;border:1px solid rgba(0,0,0,.12);border-radius:12px;margin-bottom:10px;outline:none;}
.inreal-fp-input:focus{border-color:rgba(0,0,0,.28);}
.inreal-fp-btn{width:100%;padding:12px;border:1px solid rgba(0,0,0,.12);border-radius:12px;background:#fff;font-weight:700;cursor:pointer;}
.inreal-fp-btn + .inreal-fp-btn{margin-top:10px;}
.inreal-fp-btn-primary{border:0;background:#d4a73b;color:#111;}

@media (max-width: 820px){
  .inreal-fp-popup{flex-direction:column;}
  .inreal-fp-popup-left,.inreal-fp-popup-right{width:100%;}
  .inreal-fp-popup{margin:18px auto;}
}


.inreal-fp-tooltip{position:absolute;z-index:60;background:rgba(17,17,17,.92);color:#fff;padding:10px 12px;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.25);pointer-events:none;backdrop-filter:blur(6px);font-size:13px;line-height:1.2;min-width:200px;}
.inreal-fp-tip-floor{font-weight:900;font-size:13px;letter-spacing:.2px;}
.inreal-fp-tip-sub{margin-top:4px;opacity:.92;}


/* Compass Lottie overlay */
.inreal-fp-compass{position:absolute;z-index:30;pointer-events:none;top:14px;right:14px;--fp-compass-size:96px;--fp-compass-rotate:0deg;width:var(--fp-compass-size);height:var(--fp-compass-size);filter:drop-shadow(0 8px 18px rgba(0,0,0,.18));opacity:var(--fp-compass-opacity,1);}
.inreal-fp-compass[data-pos="tr"]{top:14px;right:14px;left:auto;bottom:auto;}
.inreal-fp-compass[data-pos="tl"]{top:14px;left:14px;right:auto;bottom:auto;}
.inreal-fp-compass[data-pos="br"]{bottom:14px;right:14px;left:auto;top:auto;}
.inreal-fp-compass[data-pos="bl"]{bottom:14px;left:14px;right:auto;top:auto;}
.inreal-fp-compass .fp-compass-inner{width:100%;height:100%;transform:rotate(var(--fp-compass-rotate));transform-origin:center center;}