:root{
  --panel:rgba(18,18,20,.76);
  --panel2:rgba(18,18,20,.9);
  --text:#fff;
  --muted:rgba(255,255,255,.65);
  --line:rgba(255,255,255,.14);
}
*{box-sizing:border-box}
html,body,#app,#panorama{margin:0;width:100%;height:100%;overflow:hidden;background:#111;font-family:Arial,Helvetica,sans-serif}
#app{position:relative}
#panorama{position:absolute;inset:0}
.topbar{position:absolute;left:0;right:0;top:0;height:64px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 18px;background:linear-gradient(to bottom,rgba(0,0,0,.62),rgba(0,0,0,0));color:var(--text);z-index:20;pointer-events:none}
.brand{display:flex;align-items:baseline;gap:10px;letter-spacing:.03em}.brand strong{font-size:14px}.brand span{font-size:12px;color:var(--muted)}
.tour-title{font-size:14px;font-weight:600;text-shadow:0 1px 3px #000}
.top-actions{justify-self:end;display:flex;gap:8px;pointer-events:auto}.top-actions button,.rail-toggle{width:40px;height:40px;border:0;border-radius:12px;background:rgba(15,15,17,.64);color:white;font-size:21px;cursor:pointer;backdrop-filter:blur(10px)}
.top-actions button:hover,.rail-toggle:hover{background:rgba(15,15,17,.86)}
.scene-name{position:absolute;left:22px;bottom:138px;z-index:20;color:#fff;font-size:21px;font-weight:600;text-shadow:0 2px 8px #000;pointer-events:none}
.scene-rail{position:absolute;left:16px;right:16px;bottom:16px;height:106px;display:flex;gap:10px;overflow-x:auto;overflow-y:hidden;padding:8px;background:var(--panel);border:1px solid var(--line);border-radius:16px;backdrop-filter:blur(14px);z-index:20;scrollbar-width:none;transition:.25s ease}
.scene-rail::-webkit-scrollbar{display:none}
.scene-card{position:relative;flex:0 0 145px;height:88px;padding:0;border:1px solid rgba(255,255,255,.16);border-radius:11px;overflow:hidden;background:#222;color:white;cursor:pointer}
.scene-card img{width:100%;height:100%;object-fit:cover;display:block;transition:.2s ease}
.scene-card:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(0,0,0,.82))}
.scene-card span{position:absolute;left:10px;right:8px;bottom:8px;z-index:2;font-size:12px;font-weight:600;text-align:left;text-shadow:0 1px 2px #000}
.scene-card:hover img{transform:scale(1.035)}
.scene-card.active{outline:2px solid white;outline-offset:-2px}
.rail-toggle{position:absolute;right:18px;bottom:138px;z-index:21;display:none}
.hint{position:absolute;top:74px;left:50%;transform:translateX(-50%);z-index:20;padding:7px 11px;border-radius:18px;background:rgba(0,0,0,.45);color:rgba(255,255,255,.82);font-size:11px;pointer-events:none;opacity:1;transition:opacity .7s}
.pnlm-load-button{background:rgba(0,0,0,.65)!important;border-radius:10px!important}
.pnlm-controls-container{top:76px!important}
@media (max-width:700px){
  .topbar{height:58px;padding:0 12px;grid-template-columns:1fr auto}.tour-title{display:none}.brand span{display:none}.brand strong{font-size:12px}
  .top-actions button{width:38px;height:38px;border-radius:11px}
  .scene-rail{left:10px;right:10px;bottom:10px;height:98px;border-radius:14px;padding:7px;gap:8px}.scene-card{flex-basis:128px;height:82px}
  .scene-name{left:14px;bottom:121px;font-size:18px}.rail-toggle{display:block;bottom:116px;right:12px;width:38px;height:38px}
  .scene-rail.hidden{transform:translateY(125%);opacity:0;pointer-events:none}.scene-name.rail-hidden{bottom:18px}.rail-toggle.rail-hidden{bottom:14px}
  .hint{top:64px;max-width:84%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
/* V0.2 — hotspots espaciais */
.fs-hotspot-wrap{width:0!important;height:0!important}
.fs-hotspot{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;filter:drop-shadow(0 2px 6px rgba(0,0,0,.55));white-space:nowrap}
.fs-hotspot-dot{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.94);color:#18181a;font-size:21px;font-weight:700;border:2px solid rgba(255,255,255,.95);box-shadow:0 0 0 5px rgba(0,0,0,.18);transition:transform .18s ease,background .18s ease}
.fs-hotspot-label{padding:5px 9px;border-radius:12px;background:rgba(15,15,17,.72);backdrop-filter:blur(8px);color:white;font-size:11px;font-weight:600;opacity:.88;transition:opacity .18s ease}
.fs-hotspot:hover .fs-hotspot-dot{transform:scale(1.12);background:#fff}
.fs-hotspot:hover .fs-hotspot-label{opacity:1}
@media(max-width:700px){.fs-hotspot-dot{width:38px;height:38px;font-size:19px}.fs-hotspot-label{font-size:10px}}

/* V0.3 editor */
.edit-btn{width:auto!important;padding:0 14px!important;font-size:13px!important;font-weight:700!important}.edit-btn.active{background:#e31b23!important;color:#fff!important}
.edit-banner{position:fixed;left:50%;top:74px;transform:translateX(-50%);z-index:30;display:flex;align-items:center;gap:12px;background:rgba(18,20,24,.94);color:#fff;border-radius:12px;padding:10px 12px;box-shadow:0 8px 28px rgba(0,0,0,.25);font:13px/1.25 Arial,sans-serif;max-width:calc(100vw - 28px)}.edit-banner strong{color:#f04b53;white-space:nowrap}.edit-banner .edit-actions{display:flex;gap:6px;margin-left:8px}.edit-banner button{border:0;border-radius:7px;padding:7px 9px;cursor:pointer;background:#363a40;color:#fff}.hidden{display:none!important}
.modal{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.48);display:grid;place-items:center;padding:20px}.modal-card{width:min(430px,calc(100vw - 32px));background:#fff;border-radius:16px;padding:22px;color:#202329;box-shadow:0 22px 70px rgba(0,0,0,.35);font-family:Arial,sans-serif}.modal-card h2{margin:0 0 6px}.modal-card p{color:#666}.modal-card label{display:block;font-weight:700;margin:16px 0}.modal-card select{display:block;width:100%;margin-top:7px;padding:11px;border:1px solid #ccd0d5;border-radius:8px;background:#fff}.modal-card .check{display:flex;align-items:center;gap:9px;font-weight:500}.modal-card .check input{width:18px;height:18px}.modal-note{font-size:13px;line-height:1.4}.modal-buttons{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.modal-buttons button{padding:10px 14px;border:0;border-radius:8px;cursor:pointer}.modal-buttons .primary{background:#e31b23;color:#fff;font-weight:700}
.arrival-crosshair{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:35;pointer-events:none;width:44px;height:44px;border:2px solid rgba(255,255,255,.9);border-radius:50%;display:grid;place-items:center;box-shadow:0 0 0 2px rgba(0,0,0,.25)}.arrival-crosshair span{font:32px/1 Arial;color:#fff;text-shadow:0 1px 3px #000}.set-arrival{position:fixed;z-index:40;left:50%;bottom:112px;transform:translateX(-50%);border:0;border-radius:999px;background:#e31b23;color:#fff;font-weight:800;padding:13px 20px;box-shadow:0 8px 24px rgba(0,0,0,.28);cursor:pointer}
.toast{position:fixed;z-index:100;left:50%;bottom:30px;transform:translateX(-50%);background:#15181d;color:#fff;border-radius:999px;padding:11px 17px;font:13px Arial,sans-serif;box-shadow:0 8px 24px rgba(0,0,0,.25)}
body.placing-hotspot #panorama{cursor:crosshair}.fs-hotspot-wrap{cursor:pointer}.edit-banner .primary-action{background:#e31b23;color:#fff;font-weight:800}.edit-banner .primary-action.active{background:#a21a50}
@media(max-width:700px){.edit-banner{top:66px;flex-wrap:wrap}.edit-banner .edit-actions{margin-left:0}.set-arrival{bottom:96px}.brand span{display:none}}

/* =========================================================
   V0.5 — posicionamento por mira central + hotspot concêntrico
   ========================================================= */

/* Hotspot final: linguagem visual próxima da referência iStaging. */
.fs-hotspot-dot{
  position:relative;
  width:44px;
  height:44px;
  border-radius:50%;
  background:rgba(125,128,132,.78);
  border:2px solid rgba(255,255,255,.88);
  box-shadow:0 0 0 3px rgba(80,82,86,.28),0 3px 10px rgba(0,0,0,.36);
  color:transparent;
  font-size:0;
}
.fs-hotspot-dot::before{
  content:"";
  position:absolute;
  left:50%;top:50%;
  width:24px;height:24px;
  transform:translate(-50%,-50%);
  border:3px solid rgba(255,255,255,.92);
  border-radius:50%;
  box-sizing:border-box;
}
.fs-hotspot-dot::after{
  content:"";
  position:absolute;
  left:50%;top:50%;
  width:9px;height:9px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:rgba(255,255,255,.92);
  box-shadow:0 0 0 2px rgba(95,98,102,.55);
}
.fs-hotspot:hover .fs-hotspot-dot{transform:scale(1.1);background:rgba(115,118,122,.88)}

/* Mira central, usada tanto no posicionamento como na orientação de chegada. */
.target-marker{
  position:fixed;
  left:50%;
  top:50%;
  width:54px;
  height:54px;
  transform:translate(-50%,-50%);
  z-index:38;
  pointer-events:none;
  border-radius:50%;
  background:rgba(118,121,125,.66);
  border:2px solid rgba(255,255,255,.82);
  box-shadow:0 0 0 4px rgba(60,62,66,.22),0 5px 18px rgba(0,0,0,.34);
  backdrop-filter:blur(2px);
}
.target-ring,.target-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%}
.target-ring-outer{width:34px;height:34px;border:3px solid rgba(255,255,255,.92)}
.target-ring-mid{width:21px;height:21px;border:2px solid rgba(255,255,255,.62)}
.target-core{width:9px;height:9px;background:rgba(255,255,255,.96);box-shadow:0 0 0 2px rgba(92,95,100,.48)}
.target-marker-preview{animation:fsTargetPulse 1.45s ease-in-out infinite}
.target-marker-arrival{background:rgba(92,95,100,.66)}
@keyframes fsTargetPulse{
  0%,100%{box-shadow:0 0 0 4px rgba(60,62,66,.22),0 5px 18px rgba(0,0,0,.34)}
  50%{box-shadow:0 0 0 9px rgba(255,255,255,.10),0 5px 18px rgba(0,0,0,.34)}
}

.placement-controls{
  position:fixed;
  left:50%;
  bottom:142px;
  transform:translateX(-50%);
  z-index:42;
  display:flex;
  gap:9px;
  padding:7px;
  border-radius:14px;
  background:rgba(18,20,24,.9);
  box-shadow:0 8px 28px rgba(0,0,0,.28);
  backdrop-filter:blur(12px);
}
.placement-controls button{
  border:0;
  border-radius:9px;
  padding:11px 15px;
  cursor:pointer;
  color:#fff;
  background:#3b3f45;
  font-weight:700;
}
.placement-controls button.primary{background:#e31b23}
body.positioning-hotspot .scene-card{pointer-events:none;opacity:.64}
body.positioning-hotspot #panorama{cursor:grab}
body.positioning-hotspot #panorama:active{cursor:grabbing}

@media(max-width:700px){
  .target-marker{width:48px;height:48px}
  .target-ring-outer{width:30px;height:30px}
  .target-ring-mid{width:19px;height:19px}
  .placement-controls{bottom:116px;width:max-content;max-width:calc(100vw - 20px)}
  .placement-controls button{padding:10px 12px}
  .fs-hotspot-dot{width:40px;height:40px}
  .fs-hotspot-dot::before{width:22px;height:22px}
}
\n\n/* =========================================================\n   V0.5.1 — hotspot final simplificado + remoção do ícone\n   nativo de "scene" do Pannellum (evita a linha/seta).\n   ========================================================= */\n.pnlm-hotspot-base.fs-hotspot-wrap,\n.pnlm-hotspot-base.pnlm-scene.fs-hotspot-wrap{\n  width:0!important;\n  height:0!important;\n  background:none!important;\n  background-image:none!important;\n  border:0!important;\n  box-shadow:none!important;\n}\n.pnlm-hotspot-base.fs-hotspot-wrap::before,\n.pnlm-hotspot-base.fs-hotspot-wrap::after,\n.pnlm-hotspot-base.pnlm-scene.fs-hotspot-wrap::before,\n.pnlm-hotspot-base.pnlm-scene.fs-hotspot-wrap::after{\n  content:none!important;\n  display:none!important;\n}\n.fs-hotspot{gap:0;filter:drop-shadow(0 2px 5px rgba(0,0,0,.34))}\n.fs-hotspot-dot{\n  position:relative;\n  width:40px;\n  height:40px;\n  border-radius:50%;\n  background:rgba(142,145,149,.82);\n  border:1px solid rgba(255,255,255,.35);\n  box-shadow:0 1px 4px rgba(0,0,0,.22);\n  transition:transform .16s ease,background .16s ease;\n}\n.fs-hotspot-dot::before{\n  content:"";\n  position:absolute;\n  left:50%;top:50%;\n  width:24px;height:24px;\n  transform:translate(-50%,-50%);\n  border:3px solid rgba(255,255,255,.96);\n  border-radius:50%;\n  box-sizing:border-box;\n  background:transparent;\n}\n.fs-hotspot-dot::after{\n  content:"";\n  position:absolute;\n  left:50%;top:50%;\n  width:9px;height:9px;\n  transform:translate(-50%,-50%);\n  border-radius:50%;\n  background:rgba(255,255,255,.96);\n  box-shadow:none;\n}\n.fs-hotspot-label{\n  position:absolute;\n  top:45px;\n  left:50%;\n  transform:translateX(-50%);\n  opacity:0;\n  pointer-events:none;\n  padding:4px 8px;\n  border-radius:10px;\n  background:rgba(15,15,17,.72);\n  color:#fff;\n  font-size:11px;\n  font-weight:600;\n  transition:opacity .15s ease;\n}\n.fs-hotspot:hover .fs-hotspot-dot{transform:scale(1.06);background:rgba(132,135,139,.9)}\n.fs-hotspot:hover .fs-hotspot-label{opacity:1}\n@media(max-width:700px){.fs-hotspot-dot{width:38px;height:38px}.fs-hotspot-dot::before{width:23px;height:23px}}\n
/* =========================================================
   V0.5.2 — edição de hotspots existentes
   ========================================================= */
.pnlm-hotspot-base.pnlm-info.fs-hotspot-wrap{
  width:0!important;height:0!important;background:none!important;background-image:none!important;
  border:0!important;box-shadow:none!important;
}
.pnlm-hotspot-base.pnlm-info.fs-hotspot-wrap::before,
.pnlm-hotspot-base.pnlm-info.fs-hotspot-wrap::after{content:none!important;display:none!important}
body.editing .fs-hotspot{cursor:pointer}
body.editing .fs-hotspot-dot{box-shadow:0 0 0 2px rgba(255,255,255,.22),0 1px 5px rgba(0,0,0,.28)}
body.editing .fs-hotspot:hover .fs-hotspot-dot{box-shadow:0 0 0 3px rgba(227,27,35,.65),0 2px 7px rgba(0,0,0,.32)}
.editor-kicker{font-size:11px;font-weight:800;letter-spacing:.11em;color:#e31b23;margin-bottom:5px}
.hotspot-editor-card{width:min(470px,calc(100vw - 32px))}
.hotspot-editor-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:18px}
.editor-action{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid #e3e5e8;background:#f7f8fa;border-radius:11px;padding:12px;cursor:pointer;color:#202329;transition:.16s ease}
.editor-action:hover{transform:translateY(-1px);border-color:#cfd3d8;background:#fff;box-shadow:0 5px 16px rgba(0,0,0,.08)}
.editor-action .action-icon{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:#e8eaed;font-size:18px;flex:0 0 auto}
.editor-action span:last-child{display:flex;flex-direction:column;gap:2px}.editor-action strong{font-size:13px}.editor-action small{font-size:11px;color:#747980;font-weight:500}
.editor-action.primary-lite .action-icon{background:#ffe1ed;color:#d4145a}.editor-action.danger{color:#a92b39}.editor-action.danger .action-icon{background:#ffe7e9;color:#b31f31}
.delete-actions{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 4px}.danger-solid{border:0;border-radius:9px;padding:11px 13px;background:#b52b3c;color:#fff;font-weight:700;cursor:pointer}.danger-solid:hover{background:#982332}
@media(max-width:600px){.hotspot-editor-actions{grid-template-columns:1fr}.editor-action{padding:11px}.delete-actions{flex-direction:column}.delete-actions button{width:100%}}

/* =========================================================
   V0.5.3 — drag direto dos hotspots em modo Editar
   ========================================================= */
body.editing .fs-hotspot{
  cursor:grab;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
}
body.editing .fs-hotspot:active{cursor:grabbing}
body.dragging-hotspot,
body.dragging-hotspot *{cursor:grabbing!important}
.fs-drag-ghost{
  position:fixed;
  z-index:9999;
  transform:translate(-50%,-50%);
  pointer-events:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.36));
}
.fs-drag-ghost .fs-hotspot-dot{
  width:42px;
  height:42px;
  background:rgba(142,145,149,.9);
  transform:scale(1.04);
}
.fs-drag-label{
  padding:4px 8px;
  border-radius:10px;
  background:rgba(15,15,17,.78);
  color:#fff;
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
  box-shadow:0 2px 8px rgba(0,0,0,.22);
}

/* =========================================================
   V0.6 — hotspot limpo + planta interativa + rail colapsável
   ========================================================= */

/* Remove de forma agressiva qualquer sprite / linha nativa do Pannellum. */
.pnlm-hotspot-base.fs-hotspot-wrap,
.pnlm-hotspot-base.pnlm-info.fs-hotspot-wrap,
.pnlm-hotspot-base.pnlm-scene.fs-hotspot-wrap{
  width:0!important;height:0!important;
  background:none!important;background-image:none!important;
  border:0!important;box-shadow:none!important;
}
.pnlm-hotspot-base.fs-hotspot-wrap::before,
.pnlm-hotspot-base.fs-hotspot-wrap::after,
.pnlm-hotspot-base.pnlm-info.fs-hotspot-wrap::before,
.pnlm-hotspot-base.pnlm-info.fs-hotspot-wrap::after,
.pnlm-hotspot-base.pnlm-scene.fs-hotspot-wrap::before,
.pnlm-hotspot-base.pnlm-scene.fs-hotspot-wrap::after{
  content:none!important;display:none!important;background:none!important;
}
.fs-hotspot-dot{overflow:hidden!important}

/* A lista inferior pode agora ser recolhida também em desktop. */
.scene-rail{transition:transform .25s ease,opacity .2s ease}
.scene-rail.rail-collapsed{transform:translateY(calc(100% + 24px));opacity:0;pointer-events:none}
.scene-name.rail-collapsed{bottom:22px}
body.rail-collapsed .floorplan-panel{bottom:18px}

/* Planta */
.floorplan-panel{
  position:fixed;
  right:18px;
  bottom:138px;
  z-index:28;
  width:min(430px,calc(100vw - 36px));
  height:min(58vh,520px);
  min-height:300px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  border-radius:16px;
  background:rgba(18,18,20,.90);
  box-shadow:0 18px 55px rgba(0,0,0,.34);
  backdrop-filter:blur(16px);
  color:#fff;
}
.floorplan-head{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 10px 0 14px;border-bottom:1px solid rgba(255,255,255,.12)}
.floorplan-head>div{display:flex;align-items:baseline;gap:9px}.floorplan-head strong{font-size:13px}.floorplan-head span{font-size:11px;color:rgba(255,255,255,.62)}
.floorplan-head button{width:32px;height:32px;border:0;border-radius:9px;background:rgba(255,255,255,.08);color:#fff;font-size:21px;cursor:pointer}
.floorplan-canvas{position:relative;flex:1;min-height:0;overflow:hidden;background:#0f1012;touch-action:none}
.floorplan-canvas>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;pointer-events:none;user-select:none}
.floorplan-markers{position:absolute;inset:0;pointer-events:none}
.plan-marker{
  position:absolute;
  width:26px;height:26px;
  transform:translate(-50%,-50%);
  border:2px solid #fff;
  border-radius:50%;
  background:rgba(72,76,82,.84);
  box-shadow:0 2px 7px rgba(0,0,0,.38),0 0 0 3px rgba(255,255,255,.12);
  cursor:pointer;
  pointer-events:auto;
  touch-action:none;
}
.plan-marker::after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;transform:translate(-50%,-50%);border-radius:50%;background:#fff}
.plan-marker .plan-direction{
  position:absolute;left:50%;top:50%;width:0;height:0;
  transform-origin:0 0;
  border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:22px solid rgba(255,255,255,.44);
  transform:translate(-8px,-22px) rotate(var(--plan-angle,0deg));
  pointer-events:none;filter:drop-shadow(0 1px 2px rgba(0,0,0,.25));
}
.plan-marker.active{background:#e31b23;border-color:#fff;box-shadow:0 0 0 4px rgba(227,27,35,.22),0 3px 9px rgba(0,0,0,.4)}
body.editing .plan-marker{cursor:grab}body.editing .plan-marker:active{cursor:grabbing}
.plan-marker-label{position:absolute;left:50%;top:30px;transform:translateX(-50%);padding:3px 6px;border-radius:8px;background:rgba(8,8,10,.78);font-size:10px;font-weight:700;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .14s}
.plan-marker:hover .plan-marker-label,.plan-marker.active .plan-marker-label{opacity:1}
.plan-placement-hint{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:3;padding:7px 10px;border-radius:999px;background:rgba(227,27,35,.92);color:#fff;font-size:11px;font-weight:700;white-space:nowrap;box-shadow:0 5px 18px rgba(0,0,0,.24)}
body.plan-placing .floorplan-canvas{cursor:crosshair}
.floorplan-editbar{min-height:48px;display:flex;align-items:center;gap:7px;padding:8px;border-top:1px solid rgba(255,255,255,.12);background:rgba(10,10,12,.35)}
.floorplan-editbar button{border:0;border-radius:8px;padding:8px 10px;background:#373b41;color:#fff;font-size:11px;font-weight:700;cursor:pointer}.floorplan-editbar button.primary{background:#e31b23}
.floorplan-editbar span{margin-left:auto;font-size:10px;color:rgba(255,255,255,.62)}
body.editing .floorplan-editbar{display:flex!important}

@media(max-width:700px){
  .floorplan-panel{right:10px;left:10px;width:auto;bottom:120px;height:min(52vh,450px)}
  body.rail-collapsed .floorplan-panel{bottom:10px}
  .scene-name.rail-collapsed{bottom:18px}
  .floorplan-editbar{flex-wrap:wrap}.floorplan-editbar span{width:100%;margin-left:2px}
}

/* =========================================================
   V0.6.1 — refinamento visual + tabs integrados
   ========================================================= */

/* Hotspot robusto: removemos por JS as classes nativas do Pannellum e
   desenhamos o símbolo explicitamente. */
.pnlm-hotspot-base.fs-hotspot-wrap,
.pnlm-hotspot-base.fs-hotspot-wrap.fs-hotspot{
  width:0!important;
  height:0!important;
  min-width:0!important;
  min-height:0!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.pnlm-hotspot-base.fs-hotspot-wrap:before,
.pnlm-hotspot-base.fs-hotspot-wrap:after{
  content:none!important;
  display:none!important;
}
.fs-hotspot-dot{
  display:block!important;
  position:absolute!important;
  left:0!important;
  top:0!important;
  transform:translate(-50%,-50%)!important;
  width:40px!important;
  height:40px!important;
  border-radius:50%!important;
  background:rgba(142,145,149,.82)!important;
  border:1px solid rgba(255,255,255,.34)!important;
  box-shadow:0 2px 7px rgba(0,0,0,.30)!important;
  overflow:visible!important;
}
.fs-hotspot-dot::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:50%!important;top:50%!important;
  width:24px!important;height:24px!important;
  transform:translate(-50%,-50%)!important;
  border:3px solid rgba(255,255,255,.96)!important;
  border-radius:50%!important;
  background:transparent!important;
  box-sizing:border-box!important;
}
.fs-hotspot-dot::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:50%!important;top:50%!important;
  width:9px!important;height:9px!important;
  transform:translate(-50%,-50%)!important;
  border-radius:50%!important;
  background:#fff!important;
  border:0!important;
  box-shadow:none!important;
}
.fs-hotspot-label{
  top:24px!important;
}

/* Tabs de recolha: desenhados com CSS em vez de caracteres para garantir
   centralidade geométrica do chevron. */
.panel-tab{
  position:fixed;
  z-index:29;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(54,54,57,.72);
  color:#fff;
  backdrop-filter:blur(12px);
  box-shadow:0 5px 18px rgba(0,0,0,.20);
  cursor:pointer;
  display:grid;
  place-items:center;
  padding:0;
}
.panel-tab:hover{background:rgba(64,64,68,.90)}
.chevron{
  width:12px;height:12px;
  display:block;
  border-right:3px solid rgba(255,255,255,.94);
  border-bottom:3px solid rgba(255,255,255,.94);
  transform-origin:50% 50%;
}
.chevron-down{transform:translateY(-2px) rotate(45deg)}
.chevron-up{transform:translateY(2px) rotate(225deg)}
.chevron-left{transform:translateX(2px) rotate(135deg)}
.chevron-right{transform:translateX(-2px) rotate(-45deg)}

.rail-panel-tab{
  left:50%;
  bottom:106px;
  transform:translateX(-50%);
  width:72px;height:34px;
  border-radius:34px 34px 0 0;
  border-bottom:0;
  transition:bottom .25s ease,background .2s ease;
}
body.rail-collapsed .rail-panel-tab{
  bottom:0;
  border-radius:34px 34px 0 0;
}

.plan-side-tab{
  right:0;
  top:50%;
  transform:translateY(-50%);
  width:34px;height:72px;
  border-radius:34px 0 0 34px;
  border-right:0;
}
.floorplan-panel:not(.hidden) + .plan-side-tab{
  right:448px;
}

@media(max-width:700px){
  .rail-panel-tab{bottom:98px;width:64px;height:31px}
  body.rail-collapsed .rail-panel-tab{bottom:0}
  .floorplan-panel:not(.hidden) + .plan-side-tab{right:calc(100vw - 10px)}
}

/* =========================================================
   V0.6.2 — refinamento UX da planta + calibração manual
   ========================================================= */

/* Hotspot: movimento muito subtil e legenda ligeiramente mais baixa. */
.fs-hotspot-dot{
  animation:fsHotspotBreath 2.2s ease-in-out infinite!important;
}
.fs-hotspot-label{top:31px!important}
@keyframes fsHotspotBreath{
  0%,100%{box-shadow:0 2px 7px rgba(0,0,0,.30),0 0 0 0 rgba(255,255,255,.18)!important}
  50%{box-shadow:0 2px 7px rgba(0,0,0,.30),0 0 0 5px rgba(255,255,255,0)!important}
}
body.dragging-hotspot .fs-hotspot-dot,
.fs-drag-ghost .fs-hotspot-dot{animation:none!important}

/* A aba inferior fica realmente colada à barra e herda o mesmo vidro. */
.panel-tab{
  background:var(--panel)!important;
  border-color:var(--line)!important;
  backdrop-filter:blur(14px)!important;
}
.panel-tab:hover{background:rgba(18,18,20,.90)!important}
.rail-panel-tab{
  bottom:122px!important;
  width:72px!important;
  height:34px!important;
}
body.rail-collapsed .rail-panel-tab{bottom:0!important}

/* Chevron em SVG: centralidade visual muito mais estável. */
.chevron{width:20px!important;height:20px!important;display:grid!important;place-items:center!important;transform:none!important}
.chevron svg{width:18px;height:18px;display:block;fill:none;stroke:rgba(255,255,255,.96);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;transform-origin:50% 50%;transition:transform .18s ease}
.chevron-down svg{transform:rotate(0deg)}
.chevron-up svg{transform:rotate(180deg)}
.chevron-left svg{transform:rotate(90deg)}
.chevron-right svg{transform:rotate(-90deg)}

/* Planta mais leve / transparente. */
.floorplan-panel{
  background:rgba(18,18,20,.58)!important;
  border-color:rgba(255,255,255,.12)!important;
  box-shadow:0 18px 55px rgba(0,0,0,.24)!important;
  backdrop-filter:blur(12px)!important;
}
.floorplan-head{background:rgba(18,18,20,.30)}
.floorplan-canvas{
  background:rgba(9,10,12,.22)!important;
  cursor:default;
}
.floorplan-canvas.plan-can-pan{cursor:grab}
.floorplan-canvas.plan-panning{cursor:grabbing!important}
.floorplan-canvas>img{
  transform-origin:50% 50%;
  will-change:transform;
}

/* Controlos de zoom discretos. */
.plan-zoom-controls{
  position:absolute;
  right:10px;
  top:10px;
  z-index:6;
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:5px;
  border-radius:10px;
  background:rgba(18,18,20,.48);
  border:1px solid rgba(255,255,255,.10);
  backdrop-filter:blur(9px);
}
.plan-zoom-controls button{
  width:30px;height:30px;
  border:0;border-radius:7px;
  background:rgba(255,255,255,.09);
  color:#fff;
  font:700 18px/1 Arial,sans-serif;
  cursor:pointer;
}
.plan-zoom-controls button:hover{background:rgba(255,255,255,.17)}

/* Marcador: a seta roda geometricamente em torno do centro do ponto. */
.plan-marker{overflow:visible!important}
.plan-marker .plan-direction{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:34px!important;
  height:48px!important;
  border:0!important;
  transform:translate(-50%,-50%) rotate(var(--plan-angle,0deg))!important;
  transform-origin:50% 50%!important;
  pointer-events:none;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.28));
  z-index:-1;
}
.plan-marker .plan-direction::before{
  content:"";
  position:absolute;
  left:50%;top:0;
  transform:translateX(-50%);
  width:0;height:0;
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-bottom:22px solid rgba(255,255,255,.50);
}
body.editing .plan-marker.active .plan-direction{
  pointer-events:auto;
  cursor:crosshair;
  z-index:0;
}
body.editing .plan-marker.active .plan-direction::before{border-bottom-color:rgba(255,255,255,.78)}
body.editing .plan-marker.active .plan-direction:hover::before{border-bottom-color:#fff}
body.plan-direction-dragging,body.plan-direction-dragging *{cursor:crosshair!important}
.plan-marker::after{z-index:2}
.plan-marker-label{top:32px!important;z-index:4}

.floorplan-editbar{background:rgba(10,10,12,.24)!important}
.floorplan-editbar #resetCurrentDirection{white-space:nowrap}

@media(max-width:700px){
  .rail-panel-tab{bottom:108px!important;width:64px!important;height:31px!important}
  body.rail-collapsed .rail-panel-tab{bottom:0!important}
  .plan-zoom-controls{right:7px;top:7px;padding:4px}
  .plan-zoom-controls button{width:28px;height:28px}
}

/* =========================================================
   V0.6.3 — UX: labels, tabs simples, hit areas da planta + Info
   ========================================================= */

/* Mais respiração entre o símbolo e a legenda. */
.fs-hotspot-label{top:50px!important}

/* Tabs de recolha mais pequenas, simples e com o mesmo painel translúcido. */
.panel-tab{
  background:var(--panel)!important;
  border-color:var(--line)!important;
  box-shadow:0 3px 12px rgba(0,0,0,.16)!important;
  backdrop-filter:blur(14px)!important;
}
.panel-tab:hover{background:rgba(18,18,20,.90)!important}
.chevron{width:14px!important;height:14px!important;border:0!important;display:grid!important;place-items:center!important;transform:none!important}
.chevron svg{width:14px;height:14px;display:block;fill:none;stroke:rgba(255,255,255,.94);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.chevron-down,.chevron-up,.chevron-left,.chevron-right{transform:none!important}
.chevron-up svg{transform:rotate(180deg)}
.chevron-right svg{transform:rotate(180deg)}
.rail-panel-tab{
  width:46px!important;height:24px!important;
  bottom:116px!important;
  border-radius:18px 18px 0 0!important;
}
body.rail-collapsed .rail-panel-tab{bottom:0!important}
.plan-side-tab{
  width:24px!important;height:46px!important;
  border-radius:18px 0 0 18px!important;
}
.floorplan-panel:not(.hidden) + .plan-side-tab{right:448px}

/* A área de movimento é grande e invisível; a de rotação é menor e específica. */
.plan-marker .plan-move-hit{
  position:absolute;left:50%;top:50%;width:48px;height:48px;
  transform:translate(-50%,-50%);border-radius:50%;
  background:transparent;z-index:1;pointer-events:auto;
}
.plan-marker .plan-direction{
  width:18px!important;height:30px!important;
  z-index:4!important;
}
.plan-marker .plan-direction::before{
  border-left-width:6px!important;
  border-right-width:6px!important;
  border-bottom-width:16px!important;
}
body.editing .plan-marker.active .plan-direction{pointer-events:auto!important}
.plan-marker::after{z-index:3!important;pointer-events:none}
.plan-marker-label{z-index:5!important}

/* Botão Info */
#infoTour{font-family:Georgia,serif!important;font-style:italic;font-weight:700;font-size:19px!important}
.info-card{width:min(620px,calc(100vw - 28px));max-height:min(78vh,720px);overflow:auto}
.info-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.info-modal-head h2{margin:5px 0 0}
.info-close{width:34px;height:34px;border:0;border-radius:10px;background:rgba(255,255,255,.08);color:#fff;font-size:23px;cursor:pointer}
.info-view{margin-top:16px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12)}
.info-text{font-size:14px;line-height:1.65;color:rgba(255,255,255,.88);white-space:pre-wrap;min-height:36px}
.info-text.empty{color:rgba(255,255,255,.48);font-style:italic}
.info-edit{display:grid;gap:12px;margin-top:16px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12)}
.info-edit label{display:grid;gap:6px;font-size:11px;font-weight:700;color:rgba(255,255,255,.72)}
.info-edit input,.info-edit textarea{width:100%;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:rgba(255,255,255,.06);color:#fff;padding:10px 11px;font:13px/1.45 Arial,sans-serif;outline:none}
.info-edit textarea{resize:vertical;min-height:150px}
.info-edit input:focus,.info-edit textarea:focus{border-color:rgba(227,27,35,.75);box-shadow:0 0 0 2px rgba(227,27,35,.14)}

@media(max-width:700px){
  .rail-panel-tab{bottom:108px!important;width:42px!important;height:22px!important}
  body.rail-collapsed .rail-panel-tab{bottom:0!important}
  .floorplan-panel:not(.hidden) + .plan-side-tab{right:calc(100vw - 10px)}
}

/* =========================================================
   V0.6.4 — refinamento final: vermelho, hotspot vivo, labels, tabs e planta
   ========================================================= */

/* Hotspot com ligeiro movimento mais perceptível e legenda mais baixa. */
.fs-hotspot-dot{
  animation:fsHotspotPulse64 2.15s ease-in-out infinite!important;
}
@keyframes fsHotspotPulse64{
  0%,100%{
    background:rgba(142,145,149,.82)!important;
    box-shadow:0 2px 7px rgba(0,0,0,.30),0 0 0 0 rgba(255,255,255,.22)!important;
  }
  50%{
    background:rgba(154,157,161,.92)!important;
    box-shadow:0 2px 9px rgba(0,0,0,.34),0 0 0 7px rgba(255,255,255,0)!important;
  }
}
body.dragging-hotspot .fs-hotspot-dot,
.fs-drag-ghost .fs-hotspot-dot{animation:none!important}
.fs-hotspot-label{top:54px!important}

/* Painéis: tab simples e coerente. */
.plan-side-tab .chevron svg,
.rail-panel-tab .chevron svg{
  width:12px!important;
  height:12px!important;
  stroke-width:2.6!important;
}
.plan-side-tab{
  width:22px!important;
  height:44px!important;
}

/* Planta: centro move, zona externa/alta roda. */
.plan-marker{
  width:28px;
  height:28px;
}
.plan-marker .plan-move-hit{
  width:34px!important;
  height:34px!important;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  z-index:2;
}
.plan-marker .plan-direction{
  width:34px!important;
  height:44px!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,-100%) rotate(var(--plan-angle,0deg))!important;
  transform-origin:50% 100%!important;
  z-index:5!important;
}
.plan-marker .plan-direction::before{
  left:50%!important;
  top:4px!important;
  transform:translateX(-50%)!important;
  border-left-width:7px!important;
  border-right-width:7px!important;
  border-bottom-width:18px!important;
}
body.editing .plan-marker.active .plan-direction{
  pointer-events:auto!important;
}
.plan-marker::after{z-index:3!important}

/* Vermelho de referência em todos os estados de destaque. */
.edit-btn.active,
.modal-buttons .primary,
.set-arrival,
.edit-banner .primary-action,
.placement-controls button.primary,
.floorplan-editbar button.primary{
  background:#e31b23!important;
}
.edit-banner strong,
.editor-kicker{
  color:#e31b23!important;
}
.edit-banner .primary-action.active{background:#9f1218!important}
body.editing .fs-hotspot:hover .fs-hotspot-dot{
  box-shadow:0 0 0 3px rgba(227,27,35,.56),0 2px 7px rgba(0,0,0,.32)!important;
}
.plan-marker.active{
  background:#e31b23!important;
  box-shadow:0 0 0 4px rgba(227,27,35,.22),0 3px 9px rgba(0,0,0,.4)!important;
}
.plan-placement-hint{background:rgba(227,27,35,.92)!important}
.info-edit input:focus,.info-edit textarea:focus{
  border-color:rgba(227,27,35,.75)!important;
  box-shadow:0 0 0 2px rgba(227,27,35,.14)!important;
}

/* =========================================================
   V0.6.5 — correções visuais e hit-zones definitivas
   ========================================================= */

/* Forçar o painel Info para o mesmo tema escuro do viewer. */
.info-card{
  background:rgba(24,24,27,.96)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.12)!important;
  backdrop-filter:blur(16px)!important;
}
.info-card h2,.info-card label{color:#fff!important}
.info-card p{color:rgba(255,255,255,.68)!important}
.info-edit input,.info-edit textarea{
  background:rgba(255,255,255,.08)!important;
  color:#fff!important;
  caret-color:#fff!important;
}
.info-edit input::placeholder,.info-edit textarea::placeholder{color:rgba(255,255,255,.48)!important}

/* Hotspot: movimento no anel visível (não depende do transform do wrapper Pannellum). */
.fs-hotspot-dot{animation:none!important}
.fs-hotspot-dot::before{
  animation:fsHotspotRingPulse65 1.9s ease-in-out infinite!important;
  transform-origin:50% 50%!important;
}
@keyframes fsHotspotRingPulse65{
  0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.96}
  50%{transform:translate(-50%,-50%) scale(1.16);opacity:.62}
}
body.dragging-hotspot .fs-hotspot-dot::before,
.fs-drag-ghost .fs-hotspot-dot::before{animation:none!important}
.fs-hotspot-label{
  top:58px!important;
  margin-top:0!important;
}

/* Planta: seta do tab = esquerda quando aberta, direita quando fechada. */
.plan-side-tab .chevron-left svg{transform:none!important}
.plan-side-tab .chevron-right svg{transform:rotate(180deg)!important}

/* Centro = mover; anel exterior = rodar. */
.plan-marker{overflow:visible!important}
.plan-marker .plan-rotate-hit{
  position:absolute;
  left:50%;top:50%;
  width:66px;height:66px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:transparent;
  z-index:1;
  pointer-events:auto;
}
.plan-marker .plan-move-hit{
  width:34px!important;height:34px!important;
  z-index:6!important;
  pointer-events:auto!important;
  cursor:grab;
}
.plan-marker .plan-direction{
  pointer-events:none!important;
  width:30px!important;
  height:36px!important;
  transform:translate(-50%,-100%) rotate(var(--plan-angle,0deg))!important;
  transform-origin:50% 100%!important;
  z-index:4!important;
}
.plan-marker .plan-direction::before{
  top:8px!important;
  border-left-width:6px!important;
  border-right-width:6px!important;
  border-bottom-width:15px!important;
}
body.editing .plan-marker.active .plan-rotate-hit{cursor:crosshair}
body.editing .plan-marker:not(.active) .plan-rotate-hit{pointer-events:none}
body.editing .plan-marker.active .plan-move-hit{cursor:grab}

/* Aproximar visualmente a seta ao círculo. */
.plan-marker .plan-direction{height:31px!important}
.plan-marker .plan-direction::before{top:10px!important}

/* =========================================================
   V0.6.6 — cache-bust + tabs corretos + pulse dedicado
   ========================================================= */

/* Hotspot: halo dedicado, independente dos transforms nativos do Pannellum. */
.fs-hotspot-pulse{
  position:absolute;
  left:0;
  top:0;
  width:40px;
  height:40px;
  transform:translate(-50%,-50%) scale(.96);
  border:2px solid rgba(255,255,255,.62);
  border-radius:50%;
  pointer-events:none;
  z-index:-1;
  animation:fsHotspotPulse66 1.85s ease-out infinite;
}
@keyframes fsHotspotPulse66{
  0%{transform:translate(-50%,-50%) scale(.96);opacity:.62}
  62%{transform:translate(-50%,-50%) scale(1.30);opacity:.10}
  100%{transform:translate(-50%,-50%) scale(1.34);opacity:0}
}
body.dragging-hotspot .fs-hotspot-pulse,
.fs-drag-ghost .fs-hotspot-pulse{animation:none!important;display:none!important}

/* O círculo fica estável; é o halo exterior que respira. */
.fs-hotspot-dot,
.fs-hotspot-dot::before{animation:none!important}

/* Legenda definitivamente abaixo do círculo, com uma pequena folga. */
.fs-hotspot-label{
  top:34px!important;
  margin-top:0!important;
}

/* A seta do marcador da planta fica um pouco mais afastada do círculo. */
.plan-marker .plan-direction{
  height:39px!important;
}
.plan-marker .plan-direction::before{
  top:3px!important;
}

/* Estado do tab lateral: aberta = seta para a direita (fechar),
   fechada = seta para a esquerda (abrir). */
.plan-side-tab .chevron-left svg{transform:none!important}
.plan-side-tab .chevron-right svg{transform:rotate(180deg)!important}

/* =========================================================
   V0.6.7 — correções de interação da planta + hotspot visível
   ========================================================= */

/* Legendas da planta: contraste garantido. */
.plan-marker-label{
  color:#fff!important;
  background:rgba(12,12,14,.86)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.85)!important;
}

/* Centro pequeno = mover; toda a coroa exterior = rodar.
   O movimento deixa de estar associado ao botão inteiro. */
.plan-marker .plan-rotate-hit{
  width:78px!important;
  height:78px!important;
  z-index:4!important;
  pointer-events:auto!important;
}
.plan-marker .plan-move-hit{
  width:28px!important;
  height:28px!important;
  z-index:8!important;
  pointer-events:auto!important;
}
body.editing .plan-marker.active .plan-rotate-hit{cursor:crosshair!important}
body.editing .plan-marker .plan-move-hit{cursor:grab!important}

/* Seta visual um pouco mais afastada do círculo. */
.plan-marker .plan-direction{
  height:48px!important;
  z-index:6!important;
  pointer-events:none!important;
}
.plan-marker .plan-direction::before{
  top:0!important;
  border-left-width:7px!important;
  border-right-width:7px!important;
  border-bottom-width:18px!important;
}

/* Hotspot: halo realmente visível, acima do panorama e atrás do círculo. */
.pnlm-hotspot-base.fs-hotspot-wrap.fs-hotspot{
  overflow:visible!important;
  isolation:isolate!important;
}
.fs-hotspot-pulse{
  z-index:1!important;
  width:42px!important;
  height:42px!important;
  border:2.5px solid rgba(255,255,255,.78)!important;
  box-shadow:0 0 10px rgba(255,255,255,.20)!important;
  animation:fsHotspotPulse67 1.65s ease-out infinite!important;
}
.fs-hotspot-dot{
  z-index:2!important;
}
@keyframes fsHotspotPulse67{
  0%{transform:translate(-50%,-50%) scale(.92);opacity:.82}
  55%{transform:translate(-50%,-50%) scale(1.32);opacity:.24}
  100%{transform:translate(-50%,-50%) scale(1.48);opacity:0}
}
.fs-hotspot-label{
  position:absolute!important;
  left:0!important;
  top:58px!important;
  transform:translateX(-50%)!important;
  z-index:3!important;
  color:#fff!important;
}

/* =========================================================
   V0.6.8 — afinação: legenda hotspot + direção planta robusta
   ========================================================= */

/* A legenda aproxima-se ligeiramente do hotspot. */
.fs-hotspot-label{
  top:49px!important;
}

/* Setas da planta: ligeiramente mais próximas do círculo. */
.plan-marker .plan-direction{
  height:41px!important;
}
.plan-marker .plan-direction::before{
  top:4px!important;
}

/* O marcador deixa de ser um <button>: a zona exterior passa a receber
   pointer events de forma consistente fora do círculo central. */
.plan-marker{
  display:block;
  padding:0;
  border:2px solid #fff;
  outline:0;
}

/* Centro = mover; coroa exterior = rodar. A coroa é maior, mas o centro
   continua a ter prioridade por z-index. */
.plan-marker .plan-rotate-hit{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:64px!important;
  height:64px!important;
  transform:translate(-50%,-50%)!important;
  border-radius:50%!important;
  background:transparent!important;
  z-index:5!important;
  pointer-events:auto!important;
  touch-action:none!important;
}
.plan-marker .plan-move-hit{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:30px!important;
  height:30px!important;
  transform:translate(-50%,-50%)!important;
  border-radius:50%!important;
  background:transparent!important;
  z-index:9!important;
  pointer-events:auto!important;
  touch-action:none!important;
}
body.editing .plan-marker .plan-rotate-hit{cursor:crosshair!important}
body.editing .plan-marker .plan-move-hit{cursor:grab!important}
body.editing .plan-marker .plan-move-hit:active{cursor:grabbing!important}

/* Não bloquear a coroa de rotação nos marcadores que não são o panorama atual. */
body.editing .plan-marker:not(.active) .plan-rotate-hit{
  pointer-events:auto!important;
}

/* =========================================================
   V0.7.0 — pequena afinação visual antes do Admin
   ========================================================= */
.fs-hotspot-label{top:45px!important}

/* =========================================================
   V0.8.1 — contraste de planta + afinação final do viewer
   ========================================================= */
.fs-hotspot-label{top:42px!important}

/* Setas da planta legíveis sobre fundo claro ou escuro. */
.plan-marker .plan-direction{
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.95)) drop-shadow(0 0 2px rgba(0,0,0,.85))!important;
}
.plan-marker .plan-direction::before{
  border-bottom-color:rgba(255,255,255,.92)!important;
}
.plan-marker.active .plan-direction::before{
  border-bottom-color:#fff!important;
}

/* Em edição, a coroa exterior de rotação recebe o gesto; o centro move. */
body.editing .plan-marker .plan-rotate-hit{cursor:crosshair!important}
body.editing .plan-marker .plan-move-hit{cursor:grab!important}

/* =========================================================
   V0.8.1 — branding do empreendimento + transição suave
   ========================================================= */
.viewer-brand{min-width:1px;display:flex;align-items:center;height:46px}
.project-logo{display:block;max-width:190px;max-height:42px;object-fit:contain;filter:drop-shadow(0 1px 4px rgba(0,0,0,.32))}
.project-logo.hidden{display:none!important}
#panorama.fs-scene-transition{will-change:filter,transform;transform-origin:50% 50%}
@media(max-width:700px){.project-logo{max-width:126px;max-height:34px}.viewer-brand{height:38px}}

/* =========================================================
   V0.8.2 — transição contínua: zoom + fade simultâneos
   ========================================================= */
.scene-transition-overlay{
  position:fixed;
  inset:0;
  z-index:9;
  pointer-events:none;
  background:#111;
  opacity:0;
  transition:opacity 280ms cubic-bezier(.22,.61,.36,1);
}
.scene-transition-overlay.leaving{
  opacity:.68;
}
.scene-transition-overlay.entering{
  opacity:0;
  transition-duration:330ms;
}
#panorama.fs-scene-transition{
  will-change:filter,transform;
}

/* =========================================================
   V0.8.3 — crossfade real entre panoramas + zoom simultâneo
   ========================================================= */
.transition-panorama{
  position:fixed;
  inset:0;
  z-index:8;
  opacity:0;
  pointer-events:none;
  visibility:hidden;
  transition:opacity 440ms cubic-bezier(.22,.61,.36,1);
  background:transparent;
}
.transition-panorama.active{
  opacity:1;
  visibility:visible;
}
.transition-panorama .pnlm-container,
.transition-panorama .pnlm-render-container,
.transition-panorama canvas{
  background:transparent!important;
}
.transition-panorama .pnlm-controls-container,
.transition-panorama .pnlm-load-button,
.transition-panorama .pnlm-hotspot-base{
  display:none!important;
}

/* =========================================================
   V0.8.4 — transição sincronizada estilo iStaging
   Fade para o destino + zoom dos dois panoramas no mesmo frame.
   ========================================================= */
.transition-panorama{
  opacity:0!important;
  visibility:hidden!important;
  transition:
    opacity 500ms cubic-bezier(.33,1,.68,1),
    visibility 0s linear 500ms!important;
  background:transparent!important;
}
.transition-panorama.active{
  opacity:1!important;
  visibility:visible!important;
  transition:
    opacity 500ms cubic-bezier(.33,1,.68,1),
    visibility 0s linear 0s!important;
}

/* =========================================================
   V0.8.6 — transição contínua sem fade para preto
   Origem mantém-se visível; destino entra lentamente por cima.
   ========================================================= */
.transition-panorama{
  opacity:0!important;
  visibility:hidden!important;
  transition:
    opacity 560ms cubic-bezier(.55,.055,.675,.19),
    visibility 0s linear 560ms!important;
  background:transparent!important;
  will-change:opacity;
}
.transition-panorama.active{
  opacity:1!important;
  visibility:visible!important;
  transition:
    opacity 560ms cubic-bezier(.55,.055,.675,.19),
    visibility 0s linear 0s!important;
}
/* Handoff curto: por baixo já está exatamente a mesma cena. */
.transition-panorama.active.handoff{
  opacity:0!important;
  visibility:visible!important;
  transition:opacity 110ms cubic-bezier(.22,.61,.36,1)!important;
}

/* =========================================================
   V0.8.7 — navegação editor + drag de hotspot sem legenda
   ========================================================= */
.back-project{width:auto!important;padding:0 13px!important;font-size:12px!important;font-weight:750!important;white-space:nowrap}
.fs-drag-ghost-no-label{gap:0!important}
.fs-drag-ghost-no-label .fs-hotspot-label,
body.dragging-hotspot .fs-drag-label{display:none!important}

/* V0.8.8 — com a barra de panoramas recolhida, a aba da planta acompanha
   o painel (que desce) em vez de ficar presa ao centro do ecrã. */
body.rail-collapsed .plan-side-tab{
  top:calc(50% + 60px)!important;
}
@media(max-width:700px){
  body.rail-collapsed .plan-side-tab{top:calc(50% + 48px)!important}
}

/* =========================================================
   V0.8.9 — logo dimensionável + zoom integrado no canto superior direito
   ========================================================= */

/* Os controlos nativos do Pannellum deixam de ser usados no viewer principal. */
#panorama .pnlm-controls-container{display:none!important}

/* Logo: largura controlada pelo projeto, preservando proporção e permitindo
   uma presença visual maior sem forçar o topo a crescer. */
.viewer-brand{display:flex;align-items:center;min-width:0;height:58px}
.project-logo{
  display:block;
  width:220px;
  max-width:min(42vw,360px)!important;
  max-height:56px!important;
  object-fit:contain;
  object-position:left center;
  filter:drop-shadow(0 1px 4px rgba(0,0,0,.32));
}

/* Zoom do panorama alinhado verticalmente por baixo do Full Screen. */
.viewer-zoom-controls{
  position:fixed;
  right:18px;
  top:58px;
  z-index:21;
  display:flex;
  flex-direction:column;
  gap:6px;
  pointer-events:auto;
}
.viewer-zoom-controls button{
  width:40px;
  height:40px;
  border:0;
  border-radius:12px;
  background:rgba(15,15,17,.64);
  color:#fff;
  font:500 23px/1 Arial,sans-serif;
  cursor:pointer;
  backdrop-filter:blur(10px);
  box-shadow:0 3px 12px rgba(0,0,0,.12);
}
.viewer-zoom-controls button:hover{background:rgba(15,15,17,.86)}

@media(max-width:700px){
  .project-logo{max-width:min(46vw,240px)!important;max-height:46px!important}
  .viewer-zoom-controls{right:12px;top:58px;gap:5px}
  .viewer-zoom-controls button{width:38px;height:38px;border-radius:11px;font-size:21px}
}

/* =========================================================
   V0.11.0 — Multi-floor floorplan viewer
   ========================================================= */
.floorplan-head{gap:10px}
.floorplan-title{min-width:0;display:flex!important;align-items:baseline;gap:8px;overflow:hidden}
.floorplan-title span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
.floor-selector{display:flex;align-items:center;gap:5px;margin-left:auto;max-width:190px;overflow:auto;scrollbar-width:none}
.floor-selector::-webkit-scrollbar{display:none}
.floor-selector button{width:auto!important;height:28px!important;padding:0 9px!important;border-radius:999px!important;background:rgba(255,255,255,.08)!important;color:rgba(255,255,255,.72)!important;font-size:9px!important;font-weight:800!important;letter-spacing:.04em;white-space:nowrap;border:1px solid transparent!important}
.floor-selector button.active{background:#fff!important;color:#17181a!important;border-color:#fff!important}
.floor-selector.hidden{display:none!important}
.floorplan-canvas>img{max-width:none!important;max-height:none!important}
@media(max-width:700px){
  .floorplan-head{padding-left:10px!important;gap:6px}.floorplan-title span{display:none}
  .floor-selector{max-width:180px}.floor-selector button{padding:0 8px!important;font-size:8px!important}
}


/* V0.11.8 — pontos que ficaram fora do recorte continuam recuperáveis em edição. */
body.editing .plan-marker.plan-marker-outside{
  background:#f59e0b!important;
  border-color:#fff!important;
  box-shadow:0 0 0 4px rgba(245,158,11,.28),0 3px 9px rgba(0,0,0,.42)!important;
}
body.editing .plan-marker.plan-marker-outside .plan-marker-label{
  opacity:1!important;
  background:rgba(120,53,15,.92)!important;
}
body.editing .plan-marker.plan-marker-outside::before{
  content:"fora do recorte";
  position:absolute;left:50%;bottom:30px;transform:translateX(-50%);
  padding:2px 5px;border-radius:6px;background:rgba(120,53,15,.92);
  color:#fff;font-size:8px;font-weight:800;white-space:nowrap;pointer-events:none;
}


/* V0.12.1 — Vista por defeito + Cinematic Tour Intro — POLISH */
.edit-banner #setDefaultView.view-defined{
  background:#454a50;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.15);
  font-weight:700;
}

/* O HTML entra em tour-booting ANTES de qualquer JS. Isto elimina o flash
   inicial das barras / miniaturas enquanto boot.js ainda carrega o projeto. */
.tour-intro{
  position:fixed;inset:0;z-index:58;pointer-events:none;
  background:#030406;opacity:0;
  transition:opacity 980ms cubic-bezier(.22,.7,.18,1);
  will-change:opacity;
}
body.tour-booting .tour-intro,
body.tour-intro-active .tour-intro{opacity:1}
body.tour-intro-active .tour-intro.reveal{opacity:0}
.tour-intro.done{display:none}

/* Durante boot + movimento cinematográfico não existe qualquer informação
   sobre a imagem. A UI só é libertada quando o zoom terminou. */
body.tour-booting .topbar,
body.tour-booting .viewer-zoom-controls,
body.tour-booting .scene-name,
body.tour-booting .scene-rail,
body.tour-booting .rail-panel-tab,
body.tour-booting .hint,
body.tour-booting .floorplan-panel,
body.tour-booting .plan-side-tab,
body.tour-intro-active .topbar,
body.tour-intro-active .viewer-zoom-controls,
body.tour-intro-active .scene-name,
body.tour-intro-active .scene-rail,
body.tour-intro-active .rail-panel-tab,
body.tour-intro-active .hint,
body.tour-intro-active .floorplan-panel,
body.tour-intro-active .plan-side-tab{
  opacity:0!important;
  visibility:hidden;
  pointer-events:none!important;
}

/* Pannellum cria os hotspots depois do HTML; escondê-los também evita o
   pequeno "piscar" de círculos antes de a entrada estar concluída. */
body.tour-booting #panorama .pnlm-hotspot-base,
body.tour-booting #panorama .pnlm-load-box,
body.tour-booting #panorama .pnlm-about-msg,
body.tour-intro-active #panorama .pnlm-hotspot-base,
body.tour-intro-active #panorama .pnlm-load-box,
body.tour-intro-active #panorama .pnlm-about-msg{
  opacity:0!important;
  visibility:hidden!important;
}

/* No fim, tudo surge em conjunto mas com um fade suficientemente lento para
   não parecer um "pop". Mantemos as transforms próprias de cada componente. */
.topbar,
.viewer-zoom-controls,
.scene-name,
.scene-rail,
.rail-panel-tab,
.hint,
.floorplan-panel,
.plan-side-tab{
  transition:opacity 680ms cubic-bezier(.22,.7,.18,1),transform .25s ease;
}
#panorama .pnlm-hotspot-base{
  transition:opacity 620ms cubic-bezier(.22,.7,.18,1);
}

/* A blur CSS sobre todo o panorama foi removida nesta versão: em algumas GPUs
   provocava recomposição / flicker precisamente junto às barras inferiores. */
@media (prefers-reduced-motion:reduce){
  .tour-intro{transition:opacity 180ms linear}
  .topbar,.viewer-zoom-controls,.scene-name,.scene-rail,.rail-panel-tab,.hint,.floorplan-panel,.plan-side-tab,
  #panorama .pnlm-hotspot-base{transition-duration:180ms}
}


/* =========================================================
   V0.13.2 — Mobile viewport / scene handoff stability
   Em mobile, o visual viewport pode mudar quando a barra do browser recolhe.
   O viewer principal e a camada de transição passam a usar exatamente a
   mesma altura, evitando o salto vertical / faixa preta no handoff.
   ========================================================= */
html,body{
  min-height:100%;
  height:100dvh;
  overscroll-behavior:none;
}
#app{
  position:fixed!important;
  left:0!important;
  top:0!important;
  right:0!important;
  bottom:auto!important;
  width:100%!important;
  height:var(--fs-view-h,100dvh)!important;
  overflow:hidden!important;
  background:#111;
}
#panorama{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
}
/* Estas duas camadas vivem dentro de #app; absolute garante que o handoff
   usa a mesma caixa física do panorama principal, mesmo em Safari/Chrome mobile. */
.transition-panorama,
.tour-intro{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
}
@supports not (height:100dvh){
  html,body{height:100%}
  #app{height:var(--fs-view-h,100%)!important}
}