:root{
  --bg:#101216;
  --panel:#181b21;
  --panel2:#20242c;
  --line:#303641;
  --text:#f0f2f5;
  --muted:#9ba4b2;
  --accent:#e59d22;
  --danger:#d84e4e;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text);overflow:hidden}
button,input,select{font:inherit}
/* v3.84 R4 — compatibilidad visual para DOM creado por acciones Javascript.
   El editor usa tema oscuro en body; los overlays externos deben heredar un
   color neutro como en una página web/3DVista, sin sobrescribir colores que
   el propio script haya declarado en sus descendientes. */
.vista360-user-js-root{
  color:#111;
  color-scheme:light;
}
#app{height:100%;display:flex;flex-direction:column}
.topbar{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;background:#15181e;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;min-width:250px}
.brand-mark{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;background:var(--accent);font-weight:800;color:#15181e}
.brand-title{font-size:15px;font-weight:700}
.brand-sub{font-size:11px;color:var(--muted)}
.toolbar{display:flex;gap:7px;align-items:center}
.btn{border:1px solid #3c4350;background:#262b34;color:var(--text);padding:8px 11px;border-radius:6px;cursor:pointer;transition:.15s}
.btn:hover{background:#303641}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#141414;font-weight:700}
.btn.ghost{background:transparent}
.btn.danger{background:#3a2226;border-color:#63353b;color:#ffc5c5}
.btn.full{width:100%;margin-top:14px}
.workspace{flex:1;min-height:0;display:grid;grid-template-columns:250px minmax(0,1fr) 290px}
.left-panel,.right-panel{background:var(--panel);min-height:0;display:flex;flex-direction:column}
.left-panel{border-right:1px solid var(--line)}
.right-panel{border-left:1px solid var(--line);overflow:auto}
.panel-title{height:38px;display:flex;align-items:center;padding:0 12px;font-size:11px;font-weight:800;letter-spacing:.12em;color:#c7cdd7;border-bottom:1px solid var(--line)}
.section{border-bottom:1px solid var(--line)}
.section.grow{flex:1;min-height:100px;overflow:auto}
.section.help{padding-bottom:8px}
.section-header{height:34px;display:flex;align-items:center;justify-content:space-between;padding:0 11px;font-size:12px;color:#d6dbe3;background:#1b1f26}
.badge{padding:1px 7px;border-radius:10px;background:#303641;color:#bfc6d0;font-size:10px}
.tree-list{padding:6px}
.empty{font-size:11px;color:var(--muted);padding:8px}
.tree-item{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:5px;font-size:12px;cursor:pointer}
.tree-item:hover{background:#242932}
.tree-item.selected{background:#343b47}
.dot{width:9px;height:9px;border-radius:50%;flex:none}
.help-line{font-size:11px;color:#aeb6c2;padding:4px 10px}
.viewer-shell{min-width:0;min-height:0;display:flex;flex-direction:column;background:#0c0e11}
.viewer-toolbar{height:38px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 11px;background:#14171c}
.mode-label{font-size:11px;font-weight:800;color:#d6dbe3}
.camera-readout{display:flex;gap:14px;font-size:11px;color:var(--muted)}
.camera-readout b{color:#d7dce4}
.viewer{position:relative;flex:1;min-height:0;overflow:hidden;background:#08090b}
#glCanvas,#overlay{position:absolute;inset:0;width:100%;height:100%}
#glCanvas{display:block}
#overlay{pointer-events:none;overflow:visible}
#overlay polygon{pointer-events:all;cursor:pointer;transition:fill-opacity .12s,stroke-width .12s}
.empty-viewer{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#697381;pointer-events:none}
.empty-icon{font-size:38px;font-weight:800;color:#8993a2}
.empty-viewer h2{font-size:17px;margin:10px 0 2px}
.empty-viewer p{font-size:12px;margin:0}
.draw-hint{position:absolute;left:50%;top:14px;transform:translateX(-50%);background:#171b22e6;border:1px solid #414957;color:#e1e5eb;padding:7px 11px;border-radius:6px;font-size:11px;pointer-events:none;z-index:2147483000}
.hidden{display:none!important}
.bottom-status{height:26px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 9px;font-size:10px;color:#8d97a5;background:#12151a}
.properties{padding:12px}
.properties-empty{padding:18px 13px;color:var(--muted);font-size:12px;line-height:1.5}
.field{margin-bottom:10px}
.field.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.field.three{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.field label,.group-title{display:block;font-size:10px;color:#aab3bf;margin-bottom:5px}
.group-title{margin-top:16px;padding-bottom:5px;border-bottom:1px solid var(--line);font-weight:800;letter-spacing:.08em}
.field input,.field select{width:100%;background:#11141a;color:var(--text);border:1px solid #39404c;border-radius:5px;padding:7px}
.field input[type=color]{padding:2px;height:34px}
.state-buttons{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px;margin:5px 0 10px}
.state-buttons button{font-size:10px;padding:7px 3px;background:#262b34;color:#fff;border:1px solid #404754;border-radius:4px;cursor:pointer}
.state-buttons button:hover{filter:brightness(1.15)}
.check-row{display:flex;align-items:center;gap:7px;font-size:11px;color:#d5dbe4}
.info-card{position:absolute;left:270px;bottom:48px;width:280px;background:#171b22f2;border:1px solid #3d4551;border-radius:10px;padding:16px;box-shadow:0 15px 40px #0008;z-index:30;backdrop-filter:blur(10px)}
.close-card{position:absolute;right:8px;top:7px;border:0;background:transparent;color:#dfe4eb;font-size:22px;cursor:pointer}
.info-kicker{font-size:9px;letter-spacing:.13em;color:#929dab;margin-bottom:6px}
.info-name{font-size:20px;font-weight:800;margin-bottom:12px}
.info-row{display:flex;justify-content:space-between;padding:7px 0;border-top:1px solid #303743;font-size:11px}
.info-row span{color:#99a3b0}
.info-row b{color:#f0f2f5}

.edit-banner{
  margin-bottom:12px;
  padding:8px 9px;
  border:1px solid #7a5a1f;
  background:#2c2518;
  color:#f0b448;
  border-radius:5px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
}
.vertex-tools{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
}
.small-note{
  margin-top:8px;
  color:#8f99a7;
  font-size:10px;
  line-height:1.4;
}
#overlay circle.vertex-handle{
  pointer-events:all;
  cursor:grab;
}
#overlay circle.vertex-handle:active{
  cursor:grabbing;
}
#overlay circle.vertex-handle.selected-vertex{
  stroke:#ffffff;
  stroke-width:3;
}
.top-gap{margin-top:6px}
.toggle-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin-top:9px;
  font-size:10px;
  color:#c9d0d9;
}
.toggle-grid label{
  display:flex;
  align-items:center;
  gap:6px;
  background:#11141a;
  border:1px solid #343b47;
  padding:7px;
  border-radius:5px;
}
#overlay polygon.locked-poly{
  cursor:not-allowed;
}
.mode-label.move-mode{
  color:#f0b448;
}

.snap-settings{
  margin:8px;
  padding:8px;
  border:1px solid #343b47;
  border-radius:6px;
  background:#11141a;
  font-size:10px;
  color:#c8d0da;
}
.snap-settings label{
  display:flex;
  gap:6px;
  align-items:center;
}
.snap-tolerance{
  display:grid;
  grid-template-columns:1fr 54px 18px;
  gap:6px;
  align-items:center;
  margin-top:7px;
}
.snap-tolerance input{
  width:100%;
  background:#0c0f14;
  color:#fff;
  border:1px solid #39404c;
  border-radius:4px;
  padding:4px;
}
.shared-info{
  margin-top:9px;
  padding:7px 8px;
  background:#101820;
  border:1px solid #294353;
  border-radius:5px;
  color:#9fd7f2;
  font-size:10px;
}
#overlay circle.snap-target{
  pointer-events:none;
  fill:#65ff8a;
  fill-opacity:.26;
  stroke:#65ff8a;
  stroke-width:2;
}
#overlay circle.vertex-handle.shared-vertex{
  fill:#65ff8a;
  stroke:#ffffff;
}
#overlay circle.vertex-handle.active-vertex{
  stroke:#ffcf5a;
  stroke-width:4;
}

.mode-wrap{display:flex;align-items:center;gap:10px}
.selection-label{
  font-size:10px;
  color:#7f8996;
  border-left:1px solid #343b47;
  padding-left:10px;
}
.selection-label.selected{color:#f0b448}

.viewer-snap-toggle{
  display:flex;
  align-items:center;
  gap:5px;
  font-size:10px;
  color:#cfd6df;
  cursor:pointer;
  user-select:none;
  white-space:nowrap;
}
.viewer-snap-toggle input{
  margin:0;
  width:13px;
  height:13px;
  accent-color:#1d9ed6;
  cursor:pointer;
}
.viewer-snap-toggle:hover{color:#fff}
.object-type-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:5px;
  padding:8px;
}
.mini-tool{
  border:1px solid #39404c;
  background:#222730;
  color:#d7dce5;
  border-radius:5px;
  padding:6px 3px;
  font-size:9px;
  cursor:pointer;
}
.mini-tool.active{border-color:#e59d22;color:#f6c469}
.mini-tool.disabled{opacity:.42;cursor:not-allowed}
.tree-list.blank-click-area{min-height:52px}

.nav-hotspot{
  pointer-events:all;
  cursor:pointer;
}
.nav-hotspot circle{
  fill:#ffffff;
  stroke:#e59d22;
  stroke-width:3;
}
.nav-hotspot text{
  fill:#101216;
  font-weight:900;
  font-size:18px;
  text-anchor:middle;
  dominant-baseline:middle;
  pointer-events:none;
}
.image-hotspot{
  pointer-events:all;
  cursor:pointer;
}
.hotspot-selected-ring{
  fill:none;
  stroke:#ffffff;
  stroke-width:2;
  stroke-dasharray:5 4;
  pointer-events:none;
}
.pano-item-meta{
  margin-left:auto;
  font-size:9px;
  color:#8b95a2;
}

.hotspot-help{
  margin:-2px 0 12px;
  padding:7px 8px;
  background:#10161d;
  border:1px solid #2e3a47;
  border-radius:5px;
  color:#aeb8c4;
}
.image-resize-handle{
  pointer-events:all;
  cursor:nwse-resize;
  fill:#ffffff;
  stroke:#e59d22;
  stroke-width:2;
}
.hotspot-move-handle{
  pointer-events:none;
  fill:#e59d22;
  stroke:#ffffff;
  stroke-width:1.5;
}
.image-hotspot.selected-object,
.nav-hotspot.selected-object{
  cursor:move;
}

.field textarea{
  width:100%;
  resize:vertical;
  min-height:64px;
  background:#11141a;
  color:var(--text);
  border:1px solid #39404c;
  border-radius:5px;
  padding:7px;
  font:inherit;
}
.html-overlay{
  position:absolute;
  inset:0;
  pointer-events:none;
  overflow:hidden;
}
.webframe-object{
  position:absolute;
  transform:translate(-50%,-50%);
  border:2px solid transparent;
  border-radius:6px;
  overflow:visible;
  pointer-events:all;
  background:#111;
  box-shadow:0 6px 18px #0006;
}
.webframe-object.selected{
  border-color:#e59d22;
}
.webframe-object iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
  background:#fff;
  pointer-events:none;
  border-radius:4px;
}
.webframe-label{
  position:absolute;
  left:0;
  top:-24px;
  max-width:100%;
  padding:4px 7px;
  border-radius:4px 4px 0 0;
  background:#e59d22;
  color:#121212;
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  pointer-events:none;
}
.webframe-resize{
  position:absolute;
  right:-7px;
  bottom:-7px;
  width:14px;
  height:14px;
  border-radius:3px;
  background:#fff;
  border:2px solid #e59d22;
  cursor:nwse-resize;
  pointer-events:all;
}
.webframe-blocked{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  padding:15px;
  color:#aeb7c4;
  background:#181d24;
  font-size:11px;
  text-align:center;
}
.text-hotspot{
  pointer-events:all;
  cursor:move;
}
.text-hotspot text{
  pointer-events:none;
  dominant-baseline:middle;
  text-anchor:middle;
  font-family:Segoe UI,Arial,sans-serif;
}
.text-hotspot rect{
  pointer-events:none;
}

/* v0.9 — toolbar agrupada */
.tool-dropdown{
  position:relative;
}
.dropdown-btn{
  min-width:108px;
  display:flex;
  justify-content:center;
  gap:8px;
}
.dropdown-panel{
  position:absolute;
  top:calc(100% + 7px);
  left:0;
  width:245px;
  padding:6px;
  background:#181c22;
  border:1px solid #3c4350;
  border-radius:8px;
  box-shadow:0 16px 36px #0009;
  z-index:100;
}
.dropdown-item{
  width:100%;
  display:grid;
  grid-template-columns:32px 1fr;
  align-items:center;
  gap:8px;
  padding:8px;
  border:0;
  border-radius:6px;
  color:#e8ebef;
  background:transparent;
  text-align:left;
  cursor:pointer;
}
.dropdown-item:hover{
  background:#2b313a;
}
.dropdown-item b{
  display:block;
  font-size:12px;
}
.dropdown-item small{
  display:block;
  margin-top:2px;
  color:#8e98a6;
  font-size:9px;
  font-weight:400;
}
.tool-symbol{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:6px;
  border:1px solid #46505d;
  background:#11151a;
  color:#c9d2dc;
  font-weight:800;
}
.tool-symbol.vista360-element-type-icon svg{width:18px;height:18px;display:block;color:inherit}

/* Lista tipo editor: borrar sin entrar a Propiedades */
.tree-item{
  position:relative;
  padding-right:32px;
}
.item-delete{
  position:absolute;
  right:5px;
  top:50%;
  transform:translateY(-50%);
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:5px;
  background:transparent;
  color:#7f8996;
  cursor:pointer;
  opacity:0;
}
.tree-item:hover .item-delete,
.tree-item.selected .item-delete{
  opacity:1;
}
.item-delete:hover{
  background:#4b2529;
  color:#ffb8bd;
}

/* Panorama list delete */
.pano-delete{
  margin-left:5px;
}

/* status del preview */
.preview-badge{
  color:#f0b448;
}

#glCanvas{
  z-index:1;
}
#overlay{z-index:2}
.html-overlay{z-index:3}
.camera-readout #engineReadout{
  color:#f0b448;
  padding-right:8px;
  border-right:1px solid #343b47;
}

.viewer{touch-action:none;user-select:none;-webkit-user-select:none}

#engineReadout{
  min-width:88px;
}

.inline-number{
  width:48px!important;
  padding:3px 4px!important;
  margin-left:auto;
}

/* v1.1 — edición directa de lista */
.item-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.inline-rename{
  min-width:40px;
  width:100%;
  height:24px;
  padding:2px 6px;
  border:1px solid #e59d22;
  border-radius:4px;
  outline:none;
  background:#0e1116;
  color:#fff;
  font:inherit;
  font-size:11px;
}

/* Snap tipo CAD: ayudas visuales, no vértices nuevos */
.snap-readout{
  font-size:9px;
  font-weight:800;
  letter-spacing:.06em;
  color:#68ff91;
}
.snap-glyph{
  pointer-events:none;
  fill:none;
  stroke:#69ff91;
  stroke-width:2;
}
.snap-glyph-fill{
  pointer-events:none;
  fill:#0b1510;
  stroke:#69ff91;
  stroke-width:2;
}
.snap-label{
  pointer-events:none;
  fill:#69ff91;
  font-family:Segoe UI,Arial,sans-serif;
  font-size:10px;
  font-weight:800;
  paint-order:stroke;
  stroke:#071008;
  stroke-width:3px;
  stroke-linejoin:round;
}
.draft-vertex{
  pointer-events:none;
  fill:#ffffff;
  stroke:#e59d22;
  stroke-width:2;
}
.draft-vertex.active{
  fill:#69ff91;
  stroke:#ffffff;
  stroke-width:3;
}

.readonly-value{
  min-height:30px;
  display:flex;
  align-items:center;
  padding:6px 8px;
  border:1px solid #343b47;
  border-radius:5px;
  background:#101319;
  color:#aeb7c4;
  font-size:10px;
  word-break:break-all;
}
.media-hotspot{
  pointer-events:all;
  cursor:move;
}
.media-hotspot .media-bg{
  fill:#151a21;
  fill-opacity:.90;
  stroke:#e59d22;
  stroke-width:2;
}
.media-hotspot .media-symbol{
  fill:#f2f4f7;
  font-family:Segoe UI,Arial,sans-serif;
  font-weight:800;
  text-anchor:middle;
  dominant-baseline:middle;
  pointer-events:none;
}
.media-hotspot .media-caption{
  fill:#e1e5eb;
  font-family:Segoe UI,Arial,sans-serif;
  font-size:10px;
  text-anchor:middle;
  dominant-baseline:hanging;
  pointer-events:none;
}
.media-preview-modal{
  position:fixed;
  inset:0;
  z-index:500;
  display:grid;
  place-items:center;
  background:#000b;
}
.media-preview-box{
  width:min(900px,84vw);
  max-height:84vh;
  padding:10px;
  border:1px solid #434b57;
  border-radius:10px;
  background:#171b22;
  box-shadow:0 24px 60px #000b;
}
.media-preview-header{
  height:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 5px 7px;
}
.media-preview-video{
  width:100%;
  max-height:72vh;
  display:block;
  background:#000;
  border-radius:6px;
}

.transform-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:2;
  pointer-events:none;
}
#overlay{z-index:3}
.html-overlay{z-index:4}
.property-section-title{
  margin:15px -12px 10px;
  padding:10px 12px;
  border-top:1px solid #343b47;
  border-bottom:1px solid #343b47;
  background:#20242b;
  color:#d5d9df;
  font-size:12px;
  font-weight:700;
}
.transform-mode-row{
  display:flex;
  gap:18px;
  margin-bottom:9px;
  color:#d1d6dd;
  font-size:11px;
}
.transform-mode-row label{
  display:flex;
  align-items:center;
  gap:6px;
}
.transform-outline{
  pointer-events:none;
  fill:none;
  stroke:#20a9e8;
  stroke-width:2;
}
.transform-handle{
  pointer-events:all;
  cursor:move;
  fill:#fff;
  stroke:#15191f;
  stroke-width:1.5;
}
.transform-handle:hover{
  fill:#66d6ff;
}
.transform-center{
  pointer-events:all;
  cursor:move;
  fill:#ff8a00;
  stroke:#111;
  stroke-width:1.5;
}
.webframe-perspective{
  position:absolute;
  transform-origin:0 0;
  overflow:hidden;
  border:2px solid #20a9e8;
  background:#15191f;
  box-shadow:0 7px 22px #0007;
  pointer-events:all;
}
.webframe-perspective iframe{
  width:100%;
  height:100%;
  border:0;
  pointer-events:none;
  background:#fff;
}
.webframe-perspective .webframe-label{
  top:0;
}

/* v1.3.1 — transformación proyectiva real mediante CSS matrix3d */
.projective-object{
  position:absolute;
  left:0;
  top:0;
  transform-origin:0 0;
  pointer-events:all;
  will-change:transform;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.projective-image{
  display:block;
  object-fit:fill;
  user-select:none;
  -webkit-user-drag:none;
}
.projective-image.selected-object{
  cursor:move;
}
.projective-webframe{
  overflow:hidden;
  background:#14191f;
  border:1px solid #20a9e8;
}
.projective-webframe iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
  pointer-events:none;
  background:#fff;
}
.transform-mid-handle{
  pointer-events:all;
  cursor:move;
  fill:#fff;
  stroke:#15191f;
  stroke-width:1.5;
}
.transform-mid-handle:hover{
  fill:#66d6ff;
}

/* v1.4 */
.transform-mode-row{
  flex-wrap:wrap;
}
.generic-transform-box{
  pointer-events:all;
  position:absolute;
  transform-origin:0 0;
  will-change:transform;
}

/* v1.5 — controles de transformación */
.transform-rotate-handle{
  pointer-events:all;
  cursor:grab;
  fill:#ff9d22;
  stroke:#fff;
  stroke-width:2;
}
.transform-rotate-arm{
  pointer-events:none;
  stroke:#ff9d22;
  stroke-width:1.5;
  stroke-dasharray:4 3;
}
.transform-tilt-handle{
  pointer-events:all;
  cursor:ns-resize;
  fill:#34c3ff;
  stroke:#fff;
  stroke-width:2;
}
.transform-tilt-arm{
  pointer-events:none;
  stroke:#34c3ff;
  stroke-width:1.5;
  stroke-dasharray:4 3;
}
.three-axis-legend{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:7px 0 10px;
  padding:7px 8px;
  border:1px solid #343b47;
  border-radius:5px;
  background:#11151a;
  color:#b9c1cc;
  font-size:9px;
}
.three-axis-legend span{
  display:flex;
  align-items:center;
  gap:4px;
}
.legend-dot{
  width:9px;
  height:9px;
  display:inline-block;
  border-radius:50%;
  border:1px solid #fff;
}
.legend-dot.scale{background:#fff}
.legend-dot.rotate{background:#ff9d22}
.legend-dot.tilt{background:#34c3ff}

/* v1.6.1 CLASSIC — acciones sin cambiar el diseño general */
.compact-panorama-tools{
  display:flex;
  gap:6px;
  padding:7px 8px 9px;
}
.compact-action-btn{
  flex:1;
  padding:6px 7px!important;
  font-size:9px!important;
}
.classic-collapsible{
  margin:10px -12px 0;
  border-top:1px solid #343942;
  border-bottom:1px solid #272b32;
}
.classic-section-title{
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 12px;
  background:#22262d;
  color:#c6ccd4;
  font-size:11px;
  font-weight:700;
}
.classic-section-body{padding:9px 12px;background:#1b1f25}
.section-plus{
  width:24px;height:24px;
  border:0;border-radius:3px;
  background:#168fca;color:#fff;
  font-size:18px;line-height:1;
  cursor:pointer;
}
.tag-editor{display:grid;grid-template-columns:1fr 30px;gap:5px}
.tag-editor input{width:100%;box-sizing:border-box}
.tag-editor button{
  border:1px solid #3b424c;
  background:#282d35;color:#ddd;
  border-radius:4px;cursor:pointer;
}
.tag-list{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.tag-pill{
  padding:4px 7px;
  background:#e47f1f;color:#fff;
  border-radius:3px;font-size:9px;
  cursor:pointer;
}
.action-list{padding:7px 10px}
.action-row{
  display:flex;align-items:center;gap:8px;
  padding:7px 6px;
  border-bottom:1px solid #343942;
  color:#b7c0cb;font-size:9px;
}
.action-row button{margin-left:auto;border:0;background:transparent;color:#9ca6b3;cursor:pointer}
.studio-modal{
  position:fixed;inset:0;z-index:1400;
  background:#0009;display:grid;place-items:center;
}
.modal-window{
  background:#1f232a;
  border:1px solid #414852;
  box-shadow:0 20px 70px #000b;
  color:#d1d7df;
}
.compact-meta-window{width:min(520px,88vw)}
.compact-meta-body{padding:14px}
.modal-titlebar{
  height:44px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 14px;
  border-bottom:3px solid #1d9ed6;
  font-size:14px;
}
.modal-titlebar button{
  border:0;background:transparent;color:#aeb7c4;
  font-size:23px;cursor:pointer;
}
.action-library-window{width:min(900px,90vw)}
.action-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;padding:24px;
}
.action-choice{
  height:105px;
  border:1px solid transparent;
  background:#262b32;color:#aeb7c4;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:8px;cursor:pointer;
}
.action-choice:hover:not(.disabled){border-color:#1d9ed6;color:#fff}
.action-choice b{font-size:22px}
.action-choice.disabled{opacity:.32;cursor:default}
.action-config-window{width:min(820px,90vw)}
.action-config-layout{
  display:grid;
  grid-template-columns:320px 1fr;
  min-height:390px;
}
.action-config-left,.action-config-right{padding:16px}
.action-config-right{border-left:1px solid #3d444e}
.radio-row{display:flex;gap:9px;flex-wrap:wrap;font-size:10px;margin:10px 0}
.delay-row{
  display:grid;
  grid-template-columns:20px 1fr 65px 15px;
  gap:4px;align-items:center;
  font-size:10px;margin:12px 0;
}
.search-input{
  width:100%;box-sizing:border-box;
  background:#11151a;color:#ddd;
  border:1px solid #39404c;
  padding:7px;border-radius:4px;
}
.target-check-list{max-height:280px;overflow:auto;margin-top:7px}
.target-row{
  display:flex;align-items:center;gap:7px;
  padding:7px;
  border-bottom:1px solid #343942;
  font-size:10px;color:#b7c0cb;
}
.modal-footer{
  display:flex;justify-content:flex-end;gap:8px;
  padding:10px 14px;border-top:1px solid #3d444e;
}

.panorama-meta-footer{
  margin:10px -14px -14px;
}

.property-fold{margin:10px 0;border:1px solid #343b46;border-radius:5px;background:#181c22}
.property-fold summary{list-style:none;cursor:pointer;min-height:34px;padding:0 10px;display:flex;align-items:center;justify-content:space-between;color:#d1d7df;font-size:10px;font-weight:800;text-transform:uppercase}
.property-fold summary::-webkit-details-marker{display:none}.property-fold summary span{font-size:17px;color:#22a9e5;transition:transform .15s}.property-fold[open] summary span{transform:rotate(45deg)}.property-fold-body{border-top:1px solid #343b46;padding:10px}
.tree-item{display:grid!important;grid-template-columns:18px minmax(0,1fr) auto auto auto!important;gap:5px!important;align-items:center}
.layer-control{width:23px;height:23px;display:grid;place-items:center;border:0;border-radius:4px;background:transparent;color:#7f8996;cursor:pointer;padding:0;font-size:13px}.layer-control:hover{background:#2d343e;color:#fff}.layer-control.active{color:#f4f6f8}.layer-control.locked{color:#e3ad52}
.item-delete{position:static!important;transform:none!important;opacity:1!important;width:23px!important;height:23px!important}
.tree-item.dragging-layer{opacity:.42}.tree-item.layer-drop-before{box-shadow:inset 0 2px #22a9e5}.tree-item.layer-drop-after{box-shadow:inset 0 -2px #22a9e5}.layer-drag-hint{color:#6e7885;font-size:9px;padding:5px 8px 7px}
.device-tabs{display:grid;grid-template-columns:1fr 1fr;margin:8px 0}.device-tab{border:0;background:#11151a;color:#818a96;padding:8px;cursor:pointer}.device-tab.active{color:#fff;border-top:3px solid #20a9e8}
.skin-components-window{width:min(720px,90vw)}.skin-components-body{padding:14px}.skin-create-row{display:flex;gap:7px;margin-bottom:9px}.skin-manager-list{margin-top:10px;max-height:390px;overflow:auto}
.skin-manager-row{display:grid;grid-template-columns:25px minmax(120px,1fr) 110px 85px 32px;gap:7px;align-items:center;padding:7px;border-bottom:1px solid #343b46}.skin-manager-row input,.skin-manager-row select{width:100%;box-sizing:border-box;background:#11151a;color:#dbe0e6;border:1px solid #39404c;border-radius:4px;padding:5px}.skin-manager-row .skin-delete{border:0;background:transparent;color:#9ca6b3;font-size:18px;cursor:pointer}
.transform-rotate-symbol{pointer-events:none;fill:#ff9d22;font-size:15px;font-weight:900;text-anchor:middle;dominant-baseline:middle}

/* v1.8 — lista de capas y capas cruzadas */
.tree-item{
  display:grid!important;
  grid-template-columns:24px 24px 18px minmax(0,1fr) 24px!important;
  gap:2px!important;
  padding-left:4px!important;
  padding-right:2px!important;
  align-items:center;
}
.layer-control{
  width:24px;height:24px;
  display:grid;place-items:center;
  padding:0;border:0;background:transparent;
  color:#8c96a4;cursor:pointer;
}
.layer-control svg{
  width:16px;height:16px;
  display:block;
  stroke:currentColor;
  fill:none;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.layer-control.active{color:#dce2e9}
.layer-control.locked{color:#e9b45a}
.layer-type-icon{display:grid;place-items:center;width:18px;height:24px;color:#c9d2dc;font-size:12px}
.tree-item .item-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.tree-item .item-delete{
  width:24px!important;height:24px!important;
  margin:0!important;padding:0!important;
  justify-self:end!important;
  right:auto!important;left:auto!important;
  position:static!important;
  opacity:1!important;
}
.polygon-layer-object{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
}
.polygon-layer-object polygon{
  pointer-events:all;
  cursor:pointer;
}

/* v1.9 — lista de panoramas limpia */
.pano-tree-item{
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr) 24px!important;
  gap:2px!important;
  padding-left:4px!important;
  padding-right:2px!important;
}
.pano-tree-item .pano-list-icon{
  width:24px;
  display:grid;
  place-items:center;
  color:#dce2e9;
  font-size:11px;
}
.pano-tree-item .item-name{
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.pano-tree-item .pano-delete{
  width:24px!important;
  height:24px!important;
  justify-self:end!important;
  margin:0!important;
}
.pano-item-meta{display:none!important}

/* v1.13 — Editor de texto y controles de transformación */
.text-style-row{
  display:flex;
  gap:6px;
  margin:8px 0 12px;
}
.style-toggle input{display:none}
.style-toggle span{
  width:34px;height:30px;
  display:grid;place-items:center;
  border:1px solid #3c4450;
  background:#20252c;
  color:#d7dde5;
  border-radius:4px;
  cursor:pointer;
}
.style-toggle input:checked + span{
  background:#168fca;
  border-color:#36b9ef;
  color:#fff;
}
.text-color-grid{
  display:grid;
  gap:8px;
  margin:8px 0 12px;
}
.text-color-control{
  display:grid;
  grid-template-columns:86px 1fr auto;
  gap:7px;
  align-items:center;
}
.text-color-control > label:first-child{
  font-size:10px;
  color:#aeb7c4;
}
.color-swatch-btn{
  min-height:34px;
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid #3c4450;
  background:#282d35;
  border-radius:4px;
  color:#dce3eb;
  cursor:pointer;
  padding:4px 8px;
}
.color-swatch-btn span{
  width:30px;height:22px;
  border:1px solid #6b7480;
  background:#fff;
}
.color-swatch-btn code{
  font-family:Consolas,monospace;
  font-size:10px;
}
.none-color-check{
  font-size:9px;
  color:#9ea8b4;
  white-space:nowrap;
}
.color-palette-popover{
  position:fixed;
  z-index:3000;
  width:310px;
  padding:10px;
  background:#242830;
  border:1px solid #434a55;
  box-shadow:0 12px 35px #000b;
  border-radius:5px;
}
.palette-top{
  display:grid;
  grid-template-columns:48px 1fr 34px;
  gap:7px;
  align-items:center;
  margin-bottom:8px;
}
.palette-current{
  height:28px;
  border:1px solid #6b7480;
  background:#fff;
}
.palette-top input[type="text"]{
  height:30px;
  box-sizing:border-box;
  background:#4f535a;
  color:#fff;
  border:0;
  padding:0 8px;
  font-family:Consolas,monospace;
}
.palette-top input[type="color"]{
  width:34px;height:30px;
  border:0;padding:0;background:transparent;
}
.palette-grid{
  display:grid;
  grid-template-columns:repeat(18, 1fr);
  gap:1px;
  background:#111;
  padding:1px;
}
.palette-cell{
  aspect-ratio:1;
  border:0;
  min-width:0;
  cursor:pointer;
}
.palette-cell:hover{
  outline:2px solid #fff;
  outline-offset:-2px;
  z-index:1;
}
.palette-footer{
  display:flex;
  justify-content:space-between;
  gap:7px;
  margin-top:9px;
}
.generic-transform-box.text-hotspot{
  overflow:visible!important;
  white-space:pre-wrap;
  word-break:normal;
  line-height:1.08;
  box-sizing:border-box;
}
.transform-handle{cursor:nwse-resize!important}
.transform-mid-handle:nth-of-type(odd){cursor:ns-resize}
.transform-mid-handle:nth-of-type(even){cursor:ew-resize}
.transform-rotate-handle{cursor:crosshair!important}
.transform-tilt-handle{cursor:ns-resize!important}
.transform-handle:hover,.transform-mid-handle:hover,.transform-rotate-handle:hover,.transform-tilt-handle:hover{
  filter:drop-shadow(0 0 4px #43c7ff);
}
.transform-direction-symbol{
  pointer-events:none;
  fill:#0b1015;
  stroke:#fff;
  stroke-width:.4px;
  font-size:13px;
  font-weight:900;
  text-anchor:middle;
  dominant-baseline:middle;
}
.draft-close-vertex{
  fill:#28d17c!important;
  stroke:#fff!important;
  stroke-width:2!important;
  cursor:pointer!important;
}

/* v1.14 — paleta universal + sliders numéricos + cuadro de texto */
.compact-color-swatch{
  width:100%;
  min-height:34px;
  justify-content:flex-start;
}
.compact-color-swatch span{
  width:28px;
  height:22px;
}
.range-number-wrap{
  display:grid;
  grid-template-columns:minmax(0,1fr) 64px;
  gap:7px;
  align-items:center;
  width:100%;
}
.range-number-wrap > input[type="range"]{
  width:100%!important;
  min-width:0;
}
.range-number-input{
  width:64px!important;
  box-sizing:border-box;
  padding:6px!important;
  text-align:center;
  font-variant-numeric:tabular-nums;
}
.text-width-handle{
  fill:#ffffff!important;
  stroke:#15191f!important;
  stroke-width:1.8!important;
  cursor:ew-resize!important;
}
.text-width-handle:hover{
  fill:#66d6ff!important;
}
.text-width-symbol{
  pointer-events:none;
  fill:#0d1319;
  font-size:11px;
  font-weight:900;
  text-anchor:middle;
  dominant-baseline:middle;
}

/* v1.15 — alineación de texto */
.text-align-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:5px;
  margin:0 0 12px;
}
.text-align-btn{
  height:30px;
  border:1px solid #3c4450;
  border-radius:4px;
  background:#20252c;
  color:#cfd6df;
  cursor:pointer;
  font-size:17px;
  line-height:1;
}
.text-align-btn:hover{background:#2a313a;color:#fff}
.text-align-btn.active{
  background:#168fca;
  border-color:#36b9ef;
  color:#fff;
}

/* v1.16 — Biblioteca de imágenes/hotspots */
.image-library-window{
  width:min(1120px,94vw);
  height:min(760px,88vh);
  display:grid;
  grid-template-rows:46px 46px 1fr 56px;
  overflow:hidden;
}
.image-library-toolbar{
  display:flex;
  align-items:center;
  gap:7px;
  padding:6px 14px;
  background:#242830;
  border-bottom:1px solid #353b45;
}
.library-tool-btn{
  width:36px;height:32px;
  display:grid;place-items:center;
  border:0;border-radius:4px;
  background:transparent;color:#aab2bc;
  cursor:pointer;
  font-size:17px;
}
.library-tool-btn:hover,.library-tool-btn.active{
  background:#343b45;color:#fff;
}
.library-toolbar-sep{
  height:28px;width:1px;background:#434a55;margin:0 4px;
}
.library-toolbar-note{font-size:10px;color:#7f8995}
.image-library-layout{
  min-height:0;
  display:grid;
  grid-template-columns:250px 1fr;
}
.image-library-sidebar{
  overflow:auto;
  padding:18px 14px;
  background:#28252d;
  border-right:1px solid #3d3942;
}
.library-section-title{
  color:#d5d0d8;
  font-size:15px;
  margin-bottom:5px;
}
.library-type-title{margin-top:24px}
.library-filter-list{
  display:flex;
  flex-direction:column;
  gap:1px;
}
.library-filter-btn{
  appearance:none;
  border:0;
  background:transparent;
  color:#99949e;
  text-align:left;
  padding:4px 12px;
  border-radius:3px;
  cursor:pointer;
  font-size:12px;
}
.library-filter-btn:hover{background:#34313a;color:#ddd}
.library-filter-btn.active{
  color:#fff;
  font-weight:700;
}
.image-library-content{
  min-width:0;
  min-height:0;
  overflow:auto;
  padding:20px 24px;
  background:#26232b;
}
.library-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(135px,1fr));
  gap:18px 12px;
}
.library-card{
  position:relative;
  min-width:0;
  min-height:145px;
  padding:9px 8px 7px;
  border:1px solid transparent;
  border-radius:5px;
  background:transparent;
  color:#aaa5ae;
  cursor:pointer;
}
.library-card:hover{
  background:#2e2b34;
  border-color:#4a4650;
}
.library-card.selected{
  border-color:#c8cbd0;
  background:#2c2932;
}
.library-card-thumb{
  height:94px;
  display:grid;
  place-items:center;
  overflow:hidden;
}
.library-card-thumb img{
  width:86px;
  height:86px;
  object-fit:contain;
  filter:drop-shadow(0 2px 1px #0007);
}
.library-card-name{
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  text-align:center;
  font-size:11px;
  margin-top:6px;
}
.library-card.selected .library-card-name{color:#28b7f0}
.library-fav{
  position:absolute;
  right:5px;top:5px;
  width:24px;height:24px;
  border:0;border-radius:50%;
  background:#111a;
  color:#777;
  cursor:pointer;
  z-index:2;
}
.library-fav.active{color:#ffb52a}
.library-animated-badge{
  position:absolute;
  left:7px;top:7px;
  padding:2px 5px;
  border-radius:3px;
  background:#138bc7;
  color:#fff;
  font-size:8px;
}
.image-library-footer{
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 12px;
  background:#242830;
  border-top:1px solid #3c424b;
}
.library-search{
  width:220px;
  box-sizing:border-box;
  padding:8px 10px;
  background:#34313a;
  color:#ddd;
  border:1px solid #414752;
  border-radius:3px;
  font-style:italic;
}
.library-footer-spacer{flex:1}
.library-empty{
  grid-column:1/-1;
  display:grid;
  place-items:center;
  min-height:300px;
  color:#77727d;
  text-align:center;
}

/* v1.17 — Biblioteca visual muy cercana al flujo de referencia, con variación propia */
.vista-library{
  background:#29262f;
  border-radius:5px;
  border-color:#3b3942;
}
.vista-library .library-titlebar{
  background:#29272f;
  font-size:15px;
  height:43px;
  border-bottom:3px solid #13a8e4;
}
.vista-library .image-library-toolbar{
  height:42px;
  padding:4px 18px;
  background:#29262f;
}
.vista-library .image-library-sidebar{
  background:#2b2831;
  width:auto;
  padding:16px 14px 12px 22px;
}
.library-side-special{
  display:block;
  width:100%;
  border:0;
  background:transparent;
  color:#aaa5ad;
  text-align:left;
  padding:3px 0;
  font-size:13px;
  cursor:pointer;
}

.vista-library .library-section-title{
  font-size:13px;
  margin-top:12px;
  color:#ded9df;
}
.vista-library .library-filter-btn{
  padding:3px 10px;
  font-size:11px;
  color:#9d98a1;
}
.vista-library .library-filter-btn.active{
  color:#fff;
  background:transparent;
}
.vista-library .image-library-content{
  background:#2b2831;
  padding:18px 28px;
}
.vista-library .library-grid{
  grid-template-columns:repeat(auto-fill,minmax(128px,1fr));
  gap:26px 16px;
}
.vista-library .library-card{
  min-height:150px;
  padding:7px;
}
.vista-library .library-card-thumb{
  height:105px;
}
.vista-library .library-card-thumb img{
  width:98px;
  height:88px;
}
.vista-library .library-card.selected{
  background:#302d36;
  border-color:#bfc2c7;
}
.vista-library .library-card.selected::after{
  content:'★';
  position:absolute;
  right:50%;
  top:-13px;
  transform:translateX(50%);
  color:#ffac22;
  font-size:16px;
}
.vista-library .library-card-name{
  font-size:11px;
  color:#9f9aa3;
}
.vista-library .library-card.selected .library-card-name{
  color:#13b7f2;
}
.vista-library .library-search{
  width:215px;
  height:30px;
  background:#3a3740;
  border-color:#44414b;
  font-size:11px;
}

/* v1.18 — Biblioteca con estructura visual muy cercana a la referencia */
.vista-library-reference{
  width:min(1128px,96vw)!important;
  height:min(752px,92vh)!important;
  grid-template-rows:46px 1fr 54px!important;
  background:#29262f!important;
  border:1px solid #3a3740!important;
  border-radius:5px!important;
  overflow:hidden!important;
}
.vista-library-reference .library-titlebar{
  height:44px!important;
  background:#29272f!important;
  border-bottom:3px solid #17a8df!important;
  padding:0 16px!important;
  font-size:16px!important;
  font-weight:400!important;
}
.library-main{
  min-height:0;
  display:grid;
  grid-template-columns:250px 1fr;
  background:#29262f;
}
.vista-library-reference .image-library-sidebar{
  display:grid!important;
  grid-template-rows:54px 1fr;
  min-height:0;
  padding:0!important;
  background:#29262f!important;
  border-right:1px solid #383540!important;
}
.library-toolbar-vertical{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 17px;
  border-bottom:1px solid #37343d;
}
.library-top-icon{
  width:34px;
  height:32px;
  display:grid;
  place-items:center;
  border:0;
  background:transparent;
  color:#a4a0a8;
  font-size:19px;
  cursor:pointer;
  border-radius:3px;
}
.library-top-icon:hover,.library-top-icon.active{
  color:#fff;
  background:#35323b;
}
.library-scroll-filters{
  overflow:auto;
  padding:15px 13px 14px 24px;
}
.library-side-special{
  display:block;
  width:100%;
  border:0;
  padding:3px 0;
  background:transparent;
  color:#9e99a2;
  text-align:left;
  font-size:13px;
  cursor:pointer;
}
.library-side-special:hover{color:#fff}
.library-section-title{
  color:#d7d2da!important;
  font-size:14px!important;
  margin:10px 0 4px!important;
}
.library-type-title{margin-top:23px!important}
.library-filter-btn{
  padding:3px 12px!important;
  font-size:11px!important;
  color:#9b96a0!important;
  background:transparent!important;
}
.library-filter-btn.active{
  color:#fff!important;
  font-weight:700!important;
}
.vista-library-reference .image-library-content{
  position:relative;
  padding:18px 26px 14px!important;
  background:#29262f!important;
}
.vista-library-reference .library-grid{
  grid-template-columns:repeat(auto-fill,minmax(132px,1fr))!important;
  gap:26px 17px!important;
  align-content:start;
}
.vista-library-reference .library-card{
  min-height:148px!important;
  padding:8px 5px 5px!important;
  background:transparent!important;
}
.vista-library-reference .library-card:hover{
  background:#302d35!important;
  border-color:#4a4650!important;
}
.vista-library-reference .library-card.selected{
  border:1px solid #bfc1c6!important;
  background:#2f2c34!important;
}
.vista-library-reference .library-card-thumb{height:98px!important}
.vista-library-reference .library-card-thumb img{
  width:102px!important;
  height:88px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 1px 1px #0008)!important;
}
.vista-library-reference .library-card-name{
  font-size:11px!important;
  color:#9d98a0!important;
  margin-top:7px!important;
}
.vista-library-reference .library-card.selected .library-card-name{color:#1db7ef!important}
.vista-library-reference .library-card.selected::after{
  content:'★';
  position:absolute;
  top:-12px;
  left:50%;
  transform:translateX(-50%);
  color:#ffad21;
  font-size:17px;
}
.library-import-banner{
  position:sticky;
  top:0;
  z-index:4;
  margin:-6px 0 10px;
  padding:6px 9px;
  background:#203442;
  color:#a9dffc;
  border:1px solid #29698d;
  font-size:10px;
}
.vista-library-reference .image-library-footer{
  height:54px!important;
  padding:9px 10px 9px 18px!important;
  background:#29262f!important;
  border-top:1px solid #3b3842!important;
}
.vista-library-reference .library-search{
  width:218px!important;
  height:30px!important;
  background:#3a3740!important;
  border:1px solid #45414b!important;
  color:#ddd!important;
  font-size:11px!important;
  padding:0 9px!important;
  font-style:italic!important;
}

/* v1.19 — runtime de Acciones */
.action-preview-window{width:min(920px,90vw);height:min(680px,86vh);display:grid;grid-template-rows:44px 1fr;overflow:hidden}
.action-preview-body{min-height:0;display:grid;place-items:center;background:#0f1318;padding:14px;overflow:auto}
.action-preview-body img{max-width:100%;max-height:100%;object-fit:contain}
.action-preview-body video{max-width:100%;max-height:100%;background:#000}
.action-preview-body iframe{width:100%;height:100%;border:0;background:#fff}
.action-row{cursor:pointer}
.action-row:hover{background:#2b323c}
.action-row .action-summary{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.action-runtime-note{font-size:10px;color:#7f8995;margin-top:5px}

/* v1.20 — Modo Vista Previa interactiva */
.preview-launch-btn{
  background:#126e9a!important;
  border-color:#168cbe!important;
  color:#fff!important;
}
.preview-launch-btn:hover{background:#1688bb!important}
#app.preview-active .workspace{
  grid-template-columns:minmax(0,1fr)!important;
}
#app.preview-active .left-panel,
#app.preview-active .right-panel{
  display:none!important;
}
#app.preview-active .viewer-toolbar{
  display:none!important;
}
#app.preview-active .bottom-status{
  display:none!important;
}
#app.preview-active .viewer-shell{
  grid-column:1/-1;
}
#app.preview-active #overlay .transform-handle,
#app.preview-active #overlay .transform-mid-handle,
#app.preview-active #overlay .transform-rotate-handle,
#app.preview-active #overlay .transform-tilt-handle,
#app.preview-active #overlay .transform-center-handle,
#app.preview-active #overlay .transform-direction-symbol,
#app.preview-active #overlay .transform-rotate-symbol,
#app.preview-active #overlay .text-width-symbol{
  display:none!important;
}
#app.preview-active .projective-object.selected-object{
  outline:none!important;
  border-color:transparent!important;
}
.preview-chrome{
  position:absolute;
  z-index:2500;
  left:14px;
  right:14px;
  top:14px;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:6px 8px 6px 12px;
  border:1px solid #46515d;
  border-radius:7px;
  background:#14191fdd;
  backdrop-filter:blur(8px);
  box-shadow:0 8px 30px #0008;
  pointer-events:auto;
}
.preview-chrome-left{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
}
.preview-badge{
  flex:none;
  padding:5px 8px;
  border-radius:4px;
  background:#159fd7;
  color:#fff;
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
}
.preview-panorama-name{
  color:#d6dde6;
  font-size:11px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.preview-chrome-actions{
  display:flex;
  gap:5px;
  align-items:center;
}
.preview-device-toggle{
  display:flex;
  padding:2px;
  border:1px solid #3c4652;
  border-radius:4px;
  background:#10151a;
}
.preview-device-toggle button{
  height:27px;
  border:0;
  padding:0 9px;
  background:transparent;
  color:#8f99a5;
  font-size:9px;
  cursor:pointer;
  border-radius:3px;
}
.preview-device-toggle button.active{
  background:#2f3944;
  color:#fff;
}
.preview-control-btn{
  height:31px;
  border:1px solid #404a56;
  border-radius:4px;
  background:#252c34;
  color:#d3dae3;
  padding:0 9px;
  font-size:10px;
  cursor:pointer;
}
.preview-control-btn:hover{background:#313a45;color:#fff}
.preview-control-btn.danger{
  border-color:#70414a;
  background:#45252d;
}
.preview-skin-layer{
  position:absolute;
  z-index:2100;
  inset:0;
  pointer-events:none;
}
.preview-skin-component{
  position:absolute;
  pointer-events:auto;
  min-width:80px;
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border:1px solid #ffffff66;
  border-radius:5px;
  background:#1c222acc;
  color:#fff;
  box-shadow:0 5px 18px #0008;
  font-size:11px;
}
.preview-skin-component[data-type="button"]{
  background:#148cc4e8;
  border-color:#43bff3aa;
}
.preview-skin-component[data-type="text"]{
  background:transparent;
  border-color:transparent;
  box-shadow:none;
  font-size:14px;
  font-weight:700;
}
.preview-skin-component[data-type="image"]::before{
  content:"▧";
  margin-right:7px;
  font-size:17px;
}
.preview-skin-note{
  position:absolute;
  left:12px;
  bottom:12px;
  padding:5px 8px;
  border-radius:4px;
  background:#111820cc;
  color:#82909d;
  font-size:9px;
}
.preview-event-log{
  position:absolute;
  z-index:2600;
  width:330px;
  max-height:44%;
  right:14px;
  bottom:14px;
  display:flex;
  flex-direction:column;
  border:1px solid #46515d;
  border-radius:6px;
  background:#11161de8;
  box-shadow:0 10px 30px #0009;
  pointer-events:auto;
  overflow:hidden;
}
.preview-log-title{
  flex:none;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 9px;
  border-bottom:1px solid #333c47;
  color:#d5dce5;
  font-size:10px;
  font-weight:800;
}
.preview-log-title button{
  border:0;
  background:transparent;
  color:#7f8a97;
  font-size:9px;
  cursor:pointer;
}
.preview-event-log-body{
  overflow:auto;
  padding:5px 8px 8px;
}
.preview-log-row{
  padding:5px 2px;
  border-bottom:1px solid #252d36;
  color:#aeb8c4;
  font-size:9px;
  line-height:1.35;
}
.preview-log-row b{color:#4ec8fa}
.preview-log-time{
  margin-right:5px;
  color:#687582;
}
@media(max-width:760px){
  .preview-chrome{
    align-items:flex-start;
    flex-direction:column;
  }
  .preview-chrome-actions{flex-wrap:wrap}
  .preview-event-log{width:calc(100% - 28px)}
}

/* v1.21 — interacción real en Vista previa */

#app.preview-active .projective-object,
#app.preview-active .polygon-layer-object polygon{cursor:pointer!important}
.preview-js-test-result{
  margin-top:7px;min-height:26px;padding:6px 8px;border:1px solid #343d48;
  border-radius:4px;background:#11161c;color:#9eabb8;font-size:9px;
  white-space:pre-wrap;word-break:break-word
}
.preview-js-test-result.ok{border-color:#286646;color:#72d89f}
.preview-js-test-result.error{border-color:#7a3942;color:#ff9099}

/* v1.24 — WebFrame URL persistente e interactivo en Vista previa */
.projective-webframe iframe{
  pointer-events:none!important;
}
#app.preview-active .projective-webframe{
  cursor:default!important;
}

/* v1.25 — WebFrame sólo se ejecuta en Vista previa */
.projective-webframe{position:absolute;overflow:hidden;background:#10151b}
.projective-webframe iframe{pointer-events:none!important;background:#fff}
#app.preview-active .projective-webframe iframe{pointer-events:auto!important}
.webframe-editor-placeholder{
  position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:6px;padding:14px;
  background:linear-gradient(135deg,#151b22 25%,#1b222b 25%,#1b222b 50%,#151b22 50%,#151b22 75%,#1b222b 75%);
  background-size:18px 18px;color:#d5dde6;text-align:center;pointer-events:none
}
.webframe-editor-placeholder b{font-size:15px;color:#30b7eb}
.webframe-editor-placeholder span{max-width:90%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:10px;color:#dfe6ee}
.webframe-editor-placeholder small{font-size:9px;color:#8592a0}
#app.preview-active .webframe-editor-placeholder{display:none!important}

/* v1.26 — Editor Skin visual */
.skin-editor-window{
  width:min(1420px,96vw);
  height:min(860px,93vh);
  display:grid;
  grid-template-rows:44px 52px 1fr 52px;
  overflow:hidden;
}
.skin-editor-toolbar{
  display:flex;align-items:center;gap:7px;padding:7px 10px;
  border-bottom:1px solid #343c47;background:#1b2027
}
.skin-editor-toolbar .btn.active{background:#168fc4;border-color:#36b8ed;color:#fff}
.skin-toolbar-separator{width:1px;height:29px;background:#3b444f;margin:0 3px}
.skin-editor-layout{
  min-height:0;
  display:grid;
  grid-template-columns:260px minmax(480px,1fr) 300px;
}
.skin-editor-list-pane{
  min-height:0;overflow:auto;padding:10px;
  border-right:1px solid #343c47;background:#181d23
}
.visual-skin-list{margin-top:9px}
.visual-skin-list .skin-manager-row{
  display:grid!important;
  grid-template-columns:22px 1fr 23px 23px!important;
  gap:5px!important;align-items:center!important;
  padding:6px!important;border-radius:4px!important
}
.visual-skin-list .skin-manager-row.selected{background:#313a46!important}
.skin-row-icon{font-size:12px;text-align:center;color:#c9d2dc;display:grid;place-items:center}
.layer-type-icon svg,.skin-sidebar-type svg,.skin-row-icon svg{width:16px;height:16px;display:block;color:inherit}
.skin-row-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#d4dce5;font-size:10px}
.skin-row-eye,.skin-row-lock{
  border:0;background:transparent;color:#8693a0;cursor:pointer;padding:0
}
.skin-row-eye:hover,.skin-row-lock:hover{color:#fff}
.skin-stage-wrap{
  min-width:0;min-height:0;
  display:grid;grid-template-rows:28px 1fr;
  padding:10px 14px 14px;background:#10151b
}
.skin-stage-ruler{
  display:flex;align-items:center;color:#667482;font-size:9px;padding-left:3px
}
.skin-stage{
  position:relative;min-height:0;overflow:hidden;
  border:1px solid #3c4652;
  background:
    linear-gradient(#202830 1px,transparent 1px),
    linear-gradient(90deg,#202830 1px,transparent 1px),
    #111820;
  background-size:20px 20px;
  aspect-ratio:16/9;
  max-height:100%;
  margin:auto;
  width:min(100%,1100px);
}
.skin-stage-safe-area{
  position:absolute;inset:4%;border:1px dashed #ffffff1d;pointer-events:none
}
.skin-stage-items{position:absolute;inset:0}
.skin-stage-item{
  position:absolute;
  display:flex;align-items:center;justify-content:center;
  border:1px solid transparent;box-sizing:border-box;
  user-select:none;cursor:move;overflow:hidden
}
.skin-stage-item.selected{
  border-color:#24b6ee;
  box-shadow:0 0 0 1px #24b6ee55
}
.skin-stage-item.locked{cursor:not-allowed}
.skin-stage-item[data-type="button"]{
  border-radius:5px;background:#168fc4;color:#fff;font-weight:700;font-size:12px
}
.skin-stage-item[data-type="text"]{
  color:#fff;background:transparent;justify-content:flex-start
}
.skin-stage-item[data-type="image"]{
  background:#222b34;color:#7e8c99
}
.skin-stage-item img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.skin-resize-handle{
  position:absolute;width:9px;height:9px;border-radius:50%;
  background:#fff;border:1px solid #111;z-index:3
}
.skin-resize-handle.nw{left:-5px;top:-5px;cursor:nwse-resize}
.skin-resize-handle.ne{right:-5px;top:-5px;cursor:nesw-resize}
.skin-resize-handle.sw{left:-5px;bottom:-5px;cursor:nesw-resize}
.skin-resize-handle.se{right:-5px;bottom:-5px;cursor:nwse-resize}
.skin-editor-properties-pane{
  min-height:0;overflow:auto;padding:12px;
  border-left:1px solid #343c47;background:#181d23
}
.skin-empty-properties{padding:12px}
.skin-delete-selected{width:100%;margin-top:12px}
.modal-footer-spacer{flex:1}
.skin-file-btn{display:inline-flex!important}
@media(max-width:1050px){
  .skin-editor-layout{grid-template-columns:220px 1fr}
  .skin-editor-properties-pane{display:none}
}

/* v1.27 — Skin: acciones, tamaño/posición y presets mobile */
.skin-mobile-preset-wrap{
  display:flex;align-items:center;gap:6px;margin-left:2px
}
.skin-mobile-preset-wrap label{font-size:9px;color:#8794a1}
.skin-mobile-preset-wrap select{
  height:31px;min-width:180px;border:1px solid #3e4854;border-radius:4px;
  background:#11171e;color:#dfe6ee;padding:0 8px;font-size:10px
}
.skin-property-section{
  margin:10px -3px 12px;padding:8px 3px 10px;border-top:1px solid #303844
}
.skin-property-section-title{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:8px;color:#cfd7e0;font-size:11px;font-weight:800
}
.skin-mini-label{
  margin:9px 0 5px;color:#b4bdc7;font-size:10px;font-weight:700
}
.skin-anchor-grid{
  display:grid;grid-template-columns:70px 1fr 22px;
  gap:5px;align-items:center
}
.skin-anchor-grid label{
  display:flex;align-items:center;gap:5px;color:#9da8b4;font-size:9px
}
.skin-anchor-grid input[type="number"]{
  min-width:0;height:28px;padding:0 6px;background:#11171e;color:#dfe6ee;
  border:1px solid #36404b;border-radius:4px
}
.skin-anchor-grid span{font-size:9px;color:#697785}
.skin-padding-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:6px
}
.skin-padding-grid>div{
  display:grid;grid-template-columns:20px 1fr;gap:4px;align-items:center
}
.skin-padding-grid label{font-size:12px;color:#8996a3}
.skin-padding-grid input{
  min-width:0;height:28px;padding:0 6px;background:#11171e;color:#dfe6ee;
  border:1px solid #36404b;border-radius:4px
}
.skin-actions-section{margin-top:12px}
.skin-actions-title .section-plus{position:static}
.skin-stage.device-phone{width:auto!important;max-width:48%;height:100%;aspect-ratio:var(--skin-aspect)}
.skin-stage.device-tablet{width:auto!important;max-width:72%;height:100%;aspect-ratio:var(--skin-aspect)}
.skin-stage-device-label{
  position:absolute;right:7px;top:6px;z-index:1;padding:3px 5px;
  background:#0d1319bb;border-radius:3px;color:#748494;font-size:8px;pointer-events:none
}
.preview-skin-component{
  box-sizing:border-box;
}

/* v1.28 — Full Skin actions + layer parity + General→Mobile */
.action-grid-full{
  grid-template-columns:repeat(6,minmax(120px,1fr))!important;
  gap:8px!important;
  padding:16px!important;
}
.action-grid-full .action-choice{
  min-height:112px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
}
.action-grid-full .action-choice b{
  font-size:28px!important;
  color:#aab2bb!important;
}
.action-grid-full .action-choice span{
  text-align:center!important;
  font-size:10px!important;
}
.skin-copy-mobile-btn{
  border-color:#2289b9!important;
  background:#163448!important;
  color:#8bdcff!important;
}
.skin-copy-mobile-btn:hover{background:#1c4c66!important;color:#fff!important}

.visual-skin-list .skin-manager-row{
  grid-template-columns:22px 22px 20px 1fr 20px!important;
  cursor:grab!important;
}
.visual-skin-list .skin-manager-row.dragging{
  opacity:.45!important;
}
.visual-skin-list .skin-manager-row.drag-over{
  box-shadow:inset 0 2px 0 #26b8ef!important;
}
.skin-row-delete{
  border:0;background:transparent;color:#7d8996;cursor:pointer;padding:0;
  font-size:13px;line-height:1
}
.skin-row-delete:hover{color:#ff8d96}
.skin-row-eye svg,.skin-row-lock svg{
  width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round
}
@media(max-width:1100px){
  .action-grid-full{grid-template-columns:repeat(4,minmax(110px,1fr))!important}
}

.runtime-album-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;padding:12px
}
.runtime-album-grid img{width:100%;height:130px;object-fit:cover;border-radius:5px}
.runtime-info-window{padding:22px;white-space:pre-wrap;line-height:1.45;color:#e7edf4;font-size:14px}

/* v1.29 — Acciones consolidadas estilo Vista360Cloud */
.action-grid-final{
  grid-template-columns:repeat(6,minmax(120px,1fr))!important;
  gap:14px!important;
  padding:24px!important;
}
.action-grid-final .action-choice{
  min-height:135px!important;
  background:transparent!important;
  border:1px solid transparent!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
}
.action-grid-final .action-choice:hover{
  background:#323038!important;
  border-color:#4b4a52!important;
}
.action-grid-final .action-choice b{
  font-size:31px!important;color:#aaaeb3!important;font-weight:400!important
}
.action-grid-final .action-choice span{
  font-size:11px!important;color:#aaaeb3!important;text-align:center!important
}

.action-config-window{
  width:min(1040px,92vw)!important;
  max-height:88vh!important;
}
.action-config-layout{
  grid-template-columns:360px 1fr!important;
  min-height:390px!important;
}
.action-config-left{
  padding:22px 24px!important;
  background:#29272e!important;
}
.action-config-right{
  padding:22px!important;
  background:#29272e!important;
  overflow:auto!important;
}
.action-ref-event{
  height:36px!important;
  background:#413f46!important;
  border-color:#413f46!important;
  color:#c8c8c8!important;
}
.action-reference-panel{
  color:#b7b7b7;
}
.action-ref-row{
  display:flex;align-items:center;gap:9px;margin:9px 0
}
.action-ref-row input,.action-ref-row select,.action-ref-row textarea{
  background:#3d3b42!important;color:#d7d7d7!important;border:0!important
}
.action-ref-select-media{
  height:36px;display:flex;align-items:center;justify-content:center;
  background:#111015;border:0;color:#bfc3c7;cursor:pointer;padding:0 12px
}
.action-ref-preview{
  min-height:220px;border:1px solid #38373d;background:#111;
  display:flex;align-items:center;justify-content:center;overflow:hidden
}
.action-ref-preview img,.action-ref-preview video{
  width:100%;height:100%;object-fit:contain;max-height:360px
}
.action-ref-accordion{
  margin-top:10px;padding:10px 4px;border-top:1px solid #343239;
  color:#d2d2d2;font-size:12px
}
.action-ref-accordion::before{content:"›";color:#00a9e9;margin-right:8px}
.action-popup-checks label{
  display:flex;align-items:center;gap:7px;margin:9px 0;color:#b8b8b8
}
.action-color-line{
  display:grid;grid-template-columns:1fr 70px;gap:8px;align-items:center
}
.action-target-reference{
  display:grid;grid-template-columns:360px 1fr;gap:22px;min-height:470px
}
.action-target-left{padding:4px 2px}
.action-target-right{min-width:0}
.target-media-preview{
  height:230px;background:#111;overflow:hidden;display:flex;align-items:center;justify-content:center
}
.target-media-preview img{width:100%;height:100%;object-fit:cover}
.target-media-list{max-height:250px;overflow:auto;margin-top:8px}
.action-media-picker-window{
  width:min(1140px,94vw)!important;height:min(810px,92vh)!important;
  display:grid!important;grid-template-rows:44px 1fr 56px!important
}
.action-media-picker-grid{
  padding:14px;overflow:auto;display:grid;
  grid-template-columns:repeat(4,minmax(190px,1fr));align-content:start;gap:18px;
  background:#29272e
}
.action-media-card{
  min-height:170px;background:#37343c;border:2px solid transparent;padding:9px;cursor:pointer
}
.action-media-card.selected{border-color:#00aeef}
.action-media-card-thumb{
  height:112px;background:#111;display:flex;align-items:center;justify-content:center;overflow:hidden
}
.action-media-card-thumb img,.action-media-card-thumb video{
  width:100%;height:100%;object-fit:cover
}
.action-media-card-name{margin-top:7px;color:#c2c2c2;font-size:11px}
.action-media-card-meta{margin-top:5px;color:#8d8d8d;font-size:9px}
.action-media-picker-footer{
  display:flex;align-items:center;gap:9px;padding:9px 14px;border-top:1px solid #444;
  background:#29272e
}
.action-media-picker-footer .search-input{width:380px}
.action-media-import-label{position:relative;overflow:hidden}
.action-media-empty{
  grid-column:1/-1;padding:70px;text-align:center;color:#777
}
.popup-runtime-overlay{
  position:fixed;inset:0;z-index:999999;display:flex;align-items:center;justify-content:center
}
.popup-runtime-card{position:relative;background:#fff;overflow:hidden}
.popup-runtime-card iframe,.popup-runtime-card img{width:100%;height:100%;object-fit:contain;border:0}
.popup-runtime-close{
  position:absolute;right:10px;top:10px;z-index:2;width:38px;height:38px;border-radius:50%;
  border:0;background:#fff;color:#111;font-size:24px;cursor:pointer;box-shadow:0 2px 8px #0004
}
@media(max-width:950px){
  .action-grid-final{grid-template-columns:repeat(4,minmax(100px,1fr))!important}
  .action-target-reference{grid-template-columns:1fr}
}

/* v1.30 CLASSIC — Action Editor reimplementado a partir del comportamiento
   observado en el AddActionPopUp del programa original compartido. */
.action-library-classic-window{
  width:min(1450px,96vw)!important;height:min(840px,92vh)!important;background:#29272e!important
}
.action-library-classic-window .modal-titlebar,
.action-config-window .modal-titlebar{
  height:46px!important;background:#29272e!important;border-bottom:3px solid #00a9e9!important
}
.action-grid-final{
  grid-template-columns:repeat(6,1fr)!important;grid-auto-rows:minmax(150px,1fr)!important;
  padding:30px 36px!important;gap:18px 22px!important;overflow:auto!important
}
.action-grid-final .action-choice{
  min-height:150px!important;border-radius:0!important;background:transparent!important;border:1px solid transparent!important
}
.action-grid-final .action-choice:hover{background:#343139!important;border-color:#4b4850!important}
.action-grid-final .action-choice b{
  min-height:48px;display:flex;align-items:center;justify-content:center;font-size:34px!important;color:#a9acb0!important
}
.action-grid-final .action-choice span{font-size:12px!important;color:#aaa!important}

.action-config-window{
  width:min(1280px,94vw)!important;min-height:560px!important;max-height:92vh!important;background:#29272e!important
}
.action-config-layout{min-height:470px!important;grid-template-columns:390px minmax(0,1fr)!important}
.action-config-left,.action-config-right{background:#29272e!important}
.action-config-left{padding:26px 28px!important}
.action-config-right{padding:26px 30px!important}
.action-config-left select,.action-config-left input,
.action-config-right select,.action-config-right input,.action-config-right textarea{
  background:#403e45!important;border-color:#403e45!important;color:#d0d0d4!important;border-radius:1px!important
}
#actionTrigger,#panoramaTrigger{height:37px!important;text-align:center;font-size:11px!important}
.action-config-window .modal-footer{
  min-height:54px!important;justify-content:flex-end!important;background:#29272e!important;border-top:1px solid #424047!important
}
.action-config-window .modal-footer .primary{
  min-width:80px!important;background:#078bc9!important;border-color:#078bc9!important
}
.classic-folder-field{
  display:grid;grid-template-columns:1fr 38px;min-height:35px;align-items:center;background:#111015;margin-bottom:8px
}
.classic-folder-field .folder-label{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;color:#b6b6bb;font-style:italic;font-size:11px;padding:0 10px
}
.classic-folder-field button{height:35px;border:0;background:#111015;color:#00a9e9;font-size:18px;cursor:pointer}
.classic-viewer-select{text-align:center}
.classic-dual-number{
  display:grid;grid-template-columns:auto 64px auto 64px auto;gap:8px;align-items:center;color:#aaa;font-size:11px;margin:10px 0
}
.classic-dual-number input{width:64px!important;text-align:center}
.classic-action-checks{display:flex;flex-direction:column;gap:9px;margin-top:11px;color:#aaa;font-size:11px}
.classic-action-checks label{display:flex;align-items:center;gap:7px}
.classic-action-checks .inline-number{width:65px!important}
.classic-accordion{
  border-top:1px solid #3d3b42;padding:13px 4px 10px;color:#d0d0d4;font-size:12px;cursor:pointer
}
.classic-accordion::before{content:"›";color:#00a9e9;font-size:19px;margin-right:8px;vertical-align:-1px}
.classic-accordion.open::before{content:"⌄"}
.classic-accordion-body{display:none;padding:8px 12px 14px;border-top:1px solid #333139}
.classic-accordion.open + .classic-accordion-body{display:block}
.classic-effect-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}
.classic-effect-grid label{display:flex;align-items:center;gap:6px;color:#aaa;font-size:10px}
.classic-segmented{display:flex;gap:12px;align-items:center;margin:10px 0;color:#aaa;font-size:11px;flex-wrap:wrap}
.classic-segmented label{display:flex;gap:5px;align-items:center}
.classic-color-row{display:grid;grid-template-columns:100px 1fr 60px;gap:9px;align-items:center;margin:9px 0}
.classic-preview-title{
  position:absolute;left:0;right:0;bottom:0;padding:8px 10px;text-align:center;color:#ddd;background:#111b;font-size:11px
}
.action-ref-preview{position:relative}
.action-ref-preview.empty::before{content:"Selecciona un elemento";color:#666;font-size:11px}
.target-check-list.classic-target-list{background:transparent!important;border:0!important;max-height:310px!important}
.target-check-list.classic-target-list .target-row{min-height:31px!important;border:0!important;color:#aaa!important}

/* v1.31 — segundo bloque de fidelidad/funcionalidad del editor de acciones */
.action-chain-window{width:min(540px,90vw)!important;background:#29272e!important}
.action-chain-content{padding:22px;background:#29272e}
#actionChainSelect{width:100%;height:34px;background:#403e45;color:#ddd;border:0}
.action-event-hint{margin:4px 0 12px;color:#777b82;font-size:9px;text-align:center}
.classic-action-summary{
  margin:10px 0;padding:8px 10px;background:#211f25;border-left:2px solid #00a9e9;
  color:#adb2b8;font-size:10px
}

/* v1.32 — runtime multimedia de acciones */
.runtime-media-overlay{
  position:fixed;inset:0;z-index:999998;background:#000b;
  display:flex;align-items:center;justify-content:center
}
.runtime-media-card{
  width:min(1000px,88vw);height:min(650px,78vh);
  background:#111;position:relative;box-shadow:0 18px 70px #000b
}
.runtime-media-card video{
  width:100%;height:100%;object-fit:contain;background:#000
}
.runtime-media-title{
  position:absolute;left:0;right:0;bottom:0;padding:9px 12px;
  background:#0009;color:#ddd;text-align:center;font-size:12px;pointer-events:none
}
.runtime-media-close{
  position:absolute;right:10px;top:10px;z-index:3;width:38px;height:38px;
  border:0;border-radius:50%;background:#fff;color:#111;font-size:23px;cursor:pointer
}
.runtime-audio-indicator{
  position:fixed;right:18px;bottom:18px;z-index:999997;
  min-width:210px;max-width:340px;padding:10px 12px;
  background:#1f242b;border:1px solid #39434e;border-left:3px solid #00a9e9;
  color:#d9e1e8;font-size:10px;box-shadow:0 5px 22px #0008
}
.runtime-audio-indicator b{display:block;margin-bottom:3px;font-size:11px}
.runtime-audio-indicator span{color:#8e9aa6}

/* v1.34 — Biblioteca Multimedia central */
.media-library-manager-window{
  width:min(1450px,96vw)!important;height:min(850px,93vh)!important;
  display:grid!important;grid-template-rows:44px 52px 1fr 52px!important;
  overflow:hidden!important
}
.media-library-toolbar{
  display:flex;align-items:center;gap:6px;padding:8px 10px;
  border-bottom:1px solid #343c47;background:#1a2026
}
.media-library-toolbar .btn.active{background:#168fc4;border-color:#36b8ed;color:#fff}
.media-library-spacer{flex:1}
.media-library-layout{
  min-height:0;display:grid;grid-template-columns:220px minmax(0,1fr) 270px
}
.media-library-sidebar{
  min-height:0;overflow:auto;padding:10px;border-right:1px solid #343c47;background:#181d23
}
.media-library-content{min-height:0;overflow:auto;background:#10151b;padding:14px}
.media-library-properties{
  min-height:0;overflow:auto;padding:12px;border-left:1px solid #343c47;background:#181d23
}
.media-library-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;align-content:start
}
.media-library-card{
  background:#222a33;border:2px solid transparent;border-radius:4px;overflow:hidden;cursor:pointer
}
.media-library-card.selected{border-color:#24b6ee}
.media-library-thumb{
  height:118px;background:#0d1116;display:flex;align-items:center;justify-content:center;overflow:hidden
}
.media-library-thumb img,.media-library-thumb video{
  width:100%;height:100%;object-fit:cover
}
.media-library-thumb .media-glyph{font-size:32px;color:#7d8996}
.media-library-card-meta{padding:8px}
.media-library-card-name{font-size:10px;color:#d9e0e7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.media-library-card-type{font-size:8px;color:#788592;margin-top:4px}
.media-library-album-row{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:7px 5px;border-bottom:1px solid #252d35;color:#abb5c0;font-size:10px;cursor:pointer
}
.media-library-album-row:hover{background:#222a33}
.media-library-album-row.selected{background:#2d3742;color:#fff}
.media-lib-preview{
  min-height:150px;background:#0d1116;margin:10px 0;
  display:flex;align-items:center;justify-content:center;overflow:hidden
}
.media-lib-preview img,.media-lib-preview video{width:100%;height:100%;object-fit:contain}
.media-lib-preview audio{width:100%}
@media(max-width:1050px){
  .media-library-layout{grid-template-columns:190px 1fr}
  .media-library-properties{display:none}
}

/* v1.35 — Álbumes completos */
.album-editor-window{
  width:min(1180px,94vw)!important;height:min(780px,90vh)!important;
  display:grid!important;grid-template-rows:44px 64px 1fr 52px!important
}
.album-editor-toolbar{
  display:flex;align-items:center;gap:10px;padding:8px 12px;
  border-bottom:1px solid #343c47;background:#1a2026
}
.album-editor-toolbar .field.compact{margin:0;display:flex;align-items:center;gap:6px}
.album-editor-toolbar .field.compact input{height:30px}
.album-editor-layout{min-height:0;display:grid;grid-template-columns:1fr 300px}
.album-editor-items-pane{min-height:0;overflow:auto;padding:14px;background:#10151b}
.album-editor-preview-pane{
  min-height:0;overflow:auto;padding:14px;border-left:1px solid #343c47;background:#181d23
}
.album-editor-items{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;align-content:start
}
.album-editor-item{
  position:relative;background:#222a33;border:2px solid transparent;cursor:grab
}
.album-editor-item.dragging{opacity:.4}
.album-editor-item.drag-over{border-color:#24b6ee}
.album-editor-thumb{height:105px;background:#0d1116;overflow:hidden}
.album-editor-thumb img{width:100%;height:100%;object-fit:cover}
.album-editor-item-footer{display:flex;align-items:center;gap:6px;padding:7px}
.album-editor-item-name{flex:1;font-size:9px;color:#d6dde5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.album-editor-remove{border:0;background:transparent;color:#9aa6b2;cursor:pointer;font-size:15px}
.album-editor-remove:hover{color:#ff8993}
.album-editor-preview{
  height:260px;background:#0d1116;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:10px
}
.album-editor-preview img{width:100%;height:100%;object-fit:contain}
.album-image-picker-window{
  width:min(1050px,92vw)!important;height:min(720px,88vh)!important;
  display:grid!important;grid-template-rows:44px 50px 1fr 52px!important
}
.album-image-picker-toolbar{
  display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid #343c47;background:#1a2026
}
.album-image-picker-grid{
  min-height:0;overflow:auto;padding:14px;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;background:#10151b
}
.album-picker-card{background:#222a33;border:2px solid transparent;cursor:pointer}
.album-picker-card.selected{border-color:#24b6ee}
.album-picker-thumb{height:100px;background:#0d1116;overflow:hidden}
.album-picker-thumb img{width:100%;height:100%;object-fit:cover}
.album-picker-name{padding:7px;font-size:9px;color:#d7dee6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.runtime-album-overlay{
  position:fixed;inset:0;z-index:999998;background:#000d;display:flex;align-items:center;justify-content:center
}
.runtime-album-card{
  width:min(1100px,90vw);height:min(720px,82vh);position:relative;background:#050505;overflow:hidden
}
.runtime-album-card img{
  width:100%;height:100%;object-fit:contain;display:block
}
.runtime-album-close,.runtime-album-prev,.runtime-album-next,.runtime-album-play{
  position:absolute;z-index:3;border:0;background:#fffdd;color:#111;cursor:pointer
}
.runtime-album-close{right:12px;top:12px;width:40px;height:40px;border-radius:50%;font-size:24px}
.runtime-album-prev,.runtime-album-next{top:50%;transform:translateY(-50%);width:42px;height:58px;font-size:28px}
.runtime-album-prev{left:12px}.runtime-album-next{right:12px}
.runtime-album-play{left:50%;bottom:16px;transform:translateX(-50%);min-width:82px;height:34px;border-radius:18px}
.runtime-album-caption{
  position:absolute;left:0;right:0;bottom:0;padding:10px 100px 12px;
  text-align:center;color:#ddd;background:linear-gradient(transparent,#000b);font-size:11px;pointer-events:none
}

.project-save-state{display:inline-flex;align-items:center;margin-left:8px;padding:4px 7px;border-radius:12px;font-size:9px;white-space:nowrap}
.project-save-state.saved{color:#8b98a5;background:#20272e}
.project-save-state.dirty{color:#ffd38a;background:#3b3020}
.project-save-state.autosaving{color:#87d9ff;background:#173444}
.project-save-state.error{color:#ff9ba4;background:#3a2024}
.recovery-window{width:min(620px,92vw)!important;background:#29272e!important}
.recovery-content{display:grid;grid-template-columns:70px 1fr;gap:18px;padding:26px;background:#29272e}
.recovery-icon{width:62px;height:62px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#163b50;color:#47c7ff;font-size:34px}
.recovery-content h3{margin:4px 0 9px;color:#e4e8ed;font-size:16px}
.recovery-content p{margin:0;color:#a8b0b9;font-size:11px;line-height:1.5}
.recovery-meta{margin-top:14px;padding:10px 12px;background:#1d2228;color:#8995a0;font-size:10px;line-height:1.6;border-left:2px solid #00a9e9}

/* v1.38 — Inspector / Preflight */
.project-inspector-window{
  width:min(1180px,94vw)!important;height:min(780px,90vh)!important;
  display:grid!important;grid-template-rows:44px 52px 1fr 52px!important
}
.project-inspector-toolbar{
  display:flex;align-items:center;gap:8px;padding:8px 12px;
  border-bottom:1px solid #343c47;background:#1a2026
}
.project-inspector-layout{
  min-height:0;display:grid;grid-template-columns:270px minmax(0,1fr)
}
.project-inspector-summary{
  min-height:0;overflow:auto;padding:12px;border-right:1px solid #343c47;background:#181d23
}
.project-inspector-results{
  min-height:0;overflow:auto;padding:12px;background:#10151b
}
.project-inspector-cards{display:grid;gap:8px}
.project-inspector-card{
  padding:10px 12px;border:1px solid #303944;background:#20272f;border-radius:4px
}
.project-inspector-card b{display:block;color:#dce4eb;font-size:18px}
.project-inspector-card span{display:block;margin-top:3px;color:#83909c;font-size:9px}
.project-inspector-issue{
  display:grid;grid-template-columns:22px 1fr auto;gap:9px;align-items:start;
  padding:10px 11px;margin-bottom:7px;border:1px solid #2e3741;background:#1b2229
}
.project-inspector-issue.ok{border-left:3px solid #48b77a}
.project-inspector-issue.warning{border-left:3px solid #e0ad4d}
.project-inspector-issue.error{border-left:3px solid #e05d67}
.project-inspector-issue .icon{font-size:15px;line-height:1.2}
.project-inspector-issue .title{font-size:10px;color:#d7dfe7}
.project-inspector-issue .detail{margin-top:4px;font-size:9px;color:#7f8c98;line-height:1.45}
.project-inspector-badge{
  padding:3px 6px;border-radius:10px;background:#252e37;color:#94a2af;font-size:8px;white-space:nowrap
}

.publish-tour-window{width:min(620px,92vw)!important;background:#29272e!important}
.publish-tour-content{padding:22px 24px;background:#29272e}
.publish-options{display:flex;flex-direction:column;gap:9px;margin:18px 0;padding:12px;background:#20262d;border:1px solid #333c46}
.publish-options label{display:flex;align-items:center;gap:7px;color:#aeb7c0;font-size:10px}
.publish-tour-info{padding:12px 14px;background:#173445;border-left:3px solid #00a9e9}
.publish-tour-info b{display:block;color:#dce9f0;font-size:11px}
.publish-tour-info span{display:block;margin-top:5px;color:#8fa3af;font-size:9px;line-height:1.5}
.publish-estimate{margin-top:12px;color:#7f8c98;font-size:9px;line-height:1.5}

body.vista360-published .topbar,
body.vista360-published .sidebar,
body.vista360-published .properties-panel,
body.vista360-published .statusbar,
body.vista360-published .toolbar,
body.vista360-published #projectInspectorModal,
body.vista360-published #mediaLibraryManagerModal,
body.vista360-published #recoveryModal,
body.vista360-published #publishTourModal{display:none!important}
body.vista360-published #app{width:100vw!important;height:100vh!important;display:block!important;background:#000!important}
body.vista360-published .workspace{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;margin:0!important;padding:0!important}
body.vista360-published #viewer{position:absolute!important;inset:0!important;width:100%!important;height:100%!important}
body.vista360-published #previewExitBtn,
body.vista360-published #previewResetBtn,
body.vista360-published #previewGeneralBtn,
body.vista360-published #previewMobileBtn,
body.vista360-published #previewEventLog{display:none!important}

/* v1.40 — dispositivo automático / responsive */
.publish-device-preview{
  margin-top:12px;padding:10px 12px;background:#20272e;border:1px solid #333c46;
  color:#aab5bf;font-size:9px;line-height:1.5
}
.publish-device-preview b{color:#dfe8ef}

body.vista360-published{
  margin:0!important;overflow:hidden!important;background:#000!important;
  width:100vw!important;height:100vh!important
}
body.vista360-published .preview-skin-layer{
  padding-top:env(safe-area-inset-top,0px);
  padding-right:env(safe-area-inset-right,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
  padding-left:env(safe-area-inset-left,0px);
  box-sizing:border-box
}
body.vista360-published.mobile-device .preview-skin-component{
  touch-action:manipulation
}
body.vista360-published.mobile-device #viewer canvas{
  touch-action:none
}

/* v1.41 — reglas responsive por componente Skin */
.skin-responsive-checks{
  display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;margin:6px 0 8px
}
.skin-responsive-checks label,
.skin-responsive-auto{
  display:flex;align-items:center;gap:6px;color:#9eabb7;font-size:9px
}
.skin-responsive-auto{margin-top:9px}
.preview-skin-component.responsive-hidden{
  display:none!important
}

.skin-responsive-preview{display:inline-flex;align-items:center;gap:5px;margin-right:7px;padding:3px 6px;background:#1b2127;border:1px solid #313a44;border-radius:3px}
.skin-responsive-preview span{font-size:8px;color:#7f8c98}.skin-responsive-preview select{height:24px;min-width:72px;background:#242c34;color:#b8c2cb;border:1px solid #3a4550;font-size:9px}
.skin-responsive-preview .btn{height:24px;min-width:27px;padding:0 6px}
#skinStage.device-preview-active{margin:auto!important;transform-origin:center;box-shadow:0 0 0 1px #414c57,0 12px 34px rgba(0,0,0,.42);transition:width .18s,height .18s}
#skinStage.device-desktop.device-landscape{width:min(100%,1180px)!important;aspect-ratio:16/9}#skinStage.device-desktop.device-portrait{width:min(62%,700px)!important;aspect-ratio:9/16}
#skinStage.device-tablet.device-landscape{width:min(82%,1024px)!important;aspect-ratio:4/3}#skinStage.device-tablet.device-portrait{width:min(58%,768px)!important;aspect-ratio:3/4}
#skinStage.device-phone.device-landscape{width:min(78%,844px)!important;aspect-ratio:844/390}#skinStage.device-phone.device-portrait{width:min(38%,390px)!important;aspect-ratio:390/844}
#skinStage.device-phone{border-radius:12px;overflow:hidden}#skinStage.device-tablet{border-radius:7px;overflow:hidden}
.skin-preview-size-label{position:absolute;right:8px;bottom:7px;z-index:9999;padding:3px 6px;background:rgba(12,16,20,.75);color:#aab6c1;font-size:8px;pointer-events:none}

/* v1.43 — overrides responsive por dispositivo/orientación */
.skin-responsive-layout-box{
  margin-top:12px;padding:10px;border:1px solid #343d46;background:#1d242b
}
.skin-responsive-layout-actions{
  display:grid;grid-template-columns:1fr auto;gap:6px;margin-top:8px
}
.skin-responsive-layout-actions .btn{min-height:28px;font-size:9px}
#skinResponsiveOverrideStatus.has-override{color:#69c7f1}
#skinResponsiveOverrideStatus.no-override{color:#7e8a95}

/* v1.44 — selección múltiple / alineación / snap Skin */
.skin-align-tools{display:inline-flex;gap:3px;align-items:center}
.skin-align-tools .btn{min-width:28px;height:27px;padding:0 6px;font-size:13px}
.skin-snap-control{
  display:inline-flex;align-items:center;gap:5px;color:#8e9ba7;font-size:9px;
  padding:3px 6px;background:#1b2127;border:1px solid #313a44;border-radius:3px
}
.skin-snap-control select{
  height:23px;background:#242c34;color:#b8c2cb;border:1px solid #3a4550;font-size:9px
}
.skin-manager-row.multi-selected{outline:1px solid #35b9ee;outline-offset:-1px}
.skin-stage-item.multi-selected{box-shadow:0 0 0 1px #35b9ee inset,0 0 0 1px #35b9ee}
.skin-stage-item.selected.multi-selected{box-shadow:0 0 0 2px #fff inset,0 0 0 3px #35b9ee}
.skin-snap-guide{
  position:absolute;z-index:9998;pointer-events:none;background:#00b7f0;opacity:.85
}
.skin-snap-guide.vertical{top:0;bottom:0;width:1px}
.skin-snap-guide.horizontal{left:0;right:0;height:1px}

/* v1.45 — grupos y edición de precisión Skin */
.skin-precision-tools{display:inline-flex;align-items:center;gap:3px}
.skin-precision-tools .btn{height:27px;padding:0 7px;font-size:9px}
.skin-manager-row.group-member .skin-row-name:after{content:"  ◇";opacity:.55}
.skin-stage-item.group-member{outline:1px dashed rgba(0,183,240,.35)}

/* v1.46 — Apariencia avanzada Hotspot */
.range-number-row{
  display:grid;grid-template-columns:minmax(0,1fr) 68px;gap:7px;align-items:center
}
.range-number-row input[type="number"]{width:68px;text-align:center}
.advanced-subsection{
  margin-top:10px;padding-top:10px;border-top:1px solid #303840
}
.advanced-subsection:first-child{border-top:0;margin-top:0;padding-top:0}
.advanced-indent{padding:6px 0 2px 19px}
#hotspotShadowColor,#hotspotChromaColor{width:100%;height:30px;padding:1px}

/* =========================================================
   v1.47 — CORRECCIÓN COMPLETA DE VISIBILIDAD DEL EDITOR SKIN
   ========================================================= */

/* El modal de Skin usa todo el viewport y nunca puede crecer fuera de él. */
#skinComponentsModal{
  padding:0 !important;
  place-items:stretch !important;
  overflow:hidden !important;
}

#skinComponentsModal .skin-editor-window{
  width:100vw !important;
  max-width:100vw !important;
  height:100dvh !important;
  max-height:100dvh !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:0 !important;
  border-radius:0 !important;
  box-sizing:border-box !important;
  display:grid !important;
  grid-template-rows:44px auto minmax(0,1fr) 52px !important;
  overflow:hidden !important;
}

/* Barra superior: ya no fuerza al modal a salirse de la pantalla.
   Si no cabe, se puede desplazar horizontalmente sin ocultar controles. */
#skinComponentsModal .skin-editor-toolbar{
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  flex-wrap:nowrap !important;
  scrollbar-width:thin;
  padding:6px 10px !important;
}

#skinComponentsModal .skin-editor-toolbar > *{
  flex:0 0 auto;
}

#skinComponentsModal .skin-editor-toolbar::-webkit-scrollbar{
  height:7px;
}
#skinComponentsModal .skin-editor-toolbar::-webkit-scrollbar-thumb{
  background:#46515d;
  border-radius:6px;
}

/* Las tres zonas SIEMPRE permanecen disponibles:
   lista | lienzo | propiedades. */
#skinComponentsModal .skin-editor-layout{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  overflow:hidden !important;
  grid-template-columns:
    clamp(175px,18vw,260px)
    minmax(260px,1fr)
    clamp(270px,22vw,340px) !important;
}

#skinComponentsModal .skin-editor-list-pane,
#skinComponentsModal .skin-stage-wrap,
#skinComponentsModal .skin-editor-properties-pane{
  min-width:0 !important;
  min-height:0 !important;
  box-sizing:border-box !important;
}

/* IMPORTANTE: elimina la regla anterior que ocultaba Propiedades
   cuando el ancho CSS del navegador bajaba de 1050 px. */
#skinComponentsModal .skin-editor-properties-pane{
  display:block !important;
  visibility:visible !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  width:auto !important;
  max-width:none !important;
}

/* El lienzo se adapta al espacio restante, sin empujar Propiedades fuera. */
#skinComponentsModal .skin-stage-wrap{
  overflow:hidden !important;
  padding:8px 10px 10px !important;
}
#skinComponentsModal .skin-stage{
  max-width:100% !important;
  max-height:100% !important;
  width:auto !important;
  height:auto !important;
}

/* Footer siempre visible. */
#skinComponentsModal .modal-footer{
  min-width:0 !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  white-space:nowrap;
}

/* Pantallas CSS más estrechas / zoom alto:
   seguimos mostrando Propiedades, reduciendo anchos antes de ocultar nada. */
@media (max-width:1050px){
  #skinComponentsModal .skin-editor-layout{
    grid-template-columns:
      clamp(150px,18vw,200px)
      minmax(220px,1fr)
      clamp(240px,29vw,300px) !important;
  }
  #skinComponentsModal .skin-editor-properties-pane{
    display:block !important;
  }
  #skinComponentsModal .skin-editor-list-pane{
    padding:7px !important;
  }
}

/* En viewport extremadamente estrecho mantenemos acceso a TODO mediante
   desplazamiento horizontal interno, en vez de eliminar Propiedades. */
@media (max-width:720px){
  #skinComponentsModal .skin-editor-layout{
    grid-template-columns:160px minmax(260px,1fr) 270px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }
}

/* Evita que selects y controles largos ensanchen paneles. */
#skinComponentsModal select,
#skinComponentsModal input,
#skinComponentsModal button{
  max-width:100%;
  box-sizing:border-box;
}
#skinComponentsModal .field,
#skinComponentsModal .field.two,
#skinComponentsModal .skin-property-section{
  min-width:0;
}


/* =========================================================
   v1.48 — VENTANAS DE ACCIÓN: SCROLL COMPLETO Y FOOTER FIJO
   ========================================================= */

#actionConfigModal{
  padding:10px !important;
  overflow:hidden !important;
  place-items:center !important;
}

#actionConfigModal .action-config-window{
  width:min(1590px,calc(100vw - 24px)) !important;
  max-width:calc(100vw - 24px) !important;
  height:min(900px,calc(100dvh - 20px)) !important;
  min-height:0 !important;
  max-height:calc(100dvh - 20px) !important;
  display:grid !important;
  grid-template-rows:46px minmax(0,1fr) 54px !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}

#actionConfigModal .action-config-layout{
  min-height:0 !important;
  height:auto !important;
  max-height:none !important;
  overflow:hidden !important;
  grid-template-columns:minmax(260px,390px) minmax(0,1fr) !important;
}

#actionConfigModal .action-config-left,
#actionConfigModal .action-config-right{
  min-width:0 !important;
  min-height:0 !important;
  max-height:100% !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}

#actionConfigModal .action-config-right{
  padding-bottom:60px !important;
}

/* Las secciones desplegables ya no pueden empujar el botón Hecho
   fuera de pantalla. El contenido crece dentro del panel desplazable. */
#actionConfigModal .classic-accordion-body{
  max-width:100% !important;
  box-sizing:border-box !important;
}
#actionConfigModal .action-reference-panel,
#actionConfigModal #simpleActionConfig{
  min-width:0 !important;
  max-width:100% !important;
}
#actionConfigModal .action-ref-preview{
  max-height:min(360px,38vh) !important;
}

/* Footer siempre visible. */
#actionConfigModal .modal-footer{
  position:relative !important;
  z-index:20 !important;
  flex:0 0 54px !important;
  min-height:54px !important;
}

/* Scrollbars visibles pero discretas. */
#actionConfigModal .action-config-left::-webkit-scrollbar,
#actionConfigModal .action-config-right::-webkit-scrollbar{
  width:9px;
}
#actionConfigModal .action-config-left::-webkit-scrollbar-thumb,
#actionConfigModal .action-config-right::-webkit-scrollbar-thumb{
  background:#4a4850;
  border-radius:7px;
  border:2px solid #29272e;
}

/* Resoluciones más pequeñas / zoom alto: no ocultar nada. */
@media (max-width:900px){
  #actionConfigModal .action-config-layout{
    grid-template-columns:minmax(210px,32vw) minmax(0,1fr) !important;
  }
  #actionConfigModal .action-config-left{
    padding:16px 14px !important;
  }
  #actionConfigModal .action-config-right{
    padding:16px !important;
  }
}
@media (max-width:620px){
  #actionConfigModal{
    padding:0 !important;
  }
  #actionConfigModal .action-config-window{
    width:100vw !important;
    max-width:100vw !important;
    height:100dvh !important;
    max-height:100dvh !important;
  }
  #actionConfigModal .action-config-layout{
    grid-template-columns:190px minmax(300px,1fr) !important;
    overflow-x:auto !important;
  }
}

/* Indicador de acción encadenada. */
.close-action-picker-row{
  display:grid !important;
  grid-template-columns:auto 1fr auto !important;
  align-items:center !important;
  gap:8px !important;
}
.close-action-picker-row .close-action-summary{
  min-width:0;
  color:#9ba6b0;
  font-size:9px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.close-action-picker-row.has-chain .close-action-summary{
  color:#57c7f2;
}


/* =========================================================
   v1.49 — EDITOR SKIN: TOOLBAR COMPACTA SIN BARRA HORIZONTAL
   ========================================================= */

#skinComponentsModal .skin-editor-window{
  grid-template-rows:44px auto minmax(0,1fr) 52px !important;
}

#skinComponentsModal .skin-editor-toolbar{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  align-content:flex-start !important;
  gap:5px !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
  padding:6px 8px !important;
  box-sizing:border-box !important;
}

/* Eliminar la barra horizontal introducida en v1.47. */
#skinComponentsModal .skin-editor-toolbar::-webkit-scrollbar{
  display:none !important;
}
#skinComponentsModal .skin-editor-toolbar{
  scrollbar-width:none !important;
}

#skinComponentsModal .skin-editor-toolbar > *{
  flex:0 0 auto;
  min-width:0;
}

.skin-align-menu-wrap{
  position:relative;
  display:inline-flex;
}

.skin-align-menu-btn{
  height:30px !important;
  min-width:82px;
}

.skin-align-menu{
  position:absolute;
  top:calc(100% + 5px);
  right:0;
  z-index:12000;
  width:215px;
  padding:5px;
  background:#252931;
  border:1px solid #46515d;
  box-shadow:0 8px 28px rgba(0,0,0,.45);
  border-radius:4px;
}

.skin-align-menu button{
  width:100%;
  display:grid;
  grid-template-columns:25px 1fr;
  align-items:center;
  gap:6px;
  padding:7px 8px;
  background:transparent;
  border:0;
  color:#c4ccd4;
  text-align:left;
  font-size:10px;
  cursor:pointer;
}

.skin-align-menu button:hover{
  background:#343d47;
  color:#fff;
}

.skin-align-menu button span{
  font-size:15px;
  text-align:center;
}

.skin-align-menu-sep{
  height:1px;
  background:#3b434c;
  margin:4px 3px;
}

/* Los grupos más anchos pueden reducirse antes de forzar otra fila. */
#skinComponentsModal .skin-responsive-preview{
  margin-right:2px !important;
}
#skinComponentsModal .skin-mobile-preset-wrap{
  max-width:235px;
}
#skinComponentsModal .skin-copy-mobile-btn{
  max-width:145px;
  white-space:normal;
  line-height:1.05;
}

/* En resoluciones normales se permiten 2 filas compactas sin scroll. */
@media (max-width:1350px){
  #skinComponentsModal .skin-editor-toolbar{
    gap:4px !important;
  }
  #skinComponentsModal .skin-editor-toolbar .btn{
    padding-left:7px !important;
    padding-right:7px !important;
  }
  #skinComponentsModal .skin-responsive-preview span{
    display:none;
  }
}

/* En pantallas más pequeñas se compactan etiquetas, nunca se crea scroll horizontal. */
@media (max-width:950px){
  #skinComponentsModal .skin-copy-mobile-btn{
    max-width:105px;
    font-size:8px;
  }
  #skinComponentsModal .skin-precision-tools .btn{
    padding:0 5px !important;
  }
}

/* v1.50 — transformación numérica / vídeo avanzado */
.field.three{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}
.transform-numeric-wrap{
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid #303842;
}
.transform-scale-check{
  display:flex;
  align-items:flex-end;
  padding-bottom:6px;
}
.transform-scale-check label{
  display:flex;
  align-items:center;
  gap:6px;
  min-height:31px;
}

/* v1.51 — ventanas de acción y selector "Al cerrar" */
#actionConfigModal .modal-card,
#actionLibraryModal .modal-card,
#actionChainPickerModal .modal-card{
  max-height:calc(100vh - 24px);
}
#actionConfigModal .modal-body,
#actionLibraryModal .modal-body,
#actionChainPickerModal .modal-body{
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.close-action-picker-row{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
}
.close-action-summary{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#aeb7c2;
}
.close-action-picker-row.has-chain .close-action-summary{
  color:#dbeeff;
}
@media (max-height:720px){
  #actionConfigModal .modal-card,
  #actionLibraryModal .modal-card{
    max-height:calc(100vh - 10px);
  }
}

.replace-source-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;align-items:center}
.replace-source-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:7px 9px;background:#11171d;border:1px solid #33404a;color:#aeb8c2;font-size:9px}
.media-lib-prop-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:9px}
.media-library-card{cursor:grab}.media-library-card.dragging{opacity:.35}.media-library-card.drag-over{outline:2px solid #18afe6;outline-offset:2px}

/* v1.53 — contenedores y jerarquía Skin */
.skin-manager-row.container-row{
  background:#202b33;
  border-left:2px solid #18afe6;
}
.skin-manager-row.child-row .skin-row-name{
  padding-left:14px;
}
.skin-manager-row.child-row .skin-row-name::before{
  content:"└";
  margin-right:6px;
  opacity:.5;
}
.skin-stage-item[data-type="container"]{
  background:rgba(24,175,230,.055)!important;
  border:1px dashed rgba(24,175,230,.8)!important;
}
.skin-stage-item[data-type="container"]::before{
  content:"CONTENEDOR";
  position:absolute;
  left:5px;top:4px;
  font-size:7px;
  color:#68c8ec;
  pointer-events:none;
}
.skin-replace-component-action{
  display:flex;
  align-items:flex-end;
}
.skin-replace-component-action .btn{
  width:100%;
  min-height:31px;
}
.preview-skin-component[data-type="container"]{
  background:transparent!important;
  border:0!important;
  pointer-events:none;
}

/* v1.54 — Behaviours / estados Skin */
.skin-behaviour-controls{
  margin-top:8px;
}
.skin-state-tabs{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:5px;
  margin-bottom:9px;
}
.skin-state-tabs .btn{
  min-height:28px;
  padding:0 6px;
  font-size:9px;
}
.state-color-row{
  display:grid;
  grid-template-columns:auto 42px 1fr;
  align-items:center;
  gap:7px;
}
.state-color-row input[type="color"]{
  width:42px;
  height:28px;
  padding:1px;
}
.preview-skin-component{
  transform-origin:center center;
  will-change:transform,opacity,filter,background-color;
}
.skin-stage-item.behaviour-preview{
  outline:1px dotted rgba(255,199,78,.7);
}
.media-lib-section-title{font-size:9px;font-weight:700;color:#cbd6df;margin:10px 0 6px;border-top:1px solid #2b343c;padding-top:8px}.media-runtime-badge{font-size:7px;opacity:.72;margin-top:3px}.vista-media-effect-host{will-change:transform,opacity}.vista-media-hidden{display:none!important}
/* v1.57 — regresión integral / paridad publicación */
.project-regression-report{
  margin-top:10px;
  border-top:1px solid #343d46;
  padding-top:10px
}
.regression-row{
  display:grid;
  grid-template-columns:22px minmax(0,1fr) auto;
  gap:8px;
  align-items:start;
  padding:7px 8px;
  border-bottom:1px solid #29323a;
  font-size:9px
}
.regression-row .reg-ok{color:#5ed69a}
.regression-row .reg-warn{color:#ffd16a}
.regression-row .reg-error{color:#ff7a7a}
.regression-row small{display:block;color:#7f8a94;margin-top:2px;line-height:1.35}
.publish-validation-note{
  margin-top:8px;padding:8px 10px;border:1px solid #35404a;background:#1c2329;color:#aeb8c2;font-size:9px
}

/* v1.58 bibliotecas suministradas */
.vista-library-reference .library-card-thumb img{object-fit:contain;max-width:100%;max-height:100%}
.vista-library-reference .library-card-name{font-size:9px}

/* v1.59 — componentes Skin originales por estado */
.skin-stage-item img,
.preview-skin-component img{
  transition:inherit;
}

/* ============================================================
   v1.60 — Editor Skin: toolbar, cuadrícula y visibilidad
   ============================================================ */

#skinComponentsModal .skin-editor-toolbar{
  display:flex !important;
  flex-flow:row nowrap !important;
  align-items:center !important;
  gap:6px !important;
  overflow:visible !important;
  white-space:nowrap !important;
  min-height:52px;
  padding:8px 10px;
}

#skinComponentsModal .skin-editor-toolbar > *{
  flex:0 0 auto !important;
}

#skinComponentsModal .skin-toolbar-separator{
  align-self:stretch;
  width:1px;
  min-width:1px;
  margin:0 2px;
}

/* Menú Agregar */
.skin-add-menu-wrap{
  position:relative;
  display:flex;
  align-items:center;
}
.skin-add-menu-btn{
  min-width:104px;
  height:34px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  line-height:1 !important;
}
.skin-add-menu{
  position:absolute;
  top:calc(100% + 5px);
  left:0;
  z-index:10050;
  width:175px;
  padding:5px;
  border:1px solid #3a4650;
  background:#20272e;
  box-shadow:0 10px 28px rgba(0,0,0,.48);
}
.skin-add-menu button{
  display:flex;
  align-items:center;
  gap:9px;
  width:100%;
  min-height:36px;
  padding:7px 10px;
  border:0;
  background:transparent;
  color:#dce2e7;
  text-align:left;
  cursor:pointer;
  font:inherit;
}
.skin-add-menu button:hover{
  background:#2b353e;
  color:#fff;
}
.skin-add-type-icon{
  width:24px;height:24px;display:grid;place-items:center;flex:0 0 24px;
  border:1px solid #46505d;border-radius:5px;background:#11151a;color:#c9d2dc;
}
.skin-add-type-icon svg{width:16px;height:16px;display:block;color:inherit}

/* Todas las herramientas superiores alineadas sobre el mismo eje */
#skinComponentsModal .skin-editor-toolbar .btn,
#skinComponentsModal .skin-align-menu-btn,
#skinComponentsModal .skin-copy-mobile-btn,
#skinComponentsModal #skinBringFrontBtn,
#skinComponentsModal #skinSendBackBtn{
  box-sizing:border-box;
  height:34px !important;
  min-height:34px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  line-height:1 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  vertical-align:middle !important;
}

#skinComponentsModal #skinAlignMenuBtn{
  transform:none !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
}

/* Reducir espacio antes de crear scroll o segunda fila */
#skinComponentsModal .skin-editor-toolbar{
  font-size:10px;
}
#skinComponentsModal .skin-editor-toolbar .btn{
  padding-left:9px;
  padding-right:9px;
}
#skinComponentsModal .skin-responsive-preview{
  display:flex !important;
  align-items:center !important;
  gap:4px !important;
}
#skinComponentsModal .skin-responsive-preview select{
  max-width:105px;
}

/* Cuadrícula de diseño restaurada.
   Dos niveles: cuadrícula principal + subdivisiones. */
#skinStage{
  position:relative !important;
  background-color:#11181f !important;
  background-image:
    linear-gradient(to right, rgba(72,101,118,.28) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(72,101,118,.28) 1px, transparent 1px),
    linear-gradient(to right, rgba(72,101,118,.11) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(72,101,118,.11) 1px, transparent 1px) !important;
  background-size:
    50px 50px,
    50px 50px,
    10px 10px,
    10px 10px !important;
  background-position:0 0 !important;
}

#skinStage .skin-stage-safe-area{
  z-index:1;
  pointer-events:none;
}
#skinStageItems{
  position:absolute !important;
  inset:0 !important;
  z-index:2 !important;
  pointer-events:none;
}
#skinStageItems > .skin-stage-item{
  pointer-events:auto;
}

/* No permitir que una capa vacía tape los componentes */
#skinStage .skin-stage-item{
  visibility:visible;
}

/* En pantallas estrechas seguimos manteniendo una sola línea.
   Se compactan controles en lugar de crear segunda fila. */
@media (max-width:1550px){
  #skinComponentsModal .skin-editor-toolbar{
    gap:3px !important;
    font-size:9px;
  }
  #skinComponentsModal .skin-editor-toolbar .btn{
    padding-left:6px;
    padding-right:6px;
  }
  #skinComponentsModal .skin-snap-control{
    gap:3px;
  }
}

/* ============================================================
   v1.61 — Arquitectura Vista360Cloud: Main Viewer + Skin persistente
   ============================================================ */

/* El panorama y sus Hotspots viven dentro de Main Viewer. */
#viewer{
  position:relative !important;
  isolation:isolate;
  overflow:hidden;
}
#viewer #glCanvas{
  position:absolute;
  inset:0;
  z-index:0 !important;
}
#viewer #transformCanvas{
  position:absolute;
  inset:0;
  z-index:20 !important;
}
#viewer #overlay{
  position:absolute;
  inset:0;
  z-index:30 !important;
}
#viewer #htmlOverlay{
  position:absolute;
  inset:0;
  z-index:40 !important;
}

/* El Skin es HUD fijo, no forma parte de la cámara 360. */
#viewer #previewSkinLayer,
body.vista360-published #previewSkinLayer{
  position:absolute !important;
  inset:0 !important;
  z-index:2000 !important;
  pointer-events:none;
  transform:none !important;
  perspective:none !important;
  transform-style:flat !important;
  overflow:hidden;
  contain:layout style;
}

/* Los componentes Skin usan exclusivamente coordenadas de pantalla. */
.preview-skin-component{
  position:absolute !important;
  box-sizing:border-box !important;
  margin:0 !important;
  transform-origin:center center;
  pointer-events:auto;
  min-width:0;
  min-height:0;
}

/* Quitar decoración de prototipo: la imagen Skin debe verse tal como fue diseñada. */
.preview-skin-component[data-type="image"]{
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.preview-skin-component[data-type="image"]::before{
  content:none !important;
  display:none !important;
}
.preview-skin-component[data-type="image"] > img{
  display:block;
  width:100% !important;
  height:100% !important;
  object-fit:contain;
  pointer-events:none;
}

/* Texto Skin también es HUD, sin caja gráfica impuesta. */
.preview-skin-component[data-type="text"]{
  border:0;
  background:transparent;
  box-shadow:none;
}

/* Los controles de diagnóstico de Preview quedan por encima del Skin,
   pero no forman parte del Tour publicado. */
#viewer #previewChrome{z-index:2600 !important}
#viewer #previewEventLog{z-index:2700 !important}

/* Cambiar yaw/pitch/FOV jamás transforma el Skin. */
#app.preview-active #previewSkinLayer,
body.vista360-published #previewSkinLayer{
  translate:none !important;
  rotate:none !important;
  scale:none !important;
}

/* v1.62 — previews identificables */
.action-media-card-thumb,
.media-library-thumb{
  background:#12171c;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.action-media-card-thumb img,
.media-library-thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.action-media-card-thumb img[src^="data:image/svg"],
.media-library-thumb img[src^="data:image/svg"]{
  object-fit:contain;
}

/* Skin: los componentes deben existir visualmente desde el primer render. */
#skinStageItems .skin-stage-item{
  opacity:1;
  visibility:visible;
  will-change:left,top,width,height;
}
#skinStageItems .skin-stage-item[data-responsive-hidden="1"]{
  opacity:.22;
}

/* ============================================================
   v1.64 — Main Viewer permanente en Editor Skin
   ============================================================ */
#skinStage{
  isolation:isolate;
}
#skinStageMainViewer{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-color:#10161c;
  background-position:center center;
  background-repeat:no-repeat;
  background-size:cover;
  opacity:.56;
  border:1px solid rgba(84,116,135,.5);
  box-sizing:border-box;
}
#skinStageMainViewer.has-panorama{
  filter:saturate(.78) brightness(.82);
}
.skin-mainviewer-badge{
  position:absolute;
  left:8px;
  top:8px;
  display:flex;
  align-items:center;
  gap:8px;
  max-width:80%;
  padding:4px 7px;
  border:1px solid rgba(47,174,225,.48);
  background:rgba(9,16,22,.78);
  color:#d9e6ed;
  font-size:8px;
  pointer-events:none;
}
.skin-mainviewer-badge b{
  color:#5ac9f2;
  letter-spacing:.04em;
}
.skin-mainviewer-badge span{
  color:#8fa5b2;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#skinStage .skin-stage-safe-area{
  z-index:1 !important;
}
#skinStageItems{
  z-index:2 !important;
}

/* Main Viewer es la capa base de la lista y no se puede borrar/mover. */
.skin-mainviewer-row{
  margin-top:5px;
  border-top:1px solid #34434e !important;
  background:#17222a !important;
  cursor:default !important;
  opacity:.96;
}
.skin-mainviewer-row:hover{
  background:#1a2932 !important;
}
.skin-mainviewer-row .skin-row-name{
  color:#80d8f7;
}
.skin-mainviewer-fixed-icon{
  pointer-events:none;
  opacity:.7;
}
.skin-mainviewer-count{
  min-width:22px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  background:#2c3c47;
  color:#a9bbc6;
  font-size:8px;
  margin-left:auto;
  margin-right:6px;
}

/* v1.65 — movimiento Skin fluido */
#skinStageItems .skin-stage-item{
  touch-action:none;
}
#skinStageItems .skin-stage-item.dragging-live{
  transition:none !important;
}
.skin-stage-mainviewer{
  transition:none !important;
}

/* v1.66 — Main Viewer properties + Text Skin */
.skin-readonly-value{
  min-height:34px;
  display:flex;
  align-items:center;
  padding:0 10px;
  border:1px solid #33404a;
  background:#131a20;
  color:#94a8b5;
}
#skinMainViewerOptions .small-note{
  line-height:1.45;
}
#skinTextOptions{
  border-top:1px solid #34404a;
  margin-top:9px;
  padding-top:10px;
}
#skinTextOptions .text-style-row,
#skinTextOptions .text-align-row{
  margin:7px 0;
}

/* v1.67 — Biblioteca sin columna Álbumes fuera de IMÁGENES */
#mediaLibraryManagerModal .media-library-sidebar.hidden{display:none!important;}
#mediaLibraryManagerModal .media-library-layout:has(.media-library-sidebar.hidden){grid-template-columns:minmax(0,1fr) 320px;}

/* v1.68 video clásico y biblioteca estable */
.classic-video-props .video-opacity-row{display:grid;grid-template-columns:78px 1fr 50px;align-items:center;gap:8px}.classic-video-props .video-opacity-row label{margin:0}.classic-video-props .video-opacity-row input[type=number]{padding:5px}.classic-video-props .inline-select{display:grid;grid-template-columns:80px 1fr;align-items:center;gap:8px}.classic-video-props .inline-select label{margin:0}.target-row small{margin-left:auto;opacity:.55;font-size:11px}.media-library-sidebar.hidden{display:none!important}


/* ============================================================
   v1.69 — Acción Hotspots y Biblioteca Multimedia reconstruida
   ============================================================ */
#mediaLibraryManagerModal .media-library-layout{
  grid-template-columns:minmax(0,1fr)!important;
}
#mediaLibraryManagerModal .media-library-layout.albums-visible{
  grid-template-columns:220px minmax(0,1fr)!important;
}
#mediaLibraryManagerModal .media-library-sidebar.hidden{display:none!important}
#mediaLibraryManagerModal .media-library-content{min-width:0}
#mediaLibraryManagerModal .media-library-card{cursor:default}
#mediaLibraryManagerModal .media-library-card.selected{border-color:transparent}
#mediaLibraryManagerModal .media-library-empty{grid-column:1/-1;padding:24px}
#mediaLibraryManagerModal .media-library-properties{display:none!important}
#transformRotationFields.hidden,#transformRotationHelp.hidden{display:none!important}
#hotspotAdvancedAppearance.hidden{display:none!important}
.target-empty-note{padding:12px}
@media(max-width:780px){
  #mediaLibraryManagerModal .media-library-layout.albums-visible{grid-template-columns:170px minmax(0,1fr)!important}
}


/* ============================================================
   v1.70 — Selector de panorama y Biblioteca Multimedia estable
   ============================================================ */
.hotspot-panorama-field{display:grid!important;grid-template-columns:minmax(0,1fr) 42px!important;align-items:stretch}
.folder-panorama-select{
  width:100%;min-width:0;border:0!important;border-radius:0!important;
  background:#121217!important;color:#d8d8dc!important;text-align:center;
  font-style:italic;padding:9px 34px 9px 12px!important;cursor:pointer;
}
.folder-panorama-select:focus{outline:1px solid #1da9e6;outline-offset:-1px}
.hotspot-panorama-field button{min-width:42px}
#hotspotTargetList .target-row{display:flex!important;align-items:center!important;gap:10px!important;width:100%!important}
#hotspotTargetList .target-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#hotspotTargetList .target-row small{flex:none}
#mediaLibraryManagerModal .media-library-card{user-select:none}
#mediaLibraryManagerModal .media-library-card:focus{outline:none}
#mediaLibraryManagerModal .media-library-layout:not(.albums-visible){grid-template-columns:minmax(0,1fr)!important}


/* v1.71 — transformadores visuales, modales deterministas y controles robustos */
#transformNumericWrap,#transformRotationFields,#transformRotationHelp{display:none!important}
.transform-y-tilt-arm{stroke-dasharray:3 2}
.transform-y-tilt-handle{cursor:ew-resize}
.studio-modal{isolation:isolate}
.action-choice[data-action-kind="mediaControl"]{display:none!important}


/* ============================================================
   v1.72 — controles coherentes, biblioteca y selección de color
   ============================================================ */
.native-color-choice{
  display:grid;
  grid-template-columns:minmax(58px,1fr) auto;
  gap:7px;
  align-items:center;
  width:100%;
}
.native-color-choice input[type="color"]{
  width:100%;
  min-width:58px;
}
.native-no-color-btn{
  white-space:nowrap;
  padding:7px 9px!important;
  font-size:10px!important;
}
.native-no-color-btn.active{
  border-color:#ef5350!important;
  background:linear-gradient(135deg,#f5f5f5 0 44%,#ef5350 45% 55%,#f5f5f5 56% 100%)!important;
  color:#111!important;
}
input[type="color"].no-color{
  opacity:.45;
  background:linear-gradient(135deg,#fff 0 44%,#e33 45% 55%,#fff 56% 100%);
}
.album-picker-import-label{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  white-space:nowrap;
}
#albumImagePickerModal .album-image-picker-toolbar{
  gap:10px;
}
#albumImagePickerAddBtn:disabled{
  opacity:.48;
  cursor:not-allowed;
}
/* Campos numéricos de transparencia: escritura decimal estable. */
.range-number-input,
input[id*="Opacity" i][type="number"],
input[id*="Opacidad" i][type="number"],
input[id*="Transparency" i][type="number"]{
  font-variant-numeric:tabular-nums;
}

/* ============================================================
   v1.73 — opacidad decimal estable y Biblioteca sin Álbumes
   ============================================================ */
.range-number-input[data-opacity-decimal="1"]{
  appearance:textfield;
  -moz-appearance:textfield;
  text-align:center;
}
.range-number-input[data-opacity-decimal="1"]::-webkit-outer-spin-button,
.range-number-input[data-opacity-decimal="1"]::-webkit-inner-spin-button{
  -webkit-appearance:none;
  margin:0;
}
#mediaLibraryManagerModal .media-library-layout,
#mediaLibraryManagerModal .media-library-layout.albums-visible{
  grid-template-columns:minmax(0,1fr)!important;
}


/* v1.74 — interacción común */
.interaction-toggle-grid{margin:8px 0 14px}
.rollover-only{transition:opacity .12s ease}
.skin-stage-item.rollover-only:not(:hover){opacity:0!important}

/* ============================================================
   v1.90 — Preview Runtime modular
   ============================================================ */
.projective-video{
  overflow:hidden;
  background:#000;
  border:0;
  box-shadow:none;
}
.projective-video > video{
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
  background:#000;
  pointer-events:none;
}
.projective-video-empty{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font-size:42px;
  color:#fff;
  background:#151a21;
  pointer-events:none;
}
.projective-video.runtime-video-visual-hidden > video,
.projective-video.runtime-video-visual-hidden > .projective-video-empty{
  opacity:0!important;
}
#app.preview-active .projective-video.runtime-video-fullscreen,
body.vista360-published .projective-video.runtime-video-fullscreen{
  transform:none!important;
  transform-origin:0 0!important;
  background:#000!important;
}
#app.preview-active .projective-video.runtime-video-fullscreen > video,
body.vista360-published .projective-video.runtime-video-fullscreen > video{
  object-fit:contain;
}
#app.preview-active .projective-object[data-hand-cursor="0"],
#app.preview-active .polygon-layer-object polygon[data-hand-cursor="0"],
#previewSkinLayer .preview-skin-component[data-hand-cursor="0"],
body.vista360-published .projective-object[data-hand-cursor="0"],
body.vista360-published .polygon-layer-object polygon[data-hand-cursor="0"],
body.vista360-published #previewSkinLayer .preview-skin-component[data-hand-cursor="0"]{
  cursor:default!important;
}
#app.preview-active .projective-object[data-hand-cursor="1"],
#app.preview-active .polygon-layer-object polygon[data-hand-cursor="1"],
#previewSkinLayer .preview-skin-component[data-hand-cursor="1"],
body.vista360-published .projective-object[data-hand-cursor="1"],
body.vista360-published .polygon-layer-object polygon[data-hand-cursor="1"],
body.vista360-published #previewSkinLayer .preview-skin-component[data-hand-cursor="1"]{
  cursor:pointer!important;
}
.projective-object[data-rollover-only="1"],
.polygon-layer-object polygon[data-rollover-only="1"],
.preview-skin-component[data-rollover-only="1"]{
  transition:opacity .12s ease,fill-opacity .12s ease,stroke-opacity .12s ease;
}

/* ============================================================
   v2.00 — Biblioteca Multimedia modular
   ============================================================ */
#mediaLibraryManagerModal .media-library-manager-window{
  width:min(1120px,94vw);
  height:min(760px,88vh);
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr) auto;
}
#mediaLibraryManagerModal .media-library-toolbar{
  min-height:48px;
  align-items:center;
  gap:6px;
  border-bottom:1px solid #29343e;
}
#mediaLibraryManagerModal .media-library-result-count{
  margin-left:8px;
  color:#8798a6;
  font-size:10px;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
#mediaLibraryManagerModal .media-library-layout,
#mediaLibraryManagerModal .media-library-layout.albums-visible{
  min-height:0;
  display:block;
  grid-template-columns:none!important;
}
#mediaLibraryManagerModal .media-library-content{
  height:100%;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
}
#mediaLibraryManagerModal .media-library-grid{
  position:relative;
  align-content:start;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:12px;
}
#mediaLibraryManagerModal .media-library-card{
  min-width:0;
  cursor:default!important;
  user-select:none;
  contain:layout paint style;
}
#mediaLibraryManagerModal .media-library-card[hidden]{display:none!important;}
#mediaLibraryManagerModal .media-library-card.selected{
  border-color:transparent!important;
  box-shadow:none!important;
}
#mediaLibraryManagerModal .media-library-thumb{
  aspect-ratio:16/10;
  height:auto;
}
#mediaLibraryManagerModal .media-library-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
#mediaLibraryManagerModal .media-library-empty{
  grid-column:1/-1;
  min-height:220px;
  display:grid;
  place-items:center;
  padding:24px;
  color:#7f8c98;
  text-align:center;
}
#mediaLibraryManagerModal .media-library-empty[hidden]{display:none!important;}
#mediaLibraryManagerModal .media-library-properties,
#mediaLibraryManagerModal .media-library-sidebar,
#mediaLibraryManagerModal #mediaLibCreateAlbumBtn,
#mediaLibraryManagerModal #mediaLibAlbumsList{
  display:none!important;
}
#actionMediaPickerModal .action-media-card{
  appearance:none;
  -webkit-appearance:none;
  display:block;
  width:auto;
  min-width:0;
  padding:8px;
  color:inherit;
  text-align:left;
  font:inherit;
  background:#151b22;
  border:1px solid #27323c;
  border-radius:3px;
  cursor:pointer;
}
#actionMediaPickerModal .action-media-card:hover{
  border-color:#3c4a56;
  background:#19222a;
}
#actionMediaPickerModal .action-media-card.selected{
  border-color:#00aeef;
  box-shadow:0 0 0 1px #00aeef inset;
}
#actionMediaPickerModal .action-media-card:focus-visible{
  outline:2px solid #43c6f5;
  outline-offset:2px;
}
@media(max-width:760px){
  #mediaLibraryManagerModal .media-library-toolbar{flex-wrap:wrap;}
  #mediaLibraryManagerModal .media-library-spacer{display:none;}
  #mediaLibraryManagerModal .media-library-toolbar .search-input{width:100%;order:2;}
  #mediaLibraryManagerModal .media-library-result-count{margin-left:auto;}
}

/* ============================================================
   v2.30 — Inspector y Editor Skin modular
   ============================================================ */
.project-inspector-filter{
  min-width:150px;
  height:34px;
  border:1px solid #3c4653;
  border-radius:5px;
  background:#171c22;
  color:#e8edf2;
  padding:0 8px;
}
.project-inspector-empty{
  padding:28px 18px;
  text-align:center;
  color:#8e9aa7;
  border:1px dashed #35404b;
  border-radius:6px;
}
.skin-row-layer{
  min-width:24px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-left:auto;
  border-radius:9px;
  background:#26323c;
  color:#95a8b6;
  font-size:9px;
  font-variant-numeric:tabular-nums;
}
.skin-manager-row .skin-row-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.skin-inline-rename{
  min-width:0;
  flex:1;
  height:24px;
  padding:2px 6px;
  border:1px solid #19aee8;
  border-radius:4px;
  background:#10171d;
  color:#fff;
}
.skin-mainviewer-row{
  position:sticky;
  top:0;
  z-index:3;
}
.skin-mainviewer-row .skin-row-name{
  margin-right:auto;
}
.skin-manager-row.drag-over{
  outline:1px solid #22b5ef;
  outline-offset:-1px;
}
#skinEditorStatus{
  max-width:70%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* v3.00 — carga diferida y estado de catálogos */
#imageLibraryModal .library-empty b{color:#dce8ef}
script[data-vista360-catalog]{display:none!important}
#imageLibraryModal .library-load-more{
  grid-column:1/-1;
  min-height:42px;
  border:1px solid #34434f;
  border-radius:6px;
  background:#1a232b;
  color:#b9dbea;
  cursor:pointer;
}
#imageLibraryModal .library-load-more:hover{background:#21303a;border-color:#48bde7}


/* v3.01 — action editing, hover switch and stability polish */
.action-row .action-summary{flex:1 1 auto}
.action-row-controls{display:inline-flex;align-items:center;gap:2px;margin-left:auto;flex:0 0 auto}
.action-row .action-row-controls button{margin-left:0;width:24px;height:24px;display:grid;place-items:center;border-radius:4px;font-size:15px;line-height:1}
.action-row .action-edit-btn{color:#63c8f1}
.action-row .action-edit-btn:hover{background:#17465b;color:#fff}
.action-row .action-delete-btn:hover{background:#552a30;color:#ffadb5}
.hover-enable-row{margin-bottom:10px}
.disabled-controls{opacity:.45;pointer-events:none}


/* v3.02 — nombre de proyecto, permiso de sonido y audio sin indicador visual */
.project-name-editor{padding:10px 12px 12px;border-bottom:1px solid var(--line);background:#151920}
.project-name-editor label{display:block;margin-bottom:6px;color:#8f9aa8;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.project-name-editor input{width:100%;height:36px;border:1px solid #353d49;border-radius:6px;background:#10151c;color:#f2f5f8;padding:0 10px;font:600 13px/1.2 Segoe UI,Arial,sans-serif;outline:none}
.project-name-editor input:focus{border-color:#1da7e1;box-shadow:0 0 0 2px rgba(29,167,225,.15)}
.preview-sound-btn{border-color:#2b8fbc!important;background:#15384a!important;color:#dff6ff!important}
.runtime-audio-indicator{display:none!important}


/* v3.04 — propiedades funcionales de panorama */
.panorama-properties{padding-bottom:26px}




.panorama-properties .property-fold{border-bottom:1px solid var(--line)}
.panorama-properties .property-fold>summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:42px;
  padding:0 13px;
  background:#20252d;
  color:#dce3ea;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  list-style:none;
}
.panorama-properties .property-fold>summary::-webkit-details-marker{display:none}
.panorama-properties .property-fold[open]>summary span:not(.badge){transform:none}
.panorama-properties .property-fold-body{padding:12px 13px;background:#181d24}
.panorama-numeric-grid input{min-width:0}
.panorama-initial-view-btn{margin-top:6px}
.panorama-initial-readout{text-align:center;margin-top:7px}
.autoplay-master-row{margin-bottom:9px;font-weight:600}
.inline-property-field{display:flex;align-items:center;justify-content:space-between;gap:8px}
.inline-property-field>label{margin:0}
.inline-unit-input{display:flex;align-items:center;gap:6px}
.inline-unit-input input{width:78px}
.inline-unit-input span{color:var(--muted);font-size:11px}
#panoramaAutoplayControls.disabled-controls{opacity:.48}
#panoramaAutoplayControls.disabled-controls input,
#panoramaAutoplayControls.disabled-controls select{cursor:not-allowed}

.viewer.panorama-transition-fade canvas,
.viewer.panorama-transition-fade .html-overlay,
.viewer.panorama-transition-fade svg{
  animation:v360PanoFade var(--panorama-transition-duration,.5s) ease-out both;
}
.viewer.panorama-transition-softZoom canvas,
.viewer.panorama-transition-softZoom .html-overlay,
.viewer.panorama-transition-softZoom svg{
  transform-origin:center;
  animation:v360PanoSoftZoom var(--panorama-transition-duration,.5s) cubic-bezier(.22,.7,.25,1) both;
}
.viewer.panorama-transition-slide canvas,
.viewer.panorama-transition-slide .html-overlay,
.viewer.panorama-transition-slide svg{
  animation:v360PanoSlide var(--panorama-transition-duration,.5s) ease-out both;
}
@keyframes v360PanoFade{from{opacity:.12}to{opacity:1}}
@keyframes v360PanoSoftZoom{from{opacity:.2;transform:scale(1.018)}to{opacity:1;transform:scale(1)}}
@keyframes v360PanoSlide{from{opacity:.25;transform:translateX(10px)}to{opacity:1;transform:translateX(0)}}

.panorama-file-picker-row{display:grid;grid-template-columns:minmax(0,1fr) 38px;gap:7px;align-items:stretch}
.panorama-file-picker-row .readonly-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.panorama-file-picker-btn{display:grid;place-items:center;border:1px solid #3b4652;border-radius:5px;background:#11171e;color:#13b9ee;font-size:18px;cursor:pointer}
.panorama-file-picker-btn:hover{border-color:#18bdf2;background:#182530;color:#e8faff}
.panorama-file-picker-btn:focus-visible{outline:2px solid #1bbff2;outline-offset:1px}

/* ============================================================
   v3.05 — navegación vertical PROYECTO / SKiN / PANORAMAS
   y edición inicial de componentes SKiN
   ============================================================ */
.project-root-title,
.project-section-tab{
  min-height:38px;
  height:38px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
  padding:0 12px;
  border:0;
  border-bottom:1px solid var(--line);
  background:var(--panel);
  color:#c7cdd7;
  font:800 11px/1.2 "Segoe UI",Arial,sans-serif;
  letter-spacing:.12em;
  text-transform:uppercase;
  text-align:left;
}
.project-section-tab{cursor:pointer}
.project-section-tab:hover{background:#1b222b;color:#eef4f8}
.project-section-tab.active{
  background:#202731;
  color:#fff;
  box-shadow:inset 3px 0 #16bdf2;
}
.project-section-tab:focus-visible{outline:2px solid #16bdf2;outline-offset:-2px}
.project-section-tab .badge{min-width:22px;text-align:center;letter-spacing:normal}
.left-workspace-panel{
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
}
.left-workspace-panel.hidden{display:none!important}
.panorama-sidebar-list{padding:7px 6px;border-bottom:1px solid var(--line);flex:0 0 auto}
.skin-components-section{min-height:0;display:flex;flex-direction:column}
.component-section-header{height:34px}
.skin-sidebar-list{padding:6px;min-height:0;overflow:auto}
.skin-sidebar-row{
  display:grid!important;
  grid-template-columns:22px 22px 18px minmax(0,1fr) 22px!important;
  align-items:center;
  gap:5px!important;
  min-height:38px;
}
.skin-sidebar-row.selected{background:#35404d}
.skin-sidebar-control,.skin-sidebar-delete{
  width:22px;height:22px;display:grid;place-items:center;padding:0;border:0;
  border-radius:4px;background:transparent;color:#aab8c5;cursor:pointer;
}
.skin-sidebar-control:hover{background:#25313b;color:#fff}
.skin-sidebar-delete:hover{background:#552a30;color:#ffb2b9}
.skin-sidebar-control svg{width:16px;height:16px}
.skin-sidebar-type{color:#c9d2dc;text-align:center;font-weight:800;display:grid;place-items:center}
.skin-sidebar-name{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#edf2f6}
#previewSkinLayer.skin-editing-overlay{background:rgba(0,0,0,.02)}
#previewSkinLayer .skin-editing-component{
  outline:1px dashed rgba(45,195,245,.78);outline-offset:-1px;cursor:pointer!important;
}
#previewSkinLayer .skin-editing-component:hover{
  outline:2px solid #2dc3f5;
  box-shadow:0 0 0 1px rgba(0,0,0,.45),0 0 12px rgba(45,195,245,.35);
}
#hotspotMenuPanel.component-menu-mode #newPolygonBtn,
#hotspotMenuPanel.component-menu-mode #newWebFrameBtn,
#hotspotMenuPanel.component-menu-mode #openVideoHotspotPickerBtn{display:none!important}
.panorama-properties>.property-fold:first-child{border-top:0}

/* ============================================================
   v3.06 — SKiN integrado en el espacio principal
   ============================================================ */
.skin-integrated-list-host{
  min-height:0;
  flex:1 1 auto;
  overflow:auto;
  padding:4px 6px 12px;
}
.integrated-skin-list-section{
  display:flex;
  flex-direction:column;
  min-height:0;
}
.integrated-skin-manager-list{
  margin:0!important;
  max-height:none!important;
  overflow:visible!important;
}
.integrated-skin-manager-list .skin-manager-row{
  display:grid!important;
  grid-template-columns:24px 24px 18px minmax(0,1fr) 28px 24px!important;
  gap:5px!important;
  align-items:center!important;
  min-height:38px;
  padding:6px 5px!important;
  border:0!important;
  border-radius:5px!important;
  background:transparent;
  cursor:pointer;
}
.integrated-skin-manager-list .skin-manager-row:hover{background:#222a34}
.integrated-skin-manager-list .skin-manager-row.selected{background:#374150!important}
.integrated-skin-manager-list .skin-mainviewer-row{
  position:relative;
  top:auto;
  margin:0 0 4px;
  border-top:0!important;
  border-bottom:1px solid #2e3742!important;
  background:#1b252e!important;
}
.integrated-skin-manager-list .skin-row-name{font-size:12px;color:#e4eaf0}
.integrated-skin-manager-list .skin-mainviewer-row .skin-row-name{color:#75d5f7;font-weight:700}
.integrated-skin-manager-list .skin-row-layer{font-size:9px}

.skin-integrated-stage-host{
  position:absolute;
  inset:0;
  z-index:2100;
  display:grid;
  place-items:safe center;
  overflow:auto;
  overscroll-behavior:contain;
  padding:24px;
  background:#50565e;
  pointer-events:auto;
  scrollbar-gutter:stable;
}
.skin-integrated-stage-host.hidden{display:none!important}
.skin-integrated-stage-host #skinStage{
  width:var(--skin-stage-width,960px)!important;
  height:var(--skin-stage-height,540px)!important;
  max-width:100%!important;
  max-height:100%!important;
  min-height:0!important;
  margin:auto!important;
  aspect-ratio:var(--skin-aspect,16/9)!important;
  border:1px solid #818a93!important;
  border-radius:2px!important;
  background:#05080b!important;
  box-shadow:0 12px 34px rgba(0,0,0,.52),0 0 0 1px rgba(255,255,255,.08)!important;
  flex:0 0 auto;
}
.skin-integrated-stage-host #skinStageMainViewer{
  opacity:.78;
  filter:saturate(.82) brightness(.70);
}
.skin-integrated-stage-host #skinStageItems{pointer-events:none}
.skin-integrated-stage-host #skinStageItems>.skin-stage-item{pointer-events:auto}
.skin-integrated-stage-host .skin-stage-device-label{
  display:block!important;
  right:8px!important;
  bottom:7px!important;
  top:auto!important;
  left:auto!important;
  padding:4px 7px!important;
  border-radius:3px;
  background:rgba(5,8,11,.78)!important;
  color:#aab6c1!important;
  font-size:8px!important;
  pointer-events:none;
}

.skin-integrated-properties-host{
  min-height:0;
  overflow:auto;
  padding:12px;
}
.skin-integrated-properties-host.hidden{display:none!important}
.skin-integrated-properties-host #skinProperties{display:block}
.skin-integrated-properties-host #skinProperties.hidden{display:none!important}
.skin-integrated-properties-host .skin-property-section{margin-top:12px}
.skin-integrated-properties-host .group-title:first-child{margin-top:0}

#viewer.skin-workspace-active>#glCanvas,
#viewer.skin-workspace-active>#transformCanvas,
#viewer.skin-workspace-active>#overlay,
#viewer.skin-workspace-active>#htmlOverlay,
#viewer.skin-workspace-active>#previewSkinLayer{
  pointer-events:none!important;
}
#viewer.skin-workspace-active>#transformCanvas,
#viewer.skin-workspace-active>#overlay,
#viewer.skin-workspace-active>#htmlOverlay{
  visibility:hidden!important;
}
#viewer.skin-workspace-active #emptyViewer,
#viewer.skin-workspace-active #drawHint{display:none!important}
body.skin-workspace-mode .viewer-toolbar .camera-readout{opacity:.4}
body.skin-workspace-mode #modeLabel{color:#52c9f3}

.skin-workspace-source{display:none!important}

/* ============================================================
   v3.07 — SKiN GENERAL / MOBILE integrado
   ============================================================ */
.skin-workspace-device-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  flex:0 0 auto;
  border-bottom:1px solid var(--line);
  background:#151a21;
}
.skin-workspace-device-tab{
  min-height:40px;
  border:0;
  border-bottom:2px solid transparent;
  background:#171d25;
  color:#8fa0af;
  font:800 11px/1 "Segoe UI",Arial,sans-serif;
  letter-spacing:.08em;
  cursor:pointer;
}
.skin-workspace-device-tab:hover{background:#1d252e;color:#eef7fb}
.skin-workspace-device-tab.active{
  border-bottom-color:#19bdf1;
  background:#202933;
  color:#fff;
}
.skin-workspace-device-tab:focus-visible{outline:2px solid #19bdf1;outline-offset:-2px}
.skin-sidebar-mobile-preset{
  display:grid;
  gap:5px;
  padding:8px 10px;
  border-bottom:1px solid var(--line);
  background:#171d24;
}
.skin-sidebar-mobile-preset.hidden{display:none!important}
.skin-sidebar-mobile-preset label{
  color:#8595a4;
  font-size:9px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.skin-sidebar-mobile-preset select{
  width:100%;
  height:32px;
  border:1px solid #36424e;
  border-radius:4px;
  background:#10161d;
  color:#e8eef3;
  padding:0 8px;
}

.skin-integrated-stage-host #skinStageItems>.skin-stage-item{
  pointer-events:auto!important;
  user-select:none;
  touch-action:none;
}
.skin-integrated-stage-host #skinStageItems>.skin-stage-item.locked{cursor:not-allowed!important}
.integrated-skin-manager-list .skin-row-eye,
.integrated-skin-manager-list .skin-row-lock,
.integrated-skin-manager-list .skin-row-delete{
  position:relative;
  z-index:3;
  pointer-events:auto;
}

.skin-mobile-copy-window{width:min(660px,92vw);max-height:min(760px,90vh)}
.skin-mobile-copy-content{padding:16px 18px;overflow:auto}
.skin-mobile-copy-content>p{margin:0 0 12px;color:#b8c5cf;line-height:1.45}
.skin-mobile-copy-all{
  display:flex;align-items:center;gap:9px;
  min-height:36px;padding:0 10px;
  border:1px solid #35414d;border-radius:5px;
  background:#192129;color:#eaf2f6;font-weight:700;
}
.skin-mobile-copy-list{display:grid;gap:5px;margin-top:9px;max-height:360px;overflow:auto}
.skin-mobile-copy-row{
  display:grid;grid-template-columns:24px 24px minmax(0,1fr);gap:7px;align-items:center;
  min-height:40px;padding:6px 10px;
  border:1px solid #2d3741;border-radius:5px;
  background:#151b22;color:#e3e9ee;cursor:pointer;
}
.skin-mobile-copy-row:hover{border-color:#3d9fc6;background:#1a242c}
.skin-mobile-copy-row input{width:16px;height:16px}
.skin-mobile-copy-icon{color:#c9d2dc;text-align:center;font-weight:800;display:grid;place-items:center}
.skin-mobile-copy-icon svg{width:16px;height:16px;display:block;color:inherit}
.skin-mobile-copy-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#skinMobileCopySelectedBtn:disabled{opacity:.45;cursor:not-allowed}


/* ============================================================
   v3.08 — marco SKiN, lienzo MÓVIL real y acciones bajo Tag
   ============================================================ */
.skin-integrated-stage-host[data-device="phone"] #skinStage{
  border-radius:14px!important;
}
.skin-integrated-stage-host[data-device="tablet"] #skinStage{
  border-radius:8px!important;
}
.skin-integrated-stage-host[data-device="general"] #skinStage{
  border-radius:2px!important;
}
.skin-integrated-stage-host #skinStageMainViewer{
  background-color:#05080b!important;
}
.skin-integrated-properties-host .skin-actions-section{
  margin-top:6px!important;
  margin-bottom:12px;
}
.skin-integrated-properties-host .skin-actions-section + .group-title{
  margin-top:14px;
}

/* ============================================================
   v3.09 — Mostrar/Esconder: presentación, efectos y fondo SKiN
   ============================================================ */

/* Fondo independiente del área de trabajo GENERAL / MÓVIL. */
.skin-workspace-bg-control{
  display:grid;
  gap:6px;
  padding:9px 10px 10px;
  border-bottom:1px solid var(--line);
  background:#171d24;
}
.skin-workspace-bg-control>label{
  color:#8595a4;
  font-size:9px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.skin-workspace-bg-row{
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 34px;
  gap:6px;
  align-items:center;
}
.skin-workspace-bg-row input[type="color"]{
  width:38px;
  height:32px;
  padding:2px;
  border:1px solid #36424e;
  border-radius:4px;
  background:#10161d;
  cursor:pointer;
}
.skin-workspace-bg-row input[type="text"]{
  width:100%;
  height:32px;
  box-sizing:border-box;
  border:1px solid #36424e;
  border-radius:4px;
  background:#10161d;
  color:#e8eef3;
  padding:0 9px;
  font:600 11px/1 "Segoe UI",Arial,sans-serif;
  text-transform:uppercase;
}
.skin-workspace-bg-row button{
  width:34px;
  min-width:34px;
  height:32px;
  padding:0!important;
}
.skin-workspace-bg-control small{
  color:#6f8291;
  font-size:9px;
  line-height:1.25;
}
.skin-integrated-stage-host{
  background:var(--skin-workspace-background,#50565e)!important;
}

/* Ventana compacta de dos columnas, como la referencia de Vista360Cloud. */
#actionConfigModal.showhide-components-config .action-config-window{
  width:min(850px,calc(100vw - 24px))!important;
  height:min(850px,calc(100dvh - 20px))!important;
}
#actionConfigModal.showhide-hotspots-config .action-config-window{
  width:min(1040px,calc(100vw - 24px))!important;
  height:min(870px,calc(100dvh - 20px))!important;
}
#actionConfigModal.showhide-components-config .action-config-layout{
  grid-template-columns:minmax(360px,410px) minmax(0,1fr)!important;
}
#actionConfigModal.showhide-hotspots-config .action-config-layout{
  grid-template-columns:minmax(360px,410px) minmax(0,1fr)!important;
}
#actionConfigModal.showhide-components-config .action-config-left,
#actionConfigModal.showhide-components-config .action-config-right,
#actionConfigModal.showhide-hotspots-config .action-config-left,
#actionConfigModal.showhide-hotspots-config .action-config-right{
  padding:22px 24px!important;
}
#actionConfigModal.showhide-components-config .action-config-left,
#actionConfigModal.showhide-hotspots-config .action-config-left{
  border-right:1px solid #44424a;
}

.showhide-left-extras{
  display:grid;
  gap:3px;
  margin-top:4px;
  min-width:0;
}
.showhide-mode-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px 12px;
  margin:7px 0 13px;
  color:#aaa9ae;
  font-size:11px;
}
.showhide-mode-row label{
  display:flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
  cursor:pointer;
}
.showhide-mode-row input[type="radio"]{
  width:15px;
  height:15px;
  margin:0;
  accent-color:#00aeef;
}
.action-effects-accordion{
  margin-top:2px;
  padding-left:0!important;
  border-top:0!important;
  font-size:12px!important;
}
.action-showhide-effects{
  padding:8px 0 4px 1px!important;
  border-top:0!important;
  color:#aaa9ae;
}
.showhide-effect-restore,
.showhide-effect-delay{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:36px;
  font-size:11px;
}
.showhide-effect-restore label,
.showhide-effect-delay label{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}
.showhide-effect-restore>span,
.showhide-effect-delay>span,
.showhide-effect-row>span:last-child{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  white-space:nowrap;
}
.showhide-effect-row{
  display:grid;
  grid-template-columns:70px 58px minmax(0,1fr);
  gap:7px;
  align-items:center;
  min-height:35px;
  font-size:11px;
}
.showhide-effect-row>label,
.showhide-effect-row>span:nth-child(2){
  text-align:right;
}
.action-showhide-effects select{
  width:100%;
  height:31px!important;
  min-width:0;
  box-sizing:border-box;
  background:#403e45!important;
  border:1px solid #403e45!important;
  color:#c9c9cd!important;
  text-align:center;
}
.action-showhide-effects input[type="number"]{
  width:94px!important;
  height:29px!important;
  box-sizing:border-box;
  text-align:right;
  background:#403e45!important;
  border:1px solid #403e45!important;
  color:#c9c9cd!important;
}
.action-showhide-effects input:disabled,
.action-showhide-effects select:disabled{
  opacity:.38;
  cursor:not-allowed;
}
.action-showhide-effects input[type="checkbox"]{
  width:14px;
  height:14px;
  margin:0;
  accent-color:#00aeef;
}

/* El panel derecho contiene siempre los filtros y la lista real. */
.showhide-target-panel{
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:100%;
  color:#aaa9ae;
}
.showhide-apply-field{
  margin:0 0 8px!important;
}
.showhide-apply-field>label{
  display:block;
  margin-bottom:7px!important;
  color:#d0d0d4!important;
  font-size:11px!important;
  font-weight:400!important;
  letter-spacing:0!important;
}
.showhide-target-panel .search-input,
.showhide-apply-field input{
  width:100%;
  min-height:36px;
  box-sizing:border-box;
  background:#403e45!important;
  border:1px solid #403e45!important;
  color:#d0d0d4!important;
  padding:0 10px;
}
.showhide-target-panel .search-input::placeholder,
.showhide-apply-field input::placeholder{
  color:#85848a;
  font-style:italic;
}
.showhide-device-tabs{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  margin:0 0 12px!important;
  min-height:46px;
  border-top:0!important;
  background:#11151a;
}
.showhide-device-tabs .device-tab{
  position:relative;
  height:46px;
  padding:0!important;
  border:0!important;
  border-top:3px solid transparent!important;
  background:#11151a!important;
  color:#8b8a91!important;
  font-size:16px!important;
}
.showhide-device-tabs .device-tab.active{
  border-top-color:#20a9e8!important;
  color:#fff!important;
}
.showhide-device-tabs .device-tab.active::before{
  content:"";
  position:absolute;
  top:-1px;
  left:50%;
  transform:translateX(-50%);
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-top:8px solid #20a9e8;
}
.target-search-selectall-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  margin-bottom:7px;
}
.target-search-selectall-row .search-input{
  min-width:0;
  margin:0!important;
}
.target-select-all{
  display:flex;
  align-items:center;
  gap:7px;
  min-height:36px;
  margin:0;
  padding:0 2px;
  color:#c9c9cd;
  font-size:11px;
  white-space:nowrap;
  cursor:pointer;
  user-select:none;
}
.target-select-all input[type="checkbox"]{
  width:15px!important;
  height:15px!important;
  margin:0!important;
  accent-color:#00aeef;
}
.target-select-all:has(input:disabled){
  opacity:.45;
  cursor:default;
}
.showhide-target-panel .target-check-list.classic-target-list{
  flex:1 1 auto;
  max-height:none!important;
  min-height:260px;
  overflow:auto;
  padding:2px 0 14px;
  background:transparent!important;
}
.showhide-target-panel .target-row{
  display:grid!important;
  grid-template-columns:18px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  width:100%!important;
  min-height:31px!important;
  box-sizing:border-box;
  padding:3px 4px!important;
  border:0!important;
  background:transparent!important;
  color:#aaa9ae!important;
  cursor:pointer;
}
.showhide-target-panel .target-row:hover{
  background:#323039!important;
  color:#ddd!important;
}
.showhide-target-panel .target-row input{
  width:15px!important;
  height:15px!important;
  margin:0!important;
  accent-color:#00aeef;
}
.showhide-target-panel .target-row span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
}
.showhide-target-panel .target-row small{
  margin-left:auto;
  color:#7c7b82;
  font-size:9px;
  white-space:nowrap;
}
.showhide-target-panel .target-empty-note{
  padding:20px 4px;
  color:#7d7b82;
}
.hotspot-showhide-targets .hotspot-panorama-field{
  margin:0 0 8px;
}
.hotspot-showhide-targets .target-media-preview{
  flex:0 0 min(220px,29vh);
  height:auto;
  margin-bottom:8px;
  border:1px solid #38373d;
}


@media(max-width:620px){
  .target-search-selectall-row{grid-template-columns:1fr;gap:5px;}
  .target-select-all{min-height:28px;justify-content:flex-start;}
}

@media(max-width:760px){
  #actionConfigModal.showhide-components-config .action-config-layout,
  #actionConfigModal.showhide-hotspots-config .action-config-layout{
    grid-template-columns:minmax(300px,42vw) minmax(340px,1fr)!important;
    overflow-x:auto!important;
  }
}

/* ============================================================
   v3.10 — Vista previa real, orden de panoramas, VR y publicación
   ============================================================ */

/* El color configurado pertenece al interior del marco SKiN. */
.skin-integrated-stage-host{
  background:#50565e!important;
}
.skin-integrated-stage-host #skinStage{
  background:var(--skin-workspace-background,#50565e)!important;
}
.skin-integrated-stage-host #skinStageMainViewer{
  background-color:var(--skin-workspace-background,#50565e)!important;
}
.skin-integrated-stage-host #skinStageMainViewer:not(.has-panorama){
  background-image:none!important;
}

/* Orden visual y por arrastre de panoramas. */
.pano-tree-item{
  display:grid!important;
  grid-template-columns:20px minmax(0,1fr) 25px 25px 25px!important;
  gap:2px!important;
  align-items:center;
}
.pano-tree-item.dragging{opacity:.42;outline:1px dashed #19bdf1}
.pano-tree-item.drag-before{box-shadow:inset 0 2px 0 #19bdf1}
.pano-tree-item.drag-after{box-shadow:inset 0 -2px 0 #19bdf1}
.pano-tree-item .pano-order-btn,
.pano-tree-item .pano-delete{
  width:23px!important;
  min-width:23px!important;
  height:23px!important;
  padding:0!important;
  display:grid!important;
  place-items:center;
  border:0;
  border-radius:3px;
  background:transparent;
  color:#8292a0;
  cursor:pointer;
}
.pano-tree-item .pano-order-btn:hover{background:#25313c;color:#fff}
.pano-tree-item .pano-order-btn:disabled{opacity:.24;cursor:default;background:transparent}
.pano-tree-item .pano-delete:hover{background:#512733;color:#ffb1bd}
.pano-tree-item .item-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.preview-vr-btn{border-color:#5468b7!important;background:#20284b!important;color:#e9edff!important}
.preview-vr-btn.active{background:#394eb0!important;border-color:#8191e8!important}
.preview-control-btn.fullscreen-active{background:#1d5c45!important;border-color:#3eaa7d!important;color:#e8fff5!important}
#viewer.vr-cardboard-mode{
  position:fixed!important;
  inset:0!important;
  z-index:99990!important;
  width:100vw!important;
  height:100vh!important;
  background:#000!important;
}
#viewer.vr-cardboard-mode #previewChrome,
#viewer.vr-cardboard-mode #previewEventLog,
#viewer.vr-cardboard-mode #previewSkinLayer,
#viewer.vr-cardboard-mode #overlay,
#viewer.vr-cardboard-mode #htmlOverlay,
#viewer.vr-cardboard-mode #transformCanvas{display:none!important}
#viewer.vr-cardboard-mode::after{
  content:"";
  position:absolute;
  left:50%;top:0;bottom:0;
  width:1px;
  background:rgba(255,255,255,.18);
  pointer-events:none;
  z-index:99999;
}
.preview-vr-hint{
  position:fixed;left:50%;bottom:18px;transform:translateX(-50%);
  z-index:100000;padding:8px 12px;border-radius:5px;
  background:rgba(7,11,18,.84);border:1px solid #3c4c62;color:#eaf4ff;
  font-size:11px;pointer-events:none;
}

/* Publicar v3.10 */
.publish-v310-window{
  width:min(950px,calc(100vw - 18px))!important;
  height:min(770px,calc(100dvh - 18px))!important;
  display:grid!important;
  grid-template-rows:44px minmax(0,1fr) 56px!important;
  overflow:hidden!important;
  background:#29272e!important;
}
.publish-v310-content{
  min-height:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  overflow:hidden;
  background:#29272e;
}
.publish-target-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  padding:16px 18px 12px;
  border-bottom:1px solid #3a3941;
}
.publish-target-card{
  position:relative;
  min-height:138px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:7px;
  border:2px solid transparent;
  border-radius:3px;
  background:#35323b;
  color:#c9c7cc;
  cursor:pointer;
}
.publish-target-card:hover{background:#3a3740;color:#fff}
.publish-target-card.active{border-color:#13b8f0;background:#37343d;color:#fff}
.publish-target-card strong{font-size:18px;font-weight:500}
.publish-target-card small{font-size:10px;color:#908d96}
.publish-target-card.active small{color:#b9c8d0}
.publish-target-check{
  position:absolute;right:14px;top:10px;color:#52d463;font-size:28px;font-weight:900;
  opacity:0;
}
.publish-target-card.active .publish-target-check{opacity:1}
.publish-target-illustration{
  width:90px;height:52px;display:grid;place-items:center;border-radius:8px;
  background:#1b2229;color:#41bff1;font-weight:900;font-size:26px;
}
.publish-target-illustration.standalone{background:#ad7725;color:#fff;font-size:15px;letter-spacing:.12em}
.publish-v310-options{min-height:0;overflow:auto;padding:12px 18px 18px}
.publish-option-panel{padding:12px 14px;margin-bottom:10px;border:1px solid #3b3942;background:#25232a}
.publish-option-panel.hidden{display:none!important}
.publish-fields-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px}
.publish-destination-row{display:grid;grid-template-columns:minmax(0,1fr) 38px;gap:6px}
.publish-destination-row .btn{padding:0!important}
.publish-options-v310{display:grid!important;grid-template-columns:1fr 1fr;gap:8px 14px!important;margin:12px 0 0!important}
.publish-diagnostics-row{opacity:.75}
.publish-inline-check{display:flex;align-items:center;gap:7px;margin-top:10px;color:#b7b4bd;font-size:10px}
.publish-security-note{padding:9px 11px;border-left:3px solid #d69b36;background:#332c20;color:#cfc1a5;font-size:9px;line-height:1.45}
.publish-v310-footer{background:#25232a!important}
.publish-v310-footer .btn.primary{min-width:150px}

body.vista360-published .preview-vr-btn,
body.vista360-published .preview-control-btn{font-size:10px}
body.vista360-published.runtime-controls-hidden #previewChrome{display:none!important}
body.vista360-published #app.preview-active .viewer-shell{inset:0!important}

@media (max-width:720px){
  .publish-target-grid{grid-template-columns:1fr 1fr;padding:10px;gap:8px}
  .publish-target-card{min-height:112px}
  .publish-target-card strong{font-size:14px}
  .publish-fields-grid,.publish-options-v310{grid-template-columns:1fr}
  .preview-control-btn{padding:5px 7px!important}
}


/* ============================================================
   v3.11 — fondo real, PNG transparente y controles Preview
   ============================================================ */

/* El color elegido debe verse exactamente dentro del marco, sin oscurecimiento. */
.skin-integrated-stage-host #skinStageMainViewer:not(.has-panorama){
  opacity:1!important;
  filter:none!important;
  background-color:var(--skin-workspace-background,#50565e)!important;
}
.skin-integrated-stage-host #skinStageMainViewer.has-panorama{
  background-color:transparent!important;
}

/* Las imágenes PNG del SKiN no reciben una caja oscura artificial. */
#skinStageItems .skin-stage-item[data-type="image"],
.skin-integrated-stage-host #skinStageItems .skin-stage-item[data-type="image"]{
  background:transparent!important;
  background-color:transparent!important;
  box-shadow:none!important;
}
#skinStageItems .skin-stage-item[data-type="image"]::before{
  content:none!important;
}
#skinStageItems .skin-stage-item[data-type="image"]>img{
  background:transparent!important;
}

/* El rectángulo transparente conserva tamaño para edición, pero no se dibuja. */
.preview-skin-component[data-type="image"]{
  background:transparent!important;
}
#previewSkinLayer .preview-skin-component[data-type="image"][data-alpha-hit="0"],
body.vista360-published #previewSkinLayer .preview-skin-component[data-type="image"][data-alpha-hit="0"]{
  cursor:default!important;
}

/* La barra de Vista previa siempre recibe interacción por encima del visor. */
#previewChrome,
#previewEventLog{
  pointer-events:auto!important;
  touch-action:manipulation;
}
#previewChrome button,
#previewEventLog button{
  pointer-events:auto!important;
  touch-action:manipulation;
}


/* ============================================================
   v3.14 — Preview, WEB y EXE autónomos
   ============================================================ */
#app.preview-active #previewChrome{
  opacity:.22;
  background:rgba(20,25,31,.18);
  border-color:rgba(110,130,150,.22);
  backdrop-filter:blur(2px);
  transition:opacity .2s ease,background-color .2s ease,border-color .2s ease,backdrop-filter .2s ease;
}
#app.preview-active #previewChrome:hover,
#app.preview-active #previewChrome:focus-within{
  opacity:1;
  background:#14191fdd;
  border-color:#46515d;
  backdrop-filter:blur(8px);
}
@media (hover:none),(pointer:coarse){
  #app.preview-active #previewChrome{opacity:.55}
  #app.preview-active #previewChrome:active,
  #app.preview-active #previewChrome:focus-within{opacity:1}
}
#app.preview-active.preview-device-mobile #previewSkinLayer{--vista360-preview-device:mobile}
#app.preview-active.preview-device-general #previewSkinLayer{--vista360-preview-device:general}
.publish-target-card:not(.active) .publish-target-check{display:none}
.publish-defaults-note{
  margin-top:10px;padding:8px 10px;border-left:3px solid #18a9df;
  background:#202a31;color:#b9cbd6;font-size:10px;line-height:1.45;
}
.publish-fields-grid-auto{grid-template-columns:1fr 1fr}
#publishDownloadBtn.busy{cursor:progress;opacity:.72}
#publishDownloadBtn:disabled,#publishTestBtn:disabled{cursor:progress;opacity:.62}
@media (max-width:720px){.publish-fields-grid-auto{grid-template-columns:1fr}}

/* ============================================================
   v3.13 — Prueba de SKiN realmente separada por dispositivo
   ============================================================ */
#app.preview-active .viewer-shell.preview-mobile-frame{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:#454e58!important;
  overflow:hidden!important;
  padding:8px!important;
}
#app.preview-active .viewer-shell.preview-mobile-frame>#viewer{
  position:relative!important;
  inset:auto!important;
  border:1px solid #82909d!important;
  border-radius:12px!important;
  overflow:hidden!important;
  box-shadow:0 14px 40px rgba(0,0,0,.45)!important;
  background:#000!important;
}
body.vista360-published .viewer-shell{
  display:block!important;
  padding:0!important;
  background:#000!important;
}


/* ============================================================
   v3.14 — Zoom SKiN, panel móvil adaptable y Vista previa estable
   ============================================================ */
.skin-stage-zoom-controls{
  position:absolute;
  right:14px;
  bottom:14px;
  z-index:3500;
  display:flex;
  align-items:center;
  gap:3px;
  padding:4px;
  border:1px solid rgba(130,148,164,.72);
  border-radius:7px;
  background:rgba(13,18,24,.90);
  box-shadow:0 6px 22px rgba(0,0,0,.38);
  backdrop-filter:blur(7px);
}
.skin-stage-zoom-controls button{
  min-width:34px;
  height:32px;
  border:1px solid #384553;
  border-radius:4px;
  background:#202a34;
  color:#eef6fb;
  font:700 16px/1 "Segoe UI",Arial,sans-serif;
  cursor:pointer;
}
.skin-stage-zoom-controls button:hover{background:#2b3946;border-color:#55bfe9}
.skin-stage-zoom-controls button:disabled{opacity:.38;cursor:not-allowed}
#skinStageZoomReset{min-width:62px!important;font-size:10px!important}
#skinStageZoomValue{display:block;white-space:nowrap}
.skin-integrated-stage-host.skin-stage-zoomed #skinStage{
  margin:0!important;
  max-width:none!important;
  max-height:none!important;
}
.skin-integrated-stage-host:not(.skin-stage-zoomed) #skinStage{
  margin:auto!important;
}

/* En el simulador MÓVIL, la barra se adapta al ancho del dispositivo sin
   comprimir los botones ni invadir el contenido del Tour. */
#app.preview-active.preview-device-mobile #previewChrome{
  left:6px;
  right:6px;
  top:6px;
  width:auto;
  min-height:0;
  max-height:min(42%,190px);
  padding:5px;
  gap:5px;
  flex-direction:column;
  align-items:stretch;
  overflow:auto;
  border-radius:6px;
}
#app.preview-active.preview-device-mobile .preview-chrome-left{
  min-height:25px;
  width:100%;
  gap:6px;
}
#app.preview-active.preview-device-mobile .preview-badge{
  padding:4px 6px;
  font-size:7px;
}
#app.preview-active.preview-device-mobile .preview-panorama-name{
  font-size:9px;
}
#app.preview-active.preview-device-mobile .preview-chrome-actions{
  width:100%;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:4px;
}
#app.preview-active.preview-device-mobile .preview-device-toggle{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:1fr 1fr;
  width:100%;
}
#app.preview-active.preview-device-mobile .preview-device-toggle button{
  width:100%;
  min-width:0;
  height:26px;
  padding:0 4px;
  font-size:8px;
}
#app.preview-active.preview-device-mobile .preview-control-btn{
  width:100%;
  min-width:0;
  height:29px;
  padding:0 3px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:0;
}
#app.preview-active.preview-device-mobile #previewFullscreenBtn::after{content:'⛶';font-size:14px}
#app.preview-active.preview-device-mobile #previewVrBtn::after{content:'VR';font-size:9px;font-weight:800}
#app.preview-active.preview-device-mobile #previewResetBtn::after{content:'↺';font-size:14px}
#app.preview-active.preview-device-mobile #previewLogBtn::after{content:'☷';font-size:14px}
#app.preview-active.preview-device-mobile #previewExitBtn::after{content:'✕';font-size:13px}
#app.preview-active.preview-device-mobile #previewSoundBtn::after{content:'🔊';font-size:12px}
#app.preview-active.preview-device-mobile #previewSoundBtn.hidden{display:none!important}
#app.preview-active.preview-device-mobile #previewExitBtn{grid-column:auto}

@media (max-width:520px){
  .skin-stage-zoom-controls{right:8px;bottom:8px}
  .skin-stage-zoom-controls button{min-width:30px;height:30px}
  #skinStageZoomReset{min-width:54px!important}
}

/* v3.16 — navegación del lienzo SKiN sin barras y tamaños independientes */
.skin-integrated-stage-host{
  overflow:hidden!important;
  scrollbar-gutter:auto!important;
  cursor:grab;
  touch-action:none;
}
.skin-integrated-stage-host.skin-stage-panning{cursor:grabbing}
.skin-integrated-stage-host #skinStage{
  transform:translate3d(var(--skin-pan-x,0px),var(--skin-pan-y,0px),0);
  transform-origin:center center;
  will-change:transform,width,height;
}
/* En la simulación MÓVIL, cerrar permanece en la primera fila. */
#app.preview-active.preview-device-mobile #previewChrome{
  position:absolute;
  overflow:visible;
  padding-top:5px;
}
#app.preview-active.preview-device-mobile .preview-chrome-left{
  padding-right:38px;
}
#app.preview-active.preview-device-mobile #previewExitBtn{
  position:absolute;
  top:5px;
  right:5px;
  width:31px;
  height:25px;
  padding:0;
  z-index:4;
}
#app.preview-active.preview-device-mobile .preview-chrome-actions{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

/* Pantalla completa conserva el SKiN MÓVIL y usa todo el visor. */
#viewer:fullscreen{
  width:100vw!important;
  height:100vh!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
}
#viewer:fullscreen #previewChrome{max-width:calc(100% - 12px)}



/* v3.16 — bloqueo uniforme, móvil proporcional y runtime estricto */
.skin-manager-row.locked,.skin-sidebar-row.locked{background:rgba(127,91,35,.22)!important;color:#d8b87d!important;border-color:rgba(226,174,82,.42)!important}
.skin-manager-row.locked .skin-row-name,.skin-sidebar-row.locked .skin-sidebar-name{opacity:.72}
.skin-stage-item.locked::after,.projective-object.locked-object::after{content:'🔒';position:absolute;right:3px;top:3px;z-index:9999;width:22px;height:22px;display:grid;place-items:center;border:1px solid #e4b65f;border-radius:50%;background:rgba(18,21,25,.9);color:#ffd783;font-size:12px;pointer-events:none}
body.vista360-published .projective-object.locked-object::after,#app.preview-active .projective-object.locked-object::after{display:none!important}
.locked-selection-badge circle{fill:rgba(18,21,25,.94);stroke:#e4b65f;stroke-width:2}.locked-selection-badge text{font-size:14px;pointer-events:none}
.polygon-vertex-editor{display:grid;gap:8px;margin:8px 0 12px}.polygon-vertex-summary{padding:8px 10px;border:1px solid #35404c;border-radius:5px;background:#111820}.polygon-vertex-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}.polygon-vertex-actions .btn:last-child{grid-column:1/-1}
#skinImageScaleInline.hidden{display:none!important}.image-size-independent,.skin-size-independent{margin:0}
#app.preview-active.preview-device-mobile .viewer-shell:fullscreen{display:flex!important;align-items:center!important;justify-content:center!important;background:#303944!important;padding:10px!important}
#app.preview-active.preview-device-mobile .viewer-shell:fullscreen>#viewer{position:relative!important;inset:auto!important;margin:auto!important;border:1px solid #82909d!important;border-radius:12px!important;overflow:hidden!important;background:#000!important}
#app.preview-active.preview-device-mobile #viewer.preview-mobile-fullscreen{max-width:calc(100% - 20px)!important;max-height:calc(100% - 20px)!important}
body.vista360-runtime-only,body.vista360-runtime-only #app,body.vista360-runtime-only .workspace,body.vista360-runtime-only .viewer-shell,body.vista360-runtime-only #viewer{margin:0!important;padding:0!important;inset:0!important;width:100vw!important;height:100vh!important;max-width:none!important;max-height:none!important;border:0!important;border-radius:0!important;background:#000!important}
body.vista360-runtime-only #overlay{pointer-events:none!important}body.vista360-runtime-only .selected-object,body.vista360-runtime-only .skin-stage-item.selected{outline:0!important;box-shadow:none!important}body.vista360-runtime-only .transform-handle,body.vista360-runtime-only .vertex-handle,body.vista360-runtime-only .locked-selection-badge{display:none!important}
.polygon-layer-object,.projective-object{will-change:transform;backface-visibility:hidden;transform-style:preserve-3d}

/* v3.16 final — bloqueo visible también en la lista de objetos */
.tree-item.locked{background:rgba(127,91,35,.22)!important;color:#d8b87d!important;border-color:rgba(226,174,82,.42)!important}
.tree-item.locked .item-name{opacity:.72}
.tree-item.locked[draggable="false"]{cursor:default}
body.vista360-runtime-only .projective-object,body.vista360-runtime-only .polygon-layer-object{user-select:none!important;-webkit-user-drag:none!important}
body.vista360-runtime-only .projective-object{outline:none!important}


/* v3.17 — selección múltiple, estados bloqueado/oculto y referencia CAD */
.object-list-toolbar{display:flex;gap:5px;flex-wrap:wrap;padding:6px 8px;border-bottom:1px solid #26323e;background:#111821}
.mini-tool-btn{border:1px solid #354656;background:#192430;color:#cbd8e3;border-radius:5px;padding:5px 7px;font-size:11px;cursor:pointer}
.mini-tool-btn:hover{border-color:#19b9f2;color:#fff}.cad-tool-btn{margin-left:auto;color:#63d8ff}
.tree-item.multi-selected,.skin-manager-row.multi-selected{box-shadow:inset 3px 0 #22bff4;background:#25384a!important}
.tree-item.locked,.skin-manager-row.locked{background:#30291f!important;color:#d8c7a8!important}
.tree-item.hidden-state,.skin-manager-row.hidden-state{background:#30231f!important;opacity:.82}
.layer-control.locked-active,.layer-control.hidden-active,.skin-row-lock.locked-active,.skin-row-eye.hidden-active{color:#f4a62a!important;fill:#f4a62a!important}
.skin-manager-row.locked .skin-row-lock,.skin-manager-row.hidden-state .skin-row-eye{color:#f4a62a!important}
.projective-object.selected-object{filter:drop-shadow(0 0 1px #21c3ff)}
.projective-object.selected-object::after{content:'';position:absolute;inset:-14px;border:14px solid transparent;pointer-events:auto}
.projective-object.locked-object::before,.skin-stage-item.locked::after{content:'🔒';position:absolute;right:-9px;top:-10px;background:#17202a;color:#f4a62a;border:1px solid #f4a62a;border-radius:50%;font-size:11px;line-height:18px;text-align:center;width:18px;height:18px;z-index:1000002;pointer-events:none}
.cad-reference-object{outline:1px dashed #55d8ff;opacity:.75}.cad-reference-object.locked-object{pointer-events:none!important}
.vista360-published .selected-object::after,.vista360-published .locked-object::before{display:none!important}

/* v3.17 — selección, bloqueo y zona segura */
.skin-sidebar-control.locked-active,
.skin-sidebar-control.hidden-active,
.skin-row-lock.locked-active,
.skin-row-eye.hidden-active,
.layer-control.locked-active,
.layer-control.hidden-active{color:#f4a62a!important;fill:#f4a62a!important}
.skin-sidebar-row.hidden-state,
.skin-manager-row.hidden-state,
.tree-item.hidden-state{background:rgba(100,63,24,.22)!important;border-color:rgba(244,166,42,.36)!important;color:#d7b77b!important}
.skin-sidebar-row.locked,
.skin-manager-row.locked,
.tree-item.locked{background:#30291f!important;border-color:#7d5d2a!important;color:#d8c7a8!important}
.skin-stage-item.selected{z-index:1000000!important}
.skin-stage-item.selected::after{
  content:'';position:absolute;inset:-14px;border:14px solid transparent;pointer-events:auto;z-index:-1;
}
.skin-locked-selection-badge{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;background:#f4a62a;color:#17120b;border:2px solid #fff;box-shadow:0 3px 12px #0008;
  font-size:15px;z-index:1000002;pointer-events:none;
}
.projective-object[data-selected-safe-zone="1"]{}
.projective-object[data-selected-safe-zone="1"]::after{
  content:'';position:absolute;inset:-16px;border:16px solid transparent;pointer-events:auto;
}
body.vista360-runtime-only .projective-object::after,
body.vista360-published .projective-object::after{display:none!important}
.locked-selection-badge circle{fill:#f4a62a;stroke:#fff;stroke-width:2}
.locked-selection-badge text{font-size:14px;pointer-events:none}


/* Vista360Cloud v3.18 — interacción, capas y edición reforzadas */
.locked-selection-badge,.skin-locked-selection-badge,
.skin-stage-item.locked::before,.skin-stage-item.locked::after,
.projective-object.locked-object::before,.projective-object.locked-object::after{
  display:none!important;content:none!important;
}
.skin-manager-row.locked,.skin-sidebar-row.locked,.tree-item.locked{
  background:rgba(127,91,35,.25)!important;
  border-color:rgba(244,166,42,.48)!important;
  color:#e6c891!important;
}
.skin-manager-row.hidden-state,.skin-sidebar-row.hidden-state,.tree-item.hidden-state{
  background:rgba(127,91,35,.16)!important;
}
.skin-manager-row.locked .skin-row-lock,.skin-sidebar-row.locked .skin-sidebar-control,
.tree-item.locked .layer-control,.hidden-active,.locked-active{color:#f4a62a!important;fill:#f4a62a!important}

.layer-group-folder{margin:4px 4px 7px;border:1px solid #3b4d5c;border-radius:6px;background:#111820;overflow:hidden}
.layer-group-header{display:flex;align-items:center;gap:7px;min-height:34px;padding:5px 8px;background:#202b35;color:#dce9f1;cursor:grab;user-select:none}
.layer-group-header:active{cursor:grabbing}.layer-group-icon{color:#f0b240}.layer-group-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.layer-group-count{min-width:22px;text-align:center;border-radius:999px;background:#314250;padding:2px 6px;font-size:11px}
.layer-group-body{padding:2px 3px 4px}.layer-group-body .tree-item,.layer-group-body .skin-manager-row,.layer-group-body .skin-sidebar-row{margin-left:8px}

.skin-stage-item[data-type="image"]{padding:0!important;overflow:visible!important;background:transparent!important}
.skin-stage-item[data-type="image"]>img{display:block!important;width:100%!important;height:100%!important;object-fit:fill!important;margin:0!important;padding:0!important}
.skin-resize-handle{width:18px!important;height:18px!important;border-width:3px!important;border-radius:50%!important;z-index:1000005!important}
.skin-resize-handle.nw{left:-10px!important;top:-10px!important}.skin-resize-handle.ne{right:-10px!important;top:-10px!important}
.skin-resize-handle.sw{left:-10px!important;bottom:-10px!important}.skin-resize-handle.se{right:-10px!important;bottom:-10px!important}
.transform-handle,.transform-mid-handle,.transform-rotate-handle,.transform-tilt-handle,.vertex-handle{
  stroke-width:3px!important;filter:drop-shadow(0 0 2px #000);
}
.transform-handle,.transform-mid-handle,.vertex-handle{r:8px}
.projective-object[data-selected-safe-zone="1"]{outline-offset:7px!important}

.skin-integrated-stage-host{cursor:default!important;overflow:hidden!important}
.skin-integrated-stage-host.skin-stage-panning{cursor:grabbing!important}
.skin-integrated-stage-host.skin-stage-panning *{cursor:grabbing!important}
#skinStage{touch-action:none;will-change:transform}
#skinStageItems{overflow:visible}
.runtime-mainviewer-video{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:2000!important;background:#000!important}
.runtime-mainviewer-video-card{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;background:#000!important}
.runtime-mainviewer-video video{width:100%!important;height:100%!important;object-fit:contain!important}
#previewSkinLayer,.published-skin-layer{z-index:2100!important}

.layer-group-folder.group-drag-over{outline:2px solid #24b8f2;outline-offset:-2px;background:rgba(36,184,242,.16)}
/* Las zonas transparentes de imágenes no se convierten en una zona segura interactiva. */
.projective-image.selected-object::after,.projective-image[data-selected-safe-zone="1"]::after{display:none!important;pointer-events:none!important}
.runtime-video-play-stopped{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:4;width:72px;height:72px;border-radius:50%;border:2px solid #fff;background:#111b;color:#fff;font-size:30px;cursor:pointer}
.runtime-video-play-stopped[hidden]{display:none!important}
body.vista360-runtime-only #overlay{pointer-events:auto!important}
body.vista360-runtime-only #overlay .transform-handle,body.vista360-runtime-only #overlay .transform-mid-handle,body.vista360-runtime-only #overlay .transform-center,body.vista360-runtime-only #overlay .transform-rotate-handle,body.vista360-runtime-only #overlay .transform-tilt-handle,body.vista360-runtime-only #overlay .transform-outline,body.vista360-runtime-only #overlay .vertex-handle,body.vista360-runtime-only #overlay .draft-vertex{display:none!important;pointer-events:none!important}


/* v3.19 — diálogos propios, carpetas y edición estable */
.studio-dialog-window{width:min(560px,calc(100vw - 28px));max-width:560px}
.studio-dialog-content{display:flex;gap:18px;align-items:flex-start;padding:24px 24px 18px}
.studio-dialog-icon{flex:0 0 42px;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#17384a;border:1px solid #2bb7f0;color:#eaf8ff;font-weight:900;font-size:22px}
.studio-dialog-copy{min-width:0;flex:1}
.studio-dialog-message{white-space:pre-wrap;line-height:1.55;color:#e8edf3;font-size:14px}
.studio-dialog-input{width:100%;margin-top:16px;padding:11px 12px;border:1px solid #536273;border-radius:5px;background:#10161d;color:#fff;font-size:15px}
.studio-dialog-buttons{gap:10px;justify-content:flex-end}
.studio-dialog-buttons .btn.danger{background:#7a2630;border-color:#a83c49;color:#fff}
.studio-dialog-buttons .btn.primary{background:#12aee8;border-color:#27c5ff;color:#071117}
.video-mainviewer-options{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:center;gap:10px 20px!important}
.video-mainviewer-options label{flex:0 1 auto;min-width:210px}
.layer-group-header{position:relative}
.layer-group-toggle{border:0;background:transparent;color:#f2a91d;font-size:16px;line-height:1;padding:4px 3px;cursor:pointer}
.layer-group-folder.collapsed .layer-group-body{display:none!important}
.layer-group-folder.collapsed .layer-group-header{margin-bottom:0}
.layer-group-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.skin-stage-item[data-type="image"]{padding:0!important}
.skin-stage-item[data-type="image"]>img,.preview-skin-component[data-type="image"]>img{width:100%;height:100%;object-fit:contain!important;display:block;pointer-events:none}
.skin-stage-item.text-inline-editing,.projective-hotspot.text-inline-editing{outline:2px solid #20bfff!important;cursor:text!important;user-select:text!important}
.skin-stage-item.text-inline-editing{overflow:visible!important;min-width:max-content}
.transform-handle,.skin-resize-handle{width:16px!important;height:16px!important;margin:-8px 0 0 -8px!important;border-width:2px!important}
.vertex-handle{width:15px!important;height:15px!important;margin:-7.5px 0 0 -7.5px!important}

/* v3.19: el cursor de mano aparece solamente durante el desplazamiento del lienzo SKiN. */
.skin-integrated-stage-host{cursor:default!important}
.skin-integrated-stage-host.skin-stage-panning,.skin-integrated-stage-host.skin-stage-panning *{cursor:grabbing!important}


/* Vista360Cloud v3.20 — capas, MÓVIL, acciones y marca */
.brand-mark{width:42px;height:42px;border-radius:9px;padding:2px;background:#07111a;overflow:hidden}
.brand-mark img{display:block;width:100%;height:100%;object-fit:contain}
.layer-group-folder{margin:3px 4px 5px;border-radius:5px}
.layer-group-header{min-height:34px;padding:5px 7px;gap:6px;font-size:12px;font-weight:400}
.layer-group-toggle{width:18px;height:24px;padding:0;font-size:13px;display:grid;place-items:center}
.layer-group-icon{position:relative;width:15px;height:12px;flex:0 0 15px;background:#f0b240;border-radius:2px;margin-top:2px}
.layer-group-icon::before{content:"";position:absolute;left:1px;top:-3px;width:7px;height:4px;border-radius:2px 2px 0 0;background:#f0b240}
.layer-group-name{font-size:12px;font-weight:400}
.layer-group-count{font-size:10px;min-width:22px;padding:2px 5px}
.layer-group-body{padding:2px 2px 3px}
.skin-mobile-copy-row.already-copied{opacity:.56;cursor:not-allowed}
.skin-mobile-copy-badge{margin-left:auto;font-size:9px;border:1px solid #52616e;border-radius:999px;padding:3px 6px;color:#9fb0bd}
#app.preview-active>.topbar{pointer-events:none!important;filter:saturate(.45) brightness(.72);user-select:none}
#app.preview-active>.topbar *{pointer-events:none!important}
.skin-stage-item.selected{z-index:1000000!important}
.vertex-handle,.transform-handle,.transform-mid-handle,.transform-rotate-handle,.transform-tilt-handle{pointer-events:all!important}
.skin-stage-item[data-type="image"]>img,.preview-skin-component[data-type="image"]>img{object-fit:contain!important}


/* Vista360Cloud v3.21 — snap, capas, móvil y publicación */
.badge,.skin-row-layer,.layer-group-count{display:none!important}
.brand-mark{width:42px!important;height:42px!important;padding:1px!important;border-radius:50%!important;background:#07111a!important}
.brand-mark img{width:100%!important;height:100%!important;object-fit:contain!important}
.layer-group-header{min-height:34px!important;padding:5px 7px!important;font-size:13px!important;line-height:1.2!important}
.layer-group-toggle{width:18px!important;min-width:18px!important;height:24px!important;padding:0!important;font-size:11px!important}
.layer-group-icon{width:18px!important;height:15px!important;min-width:18px!important;background:#f0b240;border-radius:2px;position:relative;display:inline-block!important}
.layer-group-icon:before{content:'';position:absolute;left:2px;top:-3px;width:8px;height:4px;border-radius:2px 2px 0 0;background:#f0b240}
.layer-group-name{font-size:13px!important;font-weight:500!important}
.skin-mobile-copy-row{grid-template-columns:24px 24px minmax(0,1fr)!important;min-height:48px!important;height:48px!important;padding:6px 10px!important}
.skin-mobile-copy-row.already-copied{opacity:.5;cursor:default}
.skin-mobile-copy-badge{display:none!important}
.skin-stage-item[data-type="text"]{overflow:visible!important}
.skin-stage-item[data-type="image"]>img{object-fit:contain!important}
.skin-manager-row.layer-drop-before{box-shadow:inset 0 3px #27b9ef!important;background:rgba(39,185,239,.13)!important}
.skin-manager-row.layer-drop-after{box-shadow:inset 0 -3px #27b9ef!important;background:rgba(39,185,239,.13)!important}
.transform-handle,.transform-rotate-handle,.transform-tilt-handle{r:12px!important}
.transform-mid-handle,.transform-center,.vertex-handle{r:11px!important}
#skinMobileClearBtn{margin-left:8px}
/* v3.21 final — ocultar todos los contadores laterales y preservar texto visible */
.skin-mainviewer-count,#skinSidebarBadge,#skinSectionBadge,#panoBadge,#polyBadge{display:none!important}
.skin-stage-item[data-type="text"],.preview-skin-component[data-type="text"]{overflow:visible!important;min-width:0}
.skin-stage-item[data-type="text"].text-inline-editing{min-width:max-content!important;min-height:max-content!important}


/* Vista360Cloud v3.22 — grupos, controles magnéticos, texto y capas */
.layer-group-control{
  flex:0 0 26px;width:26px;height:26px;padding:0;border:0;border-radius:5px;
  display:grid;place-items:center;background:transparent;color:#94a4b2;cursor:pointer;
}
.layer-group-control:hover{background:#17222c;color:#fff}
.layer-group-control svg{width:17px;height:17px;display:block;pointer-events:none}
.layer-group-control.hidden-active,.layer-group-control.locked-active{color:#f4a62a}
.layer-group-name{flex:1!important}
#viewer>#overlay,
#viewer #overlay{
  z-index:2000001!important;
  pointer-events:none!important;
  overflow:visible!important;
}
#overlay .vertex-handle,
#overlay .transform-handle,
#overlay .transform-mid-handle,
#overlay .transform-center,
#overlay .transform-rotate-handle,
#overlay .transform-tilt-handle,
#overlay .control-magnet-zone,
#overlay .draft-close-vertex{
  pointer-events:all!important;
}
.control-magnet-zone{
  fill:transparent!important;
  stroke:transparent!important;
  stroke-width:1!important;
  pointer-events:all!important;
}
.vertex-handle.magnet-target,
.transform-handle.magnet-target,
.transform-mid-handle.magnet-target,
.transform-center.magnet-target,
.transform-rotate-handle.magnet-target,
.transform-tilt-handle.magnet-target{
  filter:drop-shadow(0 0 8px #32c8ff)!important;
  stroke:#32c8ff!important;
  stroke-width:3px!important;
}
.skin-stage-item.selected{z-index:1500000!important}
.generic-transform-box.text-hotspot{
  overflow:hidden!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  max-width:100%!important;
  max-height:100%!important;
}
.generic-transform-box.text-hotspot>*{
  max-width:100%!important;
  max-height:100%!important;
  overflow:hidden!important;
}
body.vista360-runtime-only #viewer>#overlay,
body.vista360-runtime-only #viewer #overlay{
  z-index:30!important;
  pointer-events:none!important;
}
body.vista360-runtime-only #overlay .control-magnet-zone{display:none!important;pointer-events:none!important}


/* Vista360Cloud v3.23 — correcciones definitivas verificables */
.layer-group-header{
  display:grid!important;
  grid-template-columns:26px 26px 18px 18px minmax(0,1fr)!important;
  align-items:center!important;column-gap:6px!important;
}
.layer-group-eye{grid-column:1}.layer-group-lock{grid-column:2}.layer-group-toggle{grid-column:3}.layer-group-icon{grid-column:4}.layer-group-name{grid-column:5}
.layer-group-control{display:grid!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:4!important}
.layer-group-count{display:none!important}
#viewer>#htmlOverlay{z-index:50!important}
#viewer>#overlay{
  z-index:2147483000!important;position:absolute!important;inset:0!important;
  pointer-events:none!important;overflow:visible!important;isolation:isolate!important;
}
#overlay>.selection-controls-layer{pointer-events:none!important;isolation:isolate!important}
#overlay>.selection-controls-layer>*{pointer-events:none}
#overlay>.selection-controls-layer>.control-magnet-zone,
#overlay>.selection-controls-layer>.vertex-handle,
#overlay>.selection-controls-layer>.transform-handle,
#overlay>.selection-controls-layer>.transform-mid-handle,
#overlay>.selection-controls-layer>.transform-center,
#overlay>.selection-controls-layer>.transform-rotate-handle,
#overlay>.selection-controls-layer>.transform-tilt-handle{pointer-events:all!important}
/* Área magnética táctil/mouse sólo existe porque estos controles se crean únicamente al seleccionar. */
.control-magnet-zone{r:30px!important;fill:rgba(32,191,255,.001)!important;pointer-events:all!important}
.skin-stage-item.selected:not(.locked) .skin-resize-handle{
  width:44px!important;height:44px!important;margin:0!important;border:0!important;background:transparent!important;
  transform:translate(-50%,-50%)!important;z-index:2147482000!important;pointer-events:auto!important;
}
.skin-stage-item.selected:not(.locked) .skin-resize-handle::after{
  content:'';position:absolute;left:13px;top:13px;width:14px;height:14px;border:3px solid #fff;border-radius:50%;background:#18bcea;box-shadow:0 0 0 2px #10202b;
}
.skin-stage-item.selected:not(.locked) .skin-resize-handle.nw{left:0!important;top:0!important}
.skin-stage-item.selected:not(.locked) .skin-resize-handle.ne{left:100%!important;right:auto!important;top:0!important}
.skin-stage-item.selected:not(.locked) .skin-resize-handle.sw{left:0!important;top:100%!important;bottom:auto!important}
.skin-stage-item.selected:not(.locked) .skin-resize-handle.se{left:100%!important;right:auto!important;top:100%!important;bottom:auto!important}
.skin-stage-item[data-type="image"]{pointer-events:auto!important;background:rgba(0,0,0,.001)!important}
.skin-stage-item[data-type="image"]::before{content:''!important;position:absolute!important;inset:0!important;pointer-events:auto!important;background:rgba(0,0,0,.001)!important}
.skin-stage-item[data-type="image"]>img{pointer-events:none!important}
.skin-stage-item[data-type="text"],.preview-skin-component[data-type="text"]{overflow:hidden!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;word-break:break-word!important}
.action-row,.action-row-controls,.action-row-controls button{pointer-events:auto!important;position:relative!important}
.action-row-controls{z-index:20!important}.action-row-controls button{z-index:21!important;cursor:pointer!important}
.skin-manager-row.layer-drop-before{box-shadow:inset 0 3px #27b9ef!important}.skin-manager-row.layer-drop-after{box-shadow:inset 0 -3px #27b9ef!important}


/* Vista360Cloud v3.24 — grupos, texto autoexpandible, hitbox e imagen exacta */
.layer-group-control svg{
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.generic-transform-box.text-hotspot,
.skin-stage-item[data-type="text"],
.preview-skin-component[data-type="text"]{
  overflow:visible!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  max-height:none!important;
}
.generic-transform-box.text-hotspot>*{
  overflow:visible!important;
  max-height:none!important;
}
.projective-image{
  pointer-events:auto!important;
  background:rgba(0,0,0,.001)!important;
}
.projective-image::after{
  content:'';position:absolute;inset:0;pointer-events:auto;background:rgba(0,0,0,.001);
}
.projective-image>img{pointer-events:none!important;width:100%!important;height:100%!important}
#textFontSize,#skinPropFontSize{font-variant-numeric:tabular-nums}

/* v3.24 R1 — herencia explícita de iconos de grupo */
.layer-group-control svg path,
.layer-group-control svg circle,
.layer-group-control svg rect,
.layer-group-control svg line,
.layer-group-control svg polyline{
  stroke:currentColor!important;
  fill:none!important;
}


/* Vista360Cloud v3.25 — texto real, imagen esférica y publicación Web */
.skin-stage-item[data-type="text"],.preview-skin-component[data-type="text"]{
  overflow:hidden!important;min-width:0!important;max-height:none!important;
  white-space:pre-wrap!important;overflow-wrap:anywhere!important;word-break:break-word!important;
}
.skin-stage-item[data-type="text"].text-inline-editing{overflow:hidden!important;min-width:0!important;min-height:0!important}
.projective-spherical-mesh{
  position:absolute;left:0;top:0;display:block;pointer-events:none!important;background:transparent!important;
  transform:none!important;transform-origin:0 0!important;will-change:contents;
}
.projective-image.spherical-mesh-hit{
  display:block!important;object-fit:fill!important;background:rgba(0,0,0,.001)!important;
  filter:none!important;box-shadow:none!important;
}
#textFontSize,#skinPropFontSize{font-variant-numeric:tabular-nums}


/* Vista360Cloud v3.28 — correcciones integradas desde v3.25 */
.skin-stage-item[data-type="text"],.preview-skin-component[data-type="text"]{
  display:block!important;overflow:hidden!important;max-height:none!important;
  white-space:pre-wrap!important;overflow-wrap:anywhere!important;word-break:break-word!important;
  align-items:initial!important;justify-content:initial!important;
}
#textFontSize,#skinPropFontSize{appearance:textfield;-moz-appearance:textfield}
#textFontSize::-webkit-outer-spin-button,#textFontSize::-webkit-inner-spin-button,
#skinPropFontSize::-webkit-outer-spin-button,#skinPropFontSize::-webkit-inner-spin-button{appearance:none;margin:0}

/* v3.29 — selección múltiple visible sobre el panorama. */
.multi-selection-outline{
  fill:rgba(43,196,243,.08);
  stroke:#2bc4f3;
  stroke-width:2.5;
  stroke-dasharray:8 5;
  vector-effect:non-scaling-stroke;
  pointer-events:none;
  filter:drop-shadow(0 0 3px rgba(43,196,243,.8));
}
.skin-integrated-stage-host:not(.skin-stage-panning){cursor:grab}
.skin-integrated-stage-host.skin-stage-panning{cursor:grabbing}
.skin-integrated-stage-host .skin-stage-item{cursor:default}


/* Vista360Cloud v3.30 — multiselección SKiN, desplazamiento completo y render estable */
.skin-integrated-stage-host{overflow:hidden!important;touch-action:none!important}
.skin-integrated-stage-host #skinStage{
  transform:translate3d(var(--skin-pan-x,0px),var(--skin-pan-y,0px),0)!important;
  will-change:transform!important;
  flex:none!important;
}
.skin-integrated-stage-host.skin-stage-zoomed #skinStage{max-width:none!important;max-height:none!important;margin:auto!important}
.skin-integrated-stage-host .skin-stage-safe-area,
.skin-integrated-stage-host #skinStageMainViewer{pointer-events:none!important}
.skin-stage-item.multi-selected{
  outline:3px dashed #28c8ff!important;
  outline-offset:3px!important;
  box-shadow:0 0 0 2px rgba(8,20,28,.95),0 0 14px rgba(40,200,255,.9)!important;
}
.skin-stage-item.multi-selected:not(.selected)::after{
  content:''!important;display:block!important;position:absolute!important;inset:-7px!important;
  border:2px dashed #28c8ff!important;background:rgba(40,200,255,.08)!important;
  pointer-events:none!important;z-index:2147482000!important;
}
.skin-stage-item.selected.multi-selected{
  outline:3px solid #25c7ff!important;outline-offset:3px!important;
  box-shadow:0 0 0 2px #fff,0 0 18px rgba(37,199,255,.95)!important;
}
body.skin-space-pan .skin-integrated-stage-host,
body.skin-space-pan .skin-integrated-stage-host *{cursor:grabbing!important}


/* Vista360Cloud v3.30 R2 — navegación total del lienzo y multiselección visible */
.skin-integrated-stage-host #skinStageItems{overflow:visible!important}
.skin-integrated-stage-host .skin-stage-device-label,
.skin-integrated-stage-host #skinMainViewerMeta,
.skin-integrated-stage-host .skin-stage-safe-area{pointer-events:none!important}
.skin-multi-selection-frame{
  position:absolute!important;box-sizing:border-box!important;pointer-events:none!important;
  border:3px dashed #27c8ff!important;background:rgba(39,200,255,.06)!important;
  box-shadow:0 0 0 2px rgba(3,12,18,.92),0 0 15px rgba(39,200,255,.9)!important;
}
.skin-multi-selection-frame.primary{
  border-style:solid!important;border-color:#28d7ff!important;
  box-shadow:0 0 0 2px #fff,0 0 18px rgba(40,215,255,.98)!important;
}

/* v3.31 — fidelidad de imágenes importadas */
.projective-image,.skin-stage img,.preview-skin-layer img{
  image-rendering:auto;
  -webkit-font-smoothing:antialiased;
  backface-visibility:hidden;
}


/* Vista360Cloud v3.34 — interacción alfa real, selección SKIN limpia y acciones WebFrame */
.projective-image::after,
.skin-stage-item[data-type="image"]::before{content:none!important;display:none!important;pointer-events:none!important}
.skin-stage-item.selected,
.skin-stage-item.multi-selected,
.skin-stage-item.selected.multi-selected{
  border-color:transparent!important;outline:none!important;box-shadow:none!important;background-color:transparent!important;
}
.skin-stage-item.multi-selected:not(.selected)::after{content:none!important;display:none!important}
.skin-multi-selection-frame{
  background:transparent!important;box-shadow:none!important;border:1px dashed rgba(210,220,230,.7)!important;
}
.skin-multi-selection-frame.primary{border-color:transparent!important;box-shadow:none!important}
.webframe-action-hit{position:absolute;inset:0;z-index:20;display:none;background:transparent;pointer-events:none}
.webframe-action-hit.active{display:block;pointer-events:auto;cursor:pointer}


/* ============================================================
   Vista360Cloud v3.36 — detección automática 360° / imagen plana y navegación mixta
   ============================================================ */
.topbar{flex-wrap:nowrap!important;overflow:visible!important;min-width:0}
.toolbar{flex-wrap:nowrap!important;white-space:nowrap!important;min-width:0;gap:6px!important}
.toolbar>.btn,.toolbar>.dropdown,.toolbar>.project-save-state{flex:0 0 auto}
#newProjectBtn,#openProjectBtn,#saveBtn{white-space:nowrap}

/* Controles de geometría más compactos: el área visual deja de tapar el contenido. */
#overlay .vertex-handle,
#overlay .transform-handle,
#overlay .transform-mid-handle,
#overlay .transform-center{r:7px!important;stroke-width:2px!important}
#overlay .transform-rotate-handle{r:8px!important;stroke-width:2px!important}
#overlay .transform-tilt-handle{r:8px!important;stroke-width:2px!important}
#overlay .control-magnet-zone{r:17px!important}
#overlay .transform-rotate-symbol,#overlay .transform-direction-symbol,#overlay .text-width-symbol{font-size:9px!important;pointer-events:none!important}
#overlay .transform-rotate-arm,#overlay .transform-tilt-arm{stroke-width:1.5px!important}

/* SKiN: vértices pequeños + marco azul real en selección primaria. */
.skin-stage-item.selected:not(.locked) .skin-resize-handle{
  width:24px!important;height:24px!important;margin:0!important;background:transparent!important;border:0!important;border-radius:50%!important;
}
.skin-stage-item.selected:not(.locked) .skin-resize-handle::after{
  content:""!important;position:absolute!important;left:7px!important;top:7px!important;width:8px!important;height:8px!important;
  border:2px solid #fff!important;border-radius:50%!important;background:#19aee6!important;box-shadow:0 0 0 1px #0877a2!important;
}
.skin-multi-selection-frame{background:transparent!important;pointer-events:none!important;border:1px dashed rgba(35,183,235,.72)!important;box-shadow:none!important}
.skin-multi-selection-frame.primary{border:2px solid #22b8ee!important;box-shadow:0 0 0 1px rgba(7,77,106,.5)!important}

/* Preview: el panel puede arrastrarse por su zona libre y nunca sale del visor. */
#previewChrome.preview-draggable{touch-action:none!important;max-width:100%!important;max-height:100%!important}
#previewChrome.preview-draggable .preview-chrome-left{cursor:grab;user-select:none}
#previewChrome.preview-draggable.dragging .preview-chrome-left{cursor:grabbing}
#previewChrome.preview-draggable.dragging{user-select:none!important}
#previewChrome .preview-chrome-actions{cursor:default}


/* ============================================================
   Vista360Cloud v3.37 — estado de proyecto, texto SKiN y opciones de imagen plana
   ============================================================ */
.project-root-title{justify-content:space-between!important;gap:8px!important}
.project-root-title>.project-save-state{
  margin-left:auto!important;letter-spacing:0!important;text-transform:none!important;font-weight:600!important;
  font-size:9px!important;padding:3px 6px!important;max-width:142px;overflow:hidden;text-overflow:ellipsis;
}
.flat-panorama-layout{margin-top:-2px;padding-top:0}
.flat-panorama-layout.hidden{display:none!important}
.flat-panorama-layout>.field{margin-top:8px}

/* El zoom del lienzo SKiN escala el texto mediante JS igual que el resto del componente. */
.skin-stage-item[data-type="text"]{box-sizing:border-box!important}

/* Hotspot imagen: el rectángulo transparente no crea una zona de captura visual. */
.projective-image[data-alpha-hit="0"]{cursor:default!important}
.projective-image.selected-object[data-alpha-hit="0"]{filter:none!important}


/* ============================================================
   Vista360Cloud v3.38 — imagen plana confinada, topbar completa y marco texto SKiN
   ============================================================ */
.topbar{
  flex-wrap:nowrap!important;overflow:hidden!important;min-width:0!important;
  padding-left:8px!important;padding-right:8px!important;
}
.topbar>.brand{flex:0 0 auto!important;min-width:0!important}
.topbar>.brand.topbar-brand-collapsed{display:none!important}
.topbar>.toolbar{
  flex:0 0 auto!important;flex-wrap:nowrap!important;white-space:nowrap!important;
  min-width:max-content!important;max-width:none!important;gap:5px!important;transform-origin:left center!important;
}
.topbar>.toolbar>.btn,.topbar>.toolbar>.tool-dropdown,.topbar>.toolbar>.tool-dropdown>.btn{
  flex:0 0 auto!important;white-space:nowrap!important;
}
.skin-multi-selection-frame.primary[data-skin-selection-id]{border:2px solid #22b8ee!important;box-sizing:border-box!important}
.skin-stage-item[data-type="text"].selected{box-sizing:border-box!important}


/* ============================================================
   Vista360Cloud v3.39 — topbar fija + dropdown superior + 3 Axis real
   ============================================================ */
.topbar{
  position:relative!important;z-index:2147483600!important;isolation:isolate!important;
  overflow:visible!important;flex-wrap:nowrap!important;min-width:0!important;
  padding:0 8px!important;gap:8px!important;
}
.topbar>.brand{
  display:flex!important;visibility:visible!important;opacity:1!important;
  flex:0 0 224px!important;width:224px!important;min-width:224px!important;max-width:224px!important;
}
.topbar>.brand.topbar-brand-collapsed{display:flex!important}
.topbar>.brand .brand-mark{flex:0 0 auto!important}
.topbar>.brand .brand-text{min-width:0!important;white-space:nowrap!important}
.topbar>.toolbar{
  flex:0 0 auto!important;display:flex!important;flex-wrap:nowrap!important;
  white-space:nowrap!important;min-width:max-content!important;max-width:none!important;
  gap:5px!important;transform-origin:left center!important;
}
.topbar>.toolbar>.btn,.topbar>.toolbar>.tool-dropdown,.topbar>.toolbar>.tool-dropdown>.btn{
  flex:0 0 auto!important;white-space:nowrap!important;
}
.topbar .dropdown-panel{
  z-index:2147483646!important;position:absolute!important;
  isolation:isolate!important;
}

.three-axis-numeric-props{display:grid;gap:7px;margin:8px 0 9px;padding:8px;border:1px solid #454650;border-radius:5px;background:#302f36}
.three-axis-numeric-props.hidden{display:none!important}
.three-axis-row{display:grid;grid-template-columns:96px minmax(58px,1fr) 52px minmax(58px,1fr);align-items:center;gap:6px;font-size:12px}
.three-axis-rot-row{grid-template-columns:96px repeat(3,minmax(52px,1fr))}
.three-axis-label{text-align:right;color:#c8c8cc;white-space:nowrap}.three-axis-label.short{text-align:right}
.three-axis-row input{width:100%;min-width:0;height:28px;box-sizing:border-box;padding:3px 5px}


/* ============================================================
   Vista360Cloud v3.40 — panel 3 Axis compacto y sin scroll horizontal
   ============================================================ */
.right-panel{overflow-y:auto!important;overflow-x:hidden!important}
#transformPropsWrap{max-width:100%!important;overflow-x:hidden!important}
.three-axis-numeric-props{
  width:100%!important;max-width:100%!important;min-width:0!important;
  display:grid!important;gap:6px!important;margin:7px 0 9px!important;padding:0!important;
  border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
}
.three-axis-numeric-props.hidden{display:none!important}
.three-axis-row{
  width:100%!important;min-width:0!important;display:grid!important;
  grid-template-columns:70px minmax(0,1fr) 32px minmax(0,1fr)!important;
  align-items:center!important;gap:4px!important;font-size:10.5px!important;
}
.three-axis-rot-row{grid-template-columns:70px repeat(3,minmax(0,1fr))!important}
.three-axis-label{min-width:0!important;text-align:right!important;color:#aab3bf!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important}
.three-axis-row input{
  width:100%!important;max-width:100%!important;min-width:0!important;height:28px!important;box-sizing:border-box!important;
  padding:4px 6px!important;background:#11141a!important;color:var(--text)!important;
  border:1px solid #39404c!important;border-radius:5px!important;outline:none!important;box-shadow:none!important;
  font-size:11px!important;font-variant-numeric:tabular-nums!important;
}
.three-axis-row input:focus{border-color:#20a9e8!important;box-shadow:0 0 0 1px rgba(32,169,232,.18)!important}


/* ============================================================
   Vista360Cloud v3.41 — media 3 Axis DOM, rotación SKiN y visibilidad runtime
   ============================================================ */
/* El hotspot Imagen 3 Axis ya NO usa canvas mallado. Si queda un nodo legado se oculta. */
.projective-spherical-mesh{display:none!important;pointer-events:none!important}
.projective-image:not(.spherical-mesh-hit),.projective-video{pointer-events:auto}
#app.preview-active .projective-image[data-alpha-hit="0"],
body.vista360-published .projective-image[data-alpha-hit="0"]{cursor:default!important}

/* La selección SKiN rota junto con el componente en vez de permanecer axis-aligned. */
.skin-multi-selection-frame{transform-origin:50% 50%!important}

/* Control naranja de rotación para componentes Imagen/Texto. */
.skin-stage-item.selected:not(.locked) .skin-rotate-arm{
  position:absolute!important;right:-20px!important;top:3px!important;width:22px!important;height:1.5px!important;
  background:#22b8ee!important;transform:rotate(-18deg)!important;transform-origin:left center!important;
  pointer-events:none!important;z-index:2147481998!important;
}
.skin-stage-item.selected:not(.locked) .skin-rotate-handle{
  position:absolute!important;right:-36px!important;top:-14px!important;width:22px!important;height:22px!important;
  box-sizing:border-box!important;border:3px solid #fff!important;border-radius:50%!important;background:#ff9418!important;
  box-shadow:0 0 0 2px #7a4300,0 0 9px rgba(255,148,24,.45)!important;
  cursor:crosshair!important;pointer-events:auto!important;touch-action:none!important;z-index:2147482001!important;
}
.skin-stage-item.selected:not(.locked) .skin-rotate-handle::after{
  content:'↻'!important;position:absolute!important;inset:0!important;display:grid!important;place-items:center!important;
  color:#fff!important;font-size:11px!important;font-weight:900!important;line-height:1!important;pointer-events:none!important;
}
/* En vista previa/publicada los componentes visibles siempre están por encima del Main Viewer. */
#previewSkinLayer{z-index:220000!important;pointer-events:none}
#previewSkinLayer .preview-skin-component{pointer-events:auto}


/* v3.42 — giro de componentes Skin + biblioteca de medios estable */
#skinImageScaleInline > div{min-width:0;}
#skinImageScaleInline input{width:100%;}
.vista-library-reference{max-width:min(1180px,96vw)!important;max-height:min(800px,94vh)!important;}
.vista-library-reference .image-library-content{overflow:auto!important;}
#imageLibraryModal .library-empty{display:grid;place-items:center;min-height:220px;text-align:center;color:#9ea9b3;line-height:1.45;padding:20px;}


/* ============================================================
   Vista360Cloud v3.43 — modales contenidos, campos alineados y vértices compactos
   ============================================================ */
/* La barra superior debe quedar por encima del visor, pero por debajo de cualquier modal. */
.topbar{z-index:500000!important;}
.topbar .dropdown-panel{z-index:500100!important;}
.studio-modal{
  z-index:900000;
  box-sizing:border-box!important;
  padding:8px!important;
  align-items:flex-start!important;
  justify-items:center!important;
  overflow:auto!important;
}
.modal-window{
  max-width:calc(100vw - 16px)!important;
  max-height:calc(100dvh - 16px)!important;
  box-sizing:border-box!important;
}
.modal-titlebar{
  position:sticky!important;
  top:0!important;
  z-index:20!important;
  flex:0 0 auto!important;
  background:#1f232a!important;
}
.vista-library-reference{
  width:min(1128px,calc(100vw - 16px))!important;
  height:min(752px,calc(100dvh - 16px))!important;
  max-height:calc(100dvh - 16px)!important;
}
.vista-library-reference .library-main{min-height:0!important;overflow:hidden!important;}
.vista-library-reference .image-library-content{min-height:0!important;overflow:auto!important;}
.vista-library-reference .image-library-sidebar{min-height:0!important;overflow:hidden!important;}
.vista-library-reference .library-scroll-filters{min-height:0!important;overflow:auto!important;}

/* Escala y Giro comparten exactamente la misma línea de etiquetas y de inputs. */
#skinImageScaleInline{align-items:end!important;}
#skinImageScaleInline>div{display:grid!important;grid-template-rows:32px 46px!important;min-width:0!important;}
#skinImageScaleInline label{display:flex!important;align-items:flex-end!important;min-height:32px!important;line-height:1.15!important;margin:0 0 4px!important;}
#skinImageScaleInline input{height:46px!important;align-self:end!important;box-sizing:border-box!important;}

/* Durante el dibujo el vértice tiene el mismo diámetro que durante la edición. */
#overlay .draft-vertex{r:7px!important;stroke-width:2px!important;}
#overlay .draft-vertex.active{r:7px!important;stroke-width:2px!important;}

/* Modo Inicio Invisible: el vídeo no se ve, pero conserva su superficie interactiva. */
.projective-video.runtime-video-visual-hidden{visibility:visible!important;pointer-events:auto!important;background:transparent!important;}
.projective-video.runtime-video-visual-hidden>video,
.projective-video.runtime-video-visual-hidden>.projective-video-empty{opacity:0!important;visibility:hidden!important;}


/* ============================================================
   Vista360Cloud v3.44 — diálogos centrados, campos uniformes y biblioteca limpia
   ============================================================ */
/* Los diálogos de confirmación son pequeños: siempre al centro de la pantalla. */
#studioDialogModal{
  align-items:center!important;
  justify-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}
#studioDialogModal .studio-dialog-window{
  margin:auto!important;
  max-height:calc(100dvh - 32px)!important;
}

/* Escala/Giro usa exactamente el alto base de los demás .field input.
   Sólo reservamos el mismo alto para las etiquetas para que las cajas queden alineadas. */
#skinImageScaleInline{align-items:stretch!important;}
#skinImageScaleInline>div{
  display:grid!important;
  grid-template-rows:minmax(28px,auto) auto!important;
  align-content:end!important;
  min-width:0!important;
}
#skinImageScaleInline label{
  display:flex!important;
  align-items:flex-end!important;
  min-height:28px!important;
  margin:0 0 5px!important;
  line-height:1.15!important;
}
#skinImageScaleInline input{
  height:auto!important;
  min-height:0!important;
  padding:7px!important;
  align-self:stretch!important;
  box-sizing:border-box!important;
}

/* La biblioteca muestra únicamente la miniatura; el nombre individual se oculta. */
#imageLibraryModal .library-card-name{display:none!important;}
#imageLibraryModal .library-card{min-height:116px!important;}
#imageLibraryModal .library-grid{row-gap:16px!important;}


/* ============================================================
   Vista360Cloud v3.45 — recuperación centrada + texto rotado estable
   ============================================================ */
/* La recuperación automática es un diálogo de decisión, no una ventana de trabajo grande. */
#recoveryModal{
  align-items:center!important;
  justify-items:center!important;
  justify-content:center!important;
  overflow:auto!important;
}
#recoveryModal .recovery-window{
  margin:auto!important;
  max-height:calc(100dvh - 32px)!important;
}

/* El giro de Texto vive en el marco externo de selección para que nunca quede recortado
   por el contenido/overflow del propio cuadro de texto. */
.skin-multi-selection-frame.primary .skin-text-rotate-arm{
  position:absolute!important;right:-20px!important;top:3px!important;width:22px!important;height:1.5px!important;
  background:#22b8ee!important;transform:rotate(-18deg)!important;transform-origin:left center!important;
  pointer-events:none!important;z-index:2147481998!important;
}
.skin-multi-selection-frame.primary .skin-text-rotate-handle{
  position:absolute!important;right:-36px!important;top:-14px!important;width:22px!important;height:22px!important;
  box-sizing:border-box!important;border:3px solid #fff!important;border-radius:50%!important;background:#ff9418!important;
  box-shadow:0 0 0 2px #7a4300,0 0 9px rgba(255,148,24,.45)!important;
  cursor:crosshair!important;pointer-events:auto!important;touch-action:none!important;z-index:2147482001!important;
}
.skin-multi-selection-frame.primary .skin-text-rotate-handle::after{
  content:'↻'!important;position:absolute!important;inset:0!important;display:grid!important;place-items:center!important;
  color:#fff!important;font-size:11px!important;font-weight:900!important;line-height:1!important;pointer-events:none!important;
}

/* ============================================================
   v3.46 — carga rápida, giro magnético y capas multimedia
   ============================================================ */

/* Giro del texto: a la derecha de B / I / U, dentro de la misma fila. */
#skinTextOptions .text-style-row{
  display:flex;
  align-items:center;
  gap:7px;
}
#skinTextOptions .skin-text-rotation-inline{
  margin-left:auto;
  min-width:132px;
  display:grid;
  grid-template-columns:auto 74px;
  align-items:center;
  gap:7px;
}
#skinTextOptions .skin-text-rotation-inline label{
  margin:0;
  white-space:nowrap;
  color:#aeb9c4;
  font-size:10px;
}
#skinTextOptions .skin-text-rotation-inline input{
  box-sizing:border-box;
  width:74px;
  height:38px;
  min-height:38px;
  margin:0;
  padding:7px 9px;
}

/* La fila Escala/Giro sigue usando exactamente el alto normal de los inputs. */
#skinImageScaleInline > div{min-width:0;}
#skinImageScaleInline input{
  box-sizing:border-box;
  width:100%;
  height:38px!important;
  min-height:38px!important;
  margin:0!important;
  padding-top:7px!important;
  padding-bottom:7px!important;
}

/* Un vídeo lanzado como acción pertenece al Main Viewer; el SKiN es HUD y debe
   permanecer siempre encima. */
.runtime-mainviewer-video{
  z-index:1500!important;
}
#viewer #previewSkinLayer,
body.vista360-published #previewSkinLayer{
  z-index:2000!important;
}


/* ============================================================
   Vista360Cloud v3.47 — SKiN estable al zoom + controles limpios
   ============================================================ */
/* En componente Texto, el Giro del bloque Tamaño/Posición desaparece: sólo queda
   el nuevo control junto a B / I / U. En Imagen se conserva junto a Escala. */
#skinImageRotationField.hidden{display:none!important;}
#skinScaleField.skin-scale-text-wide{grid-column:1/-1!important;}

/* El Giro del texto usa exactamente el mismo aspecto de los inputs del Inspector. */
#skinTextOptions .skin-text-rotation-inline input{
  background:#11141a!important;
  color:var(--text)!important;
  border:1px solid #39404c!important;
  border-radius:5px!important;
  padding:7px!important;
  width:74px!important;
  height:38px!important;
  min-height:38px!important;
  margin:0!important;
  box-sizing:border-box!important;
  box-shadow:none!important;
}
#skinTextOptions .skin-text-rotation-inline input:focus{
  outline:none!important;
  border-color:#7f8b9a!important;
}

/* La etiqueta/rectángulo Main Viewer no forma parte del lienzo de diseño. */
.skin-mainviewer-badge,#skinMainViewerMeta{display:none!important;}

/* El marco se sincroniza con la caja real del componente. */
.skin-multi-selection-frame{box-sizing:border-box!important;}

/* El zoom SKiN tiene piso en 100%. */
#skinStageZoomOut:disabled{opacity:.34!important;cursor:not-allowed!important;}

/* Opción de vídeo: mantener Cerrar al finalizar junto a Reproducir en bucle. */
.video-mainviewer-options{grid-template-columns:repeat(4,minmax(0,1fr))!important;}


/* ============================================================
   Vista360Cloud v3.48 — texto SKiN al zoom + vídeo excluyente
   ============================================================ */
/* El alto visual de Texto se recalcula por JS cada vez que cambia el zoom; no
   conservar una altura fija en px proveniente del 100%. */
.skin-integrated-stage-host.skin-stage-zoomed .skin-stage-item[data-type="text"]{
  max-height:none!important;
}
.video-mainviewer-options input[type="checkbox"]:disabled{
  opacity:.45;
  cursor:not-allowed;
}
.video-mainviewer-options label:has(input:disabled){opacity:.55;}
#videoStopTrigger option:disabled{color:#69737e;}


/* v3.49 — acciones encadenadas configurables para vídeo usado como Acción */
.video-action-link-row{
  display:grid;
  grid-template-columns:minmax(260px,.85fr) minmax(520px,1.7fr);
  gap:18px;
  align-items:start;
  margin:2px 0 10px;
}
.video-action-link-row>.check-row{margin:6px 0 0!important;min-height:34px;display:flex;align-items:center;gap:10px;}
.video-nested-action-control{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap;}
.video-nested-action-control>.check-row{display:flex;align-items:center;gap:8px;margin:0;white-space:nowrap;}
#chooseVideoNestedActionBtn{min-height:34px;padding:6px 14px;flex:0 0 auto;}
.video-nested-action-chips{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0;flex:1 1 280px;}
.video-nested-action-chip{display:inline-flex;align-items:center;min-width:0;max-width:270px;height:32px;border:1px solid #414b58;border-radius:5px;background:#151b22;color:#d9e4ed;overflow:hidden;}
.video-nested-action-chip-label{padding:0 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;min-width:50px;}
.video-nested-action-chip button{width:28px;height:30px;border:0;border-left:1px solid #39434e;background:#202833;color:#9dcfe6;cursor:pointer;padding:0;display:grid;place-items:center;}
.video-nested-action-chip button:hover{background:#263646;color:#fff;}
.video-nested-action-delete{color:#eaa0a8!important;}
.video-action-link-row.video-nested-child-mode .video-nested-action-control{display:none!important;}
@media (max-width:1050px){.video-action-link-row{grid-template-columns:1fr;gap:4px;}}


/* v3.50 — plantillas SKiN y prevención visual de acciones duplicadas */
.skin-section-tab-row{cursor:pointer;gap:5px!important;padding-right:6px!important;}
.skin-section-tab-row .skin-section-label{flex:0 0 auto;}
.skin-section-template-actions{margin-left:auto;display:flex;align-items:center;gap:4px;min-width:0;}
.skin-template-btn{
  appearance:none;border:1px solid #3a4653;border-radius:5px;background:#171d24;color:#dbe5ed;
  height:30px;min-width:54px;padding:0 9px;font:700 11px/1 "Segoe UI",Arial,sans-serif;letter-spacing:0;text-transform:none;cursor:pointer;
}
.skin-template-btn:hover:not(:disabled){background:#22303a;border-color:#21aee3;color:#fff;}
.skin-template-btn:disabled{opacity:.38;cursor:not-allowed;filter:saturate(.35);}
.skin-section-tab-row .badge{flex:0 0 auto;min-width:18px!important;}
.action-choice:disabled,.action-choice.action-choice-disabled{opacity:.32!important;cursor:not-allowed!important;filter:saturate(.25);pointer-events:none;}

/* v3.51 — botones de plantilla SKiN más legibles */
.skin-section-template-actions{gap:5px;}


/* v3.53 — Referencia CAD reservada para desarrollo posterior */
#cadReferenceBtn{display:none!important;}


/* ============================================================
   Vista360Cloud v3.55 — topbar, Popup de imagen y Álbum Popup
   ============================================================ */
@media (min-width:1400px){
  .action-grid-final{grid-template-columns:repeat(7,minmax(112px,1fr))!important;}
}
.popup-runtime-card.popup-runtime-image-card{
  display:inline-flex!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  background:transparent!important;
  overflow:visible!important;
  width:auto!important;height:auto!important;
}
.popup-runtime-card.popup-runtime-image-card>.popup-runtime-image{
  display:block!important;width:auto!important;height:auto!important;
  object-fit:contain!important;background:transparent!important;
}
.popup-runtime-image-card>.popup-runtime-close{
  top:10px!important;right:10px!important;margin:0!important;
  width:36px!important;height:36px!important;border-radius:0!important;
  background:#fff!important;color:#111!important;font-size:27px!important;line-height:36px!important;
}
.topbar>.toolbar{padding-right:2px!important;}


/* ============================================================
   Vista360Cloud v3.55 — Álbum Popup transparente + transiciones
   ============================================================ */
.runtime-album-overlay.runtime-album-popup-overlay{
  background:rgba(0,0,0,.68)!important;
  padding:20px!important;
  box-sizing:border-box!important;
}
.runtime-album-popup-overlay .runtime-album-card{
  width:auto!important;
  height:auto!important;
  max-width:92vw!important;
  max-height:90vh!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  position:relative!important;
  overflow:visible!important;
  background:transparent!important;
  box-shadow:none!important;
  line-height:0!important;
}
.runtime-album-popup-overlay .runtime-album-card>.runtime-album-image{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:88vw!important;
  max-height:86vh!important;
  object-fit:contain!important;
  background:transparent!important;
  transform-origin:center center!important;
}
.runtime-album-popup-overlay .runtime-album-close{
  top:10px!important;
  right:10px!important;
  width:40px!important;
  height:40px!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.94)!important;
  color:#111!important;
  box-shadow:0 3px 12px #0006!important;
}
.runtime-album-popup-overlay .runtime-album-prev,
.runtime-album-popup-overlay .runtime-album-next{
  top:50%!important;
  transform:translateY(-50%)!important;
  width:42px!important;
  height:58px!important;
  background:rgba(255,255,255,.92)!important;
  color:#111!important;
  border-radius:3px!important;
}
.runtime-album-popup-overlay .runtime-album-prev{left:12px!important;}
.runtime-album-popup-overlay .runtime-album-next{right:12px!important;}
.runtime-album-popup-overlay .runtime-album-play{
  bottom:12px!important;
  background:rgba(255,255,255,.94)!important;
  color:#111!important;
}
.runtime-album-popup-overlay .runtime-album-caption{
  bottom:0!important;
  color:#fff!important;
  background:linear-gradient(transparent,rgba(0,0,0,.58))!important;
  text-shadow:0 1px 3px #000!important;
  line-height:1.25!important;
}
.album-popup-effect-row{margin-top:10px!important;align-items:end!important;}
.album-popup-effect-row>div{min-width:0!important;}
.album-popup-effect-row select,.album-popup-effect-row input{width:100%!important;}
.album-popup-effect-note{margin:-2px 0 10px!important;color:#81909d!important;}
@media(max-width:720px){
  .runtime-album-overlay.runtime-album-popup-overlay{padding:8px!important;}
  .runtime-album-popup-overlay .runtime-album-card>.runtime-album-image{max-width:96vw!important;max-height:90vh!important;}
  .runtime-album-popup-overlay .runtime-album-close{top:6px!important;right:6px!important;}
  .runtime-album-popup-overlay .runtime-album-prev{left:6px!important;}
  .runtime-album-popup-overlay .runtime-album-next{right:6px!important;}
}


/* Vista360Cloud v3.56 — Main Viewer y Álbum Popup */
#actionConfigModal .album-popup-left-options{
  margin-top:12px;
  padding-top:10px;
  border-top:1px solid #3a3e47;
}
#actionConfigModal .album-popup-left-options .field{margin-bottom:10px;}
#actionConfigModal .album-popup-left-options label{display:block;margin-bottom:5px;}
#actionConfigModal .album-popup-left-options select,
#actionConfigModal .album-popup-left-options input{
  width:100%;
  box-sizing:border-box;
}


/* ============================================================
   Vista360Cloud v3.57 — controles fijos de Álbum Popup
   ============================================================ */
.runtime-album-popup-overlay .runtime-album-card.runtime-album-stage-locked{
  width:var(--runtime-album-stage-width)!important;
  height:var(--runtime-album-stage-height)!important;
  max-width:88vw!important;
  max-height:86vh!important;
  flex:0 0 auto!important;
}
.runtime-album-popup-overlay .runtime-album-card.runtime-album-stage-locked>.runtime-album-image{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
}
.runtime-album-popup-overlay .runtime-album-card.runtime-album-measuring{
  visibility:hidden!important;
}
/* Flechas y cierre quedan anclados al marco fijo del álbum, no a la imagen actual. */
.runtime-album-popup-overlay .runtime-album-card.runtime-album-stage-locked>.runtime-album-close{
  top:10px!important;right:10px!important;
}
.runtime-album-popup-overlay .runtime-album-card.runtime-album-stage-locked>.runtime-album-prev{
  left:12px!important;top:50%!important;
}
.runtime-album-popup-overlay .runtime-album-card.runtime-album-stage-locked>.runtime-album-next{
  right:12px!important;top:50%!important;
}
@media(max-width:720px){
  .runtime-album-popup-overlay .runtime-album-card.runtime-album-stage-locked{
    max-width:96vw!important;max-height:90vh!important;
  }
}


/* ============================================================
   Vista360Cloud v3.58 — Álbum Popup sin franja inferior + opciones restauradas
   ============================================================ */
.runtime-album-popup-overlay .runtime-album-card,
.runtime-album-popup-overlay .runtime-album-card.runtime-album-stage-locked{
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.runtime-album-popup-overlay .runtime-album-card.runtime-album-stage-locked>.runtime-album-image{
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
/* La leyenda ya no pinta un degradado/rectángulo negro debajo de la imagen. */
.runtime-album-popup-overlay .runtime-album-caption{
  background:transparent!important;
  box-shadow:none!important;
  border:0!important;
  padding:0 84px 8px!important;
  line-height:1.25!important;
  text-shadow:0 1px 3px #000,0 0 6px #000!important;
}
#actionConfigModal .album-popup-left-options{
  display:block;
}
#actionConfigModal .album-popup-left-options.hidden{
  display:none!important;
}


/* Vista360Cloud v3.65 — Hotspots Imagen/Texto/WebFrame/Vídeo como Sticker billboard */
.interaction-sticker-toggle{grid-column:1/-1!important;}
.interaction-sticker-toggle.disabled{opacity:.45;cursor:not-allowed;}
.interaction-sticker-toggle.disabled input{cursor:not-allowed;}

/* Vista360Cloud v3.65 — Sticker billboard: no spherical mesh/canvas. */
.projective-spherical-mesh.sticker-mesh{display:none!important;}
.projective-object[data-sticker-billboard="1"]{backface-visibility:visible!important;-webkit-backface-visibility:visible!important;}

/* Vista360Cloud v3.65 — el HUD SKIN siempre gana la interacción sobre vídeos/acciones del Main Viewer. */
#viewer #previewSkinLayer,body.vista360-published #previewSkinLayer{z-index:2200!important;}
#previewSkinLayer .preview-skin-component,body.vista360-published #previewSkinLayer .preview-skin-component{pointer-events:auto;}
.runtime-mainviewer-video{z-index:1500!important;}


/* Vista360Cloud v3.66 — lógica de efectos y HUD interactivo sobre vídeo */
.action-showhide-effects .showhide-effect-row.effect-disabled{opacity:.42;}
.action-showhide-effects .showhide-effect-row.effect-disabled select,
.action-showhide-effects .showhide-effect-row.effect-disabled input{cursor:not-allowed;}
/* El vídeo del Main Viewer nunca debe crear una superficie de interacción por encima del HUD SKIN. */
.runtime-mainviewer-video{z-index:1500!important;}
#viewer #previewSkinLayer,body.vista360-published #previewSkinLayer{z-index:2200!important;pointer-events:none!important;}
#previewSkinLayer .preview-skin-component,body.vista360-published #previewSkinLayer .preview-skin-component{pointer-events:auto!important;}


/* Vista360Cloud v3.67 — SKIN interactivo durante vídeos de acción del Main Viewer */
.runtime-mainviewer-video{z-index:1500!important;}
#viewer #previewSkinLayer,body.vista360-published #previewSkinLayer{z-index:2200!important;pointer-events:none!important;}
#previewSkinLayer .preview-skin-component,body.vista360-published #previewSkinLayer .preview-skin-component{pointer-events:auto!important;touch-action:none;}


/* Vista360Cloud v3.81 — Free Mode imagen: malla planar recortada estable. */
.projective-spherical-mesh.free-planar-mesh{display:block!important;pointer-events:none!important;background:transparent!important;left:0!important;top:0!important;transform:none!important;transform-origin:0 0!important;}

/* Vista360Cloud v3.84 — la superficie IMG full-screen de una Imagen Free Mode
   mallada es únicamente fuente alfa/UV en TODOS los modos. Edición resuelve la
   selección/movimiento por geometría desde #viewer; Preview/Web/EXE ya usaban
   esa misma estrategia desde v3.83. Así nunca bloquea el arrastre del panorama. */
.projective-image.spherical-mesh-hit[data-free-planar-mesh-hit="1"]{
  display:block!important;pointer-events:none!important;object-fit:fill!important;
}


/* ============================================================
   Vista360Cloud v3.84 R2 — mensajes de edición siempre al frente
   ============================================================ */
#viewer #drawHint{
  z-index:2147483646!important;
  position:absolute!important;
  isolation:isolate!important;
  pointer-events:none!important;
}


/* Vista360Cloud v3.84 R3 — selección visible aun cuando la capa esté bloqueada. */
.tree-item.locked.selected,
.tree-item.locked.multi-selected{
  background:#25384a!important;
  border-color:#22bff4!important;
  color:#e7f6ff!important;
  box-shadow:inset 3px 0 #22bff4!important;
}
.tree-item.locked.selected .item-name,
.tree-item.locked.multi-selected .item-name{opacity:1!important;color:#e7f6ff!important}
.layer-group-folder.object-group-folder.group-drag-over>.layer-group-header{outline:2px solid #22bff4;outline-offset:-2px}


/* ============================================================
   Vista360Cloud v3.84 R5 — prioridad de capas + listas verticales
   ============================================================ */
/* Bloquear no cambia el color de fondo de una fila. El candado sigue indicando
   el estado; Oculto conserva su propio estado visual. */
.tree-item.locked:not(.hidden-state),
.skin-manager-row.locked:not(.hidden-state),
.skin-sidebar-row.locked:not(.hidden-state){
  background:transparent!important;
  color:inherit!important;
  border-color:inherit!important;
}
.tree-item.locked:not(.hidden-state) .item-name,
.skin-manager-row.locked:not(.hidden-state) .skin-row-name,
.skin-sidebar-row.locked:not(.hidden-state) .skin-sidebar-name{
  opacity:1!important;
  color:inherit!important;
}
/* Una fila bloqueada seleccionada sigue usando el azul normal de selección. */
.tree-item.locked.selected,.tree-item.locked.multi-selected,
.skin-manager-row.locked.selected,.skin-manager-row.locked.multi-selected,
.skin-sidebar-row.locked.selected,.skin-sidebar-row.locked.multi-selected{
  background:#25384a!important;
  color:#e7f6ff!important;
  border-color:#22bff4!important;
}

/* Fantasma propio del DnD: X fijo, sólo sigue Y. La imagen de arrastre nativa es
   transparente, por lo que nunca se ve una fila desplazándose hacia los costados. */
.vista360-vertical-drag-ghost{
  position:fixed!important;
  z-index:2147483645!important;
  box-sizing:border-box!important;
  margin:0!important;
  pointer-events:none!important;
  opacity:.88!important;
  transform:none!important;
  transition:none!important;
  background:#253441!important;
  border:1px solid #22bff4!important;
  border-radius:5px!important;
  box-shadow:0 8px 24px rgba(0,0,0,.42)!important;
  overflow:hidden!important;
}
.vista360-vertical-drag-ghost *{pointer-events:none!important;}


/* ============================================================
   Vista360Cloud v3.84 R7 — nombre SKIN visible durante arrastre
   ============================================================ */
/* El fantasma se adjunta a <body>, fuera del contenedor que normalmente define
   las columnas de la lista SKIN. Usar un layout propio evita que el nombre se
   desplace fuera del ancho disponible y deja siempre claro qué componente se
   está moviendo. */
.vista360-vertical-drag-ghost.vista360-skin-drag-ghost{
  display:grid!important;
  grid-template-columns:18px minmax(0,1fr)!important;
  gap:7px!important;
  align-items:center!important;
  min-height:38px!important;
  padding:6px 10px!important;
  color:#f4f8fb!important;
}
.vista360-skin-drag-ghost .skin-row-eye,
.vista360-skin-drag-ghost .skin-row-lock,
.vista360-skin-drag-ghost .skin-row-layer,
.vista360-skin-drag-ghost .skin-row-delete,
.vista360-skin-drag-ghost .skin-sidebar-control,
.vista360-skin-drag-ghost .skin-sidebar-delete{
  display:none!important;
}
.vista360-skin-drag-ghost .skin-row-icon,
.vista360-skin-drag-ghost .skin-sidebar-type{
  display:block!important;
  color:#a9dff3!important;
  opacity:1!important;
}
.vista360-skin-drag-ghost .skin-row-name,
.vista360-skin-drag-ghost .skin-sidebar-name{
  display:block!important;
  min-width:0!important;
  visibility:visible!important;
  opacity:1!important;
  color:#ffffff!important;
  font-size:12px!important;
  font-weight:600!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}


/* ============================================================
   Vista360Cloud v3.84 R9 — grupos con propiedades compartidas
   ============================================================ */
.layer-group-folder.object-group-folder.group-selected>.layer-group-header{
  background:#28445b!important;
  outline:2px solid #19c4f5!important;
  outline-offset:-2px;
}
.object-group-properties .group-property-note{margin-bottom:12px}
.object-group-properties .object-group-state-grid{margin-top:14px;margin-bottom:10px}
.object-group-properties input[type="checkbox"]:indeterminate{
  accent-color:#8fa7b8;
  outline:1px solid rgba(143,167,184,.45);
}
.object-group-properties .small-note{line-height:1.35}
.projective-image.spherical-mesh-hit[data-free-planar-mesh-hit="1"]{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* ============================================================
   v3.84 R27 — Runtime móvil táctil + paneles Javascript contenidos
   ============================================================ */
#vista360PreviewJavascriptHost.vista360-preview-js-host{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  overflow:hidden!important;
  pointer-events:none!important;
  transform:translateZ(0);
  contain:layout paint;
  z-index:2400!important;
}
#vista360PreviewJavascriptHost>.vista360-user-js-root{
  pointer-events:auto!important;
  max-width:100%;
  box-sizing:border-box;
}
/* R28: la adaptación de viewport no anima top/left/zoom. Conserva únicamente
   las transiciones de transform/opacity definidas por el panel del proyecto. */
.vista360-user-js-root.vista360-js-viewport-stable{
  transition-property:transform,opacity!important;
}
.vista360-user-js-root.vista360-js-root-preparing{
  visibility:hidden!important;
}

/* Quita el destello/rectángulo de toque nativo de Chromium/Safari. La respuesta
   visual del Hotspot/Componente sigue perteneciendo únicamente a VISTA360. */
body.vista360-published #viewer,
body.vista360-published #viewer *,
#app.preview-active #viewer,
#app.preview-active #viewer *{
  -webkit-tap-highlight-color:transparent!important;
  -webkit-touch-callout:none;
}
body.vista360-published [data-poly-id],
body.vista360-published .polygon-layer-object,
body.vista360-published .polygon-layer-object polygon,
#app.preview-active [data-poly-id],
#app.preview-active .polygon-layer-object polygon{
  outline:none!important;
  -webkit-tap-highlight-color:transparent!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}

/* El zoom con dos dedos lo resuelve el motor cambiando el FOV; nunca debe hacer
   zoom/scroll a la página HTML publicada. */
body.vista360-published #viewer,
body.vista360-published #overlay,
body.vista360-published #htmlOverlay,
body.vista360-published .polygon-layer-object,
body.vista360-published .polygon-layer-object polygon{
  touch-action:none!important;
}

.preview-mobile-rotate{position:absolute;z-index:95;display:grid;place-items:center;min-width:42px;height:42px;padding:0 10px;border:1px solid rgba(148,163,184,.45);border-radius:999px;background:rgba(15,23,42,.88);color:#fff;font-size:22px;font-weight:700;cursor:pointer;box-shadow:0 10px 24px rgba(0,0,0,.35);opacity:.5;transition:opacity .18s ease,transform .18s ease;touch-action:none;user-select:none;-webkit-user-select:none}
.preview-mobile-rotate:hover,.preview-mobile-rotate:focus-visible{opacity:1;transform:translateY(-1px)}
.preview-mobile-rotate.hidden{display:none}

/* ============================================================
   Vista360Cloud v3.86 R34 — Acciones contenidas en Vista previa MÓVIL
   ============================================================ */
#vista360PreviewJavascriptHost>.vista360-preview-contained-overlay{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  pointer-events:auto!important;
}
#vista360PreviewJavascriptHost>.vista360-preview-contained-overlay .popup-runtime-card,
#vista360PreviewJavascriptHost>.vista360-preview-contained-overlay .runtime-album-card{
  max-width:calc(100% - 12px)!important;
  max-height:calc(100% - 12px)!important;
  box-sizing:border-box!important;
}
#vista360PreviewJavascriptHost>.vista360-preview-contained-overlay iframe,
#vista360PreviewJavascriptHost>.vista360-preview-contained-overlay video,
#vista360PreviewJavascriptHost>.vista360-preview-contained-overlay img{
  max-width:100%;
  max-height:100%;
}


/* VISTA360 v4.01 R49 — Piloto Automático / Waypoints */
.pilot-fold-icon{font-size:17px!important;color:#22a9e5;transition:transform .15s}
.pilot-intro-note{line-height:1.45;margin-bottom:10px}
.pilot-toolbar{display:grid;grid-template-columns:1fr;gap:6px;margin-bottom:8px}
.pilot-toolbar .btn{width:100%;font-size:11px;padding:7px 8px;text-align:left}
.pilot-toolbar .btn.active{border-color:#27abe6;background:#17364a;color:#eaf8ff}
.pilot-capture-hint{border:1px solid #2aa9e0;background:#112a38;color:#bdeaff;padding:8px;border-radius:6px;font-size:10px;line-height:1.4;margin:8px 0}
.pilot-waypoint-panel,.pilot-waypoint-properties{border:1px solid #343b46;background:#1c2027;margin-top:9px}
.pilot-waypoint-panel-title{padding:8px 9px;border-bottom:1px solid #343b46;font-size:11px;font-weight:700;color:#d4dae3}
.pilot-waypoint-list{padding:5px}
.pilot-waypoint-empty{font-size:10px;color:#8f99a7;line-height:1.45;padding:8px}
.pilot-waypoint-row{display:grid;grid-template-columns:29px minmax(0,1fr) 24px 24px 24px;gap:4px;align-items:center;border-radius:5px;padding:3px;margin:2px 0}
.pilot-waypoint-row:hover,.pilot-waypoint-row.selected{background:#2b3039}
.pilot-waypoint-index,.pilot-waypoint-mini,.pilot-waypoint-name{border:0;background:transparent;color:#cfd6df;cursor:pointer;height:27px}
.pilot-waypoint-index{border:1px solid #6f7987;border-radius:50%;width:27px;padding:0;font-weight:700;background:#4a5059;color:white}
.pilot-waypoint-row.selected .pilot-waypoint-index{background:#159cd6;border-color:#7ad8ff}
.pilot-waypoint-name{text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
.pilot-waypoint-mini{font-size:12px;padding:0;border-radius:4px}
.pilot-waypoint-mini:hover{background:#3a414c}.pilot-waypoint-mini.danger{color:#ff8f97}.pilot-waypoint-mini:disabled{opacity:.25;cursor:default}
.pilot-waypoint-properties{padding-bottom:9px}.pilot-waypoint-properties>.field,.pilot-waypoint-properties>.check-row,.pilot-waypoint-properties>.pilot-motion-row,.pilot-waypoint-properties>.btn{margin-left:9px;margin-right:9px}
.pilot-property-note{font-style:italic;text-align:center;padding:9px 12px 4px;line-height:1.45}
.pilot-motion-row{display:grid;grid-template-columns:88px minmax(0,1fr);align-items:center;gap:7px;margin-bottom:8px}
.pilot-radio-line{display:flex;align-items:center;gap:5px;font-size:11px;color:#d2d8e1}.pilot-radio-line input{margin:0}
.pilot-range-line{display:grid;grid-template-columns:minmax(0,1fr) 48px;align-items:center;gap:6px}.pilot-range-line input{width:100%}.pilot-range-line span{font-size:10px;color:#aab4c0;text-align:right}
.pilot-duration-input{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important}.pilot-duration-input input{min-width:0;width:100%}
.pilot-zoom-check{margin-top:8px!important;margin-bottom:8px!important}.pilot-zoom-field{margin-top:2px}
.panorama-pilot-markers{position:absolute;inset:0;z-index:46;pointer-events:none;overflow:hidden}
.pilot-waypoint-marker{position:absolute;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;border:2px solid white;background:rgba(100,105,112,.88);color:white;font:700 13px Segoe UI,Arial;box-shadow:0 2px 6px rgba(0,0,0,.6),0 0 0 2px rgba(0,0,0,.24);pointer-events:auto;cursor:pointer}
.pilot-waypoint-marker:hover,.pilot-waypoint-marker.selected{background:#069fdf;border-color:#fff;transform:translate(-50%,-50%) scale(1.08)}
.viewer.pilot-capture-active{cursor:crosshair!important}.viewer.pilot-capture-active #glCanvas{cursor:crosshair!important}

/* R47 — Piloto Automático mantiene la jerarquía visual de Ajustes de Autoplay. */
#panoramaPilotEnabled:disabled{cursor:not-allowed}
#panoramaPilotEnabled:disabled+*{opacity:.55}
.viewer.pilot-capture-active{cursor:crosshair!important}
.viewer.pilot-capture-active.dragging,.viewer.pilot-capture-active:active{cursor:grabbing!important}


/* VISTA360 v4.01 R49 — precisión visual de Waypoints + controles de recorrido. */
.pilot-speed-line{grid-template-columns:minmax(86px,1fr) 62px 30px!important;gap:6px!important}
.pilot-speed-line input[type="range"]{display:block!important;min-width:0!important;width:100%!important;margin:0!important;position:relative!important;z-index:1!important}
.pilot-value-input,.pilot-duration-input input{
  width:100%!important;min-width:0!important;height:32px!important;
  background:#11141a!important;color:var(--text)!important;
  border:1px solid #39404c!important;border-radius:5px!important;
  padding:5px 7px!important;font:inherit!important;box-shadow:none!important;
}
.pilot-value-input:focus,.pilot-duration-input input:focus{outline:1px solid #159cd6!important;border-color:#159cd6!important}
#panoramaPilotSpeedReadout{min-width:30px;text-align:left!important;color:var(--muted)!important}
#panoramaPilotStopBtn{border-color:#a94c52!important;color:#ffd8db!important;background:#2b1c20!important}
#panoramaPilotStopBtn:hover{background:#44242a!important;border-color:#d66a72!important}


/* VISTA360 v4.01 R49 — Piloto Automático independiente de Autoplay. */
#panoramaPilotEnabled:disabled{opacity:.55}

/* v4.12 R60 · INFO UNIDAD nativo + vínculo inmobiliario */
.info-description{margin-top:10px;padding-top:10px;border-top:1px solid #303743;color:#cbd5e1;font-size:12px;line-height:1.45;white-space:pre-wrap}
.info-card .info-row b{max-width:62%;text-align:right;overflow-wrap:anywhere}
@media(max-width:700px){.info-card{position:fixed!important;left:12px!important;right:12px!important;bottom:12px!important;width:auto!important;max-height:58vh;overflow:auto;z-index:2147482500}}
#realEstateBindingFold select{width:100%}
#realEstateBindingStatus{margin-top:8px;line-height:1.4}

/* ========================================================================
   R82 · CONECTAR PANORAMAS AUTOMÁTICAMENTE
   ======================================================================== */
.project-section-tab-row{display:flex;align-items:stretch;gap:6px;padding:0 8px 0 0;background:transparent}
.project-section-tab-row .project-section-tab{flex:1;min-width:0}
.auto-connect-panoramas-btn{position:relative;flex:0 0 38px;min-width:38px;align-self:center;height:34px;margin:0;border:1px solid #3b5367;border-radius:8px;background:linear-gradient(180deg,#1c2a37,#121c26);color:#79c9ff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.04);transition:border-color .15s,background .15s,transform .15s}
.auto-connect-panoramas-btn:hover{border-color:#28b5ee;background:linear-gradient(180deg,#20384b,#142736);transform:translateY(-1px)}
.auto-connect-panoramas-btn:active{transform:none}
.auto-connect-link-icon{font-size:17px;line-height:1}
.auto-connect-selection-badge{position:absolute;right:-5px;top:-7px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:#1aa7df;color:#03121c;border:2px solid #151b22;font:800 10px Segoe UI,Arial;box-sizing:border-box}
.pano-tree-item.auto-connect-selected{box-shadow:inset 3px 0 0 #17b8f2;background:linear-gradient(90deg,rgba(21,181,239,.16),rgba(21,181,239,.03))}
.pano-tree-item.auto-connect-selected .pano-list-icon{color:#64d1ff}

.auto-connect-window{width:min(860px,calc(100vw - 50px));max-height:min(790px,calc(100vh - 46px));display:flex;flex-direction:column;background:#111921;border:1px solid #3b4d5d;box-shadow:0 28px 90px rgba(0,0,0,.62)}
.auto-connect-body{padding:20px;overflow:auto;background:radial-gradient(circle at 85% 0,rgba(26,117,173,.12),transparent 35%),linear-gradient(180deg,#111a22,#0e151c)}
.auto-connect-step{display:flex;flex-direction:column;gap:18px}
.auto-connect-intro{display:flex;gap:16px;align-items:flex-start;padding:16px 18px;border:1px solid rgba(73,133,177,.28);border-radius:12px;background:linear-gradient(135deg,rgba(18,69,103,.32),rgba(15,31,45,.58))}
.auto-connect-intro-icon{flex:0 0 44px;width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:#123c59;border:1px solid #266b94;color:#62c9ff;font-size:22px}
.auto-connect-intro b,.auto-connect-step-title b{display:block;color:#f2f7fb;font-size:15px;margin-bottom:5px}
.auto-connect-intro span,.auto-connect-step-title small{display:block;color:#aebdca;line-height:1.55;font-size:13px}
.auto-connect-selection-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.auto-connect-selection-head>div:first-child{display:flex;align-items:baseline;gap:10px}.auto-connect-selection-head b{color:#e9f2f8}.auto-connect-selection-head span{font-size:12px;color:#8499aa}
.auto-connect-selection-actions{display:flex;gap:8px}.auto-connect-selection-actions .btn{height:30px;padding:0 11px;font-size:11px}
.auto-connect-checklist{max-height:205px;overflow:auto;border:1px solid #314150;border-radius:10px;background:#0b1218;padding:6px}
.auto-pano-row{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:9px;min-height:38px;padding:0 10px;border-radius:7px;color:#dce7ef;cursor:pointer;border:1px solid transparent}
.auto-pano-row:hover{background:#16232e}.auto-pano-row.selected{background:rgba(25,170,225,.12);border-color:rgba(45,181,233,.22)}.auto-pano-row.disabled{opacity:.45;cursor:not-allowed}
.auto-pano-row input{accent-color:#1db6ee}.auto-pano-row .type{font:800 10px Segoe UI,Arial;letter-spacing:.08em;color:#7f9aaf}
.auto-connect-grid{display:grid;gap:16px}.auto-connect-grid.two{grid-template-columns:1fr 1fr}.auto-connect-grid .field{margin:0}.auto-connect-grid .field>small{display:block;margin-top:6px;color:#778b9b;font-size:11px;line-height:1.45}
.auto-connect-type-grid,.auto-connect-search-mode{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.auto-connect-choice,.auto-connect-search-mode button{min-height:72px;padding:11px 12px;text-align:left;border:1px solid #344653;border-radius:9px;background:#111c25;color:#dce6ed;cursor:pointer;transition:.15s}
.auto-connect-choice:hover,.auto-connect-search-mode button:hover{border-color:#4b718d;background:#142532}.auto-connect-choice.active,.auto-connect-search-mode button.active{border-color:#22b6ef;background:linear-gradient(135deg,rgba(18,115,163,.28),rgba(16,42,59,.62));box-shadow:inset 0 0 0 1px rgba(53,192,244,.1)}
.auto-connect-choice b,.auto-connect-search-mode b{display:block;font-size:13px;margin-bottom:4px}.auto-connect-choice span,.auto-connect-search-mode span{display:block;color:#8ea3b3;font-size:11px;line-height:1.35}
.auto-connect-check{display:flex;align-items:flex-start;gap:10px;padding:12px 13px;border:1px solid #314150;border-radius:9px;background:#0d161e;color:#dae6ee;cursor:pointer}.auto-connect-check input{margin-top:2px;accent-color:#1eb5ed}.auto-connect-check b{display:block;font-size:12px;margin-bottom:4px}.auto-connect-check small{display:block;color:#8296a6;font-size:11px;line-height:1.4}
.auto-connect-error{padding:10px 12px;border-radius:8px;background:rgba(192,52,62,.16);border:1px solid rgba(232,84,93,.35);color:#ffadb2;font-size:12px}
.auto-connect-step-title{display:flex;align-items:flex-start;gap:14px;padding:4px 2px}.auto-connect-step-title>span{display:flex;align-items:center;justify-content:center;flex:0 0 38px;width:38px;height:38px;border-radius:10px;background:#153d57;color:#65cbff;border:1px solid #2c698f;font-weight:800}
.auto-connect-calibration-card{display:grid;grid-template-columns:minmax(0,1fr) 36px minmax(0,1fr) 160px;gap:12px;align-items:end;padding:18px;border-radius:12px;border:1px solid #344653;background:#0c141b}.auto-connect-calibration-link{height:42px;display:flex;align-items:center;justify-content:center;color:#55c5fa;font-size:20px}.auto-connect-calibration-card .field{margin:0}.auto-connect-calibration-card select,.auto-connect-calibration-card input{width:100%;height:42px;box-sizing:border-box;border:1px solid #425464;border-radius:7px;background:#111920;color:#edf5fa;padding:0 10px;outline:none}.auto-connect-calibration-card select:focus,.auto-connect-calibration-card input:focus{border-color:#24b8f1;box-shadow:0 0 0 2px rgba(36,184,241,.12)}
.auto-connect-note{padding:12px 14px;border-left:3px solid #287ba7;background:#101e29;color:#91a7b7;font-size:12px;line-height:1.55}.auto-connect-note b{color:#dce9f1}
.auto-connect-processing-hero{padding:28px 18px 10px;text-align:center}.auto-connect-processing-hero b{display:block;color:#f1f7fb;font-size:18px;margin:13px 0 4px}.auto-connect-processing-hero span{color:#8ea4b5;font-size:12px}.auto-connect-spinner{width:46px;height:46px;margin:auto;border-radius:50%;border:4px solid #233543;border-top-color:#20b8f1;animation:autoConnectSpin .8s linear infinite}@keyframes autoConnectSpin{to{transform:rotate(360deg)}}
.auto-connect-progress{height:9px;border-radius:999px;overflow:hidden;background:#071016;border:1px solid #2b3d49}.auto-connect-progress>div{height:100%;width:0;background:linear-gradient(90deg,#138dd0,#35c8ff);transition:width .18s ease}.auto-connect-progress-meta{display:flex;justify-content:space-between;gap:14px;color:#7f95a5;font-size:11px}.auto-connect-progress-meta span:last-child{text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.auto-connect-processing-note{text-align:center;color:#6f8494;font-size:11px;line-height:1.5;padding:10px 20px}
.auto-connect-result-icon{width:58px;height:58px;margin:8px auto 0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(34,184,109,.16);border:1px solid rgba(67,215,134,.4);color:#74e8a2;font-size:27px;font-weight:900}.auto-connect-result h3{text-align:center;margin:0;color:#f3f8fb}.auto-connect-result p{text-align:center;margin:-7px auto 0;max-width:660px;color:#9fb2c0;font-size:13px;line-height:1.55}
.auto-connect-result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.auto-connect-stat{padding:15px 10px;border-radius:10px;text-align:center;border:1px solid #334553;background:#0c151c}.auto-connect-stat b{display:block;color:#55c8ff;font-size:23px}.auto-connect-stat span{display:block;margin-top:3px;color:#738999;font-size:9px;font-weight:800;letter-spacing:.07em}.auto-connect-result-warnings{padding:12px 14px;border-radius:9px;background:rgba(215,147,31,.09);border:1px solid rgba(222,160,51,.25);color:#dfbf83;font-size:12px;line-height:1.55}
.auto-connect-footer{display:flex;align-items:center;gap:8px}.modal-footer-spacer{flex:1}
@media(max-width:760px){.auto-connect-window{width:calc(100vw - 22px);max-height:calc(100vh - 22px)}.auto-connect-grid.two{grid-template-columns:1fr}.auto-connect-calibration-card{grid-template-columns:1fr}.auto-connect-calibration-link{height:auto}.auto-connect-result-stats{grid-template-columns:1fr}.compact-grid{grid-template-columns:1fr!important}}

/* ========================================================================
   R82 · Importación bloqueante, lista de 3 panoramas y hotspots AutoConnect
   ======================================================================== */
.panorama-sidebar-list{
  max-height:128px;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-gutter:stable;
}
.pano-tree-item{min-height:38px;box-sizing:border-box}
.panorama-sidebar-list::-webkit-scrollbar{width:8px}
.panorama-sidebar-list::-webkit-scrollbar-track{background:#121820}
.panorama-sidebar-list::-webkit-scrollbar-thumb{background:#51606d;border-radius:999px;border:2px solid #121820}

.panorama-import-progress-modal{
  position:fixed;inset:0;z-index:2147483600;display:flex;align-items:center;justify-content:center;
  padding:24px;background:rgba(3,8,13,.90);backdrop-filter:blur(10px);pointer-events:all;
}
.panorama-import-progress-card{
  width:min(560px,calc(100vw - 36px));padding:30px;border-radius:20px;
  background:linear-gradient(180deg,#0c1b28,#07121c);border:1px solid #29465b;
  box-shadow:0 30px 90px rgba(0,0,0,.58),0 0 60px rgba(26,170,230,.08);color:#edf6fc;text-align:center;
}
.panorama-import-progress-icon{
  width:64px;height:64px;margin:0 auto 16px;border-radius:50%;display:grid;place-items:center;
  border:2px solid #25b9ef;color:#6ed5ff;background:radial-gradient(circle,rgba(32,171,228,.16),rgba(11,28,40,.7));font:800 17px Segoe UI,Arial;
}
.panorama-import-progress-card h3{margin:0 0 8px;font-size:22px}.panorama-import-progress-card>p{margin:0 0 22px;color:#9fb6c7;font-size:14px}
.panorama-import-progress-bar{height:12px;border-radius:999px;overflow:hidden;background:#061018;border:1px solid #294253}
.panorama-import-progress-bar>div{height:100%;width:0;background:linear-gradient(90deg,#128ad0,#39c9ff);transition:width .18s ease}
.panorama-import-progress-meta{display:flex;justify-content:space-between;align-items:center;margin-top:10px;color:#8299aa;font-size:12px}.panorama-import-progress-meta strong{color:#65ceff;font-size:14px}
.panorama-import-progress-name{margin-top:12px;min-height:20px;color:#dce9f2;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.panorama-import-progress-note{margin-top:18px;padding-top:16px;border-top:1px solid #213341;color:#728797;font-size:11px;line-height:1.55}
body.panorama-import-busy{overflow:hidden!important;cursor:progress!important}

.projective-object.auto-connect-nav-hotspot{
  background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important;
  display:grid!important;place-items:center!important;cursor:pointer!important;filter:drop-shadow(0 5px 8px rgba(0,0,0,.32));
}
.auto-connect-nav-ring{position:relative;display:block;width:84px;height:84px;border:7px solid rgba(255,255,255,.78);border-radius:50%;box-sizing:border-box;background:rgba(255,255,255,.07);box-shadow:0 0 0 2px rgba(10,28,40,.18),inset 0 0 14px rgba(255,255,255,.10)}
.auto-connect-nav-ring::before{content:'';position:absolute;inset:15px;border:4px solid rgba(255,255,255,.44);border-radius:50%}
.auto-connect-nav-ring i{position:absolute;left:50%;top:50%;width:14px;height:14px;transform:translate(-50%,-50%);border-radius:50%;background:rgba(255,255,255,.72);box-shadow:0 0 14px rgba(255,255,255,.25)}
.auto-connect-nav-hotspot.floor .auto-connect-nav-ring{transform:perspective(180px) rotateX(61deg) scale(1.18,.92);transform-origin:center}
.auto-connect-nav-arrow{width:66px;height:66px;display:grid;place-items:center;border-radius:50%;background:rgba(5,19,30,.72);border:3px solid rgba(255,255,255,.76);color:#fff;font:800 34px/1 Segoe UI,Arial;box-shadow:0 0 0 4px rgba(31,175,232,.18)}
.projective-object.auto-connect-nav-hotspot:hover .auto-connect-nav-ring,.projective-object.auto-connect-nav-hotspot:hover .auto-connect-nav-arrow{filter:brightness(1.18);box-shadow:0 0 0 5px rgba(46,190,244,.20),0 0 28px rgba(46,190,244,.22)}
.projective-object.auto-connect-nav-hotspot.selected-object .auto-connect-nav-ring,.projective-object.auto-connect-nav-hotspot.selected-object .auto-connect-nav-arrow{outline:3px solid #24bdf4;outline-offset:6px}

/* R82 · AutoConnect: conexiones de sistema, únicamente a nivel del suelo */
.auto-connect-floor-only{
  min-height:82px;padding:16px 18px;border:1px solid #2a485d;border-radius:14px;
  background:linear-gradient(180deg,#0d2230,#0a1a25);display:flex;flex-direction:column;justify-content:center;gap:7px;
}
.auto-connect-floor-only b{color:#eef8ff;font-size:15px}.auto-connect-floor-only span{color:#91afc3;font-size:12px;line-height:1.55}
.tree-item.auto-connect-system-row{background:linear-gradient(90deg,rgba(15,91,125,.13),rgba(13,27,39,.18));border-left:2px solid rgba(70,192,242,.62)}
.tree-item.auto-connect-system-row .item-name{color:#d9edf9}.tree-item.auto-connect-system-row .layer-type-icon{color:#c9d2dc;font-size:12px}
.tree-item.auto-connect-system-row .layer-control:disabled{opacity:.62;cursor:default;filter:none}.tree-item.auto-connect-system-row .layer-control.locked-active{color:#f2aa20}
.projective-object.auto-connect-nav-hotspot.system-protected{user-select:none;-webkit-user-select:none;touch-action:manipulation}
.projective-object.auto-connect-nav-hotspot .auto-connect-nav-ring{
  width:92px;height:92px;border:8px solid rgba(255,255,255,.92);background:rgba(203,211,218,.19);
  box-shadow:0 0 0 2px rgba(22,35,45,.20),inset 0 0 22px rgba(255,255,255,.14),0 8px 16px rgba(0,0,0,.18);
}
.projective-object.auto-connect-nav-hotspot .auto-connect-nav-ring::before{inset:15px;border:0;background:rgba(125,137,147,.26);box-shadow:inset 0 0 10px rgba(255,255,255,.18)}
.projective-object.auto-connect-nav-hotspot .auto-connect-nav-ring i{width:18px;height:18px;background:rgba(230,235,239,.68);box-shadow:0 0 0 2px rgba(255,255,255,.18)}
.projective-object.auto-connect-nav-hotspot.floor .auto-connect-nav-ring{transform:perspective(190px) rotateX(65deg) scale(1.16,.88);transform-origin:center}
.projective-object.auto-connect-nav-hotspot.system-protected.locked-object .auto-connect-nav-ring{outline:none!important}

/* R83 · AutoConnect: vistas previas de calibración + overlay angular esférico */
.auto-connect-calibration-card{grid-template-columns:minmax(250px,1fr) 36px minmax(250px,1fr) 170px;align-items:start}
.auto-connect-calibration-panorama{min-width:0;display:flex;flex-direction:column;gap:10px}
.auto-connect-calibration-preview{position:relative;aspect-ratio:2/1;min-height:118px;border:1px solid #31495b;border-radius:10px;overflow:hidden;background:linear-gradient(180deg,#07131d,#0a1a25);box-shadow:inset 0 0 0 1px rgba(255,255,255,.015)}
.auto-connect-calibration-preview img{display:block;width:100%;height:100%;object-fit:fill;background:#07111a}
.auto-connect-calibration-preview img.hidden{display:none}
.auto-connect-calibration-preview .preview-loading{position:absolute;inset:0;display:grid;place-items:center;color:#7f9bae;font-size:12px;background:linear-gradient(135deg,rgba(10,26,38,.95),rgba(7,18,28,.95));z-index:1}
.auto-connect-calibration-preview .preview-loading.hidden{display:none}
.auto-connect-calibration-preview>span{position:absolute;left:0;right:0;bottom:0;padding:7px 9px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.78));color:#eff8ff;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;z-index:2}
.auto-connect-calibration-card .field.distance{align-self:start;padding-top:0}

/* El marcador ya NO usa la apariencia de Sticker ni un tamaño fijo de pantalla.
   El elemento completo (270x150 en Suelo) es transformado por homografía a un
   parche angular de la panorámica, por eso estos hijos ocupan el 100% del plano. */
.projective-object.auto-connect-nav-hotspot{filter:drop-shadow(0 5px 10px rgba(0,0,0,.30));transform-origin:0 0!important;will-change:transform}
/* R84 · Marcador VISTA360 original: aro elíptico blanco/gris con pulso concéntrico.
   Se recrea con CSS propio; el plano completo continúa anclado angularmente a la esfera. */
.projective-object.auto-connect-nav-hotspot .auto-connect-nav-ring{position:relative;display:block;width:100%!important;height:100%!important;box-sizing:border-box;border:12px solid rgba(255,255,255,.96)!important;border-radius:50%!important;background:rgba(151,163,174,.14)!important;box-shadow:0 0 0 3px rgba(24,34,43,.22),inset 0 0 20px rgba(255,255,255,.13),0 8px 20px rgba(0,0,0,.20)!important;transform:none!important;transform-origin:center!important;animation:v360AutoConnectBasePulse 1.55s ease-in-out infinite}
.projective-object.auto-connect-nav-hotspot .auto-connect-nav-ring::before{content:'';position:absolute;inset:18%!important;border:8px solid rgba(226,232,237,.74)!important;border-radius:50%!important;background:rgba(118,133,145,.19)!important;box-shadow:inset 0 0 16px rgba(255,255,255,.18)!important}
.projective-object.auto-connect-nav-hotspot .auto-connect-nav-ring::after{content:'';position:absolute;left:50%;top:50%;width:23%!important;height:23%!important;transform:translate(-50%,-50%)!important;border-radius:50%!important;background:radial-gradient(ellipse at center,rgba(244,248,250,.90) 0 34%,rgba(185,198,207,.62) 48%,rgba(96,112,124,.18) 78%,transparent 100%)!important;box-shadow:0 0 15px rgba(255,255,255,.28)!important}
.projective-object.auto-connect-nav-hotspot .auto-connect-nav-ring i{position:absolute;inset:-7%!important;border:5px solid rgba(255,255,255,.82)!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;transform:scale(.58)!important;transform-origin:center!important;opacity:0;animation:v360AutoConnectWave 1.55s ease-out infinite!important;pointer-events:none}
.projective-object.auto-connect-nav-hotspot.floor .auto-connect-nav-ring{transform:none!important}
.projective-object.auto-connect-nav-hotspot .auto-connect-nav-arrow{display:grid;width:100%!important;height:100%!important;place-items:center;border-radius:50%;box-sizing:border-box;background:radial-gradient(circle,rgba(10,38,57,.72),rgba(4,17,28,.82));border:9px solid rgba(255,255,255,.90)!important;color:#fff;box-shadow:0 0 0 5px rgba(35,174,235,.18),0 8px 22px rgba(0,0,0,.22)}
.projective-object.auto-connect-nav-hotspot .auto-connect-nav-arrow i{font:900 74px/1 Segoe UI,Arial,sans-serif;font-style:normal;text-shadow:0 2px 10px rgba(0,0,0,.35)}
.projective-object.auto-connect-nav-hotspot.system-protected.locked-object .auto-connect-nav-ring,.projective-object.auto-connect-nav-hotspot.system-protected.locked-object .auto-connect-nav-arrow{outline:none!important}
@keyframes v360AutoConnectBasePulse{0%,100%{opacity:.88;filter:brightness(.98)}50%{opacity:1;filter:brightness(1.08)}}
@keyframes v360AutoConnectWave{0%{transform:scale(.56);opacity:.72}62%{opacity:.28}100%{transform:scale(1.12);opacity:0}}

.projective-image.auto-connect-image-hotspot{background:transparent!important;border:0!important;box-shadow:none!important;filter:drop-shadow(0 5px 10px rgba(0,0,0,.30));user-select:none;-webkit-user-select:none;touch-action:manipulation;will-change:transform;overflow:visible!important}
.projective-image.auto-connect-image-hotspot.selected-object{outline:3px solid #24bdf4;outline-offset:6px}
.projective-image.auto-connect-image-hotspot.locked-object{outline:none!important}

@media(max-width:900px){.auto-connect-calibration-card{grid-template-columns:1fr 26px 1fr}.auto-connect-calibration-card .field.distance{grid-column:1/-1}.auto-connect-calibration-preview{min-height:100px}}
@media(max-width:620px){.auto-connect-calibration-card{grid-template-columns:1fr}.auto-connect-calibration-link{height:auto}.auto-connect-calibration-preview{min-height:130px}}

/* R89 · AutoConnect: +40 %, animación de Biblioteca y recorrido sin giro/FOV */
.projective-image.auto-connect-image-hotspot{
  animation:none!important;
  filter:drop-shadow(0 5px 10px rgba(0,0,0,.30));
}
.viewer.auto-connect-walk-active{pointer-events:none!important;cursor:progress!important;overflow:hidden!important}
.viewer.auto-connect-walk-active>#glCanvas,
.viewer.auto-connect-walk-active>#overlay,
.viewer.auto-connect-walk-active>#htmlOverlay{
  transform-origin:var(--auto-connect-travel-x,50%) var(--auto-connect-travel-y,70%);
  will-change:transform,filter;
}
.viewer.auto-connect-ground-travel>#glCanvas,
.viewer.auto-connect-ground-travel>#overlay,
.viewer.auto-connect-ground-travel>#htmlOverlay{
  transform:scale(var(--auto-connect-travel-scale,1.14));
  transition:transform var(--auto-connect-travel-duration,560ms) cubic-bezier(.22,.72,.18,1),filter var(--auto-connect-travel-duration,560ms) ease;
  filter:blur(.22px);
}
.viewer.auto-connect-walk-active::after{
  content:'';position:absolute;inset:0;z-index:50000;pointer-events:none;
  background:
    radial-gradient(ellipse at var(--auto-connect-travel-x,50%) var(--auto-connect-travel-y,70%),transparent 0 34%,rgba(4,12,19,.025) 61%,rgba(3,10,17,.15) 100%);
  opacity:0;transition:opacity 180ms ease;
}
.viewer.auto-connect-ground-travel::after{opacity:1}
.viewer.auto-connect-travel-swap::after{opacity:.22}

/* R90 · gestión por grupos + avance frontal + horizonte con aro de suelo girado */
.auto-connect-toolbar-control{position:relative;flex:0 0 46px;min-width:46px;align-self:center;height:38px;display:flex;align-items:center;justify-content:center}
.auto-connect-toolbar-control .auto-connect-panoramas-btn{flex:0 0 38px;min-width:38px;width:38px}
.auto-connect-delete-btn{position:absolute;right:-3px;top:-5px;width:18px;height:18px;padding:0;border-radius:50%;border:2px solid #151b22;background:#c94a4a;color:#fff;font:800 13px/13px Segoe UI,Arial;display:grid;place-items:center;cursor:pointer;z-index:3;box-shadow:0 2px 7px rgba(0,0,0,.35)}
.auto-connect-delete-btn:hover{background:#e35c5c;transform:scale(1.06)}
.auto-connect-delete-window{width:min(720px,calc(100vw - 40px));max-height:min(76vh,680px)}
.auto-connect-delete-body{padding:22px;overflow:auto;min-height:180px}
.auto-connect-delete-intro{padding:15px 16px;margin-bottom:16px;border:1px solid #2d4659;border-radius:12px;background:linear-gradient(180deg,#0d2230,#0a1924);display:flex;flex-direction:column;gap:6px}
.auto-connect-delete-intro b{color:#eef8ff;font-size:15px}.auto-connect-delete-intro span{color:#91aabd;font-size:12px;line-height:1.55}
.auto-connect-delete-groups{display:grid;gap:10px}
.auto-connect-delete-group{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid #344754;border-radius:10px;background:#111c25;cursor:pointer;transition:.15s}
.auto-connect-delete-group:hover{border-color:#4b718d;background:#142532}.auto-connect-delete-group:has(input:checked){border-color:#24baf1;background:linear-gradient(135deg,rgba(20,111,158,.27),rgba(13,34,48,.7));box-shadow:inset 0 0 0 1px rgba(65,194,241,.1)}
.auto-connect-delete-group input{margin-top:4px;accent-color:#22b8ef}.auto-connect-delete-group .group-main{min-width:0;display:flex;flex-direction:column;gap:4px}.auto-connect-delete-group b{color:#eef8ff;font-size:14px}.auto-connect-delete-group small{color:#8eabba;font-size:12px}.auto-connect-delete-group em{color:#6f8b9d;font-style:normal;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:580px}
.auto-connect-delete-empty{padding:30px;text-align:center;color:#8298a8;border:1px dashed #344754;border-radius:10px}

/* El avance R90 no desplaza la panorámica hacia un lado. La imagen mantiene el
   mismo centro, altura aparente, orientación y FOV; una guía creciente marca el
   recorrido hasta el punto elegido y el cambio de panorama se hace al final. */
.viewer.auto-connect-walk-active>#glCanvas,
.viewer.auto-connect-walk-active>#overlay,
.viewer.auto-connect-walk-active>#htmlOverlay{transform-origin:50% 50%!important}
.viewer.auto-connect-ground-travel>#glCanvas,
.viewer.auto-connect-ground-travel>#overlay,
.viewer.auto-connect-ground-travel>#htmlOverlay{transform:none!important;filter:none!important;transition:none!important}
.viewer.auto-connect-walk-active::after{background:rgba(3,10,16,.08)!important;opacity:0;transition:opacity calc(var(--auto-connect-travel-duration,650ms)*.25) ease!important}
.viewer.auto-connect-ground-travel::after{opacity:.16!important}
.auto-connect-travel-marker{position:absolute;z-index:49999;width:42px;height:20px;margin:-10px 0 0 -21px;border:3px solid rgba(255,255,255,.92);border-radius:50%;pointer-events:none;transform-origin:center;opacity:.9;box-shadow:0 0 10px rgba(255,255,255,.15);animation:v360AutoConnectApproach var(--auto-connect-travel-duration,650ms) cubic-bezier(.18,.72,.18,1) forwards}
.auto-connect-travel-marker::before,.auto-connect-travel-marker::after{content:'';position:absolute;inset:-4px;border:2px solid rgba(255,255,255,.66);border-radius:50%;animation:v360AutoConnectApproachWave var(--auto-connect-travel-duration,650ms) ease-out forwards}
.auto-connect-travel-marker::after{animation-delay:80ms;opacity:.45}
@keyframes v360AutoConnectApproach{0%{transform:scale(.65);opacity:.65}70%{transform:scale(3.4);opacity:.92}100%{transform:scale(5.6);opacity:0}}
@keyframes v360AutoConnectApproachWave{0%{transform:scale(.5);opacity:.72}100%{transform:scale(2.4);opacity:0}}

/* R91 · AutoConnect: transición con zoom leve, grupos desplegables y orientación real */
.viewer.auto-connect-walk-active{pointer-events:none!important;cursor:progress!important;overflow:hidden!important}
.viewer.auto-connect-ground-travel>#glCanvas,
.viewer.auto-connect-ground-travel>#overlay,
.viewer.auto-connect-ground-travel>#htmlOverlay{
  transform:none!important;
  filter:none!important;
  transition:none!important;
}
.viewer.auto-connect-walk-active::after{
  content:'';position:absolute;inset:0;z-index:50000;pointer-events:none;
  background:radial-gradient(ellipse at center,transparent 0 58%,rgba(2,9,15,.09) 100%)!important;
  opacity:0;transition:opacity 180ms ease!important;
}
.viewer.auto-connect-ground-travel::after{opacity:.28!important}
.viewer.auto-connect-travel-swap::after{opacity:.34!important}
/* El click realza el propio plano del hotspot: no se genera una elipse horizontal
   independiente, por lo que Horizonte conserva el giro/orientación espacial. */
.projective-image.auto-connect-image-hotspot.auto-connect-click-active{
  filter:drop-shadow(0 0 14px rgba(255,255,255,.55)) drop-shadow(0 6px 12px rgba(0,0,0,.28)) brightness(1.12)!important;
}

.auto-connect-delete-group{display:block!important;padding:0!important;overflow:hidden}
.auto-connect-delete-group .group-header{display:flex;align-items:center;gap:10px;padding:13px 14px;cursor:pointer}
.auto-connect-delete-group .group-header>input{flex:0 0 auto;margin:0;accent-color:#22b8ef}
.auto-connect-delete-group .group-title{min-width:0;flex:1;display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;background:transparent;color:#eef8ff;text-align:left;padding:2px 0;cursor:pointer;font:inherit}
.auto-connect-delete-group .group-title b{font-size:15px;line-height:1.35;color:#eef8ff}
.auto-connect-delete-group .group-chevron{flex:0 0 auto;color:#7fcff1;font-size:18px;transition:transform .16s ease}
.auto-connect-delete-group.expanded .group-chevron{transform:rotate(180deg)}
.auto-connect-delete-group .group-details{border-top:1px solid rgba(79,122,151,.28);padding:10px 14px 13px 40px;background:rgba(4,14,22,.26)}
.auto-connect-delete-group .group-details.hidden{display:none}
.auto-connect-delete-group .group-details-caption{margin-bottom:8px;color:#7f9db0;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.auto-connect-delete-group .group-panorama-name{display:grid;grid-template-columns:24px minmax(0,1fr);gap:8px;align-items:center;padding:5px 0;color:#c9d9e5}
.auto-connect-delete-group .group-panorama-name span{width:21px;height:21px;border-radius:50%;display:grid;place-items:center;background:#17364a;color:#68cef7;font-size:10px;font-weight:800}
.auto-connect-delete-group .group-panorama-name b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#c9d9e5;font-size:12px;font-weight:600}


/* ========================================================================
   R94 · CONECTAR PANORAMAS — DISEÑO R91 + AJUSTES PUNTUALES
   ======================================================================== */
/* Se conserva el diseño de R91. Solo reducimos un poco la lista para que el
   contenido completo entre en pantalla sin comprimir tipografías ni controles. */
#autoConnectStep1 .auto-connect-checklist{
  max-height:170px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-gutter:stable;
}
@media(max-height:820px) and (min-width:761px){
  #autoConnectStep1 .auto-connect-checklist{max-height:138px!important}
}
@media(max-height:740px) and (min-width:761px){
  #autoConnectStep1 .auto-connect-checklist{max-height:112px!important}
}

/* Alineación exacta del selector azul y del título del grupo. */
.auto-connect-delete-group .group-header{
  display:grid!important;
  grid-template-columns:18px minmax(0,1fr)!important;
  align-items:center!important;
  column-gap:10px!important;
}
.auto-connect-delete-group .group-header>input{
  width:14px!important;height:14px!important;
  margin:0!important;align-self:center!important;justify-self:center!important;
}
.auto-connect-delete-group .group-title{
  min-height:0!important;padding:0!important;margin:0!important;
  align-items:center!important;
}
.auto-connect-delete-group .group-title b{
  margin:0!important;min-height:0!important;line-height:1.2!important;
  display:flex!important;align-items:center!important;
}
.auto-connect-delete-group .group-chevron{align-self:center!important}

/* Transición 3D R94: el hotspot permanece inmóvil. Solo se desplaza visualmente
   la panorámica (canvas + overlay geométrico) hacia la línea perpendicular del
   punto elegido. El HTML overlay queda fijo para evitar mover/agrandar hotspots. */
.viewer.auto-connect-walk-active{pointer-events:none!important;cursor:progress!important;overflow:hidden!important}
.viewer.auto-connect-ground-travel>#glCanvas,
.viewer.auto-connect-ground-travel>#overlay{
  transform-origin:var(--auto-connect-origin-x,50%) var(--auto-connect-origin-y,62%)!important;
  transform:scale(var(--auto-connect-travel-scale,1.34))!important;
  transition:transform var(--auto-connect-travel-duration,720ms) cubic-bezier(.12,.68,.18,1),filter var(--auto-connect-travel-duration,720ms) ease!important;
  filter:saturate(1.012) contrast(1.008)!important;
  will-change:transform,filter!important;
}
.viewer.auto-connect-ground-travel>#htmlOverlay{
  transform:none!important;filter:none!important;transition:none!important;
}
.viewer.auto-connect-arrival-phase>#glCanvas,
.viewer.auto-connect-arrival-phase>#overlay{
  transform-origin:var(--auto-connect-origin-x,50%) var(--auto-connect-origin-y,62%)!important;
  transform:scale(1)!important;
  transition:transform var(--auto-connect-arrival-duration,360ms) cubic-bezier(.16,.72,.18,1),filter var(--auto-connect-arrival-duration,360ms) ease!important;
  filter:none!important;
  will-change:transform,filter!important;
}
.viewer.auto-connect-arrival-phase>#htmlOverlay{
  transform:none!important;filter:none!important;transition:none!important;
}
.viewer.auto-connect-walk-active::after{
  content:'';position:absolute;inset:0;z-index:50000;pointer-events:none;
  background:radial-gradient(ellipse at var(--auto-connect-origin-x,50%) var(--auto-connect-origin-y,62%),transparent 0 50%,rgba(2,9,15,.03) 78%,rgba(2,9,15,.09) 100%)!important;
  opacity:.20!important;transition:opacity 160ms ease!important;
}
.viewer.auto-connect-travel-swap::after{opacity:.28!important}

/* Recupera el efecto visual del click sobre el propio plano del hotspot. */
.projective-image.auto-connect-image-hotspot.auto-connect-click-active{
  filter:drop-shadow(0 0 16px rgba(255,255,255,.66)) drop-shadow(0 6px 12px rgba(0,0,0,.25)) brightness(1.16)!important;
}
.projective-image.auto-connect-click-wave{
  pointer-events:none!important;
  opacity:.92;
  scale:.20;
  transform-origin:center!important;
  animation:v360AutoConnectClickWaveR94 .66s cubic-bezier(.12,.68,.24,1) forwards!important;
  filter:brightness(1.22) drop-shadow(0 0 14px rgba(255,255,255,.62))!important;
}
@keyframes v360AutoConnectClickWaveR94{
  0%{scale:.18;opacity:.94;filter:brightness(1.30) drop-shadow(0 0 10px rgba(255,255,255,.68))}
  62%{opacity:.62}
  100%{scale:1.18;opacity:0;filter:brightness(1.04) drop-shadow(0 0 2px rgba(255,255,255,0))}
}

/* ========================================================================
   R95 · TRANSICIÓN AUTOCONNECT ESTABLE + INDICADORES DE PROPIEDADES
   ======================================================================== */
/* Durante el recorrido no se transforma el motor 360 ni sus overlays. El frame
   capturado se anima por encima del panorama y por debajo del efecto del hotspot. */
.auto-connect-transition-frame{display:block;backface-visibility:hidden;image-rendering:auto}
.viewer.auto-connect-captured-travel>#glCanvas,
.viewer.auto-connect-captured-travel>#overlay,
.viewer.auto-connect-captured-travel>#htmlOverlay{
  transform:none!important;filter:none!important;transition:none!important;
}
/* Oculta los hotspots normales mientras el frame de origen recorre el espacio;
   la onda del hotspot pulsado permanece visible y fija sobre su posición. */
.viewer.auto-connect-transition-hide-hotspots #htmlOverlay>.projective-object:not(.auto-connect-click-wave){opacity:0!important;pointer-events:none!important}
.viewer.auto-connect-transition-hide-hotspots #htmlOverlay>.auto-connect-click-wave{opacity:1!important}
.viewer.auto-connect-captured-travel::after{
  content:'';position:absolute;inset:0;z-index:46;pointer-events:none;
  background:radial-gradient(ellipse at center,transparent 0 72%,rgba(2,8,14,.035) 100%);
}
/* El símbolo de apertura/cierre debe ser literal, no una rotación de '+' que puede
   terminar pareciendo una X o una barra inclinada. */
details.property-fold>summary span:not(.badge){transform:none!important}

/* ========================================================================
   R99 · AUTOCONNECT — RECORRIDO CONTINUO SIN ESTELAS
   ======================================================================== */
/* Los hotspots reales quedan ocultos desde antes del primer frame. El efecto del
   click se dibuja en una capa separada, por lo que nunca hereda movimientos de la esfera. */
.viewer.auto-connect-transition-hide-hotspots #htmlOverlay{visibility:hidden!important;pointer-events:none!important}
.auto-connect-click-wave-layer{position:absolute;pointer-events:none!important;overflow:visible!important;will-change:transform;backface-visibility:hidden}
.auto-connect-click-wave-image{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none!important;transform-origin:center;animation:v360AutoConnectClickWaveR97 .72s cubic-bezier(.12,.68,.24,1) forwards;filter:brightness(1.20) drop-shadow(0 0 12px rgba(255,255,255,.48))}
@keyframes v360AutoConnectClickWaveR97{
  0%{transform:scale(.18);opacity:.95}
  64%{opacity:.60}
  100%{transform:scale(1.18);opacity:0}
}
/* Los indicadores de Propiedades son texto literal +/−. */
details.property-fold>summary span:not(.badge){transform:none!important}

/* ========================================================================== */
/* R102 · Identidad visual Vista360Cloud — ventanas, acciones y bibliotecas */
/* ========================================================================== */

/* Compatibilidad: el dato interno puede seguir existiendo, pero el control ya no forma
   parte de la interfaz del editor. */
label:has(#panoramaIncludeCarousel),
label:has(#actionVideoIncludeCarousel),
label:has(input[id*="IncludeCarousel"]),
label[data-vista360-hidden-carousel="1"]{display:none!important}

/* Lenguaje visual común para flujos de acciones y bibliotecas. */
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal) {
  background:radial-gradient(circle at 50% 12%,rgba(20,74,116,.20),rgba(3,9,15,.78) 42%,rgba(2,6,11,.92) 100%)!important;
  backdrop-filter:blur(12px) saturate(.9);
}
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal) .modal-window{
  background:linear-gradient(180deg,#0d1a27 0%,#09131e 100%)!important;
  border:1px solid rgba(96,158,211,.20)!important;
  border-radius:20px!important;
  box-shadow:0 34px 90px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.025)!important;
  overflow:hidden;
}
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal) .modal-titlebar{
  min-height:70px!important;height:auto!important;padding:14px 18px 13px 22px!important;
  background:linear-gradient(90deg,#101f2e,#0b1723)!important;
  border:0!important;border-bottom:1px solid rgba(82,145,198,.15)!important;
  box-shadow:inset 0 -1px 0 rgba(0,0,0,.24)!important;
}
.vista-modal-heading{display:flex;min-width:0;flex-direction:column;justify-content:center;gap:3px}
.vista-modal-kicker{font-size:10px!important;line-height:1.1!important;font-weight:800!important;letter-spacing:.16em!important;color:#58c9ff!important;text-transform:uppercase}
.vista-modal-title{font-size:18px!important;line-height:1.2!important;font-weight:750!important;color:#f3f8fc!important;letter-spacing:0!important}
.vista-modal-close,
:is(#actionLibraryModal,#actionConfigModal,#imageLibraryModal,#mediaLibraryManagerModal) .modal-titlebar>button{
  width:40px!important;height:40px!important;display:grid!important;place-items:center!important;
  border-radius:12px!important;border:1px solid rgba(128,172,209,.14)!important;
  background:rgba(255,255,255,.035)!important;color:#aebfd0!important;font-size:23px!important;line-height:1!important;
  transition:background .14s ease,border-color .14s ease,color .14s ease,transform .14s ease;
}
.vista-modal-close:hover,
:is(#actionLibraryModal,#actionConfigModal,#imageLibraryModal,#mediaLibraryManagerModal) .modal-titlebar>button:hover{
  background:rgba(56,171,232,.10)!important;border-color:rgba(73,188,242,.30)!important;color:#fff!important;transform:translateY(-1px)
}
:is(#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#albumEditorModal,#albumImagePickerModal,#mediaLibraryManagerModal) .modal-footer{
  min-height:66px;padding:12px 18px!important;background:#08121c!important;border-top:1px solid rgba(99,148,188,.13)!important
}
:is(#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#albumEditorModal,#albumImagePickerModal,#mediaLibraryManagerModal) .btn{
  border-radius:11px!important;min-height:40px;border-color:#31495d;background:#122231;color:#dceaf4
}
:is(#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#albumEditorModal,#albumImagePickerModal,#mediaLibraryManagerModal) .btn:hover{background:#182d3e;border-color:#46657e}
:is(#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#albumEditorModal,#albumImagePickerModal,#mediaLibraryManagerModal) .btn.primary{
  background:linear-gradient(135deg,#1fa8e2,#1680d7)!important;border-color:#27b6ee!important;color:#fff!important;box-shadow:0 8px 20px rgba(18,138,209,.15)
}

/* ------------------------------ Nueva acción ------------------------------ */
#actionLibraryModal .action-library-window.vista-action-hub{width:min(1060px,94vw)!important;max-height:min(820px,90vh)!important}
#actionLibraryModal .vista-action-intro{
  margin:18px 22px 4px;padding:15px 17px;display:flex;align-items:center;gap:13px;border:1px solid rgba(73,166,218,.14);
  border-radius:15px;background:linear-gradient(90deg,rgba(21,74,105,.18),rgba(15,34,50,.42));
}
#actionLibraryModal .vista-action-intro-icon{width:42px;height:42px;flex:none;display:grid;place-items:center;border-radius:13px;background:rgba(36,169,226,.12);border:1px solid rgba(57,190,241,.26);font-size:20px}
#actionLibraryModal .vista-action-intro div:last-child{display:flex;min-width:0;flex-direction:column;gap:3px}
#actionLibraryModal .vista-action-intro b{font-size:14px;color:#edf7fd}
#actionLibraryModal .vista-action-intro span{font-size:12px;line-height:1.45;color:#91aabe}
#actionLibraryModal .vista-action-grid{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:11px!important;
  padding:18px 22px 24px!important;overflow:auto!important;align-content:start!important;background:transparent!important;
}
#actionLibraryModal .action-choice{
  position:relative!important;min-height:112px!important;padding:15px!important;display:flex!important;align-items:flex-start!important;gap:13px!important;text-align:left!important;
  border:1px solid rgba(92,139,179,.16)!important;border-radius:15px!important;background:linear-gradient(160deg,rgba(21,38,54,.92),rgba(11,24,36,.96))!important;
  box-shadow:none!important;color:#e8f2fa!important;transform:none!important;transition:border-color .14s ease,background .14s ease,transform .14s ease,box-shadow .14s ease!important;
}
#actionLibraryModal .action-choice::after{content:'';position:absolute;left:14px;right:14px;bottom:0;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,#25b9ef,transparent);opacity:0;transition:opacity .14s ease}
#actionLibraryModal .action-choice:hover{border-color:rgba(63,187,239,.43)!important;background:linear-gradient(160deg,rgba(25,50,69,.98),rgba(12,29,43,.98))!important;transform:translateY(-2px)!important;box-shadow:0 12px 24px rgba(0,0,0,.15)!important}
#actionLibraryModal .action-choice:hover::after{opacity:.65}
#actionLibraryModal .action-choice:focus-visible{outline:2px solid #37c2f5!important;outline-offset:2px}
#actionLibraryModal .action-choice.action-choice-disabled,#actionLibraryModal .action-choice:disabled{opacity:.38!important;filter:saturate(.4);transform:none!important}
#actionLibraryModal .action-card-icon{
  width:44px!important;height:44px!important;flex:0 0 44px!important;display:grid!important;place-items:center!important;margin:0!important;border-radius:13px!important;
  background:linear-gradient(145deg,rgba(41,173,230,.20),rgba(30,94,154,.12))!important;border:1px solid rgba(65,188,238,.26)!important;color:#75d7ff!important;
  font-size:16px!important;line-height:1!important;font-weight:800!important;font-family:Segoe UI,Arial,sans-serif!important
}
#actionLibraryModal .action-card-icon.pdf{font-size:12px!important;letter-spacing:.04em}
#actionLibraryModal .action-card-icon.code{font-size:14px!important}
#actionLibraryModal .action-card-copy{display:flex!important;min-width:0!important;flex:1!important;flex-direction:column!important;gap:5px!important;padding-top:2px!important}
#actionLibraryModal .action-card-copy strong{font-size:13px!important;line-height:1.2!important;color:#f0f7fc!important;font-weight:750!important}
#actionLibraryModal .action-card-copy small{font-size:11px!important;line-height:1.4!important;color:#829bae!important;font-weight:400!important}
#actionLibraryModal .action-choice[data-action-kind="javascript"] .action-card-icon{color:#8ce0b0!important;border-color:rgba(71,199,126,.28)!important;background:rgba(37,142,83,.12)!important}
#actionLibraryModal .action-choice[data-action-kind="navigate"] .action-card-icon{color:#75d7ff!important}
#actionLibraryModal .action-choice[data-action-kind="showHideComponents"] .action-card-icon,
#actionLibraryModal .action-choice[data-action-kind="showHideHotspots"] .action-card-icon{color:#ffca6b!important;border-color:rgba(255,189,77,.25)!important;background:rgba(164,104,26,.10)!important}

/* -------------------------- Configuración de acción ----------------------- */
#actionConfigModal .action-config-window{width:min(1080px,94vw)!important;max-height:min(860px,92vh)!important}
#actionConfigModal .action-config-layout{background:#0a1520!important;gap:0!important}
#actionConfigModal .action-config-left{background:#0c1925!important;border-right:1px solid rgba(92,144,186,.13)!important;padding:18px!important}
#actionConfigModal .action-config-right{background:#09131e!important;padding:18px!important}
#actionConfigModal .field label,#actionConfigModal .delay-row,#actionConfigModal .small-note{color:#9fb4c5!important}
#actionConfigModal input:not([type=checkbox]):not([type=radio]),#actionConfigModal select,#actionConfigModal textarea{
  background:#071019!important;border:1px solid #30495d!important;border-radius:10px!important;color:#eaf4fa!important;min-height:39px!important
}
#actionConfigModal input:focus,#actionConfigModal select:focus,#actionConfigModal textarea:focus{border-color:#29b8ed!important;box-shadow:0 0 0 2px rgba(41,184,237,.10)!important;outline:none!important}
#actionConfigModal .target-row,#actionConfigModal .action-target-row{border-radius:10px!important;background:rgba(255,255,255,.018)!important;border-color:rgba(100,150,188,.12)!important}

/* ----------------------- Biblioteca visual VISTA360 ----------------------- */
#imageLibraryModal .image-library-window{width:min(1180px,95vw)!important;height:min(790px,90vh)!important;max-height:90vh!important}
#imageLibraryModal .library-main{background:#08131d!important;grid-template-columns:220px minmax(0,1fr)!important;min-height:0}
#imageLibraryModal .image-library-sidebar{background:linear-gradient(180deg,#0c1b28,#09151f)!important;border-right:1px solid rgba(93,146,189,.13)!important;padding:13px!important}
#imageLibraryModal .library-toolbar-vertical{display:grid!important;grid-template-columns:repeat(5,1fr)!important;gap:6px!important;padding:0 0 13px!important;border-bottom:1px solid rgba(92,143,184,.12)!important}
#imageLibraryModal .library-top-icon{width:auto!important;height:42px!important;display:grid!important;place-items:center!important;border-radius:10px!important;background:#102231!important;border:1px solid #263f52!important;color:#8ccfe9!important;cursor:pointer!important}
#imageLibraryModal .library-top-icon:hover{background:#153044!important;border-color:#2e7194!important;color:#fff!important}
#imageLibraryModal .library-scroll-filters{padding:12px 0 0!important}
#imageLibraryModal .library-side-special{border-radius:9px!important;background:transparent!important;border:1px solid transparent!important;color:#a7b9c8!important;text-align:left!important;padding:9px 10px!important}
#imageLibraryModal .library-side-special:hover,#imageLibraryModal .library-side-special.active{background:rgba(43,153,204,.10)!important;border-color:rgba(50,173,225,.17)!important;color:#e9f7ff!important}
#imageLibraryModal .library-section-title{margin:17px 8px 7px!important;color:#597b94!important;font-size:9px!important;font-weight:800!important;letter-spacing:.14em!important;text-transform:uppercase!important}
#imageLibraryModal .library-filter-list button{border-radius:8px!important;color:#aebdcc!important;padding:7px 10px!important}
#imageLibraryModal .library-filter-list button:hover,#imageLibraryModal .library-filter-list button.active{background:#122a3b!important;color:#fff!important}
#imageLibraryModal .image-library-content{background:radial-gradient(circle at 50% 0,rgba(28,74,103,.12),transparent 36%),#07111a!important;padding:18px!important}
#imageLibraryModal .library-grid{gap:12px!important}
#imageLibraryModal .library-item,#imageLibraryModal .library-card{
  background:linear-gradient(180deg,#10202d,#0b1721)!important;border:1px solid rgba(94,141,179,.13)!important;border-radius:13px!important;overflow:hidden!important;box-shadow:none!important
}
#imageLibraryModal .library-item:hover,#imageLibraryModal .library-card:hover{border-color:rgba(52,185,236,.42)!important;box-shadow:0 10px 24px rgba(0,0,0,.15)!important}
#imageLibraryModal .library-item.selected,#imageLibraryModal .library-card.selected{border-color:#2dbcf0!important;box-shadow:0 0 0 2px rgba(45,188,240,.12)!important}
#imageLibraryModal .image-library-footer{min-height:66px!important;padding:11px 16px!important;background:#08121c!important;border-top:1px solid rgba(91,144,185,.13)!important}
#imageLibraryModal .library-search{height:40px!important;width:min(360px,42vw)!important;border-radius:11px!important;background:#061019!important;border:1px solid #30495b!important;color:#e5f0f7!important;padding:0 13px!important}
#imageLibraryModal .library-search:focus{outline:none!important;border-color:#2bb8ed!important;box-shadow:0 0 0 2px rgba(43,184,237,.10)!important}

/* ---------------------------- Recursos proyecto --------------------------- */
#mediaLibraryManagerModal .media-library-manager-window{width:min(1140px,95vw)!important;height:min(790px,90vh)!important}
#mediaLibraryManagerModal .media-library-toolbar{padding:12px 16px!important;background:#0b1925!important;border-bottom:1px solid rgba(90,142,183,.13)!important;gap:7px!important}
#mediaLibraryManagerModal .media-library-toolbar .btn{min-height:34px!important;padding:0 11px!important;font-size:10px!important;letter-spacing:.04em!important;background:#102231!important}
#mediaLibraryManagerModal .media-library-toolbar .btn.active{background:linear-gradient(135deg,#1c9ed8,#1979c8)!important;border-color:#30b9ec!important;color:#fff!important}
#mediaLibraryManagerModal .media-library-toolbar .search-input{height:36px!important;border-radius:10px!important;background:#07111a!important;border:1px solid #31495c!important;color:#e8f2f8!important}
#mediaLibraryManagerModal .media-library-content{background:#07111a!important;padding:18px!important}
#mediaLibraryManagerModal .media-library-grid{gap:12px!important}
#mediaLibraryManagerModal .media-library-card{border-radius:13px!important;background:linear-gradient(180deg,#10202c,#0b1721)!important;border:1px solid rgba(92,142,180,.13)!important;overflow:hidden!important}
#mediaLibraryManagerModal .media-library-card:hover{border-color:rgba(48,184,236,.38)!important;transform:translateY(-1px)}
#mediaLibraryManagerModal .media-library-thumb{background:#050d14!important;border-bottom:1px solid rgba(85,132,169,.12)!important}
#mediaLibraryManagerModal .media-library-card-name{font-size:11px!important;color:#e2edf4!important}
#mediaLibraryManagerModal .media-library-card-type{font-size:9px!important;color:#66849a!important;text-transform:uppercase!important;letter-spacing:.08em!important}

/* Selectores auxiliares del flujo de acciones. */
#actionMediaPickerModal .action-media-picker-window,#actionChainPickerModal .action-chain-window{width:min(760px,92vw)!important}
#actionMediaPickerModal .action-media-picker-grid{background:#08131d!important;padding:16px!important;gap:10px!important}
#actionMediaPickerModal .action-media-picker-item{border-radius:12px!important;background:#10202d!important;border:1px solid rgba(92,142,181,.15)!important}
#actionMediaPickerModal .action-media-picker-item:hover{border-color:#2caddf!important;background:#132838!important}

@media(max-width:900px){
  #actionLibraryModal .vista-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #imageLibraryModal .library-main{grid-template-columns:180px minmax(0,1fr)!important}
}
@media(max-width:620px){
  #actionLibraryModal .vista-action-grid{grid-template-columns:1fr!important;padding:14px!important}
  #actionLibraryModal .vista-action-intro{margin:14px 14px 2px}
  #imageLibraryModal .library-main{grid-template-columns:1fr!important}
  #imageLibraryModal .image-library-sidebar{display:none!important}
}

/* ========================================================================
   R103 · ACTION CONFIG LAYOUT FIX + VISTA360 GLASS CATALOG
   ======================================================================== */
/* La nueva cabecera visual tiene más alto que la fila heredada de 46px.
   Reservar su alto real evita que el primer label/control quede debajo del título. */
#actionConfigModal .action-config-window{
  grid-template-rows:auto minmax(0,1fr) 58px!important;
}
#actionConfigModal .vista-modal-titlebar{
  position:relative!important;
  z-index:25!important;
  min-height:78px!important;
  flex:none!important;
}
#actionConfigModal .action-config-layout{
  position:relative!important;
  z-index:1!important;
  min-height:0!important;
  overflow:hidden!important;
}
#actionConfigModal .action-config-left,
#actionConfigModal .action-config-right{
  padding-top:22px!important;
  scroll-padding-top:22px!important;
}
#actionConfigModal .action-config-left>.field:first-child,
#actionConfigModal .action-config-left>#panoramaTriggerWrap:not(.hidden):first-child,
#actionConfigModal .action-config-right>.action-reference-panel:first-child{
  margin-top:0!important;
}

/* Catálogo reinterpretado: los recursos heredados usan una identidad gráfica
   VISTA360 propia. Los dos componentes originales de VISTA360 conservan su PNG. */
#imageLibraryModal .library-card.vista360-glass-catalog{
  background:linear-gradient(155deg,rgba(17,40,57,.98),rgba(7,20,30,.99))!important;
  border-color:rgba(64,145,189,.20)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018)!important;
}
#imageLibraryModal .library-card.vista360-glass-catalog:hover{
  border-color:rgba(49,195,246,.58)!important;
  background:linear-gradient(155deg,rgba(19,52,73,.99),rgba(8,25,37,.99))!important;
  box-shadow:0 14px 30px rgba(0,0,0,.20),0 0 0 1px rgba(40,181,235,.08)!important;
}
#imageLibraryModal .library-card.vista360-glass-catalog .library-card-thumb{
  background:radial-gradient(circle at 50% 43%,rgba(42,166,221,.09),transparent 62%)!important;
}
#imageLibraryModal .library-card.vista360-glass-catalog .library-card-thumb img{
  width:92%!important;height:92%!important;max-width:118px!important;max-height:104px!important;
  filter:drop-shadow(0 5px 10px rgba(0,0,0,.26))!important;
}
#imageLibraryModal .library-card.vista360-glass-catalog .library-fav{
  background:rgba(4,14,22,.82)!important;border:1px solid rgba(100,151,185,.15)!important;
}
#imageLibraryModal .library-card.vista360-glass-catalog .library-animated-badge{
  background:linear-gradient(135deg,#19a9e5,#1479c8)!important;
  border:1px solid rgba(111,219,255,.22)!important;
  color:#fff!important;letter-spacing:.04em!important;
}
/* Creaciones propias: no se altera la imagen ni su tratamiento interno. */
#imageLibraryModal .library-card.vista360-original-control .library-card-thumb img{
  filter:drop-shadow(0 2px 1px rgba(0,0,0,.55))!important;
}


/* ========================================================================
   R106 · IDENTIDAD ÚNICA OSCURA — PALETA VISUAL R101
   Tema claro eliminado. Conserva catálogo nativo depurado de R104.
   ======================================================================== */
:root{
  --bg:#101216;
  --panel:#181b21;
  --panel2:#20242c;
  --line:#303641;
  --text:#f0f2f5;
  --muted:#9ba4b2;
  --accent:#e59d22;
  --danger:#d84e4e;
  color-scheme:dark;
}

/* Barra superior: Agregar panorama / imagen y Publicar comparten exactamente
   el mismo tratamiento de botón primario. */
.toolbar>label.btn.primary,
#publishTourBtn.btn.primary{
  background:var(--accent)!important;
  border-color:var(--accent)!important;
  color:#141414!important;
  font-weight:700!important;
  box-shadow:none!important;
}
.toolbar>label.btn.primary:hover,
#publishTourBtn.btn.primary:hover{
  background:#f0aa2f!important;
  border-color:#f0aa2f!important;
  color:#141414!important;
}

/* Superficies base como R101. */
body,#app,.workspace{background:#101216;color:#f0f2f5}
.topbar{background:#15181e!important;border-color:#303641!important;box-shadow:none!important}
.left-panel,.right-panel{background:#181b21!important;border-color:#303641!important}
.panel-title{background:#181b21!important;color:#c7cdd7!important;border-color:#303641!important}
.section-header{background:#1b1f26!important;color:#d6dbe3!important;border-color:#303641!important}
.viewer-toolbar{background:#14171c!important;border-color:#303641!important}
.bottom-status{background:#12151a!important;border-color:#303641!important;color:#8d97a5!important}
.properties{background:#181b21!important;color:#f0f2f5!important}

/* Propiedades y paneles internos. */
.property-group,.property-card,.inspector-section,.skin-property-section,
.skin-responsive-layout-box,.showhide-target-panel,.action-reference-panel,
.pilot-waypoint-panel,.pilot-waypoint-properties,.flat-panorama-layout,
.toggle-grid label,.snap-settings{
  background:#181b21!important;
  color:#d5dbe4!important;
  border-color:#343b47!important;
}
details.property-fold>summary,.panorama-properties .property-fold>summary,
.classic-section-title,.property-group-header,.inspector-section-title{
  background:#20242c!important;
  color:#dce1e7!important;
  border-color:#343b47!important;
}
details.property-fold>.property-fold-body,.panorama-properties .property-fold-body,
.classic-section-body{background:#181b21!important;color:#dce1e7!important;border-color:#343b47!important}
.field label,.group-title,.small-note,.hint,.muted{color:#aab3bf!important}
input:not([type=checkbox]):not([type=radio]),select,textarea,
.field input,.field select,.search-input{
  background:#11141a!important;
  color:#f0f2f5!important;
  border-color:#39404c!important;
}
input:focus,select:focus,textarea:focus{
  border-color:#1d9ed6!important;
  box-shadow:0 0 0 1px rgba(29,158,214,.22)!important;
  outline:none!important;
}

/* Modales globales: recuperar paleta R101 sin alterar layouts nuevos. */
.studio-modal,.modal-overlay{
  background:rgba(0,0,0,.62)!important;
  backdrop-filter:none!important;
}
.modal-window,.vista-modal-window,.studio-dialog-window{
  background:#1f232a!important;
  color:#d1d7df!important;
  border-color:#414852!important;
  box-shadow:0 20px 70px rgba(0,0,0,.72)!important;
}
.modal-titlebar,.vista-modal-titlebar{
  background:#1f232a!important;
  color:#e5e9ee!important;
  border-color:#1d9ed6!important;
  box-shadow:none!important;
}
.vista-modal-kicker{color:#58c9ff!important}
.vista-modal-title{color:#f0f2f5!important}
.vista-modal-close,.modal-titlebar>button,.vista-modal-titlebar>button{
  background:transparent!important;
  color:#aeb7c4!important;
  border-color:#414852!important;
  box-shadow:none!important;
}
.vista-modal-close:hover,.modal-titlebar>button:hover,.vista-modal-titlebar>button:hover{
  background:#2a3038!important;
  color:#fff!important;
  border-color:#525b68!important;
}
.modal-footer{
  background:#191d23!important;
  border-color:#343b44!important;
}
.studio-modal .btn:not(.primary):not(.danger){
  background:#262b34!important;
  color:#f0f2f5!important;
  border-color:#3c4350!important;
}
.studio-modal .btn:not(.primary):not(.danger):hover{background:#303641!important;border-color:#4b5360!important}
.studio-modal .btn.primary{background:#e59d22!important;border-color:#e59d22!important;color:#141414!important;box-shadow:none!important}
.studio-modal .btn.primary:hover{background:#f0aa2f!important;border-color:#f0aa2f!important}

/* Nueva acción: conserva la nueva organización, pero con tonos R101 neutros. */
#actionLibraryModal .vista-action-intro{
  background:#20242c!important;
  border-color:#343b47!important;
}
#actionLibraryModal .vista-action-intro-icon{
  background:#262b34!important;
  border-color:#414852!important;
  color:#58c9ff!important;
}
#actionLibraryModal .vista-action-intro b{color:#f0f2f5!important}
#actionLibraryModal .vista-action-intro span{color:#9ba4b2!important}
#actionLibraryModal .vista-action-grid{background:#1f232a!important}
#actionLibraryModal .action-choice,
#actionLibraryModal .vista-action-card{
  background:#262b32!important;
  border-color:#343b47!important;
  color:#d8dde4!important;
  box-shadow:none!important;
}
#actionLibraryModal .action-choice:hover,
#actionLibraryModal .vista-action-card:hover{
  background:#2d333c!important;
  border-color:#1d9ed6!important;
  box-shadow:none!important;
}
#actionLibraryModal .action-choice::after{background:#1d9ed6!important}
#actionLibraryModal .action-card-icon{
  background:#20252c!important;
  border-color:#414852!important;
  color:#75d7ff!important;
}
#actionLibraryModal .action-card-copy strong{color:#f0f2f5!important}
#actionLibraryModal .action-card-copy small{color:#9ba4b2!important}
#actionLibraryModal .action-choice[data-action-kind="showHideComponents"] .action-card-icon,
#actionLibraryModal .action-choice[data-action-kind="showHideHotspots"] .action-card-icon{
  background:#2c2518!important;border-color:#7a5a1f!important;color:#f0b448!important
}

/* Configuradores de acción. */
#actionConfigModal .action-config-layout{background:#1f232a!important}
#actionConfigModal .action-config-left{background:#20242c!important;border-color:#3d444e!important}
#actionConfigModal .action-config-right{background:#1f232a!important}
#actionConfigModal .field label,#actionConfigModal .delay-row,#actionConfigModal .small-note{color:#aab3bf!important}
#actionConfigModal input:not([type=checkbox]):not([type=radio]),
#actionConfigModal select,#actionConfigModal textarea{
  background:#11151a!important;border-color:#39404c!important;color:#f0f2f5!important
}
#actionConfigModal .target-row,#actionConfigModal .action-target-row,
#actionConfigModal .action-reference-panel,#actionConfigModal .showhide-target-panel,
#actionConfigModal .classic-action-checks{
  background:#20242c!important;border-color:#343b47!important;color:#d7dde4!important
}
#actionConfigModal .action-ref-preview,#actionConfigModal .target-media-preview{
  background:#15181e!important;border-color:#343b47!important;color:#8f99a7!important
}

/* Biblioteca VISTA360: catálogo nativo transparente, sin tinte azul. */
#imageLibraryModal .image-library-window{background:#1f232a!important}
#imageLibraryModal .library-main{background:#181b21!important}
#imageLibraryModal .image-library-sidebar{background:#1b1f26!important;border-color:#303641!important}
#imageLibraryModal .image-library-content{background:#15181e!important}
#imageLibraryModal .image-library-footer{background:#1b1f26!important;border-color:#303641!important}
#imageLibraryModal .library-top-icon{
  background:#262b34!important;border-color:#3c4350!important;color:#d4dae2!important
}
#imageLibraryModal .library-top-icon:hover{background:#303641!important;border-color:#59616d!important;color:#fff!important}
#imageLibraryModal .library-side-special,#imageLibraryModal .library-filter-list button{color:#aeb7c4!important}
#imageLibraryModal .library-side-special:hover,#imageLibraryModal .library-side-special.active,
#imageLibraryModal .library-filter-list button:hover,#imageLibraryModal .library-filter-list button.active{
  background:#262b34!important;color:#fff!important;border-color:#3c4350!important
}
#imageLibraryModal .library-search{background:#11151a!important;color:#f0f2f5!important;border-color:#39404c!important}
#imageLibraryModal .library-card.vista360-native-catalog,
#imageLibraryModal .library-card.vista360-glass-catalog{
  background:#15191d!important;
  border:1px solid #353b41!important;
  border-radius:12px!important;
  box-shadow:none!important;
}
#imageLibraryModal .library-card.vista360-native-catalog:hover,
#imageLibraryModal .library-card.vista360-glass-catalog:hover{
  background:#1b2025!important;border-color:#676f76!important;box-shadow:0 10px 24px rgba(0,0,0,.18)!important
}
#imageLibraryModal .library-card.vista360-native-catalog.selected,
#imageLibraryModal .library-card.vista360-glass-catalog.selected{
  border-color:#e59d22!important;box-shadow:0 0 0 2px rgba(229,157,34,.16)!important
}
#imageLibraryModal .library-card.vista360-native-catalog .library-card-thumb,
#imageLibraryModal .library-card.vista360-glass-catalog .library-card-thumb{background:transparent!important}
#imageLibraryModal .library-card.vista360-native-catalog .library-card-thumb img,
#imageLibraryModal .library-card.vista360-glass-catalog .library-card-thumb img{
  width:88%!important;height:88%!important;max-width:116px!important;max-height:104px!important;object-fit:contain!important;filter:none!important
}
#imageLibraryModal .library-card.vista360-native-catalog .library-fav,
#imageLibraryModal .library-card.vista360-glass-catalog .library-fav{
  background:rgba(16,18,20,.84)!important;border:1px solid rgba(190,196,201,.14)!important;color:#c6c9cc!important
}
#imageLibraryModal .library-card.vista360-native-catalog .library-fav.active{color:#f2b24c!important}
#imageLibraryModal .library-card.vista360-native-catalog .library-animated-badge{
  background:#2a2f34!important;border:1px solid #4b535a!important;color:#eef0f2!important
}

/* Recursos multimedia y selectores auxiliares. */
#mediaLibraryManagerModal .media-library-toolbar,
#mediaLibraryManagerModal .media-library-content,
#actionMediaPickerModal .action-media-picker-grid,
#actionChainPickerModal .action-chain-content,
#actionPreviewModal .action-preview-body,
#albumEditorModal .album-editor-content,
#albumImagePickerModal .album-image-picker-content{
  background:#1b1f26!important;color:#d7dde4!important;border-color:#303641!important
}
#mediaLibraryManagerModal .media-library-card,
#actionMediaPickerModal .action-media-picker-item{
  background:#262b32!important;border-color:#343b47!important;color:#d7dde4!important
}
#mediaLibraryManagerModal .media-library-card:hover,
#actionMediaPickerModal .action-media-picker-item:hover{background:#2d333c!important;border-color:#1d9ed6!important}
#mediaLibraryManagerModal .media-library-thumb{background:#11151a!important;border-color:#343b47!important}
#mediaLibraryManagerModal .media-library-card-name{color:#e5e9ee!important}
#mediaLibraryManagerModal .media-library-card-type{color:#8f99a7!important}

/* El control Incluir en carrusel continúa oculto globalmente. */
label:has(#panoramaIncludeCarousel),
label:has(#actionVideoIncludeCarousel),
label:has(input[id*="IncludeCarousel"]),
label[data-vista360-hidden-carousel="1"]{display:none!important}

/* ========================================================================
   R107 · PALETA GLOBAL BASADA EN "CONECTAR PANORAMAS"
   Unifica modales, acciones, bibliotecas y selectores con el mismo lenguaje.
   ======================================================================== */
:root{
  --v107-modal-title:#20242c;
  --v107-modal-window:#111921;
  --v107-modal-body:#0e151c;
  --v107-modal-panel:#111c25;
  --v107-modal-panel-soft:#0d161e;
  --v107-modal-input:#111920;
  --v107-modal-line:#344653;
  --v107-modal-line-soft:#314150;
  --v107-modal-text:#edf5fa;
  --v107-modal-muted:#91a7b7;
  --v107-modal-muted2:#778b9b;
  --v107-modal-accent:#22b6ef;
  --v107-modal-accent-soft:#123c59;
  --v107-modal-primary:#f0a01a;
  --v107-modal-primary-hover:#ffae24;
}

/* Marco de todas las ventanas emergentes. */
.studio-modal,.modal-overlay{
  background:rgba(2,7,11,.74)!important;
  backdrop-filter:none!important;
}
.modal-window,.vista-modal-window,.studio-dialog-window,
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal) .modal-window{
  background:var(--v107-modal-window)!important;
  color:var(--v107-modal-text)!important;
  border:1px solid #3b4d5d!important;
  box-shadow:0 28px 90px rgba(0,0,0,.62)!important;
}
.modal-titlebar,.vista-modal-titlebar,
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal) .modal-titlebar{
  background:var(--v107-modal-title)!important;
  color:var(--v107-modal-text)!important;
  border:0!important;
  border-bottom:2px solid var(--v107-modal-accent)!important;
  box-shadow:none!important;
}
.vista-modal-kicker{color:#65cbff!important}
.vista-modal-title{color:#f2f7fb!important}
.vista-modal-close,.modal-titlebar>button,.vista-modal-titlebar>button{
  background:transparent!important;
  color:#b7c7d4!important;
  border:1px solid transparent!important;
  box-shadow:none!important;
}
.vista-modal-close:hover,.modal-titlebar>button:hover,.vista-modal-titlebar>button:hover{
  background:#2a3038!important;
  color:#fff!important;
  border-color:#46525e!important;
}
.modal-body,.vista-modal-body{
  background:var(--v107-modal-body)!important;
  color:var(--v107-modal-text)!important;
}
.modal-footer{
  background:#151c23!important;
  color:var(--v107-modal-text)!important;
  border-top:1px solid var(--v107-modal-line)!important;
}

/* Campos, selects y buscadores de cualquier modal. */
.studio-modal input:not([type=checkbox]):not([type=radio]):not([type=color]),
.studio-modal select,.studio-modal textarea,
.modal-window input:not([type=checkbox]):not([type=radio]):not([type=color]),
.modal-window select,.modal-window textarea,
.studio-dialog-window input:not([type=checkbox]):not([type=radio]):not([type=color]),
.studio-dialog-window select,.studio-dialog-window textarea{
  background:var(--v107-modal-input)!important;
  color:var(--v107-modal-text)!important;
  border-color:#425464!important;
  box-shadow:none!important;
}
.studio-modal input:focus,.studio-modal select:focus,.studio-modal textarea:focus,
.modal-window input:focus,.modal-window select:focus,.modal-window textarea:focus{
  border-color:#24b8f1!important;
  box-shadow:0 0 0 2px rgba(36,184,241,.12)!important;
  outline:none!important;
}
.studio-modal label,.modal-window label,.studio-dialog-window label{color:#c6d3dc}
.studio-modal .small-note,.studio-modal .hint,.studio-modal .muted,
.modal-window .small-note,.modal-window .hint,.modal-window .muted{color:var(--v107-modal-muted)!important}

/* Botones: secundarios y primarios con el mismo tratamiento de Conectar panoramas. */
.studio-modal .btn:not(.primary):not(.danger),
.modal-window .btn:not(.primary):not(.danger){
  background:#262b34!important;
  color:#f0f4f7!important;
  border-color:#3c4651!important;
  box-shadow:none!important;
}
.studio-modal .btn:not(.primary):not(.danger):hover,
.modal-window .btn:not(.primary):not(.danger):hover{
  background:#303742!important;
  border-color:#52606d!important;
}
.studio-modal .btn.primary,.modal-window .btn.primary{
  background:var(--v107-modal-primary)!important;
  border-color:var(--v107-modal-primary)!important;
  color:#111!important;
  box-shadow:none!important;
}
.studio-modal .btn.primary:hover,.modal-window .btn.primary:hover{
  background:var(--v107-modal-primary-hover)!important;
  border-color:var(--v107-modal-primary-hover)!important;
}

/* Nueva acción: misma estructura cromática que las tarjetas de Conectar panoramas. */
#actionLibraryModal .action-library-window.vista-action-hub{background:var(--v107-modal-window)!important}
#actionLibraryModal .vista-action-intro{
  background:linear-gradient(135deg,rgba(18,69,103,.32),rgba(15,31,45,.58))!important;
  border:1px solid rgba(73,133,177,.28)!important;
}
#actionLibraryModal .vista-action-intro-icon{
  background:#123c59!important;
  border:1px solid #266b94!important;
  color:#62c9ff!important;
}
#actionLibraryModal .vista-action-intro b{color:#f2f7fb!important}
#actionLibraryModal .vista-action-intro span{color:#aebdca!important}
#actionLibraryModal .vista-action-grid{background:var(--v107-modal-body)!important}
#actionLibraryModal .action-choice,
#actionLibraryModal .vista-action-card{
  background:var(--v107-modal-panel)!important;
  border:1px solid var(--v107-modal-line)!important;
  color:#dce6ed!important;
  box-shadow:none!important;
}
#actionLibraryModal .action-choice:hover,
#actionLibraryModal .vista-action-card:hover{
  background:#142532!important;
  border-color:#4b718d!important;
  box-shadow:none!important;
}
#actionLibraryModal .action-choice:focus-visible{outline:2px solid #24b8f1!important}
#actionLibraryModal .action-choice::after{background:#22b6ef!important}
#actionLibraryModal .action-card-icon{
  background:#0d1821!important;
  border:1px solid #344653!important;
  color:#62c9ff!important;
}
#actionLibraryModal .action-card-copy strong{color:#f2f7fb!important}
#actionLibraryModal .action-card-copy small{color:#91a7b7!important}
#actionLibraryModal .action-choice[data-action-kind="showHideComponents"] .action-card-icon,
#actionLibraryModal .action-choice[data-action-kind="showHideHotspots"] .action-card-icon{
  background:#211b10!important;border-color:#6d5428!important;color:#f0b448!important
}

/* Configurar acción. */
#actionConfigModal .action-config-layout{background:var(--v107-modal-body)!important}
#actionConfigModal .action-config-left{
  background:#0d161e!important;
  border-right:1px solid var(--v107-modal-line)!important;
}
#actionConfigModal .action-config-right{background:#101820!important}
#actionConfigModal .field label,#actionConfigModal .delay-row,#actionConfigModal .small-note{color:#aebdca!important}
#actionConfigModal input:not([type=checkbox]):not([type=radio]),
#actionConfigModal select,#actionConfigModal textarea{
  background:var(--v107-modal-input)!important;
  border-color:#425464!important;
  color:var(--v107-modal-text)!important;
}
#actionConfigModal .target-row,#actionConfigModal .action-target-row,
#actionConfigModal .action-reference-panel,#actionConfigModal .showhide-target-panel,
#actionConfigModal .classic-action-checks{
  background:var(--v107-modal-panel)!important;
  border-color:var(--v107-modal-line)!important;
  color:#dce6ed!important;
}
#actionConfigModal .action-ref-preview,#actionConfigModal .target-media-preview{
  background:#111!important;
  border-color:var(--v107-modal-line)!important;
  color:#8499aa!important;
}
#actionConfigModal .action-config-right .classic-section-title,
#actionConfigModal .action-reference-title{
  background:#101820!important;
  color:#dce9f1!important;
  border-color:var(--v107-modal-line)!important;
}

/* Biblioteca Vista360Cloud. */
#imageLibraryModal .image-library-window{background:var(--v107-modal-window)!important}
#imageLibraryModal .library-main{background:var(--v107-modal-body)!important}
#imageLibraryModal .image-library-sidebar{background:#101820!important;border-color:var(--v107-modal-line)!important}
#imageLibraryModal .image-library-content{background:#0b1218!important}
#imageLibraryModal .image-library-footer{background:#151c23!important;border-color:var(--v107-modal-line)!important}
#imageLibraryModal .library-top-icon{
  background:#111c25!important;border-color:#344653!important;color:#dce6ed!important
}
#imageLibraryModal .library-top-icon:hover{background:#142532!important;border-color:#4b718d!important;color:#fff!important}
#imageLibraryModal .library-side-special,#imageLibraryModal .library-filter-list button{color:#aebdca!important}
#imageLibraryModal .library-side-special:hover,#imageLibraryModal .library-side-special.active,
#imageLibraryModal .library-filter-list button:hover,#imageLibraryModal .library-filter-list button.active{
  background:#142532!important;color:#fff!important;border-color:#344653!important
}
#imageLibraryModal .library-search{background:#111920!important;color:#edf5fa!important;border-color:#425464!important}
#imageLibraryModal .library-card.vista360-native-catalog,
#imageLibraryModal .library-card.vista360-glass-catalog{
  background:#111c25!important;
  border:1px solid #344653!important;
  box-shadow:none!important;
}
#imageLibraryModal .library-card.vista360-native-catalog:hover,
#imageLibraryModal .library-card.vista360-glass-catalog:hover{
  background:#142532!important;border-color:#4b718d!important;box-shadow:none!important
}
#imageLibraryModal .library-card.vista360-native-catalog.selected,
#imageLibraryModal .library-card.vista360-glass-catalog.selected{
  background:linear-gradient(135deg,rgba(18,115,163,.25),rgba(16,42,59,.60))!important;
  border-color:#22b6ef!important;box-shadow:inset 0 0 0 1px rgba(53,192,244,.10)!important
}
#imageLibraryModal .library-card.vista360-native-catalog .library-card-thumb,
#imageLibraryModal .library-card.vista360-glass-catalog .library-card-thumb{background:transparent!important}
#imageLibraryModal .library-card.vista360-native-catalog .library-fav,
#imageLibraryModal .library-card.vista360-glass-catalog .library-fav{
  background:#0b1218!important;border-color:#314150!important;color:#c7d3dc!important
}
#imageLibraryModal .library-card.vista360-native-catalog .library-animated-badge{
  background:#123c59!important;border-color:#266b94!important;color:#eef8ff!important
}

/* Recursos multimedia, selectores de panorama/imagen/video/álbum y popups auxiliares. */
#mediaLibraryManagerModal .media-library-toolbar,
#mediaLibraryManagerModal .media-library-content,
#actionMediaPickerModal .action-media-picker-grid,
#actionChainPickerModal .action-chain-content,
#actionPreviewModal .action-preview-body,
#albumEditorModal .album-editor-content,
#albumImagePickerModal .album-image-picker-content,
.media-picker-grid,.panorama-picker-grid,.album-picker-grid,.selector-grid{
  background:var(--v107-modal-body)!important;
  color:#dce6ed!important;
  border-color:var(--v107-modal-line)!important;
}
#mediaLibraryManagerModal .media-library-card,
#actionMediaPickerModal .action-media-picker-item,
.media-picker-item,.panorama-picker-item,.album-picker-item,.selector-card{
  background:#111c25!important;
  border-color:#344653!important;
  color:#dce6ed!important;
}
#mediaLibraryManagerModal .media-library-card:hover,
#actionMediaPickerModal .action-media-picker-item:hover,
.media-picker-item:hover,.panorama-picker-item:hover,.album-picker-item:hover,.selector-card:hover{
  background:#142532!important;border-color:#4b718d!important
}
#mediaLibraryManagerModal .media-library-thumb,.selector-thumb{background:#0b1218!important;border-color:#314150!important}
#mediaLibraryManagerModal .media-library-card-name{color:#eef8ff!important}
#mediaLibraryManagerModal .media-library-card-type{color:#8499aa!important}

/* Paneles internos genéricos de los modales: misma paleta que AutoConnect. */
.studio-modal .property-card,.studio-modal .property-group,.studio-modal .inspector-section,
.studio-modal .showhide-target-panel,.studio-modal .action-reference-panel,
.modal-window .property-card,.modal-window .property-group,.modal-window .inspector-section,
.modal-window .showhide-target-panel,.modal-window .action-reference-panel{
  background:#111c25!important;
  border-color:#344653!important;
  color:#dce6ed!important;
}
.studio-modal .section-header,.modal-window .section-header,
.studio-modal .classic-section-title,.modal-window .classic-section-title{
  background:#101820!important;
  border-color:#344653!important;
  color:#eef8ff!important;
}

/* Mantener oculto Incluir en carrusel. */
label:has(#panoramaIncludeCarousel),
label:has(#actionVideoIncludeCarousel),
label:has(input[id*="IncludeCarousel"]),
label[data-vista360-hidden-carousel="1"]{display:none!important}

/* R107 · Neutraliza reglas R102 de mayor especificidad para que toda la familia
   de ventanas use exactamente la misma paleta de Conectar panoramas. */
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal){
  background:rgba(2,7,11,.74)!important;
  backdrop-filter:none!important;
}
:is(#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#albumEditorModal,#albumImagePickerModal,#mediaLibraryManagerModal) .modal-footer{
  background:#151c23!important;
  border-top:1px solid #344653!important;
}
:is(#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#albumEditorModal,#albumImagePickerModal,#mediaLibraryManagerModal) .btn:not(.primary):not(.danger){
  background:#262b34!important;border-color:#3c4651!important;color:#f0f4f7!important
}
:is(#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#albumEditorModal,#albumImagePickerModal,#mediaLibraryManagerModal) .btn:not(.primary):not(.danger):hover{
  background:#303742!important;border-color:#52606d!important
}
:is(#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#albumEditorModal,#albumImagePickerModal,#mediaLibraryManagerModal) .btn.primary{
  background:#f0a01a!important;border-color:#f0a01a!important;color:#111!important;box-shadow:none!important
}
:is(#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#albumEditorModal,#albumImagePickerModal,#mediaLibraryManagerModal) .btn.primary:hover{
  background:#ffae24!important;border-color:#ffae24!important
}

/* ========================================================================
   R108 · VISIBILIDAD DE OBJETOS + ICONOS CENTRADOS + PALETA PROPIEDADES
   Referencia cromática: panel Propiedades aprobado por el usuario.
   ======================================================================== */
:root{
  --v108-bg:#101018;
  --v108-surface:#181820;
  --v108-surface-2:#202028;
  --v108-surface-3:#202830;
  --v108-input:#101018;
  --v108-line:#303840;
  --v108-line-strong:#384048;
  --v108-text:#f0f2f5;
  --v108-muted:#a8b0b8;
  --v108-muted-2:#78808c;
  --v108-accent:#22a9e5;
  --v108-primary:#f0a01a;
  --v108-primary-hover:#ffad24;
}

/* Paleta general coherente con Propiedades. */
body,#app,.workspace{background:var(--v108-bg)!important;color:var(--v108-text)!important}
.topbar,.viewer-toolbar,.bottom-status{border-color:var(--v108-line)!important}
.left-panel,.right-panel,.properties{background:var(--v108-surface)!important;border-color:var(--v108-line)!important;color:var(--v108-text)!important}
.panel-title,.section-header,details.property-fold>summary,.panorama-properties .property-fold>summary,
.classic-section-title,.property-group-header,.inspector-section-title,.skin-property-section-title,
.property-section-title{background:var(--v108-surface-2)!important;color:var(--v108-text)!important;border-color:var(--v108-line)!important}
details.property-fold>.property-fold-body,.panorama-properties .property-fold-body,.classic-section-body,
.property-group,.property-card,.inspector-section,.skin-property-section,.skin-responsive-layout-box,
.showhide-target-panel,.action-reference-panel,.pilot-waypoint-panel,.pilot-waypoint-properties,
.flat-panorama-layout,.toggle-grid label,.snap-settings{background:var(--v108-surface)!important;color:#d8dde4!important;border-color:var(--v108-line)!important}
.field label,.group-title,.small-note,.hint,.muted{color:var(--v108-muted)!important}
input:not([type=checkbox]):not([type=radio]),select,textarea,.field input,.field select,.search-input{
  background:var(--v108-input)!important;color:var(--v108-text)!important;border-color:var(--v108-line-strong)!important
}
input:focus,select:focus,textarea:focus{border-color:var(--v108-accent)!important;box-shadow:0 0 0 1px rgba(34,169,229,.2)!important}

/* Ventanas: misma jerarquía de Propiedades, sin fondos azulados. */
.studio-modal,.modal-overlay,
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal){
  background:rgba(0,0,0,.66)!important;backdrop-filter:none!important
}
.modal-window,.vista-modal-window,.studio-dialog-window,
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal) .modal-window{
  background:var(--v108-surface)!important;color:var(--v108-text)!important;border:1px solid var(--v108-line-strong)!important;box-shadow:0 24px 72px rgba(0,0,0,.72)!important
}
.modal-titlebar,.vista-modal-titlebar,
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal) .modal-titlebar{
  background:var(--v108-surface-2)!important;color:var(--v108-text)!important;border:0!important;border-bottom:1px solid var(--v108-line)!important;box-shadow:none!important
}
.vista-modal-kicker{color:#58c9ff!important}.vista-modal-title{color:var(--v108-text)!important}
.vista-modal-close,.modal-titlebar>button,.vista-modal-titlebar>button{background:transparent!important;color:#b8c0c8!important;border:1px solid var(--v108-line)!important}
.vista-modal-close:hover,.modal-titlebar>button:hover,.vista-modal-titlebar>button:hover{background:#282830!important;color:#fff!important;border-color:#484850!important}
.modal-body,.vista-modal-body{background:var(--v108-surface)!important;color:var(--v108-text)!important}
.modal-footer{background:#14141c!important;color:var(--v108-text)!important;border-top:1px solid var(--v108-line)!important}

.studio-modal input:not([type=checkbox]):not([type=radio]):not([type=color]),
.studio-modal select,.studio-modal textarea,.modal-window input:not([type=checkbox]):not([type=radio]):not([type=color]),
.modal-window select,.modal-window textarea,.studio-dialog-window input:not([type=checkbox]):not([type=radio]):not([type=color]),
.studio-dialog-window select,.studio-dialog-window textarea{background:var(--v108-input)!important;color:var(--v108-text)!important;border-color:var(--v108-line-strong)!important}

/* Nueva acción: iconografía centrada, tarjeta neutra y texto alineado al centro. */
#actionLibraryModal .action-library-window.vista-action-hub{background:var(--v108-surface)!important}
#actionLibraryModal .vista-action-intro{background:var(--v108-surface-2)!important;border:1px solid var(--v108-line)!important}
#actionLibraryModal .vista-action-intro-icon{background:var(--v108-surface)!important;border:1px solid var(--v108-line-strong)!important;color:#58c9ff!important}
#actionLibraryModal .vista-action-intro b{color:var(--v108-text)!important}
#actionLibraryModal .vista-action-intro span{color:var(--v108-muted)!important}
#actionLibraryModal .vista-action-grid{background:var(--v108-surface)!important}
#actionLibraryModal .action-choice,#actionLibraryModal .vista-action-card{
  min-height:128px!important;padding:14px 16px 13px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:10px!important;text-align:center!important;
  background:var(--v108-surface-2)!important;border:1px solid var(--v108-line)!important;color:#dce1e7!important;box-shadow:none!important
}
#actionLibraryModal .action-choice:hover,#actionLibraryModal .vista-action-card:hover{background:#282830!important;border-color:#4b5965!important;transform:translateY(-1px)!important;box-shadow:none!important}
#actionLibraryModal .action-card-icon{
  width:48px!important;height:48px!important;flex:0 0 48px!important;display:grid!important;place-items:center!important;margin:0 auto!important;
  background:var(--v108-surface)!important;border:1px solid var(--v108-line-strong)!important;color:#58c9ff!important;border-radius:12px!important;
  text-align:center!important;line-height:1!important
}
#actionLibraryModal .action-card-copy{display:flex!important;min-width:0!important;width:100%!important;flex:none!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:4px!important;padding:0!important;text-align:center!important}
#actionLibraryModal .action-card-copy strong{color:var(--v108-text)!important;text-align:center!important}
#actionLibraryModal .action-card-copy small{color:var(--v108-muted)!important;text-align:center!important}
#actionLibraryModal .action-choice[data-action-kind="showHideComponents"] .action-card-icon,
#actionLibraryModal .action-choice[data-action-kind="showHideHotspots"] .action-card-icon{background:#282218!important;border-color:#6c5428!important;color:#f0b448!important}

/* Configuración de acciones y selectores. */
#actionConfigModal .action-config-layout{background:var(--v108-surface)!important}
#actionConfigModal .action-config-left{background:var(--v108-surface)!important;border-right:1px solid var(--v108-line)!important}
#actionConfigModal .action-config-right{background:var(--v108-surface)!important}
#actionConfigModal .target-row,#actionConfigModal .action-target-row,#actionConfigModal .action-reference-panel,
#actionConfigModal .showhide-target-panel,#actionConfigModal .classic-action-checks{background:var(--v108-surface-2)!important;border-color:var(--v108-line)!important;color:#dce1e7!important}
#actionConfigModal .action-ref-preview,#actionConfigModal .target-media-preview{background:#101010!important;border-color:var(--v108-line)!important;color:#858d97!important}
#actionConfigModal .action-config-right .classic-section-title,
#actionConfigModal .action-config-right .section-header{background:var(--v108-surface-2)!important;color:var(--v108-text)!important;border-color:var(--v108-line)!important}

#imageLibraryModal .library-main,#imageLibraryModal .library-grid,
#mediaLibraryManagerModal .media-library-main,#mediaLibraryManagerModal .media-library-grid,
#albumEditorModal .album-editor-content,#albumImagePickerModal .album-image-picker-content,
.media-picker-grid,.panorama-picker-grid,.album-picker-grid,.selector-grid{background:var(--v108-surface)!important;color:#dce1e7!important;border-color:var(--v108-line)!important}
#mediaLibraryManagerModal .media-library-card,#actionMediaPickerModal .action-media-picker-item,
.media-picker-item,.panorama-picker-item,.album-picker-item,.selector-card{background:var(--v108-surface-2)!important;border-color:var(--v108-line)!important;color:#dce1e7!important}
#mediaLibraryManagerModal .media-library-card:hover,#actionMediaPickerModal .action-media-picker-item:hover,
.media-picker-item:hover,.panorama-picker-item:hover,.album-picker-item:hover,.selector-card:hover{background:#282830!important;border-color:#4b5965!important}

/* Botones consistentes con la paleta aprobada. */
.studio-modal .btn:not(.primary):not(.danger),.modal-window .btn:not(.primary):not(.danger){background:#282830!important;color:#f0f2f5!important;border-color:#404048!important}
.studio-modal .btn:not(.primary):not(.danger):hover,.modal-window .btn:not(.primary):not(.danger):hover{background:#303038!important;border-color:#505058!important}
.studio-modal .btn.primary,.modal-window .btn.primary{background:var(--v108-primary)!important;border-color:var(--v108-primary)!important;color:#141414!important;box-shadow:none!important}
.studio-modal .btn.primary:hover,.modal-window .btn.primary:hover{background:var(--v108-primary-hover)!important;border-color:var(--v108-primary-hover)!important}

/* Mantener oculto Incluir en carrusel. */
label:has(#panoramaIncludeCarousel),label:has(#actionVideoIncludeCarousel),label:has(input[id*="IncludeCarousel"]),label[data-vista360-hidden-carousel="1"]{display:none!important}

/* ========================================================================
   R109 · PALETA ORIGINAL VISTA360 — REFERENCIA EXACTA R101
   Mantiene las estructuras y funciones nuevas, pero toda superficie visual
   vuelve a la identidad cromática original del proyecto.
   ======================================================================== */
:root{
  --bg:#101216!important;
  --panel:#181b21!important;
  --panel2:#20242c!important;
  --line:#303641!important;
  --text:#f0f2f5!important;
  --muted:#9ba4b2!important;
  --accent:#e59d22!important;
  --danger:#d84e4e!important;
  --v108-bg:#101216!important;
  --v108-surface:#181b21!important;
  --v108-surface-2:#20242c!important;
  --v108-surface-3:#242932!important;
  --v108-input:#11141a!important;
  --v108-line:#303641!important;
  --v108-line-strong:#39404c!important;
  --v108-text:#f0f2f5!important;
  --v108-muted:#9ba4b2!important;
  --v108-muted-2:#7f8996!important;
  --v108-accent:#1d9ed6!important;
  --v108-primary:#e59d22!important;
  --v108-primary-hover:#f4a62a!important;
  --v107-modal-bg:#1f232a!important;
  --v107-modal-body:#181b21!important;
  --v107-modal-surface:#20242c!important;
  --v107-modal-line:#303641!important;
}

html,body,#app,.workspace{background:#101216!important;color:#f0f2f5!important}
.topbar{background:#15181e!important;border-color:#303641!important}
.viewer-toolbar{background:#14171c!important;border-color:#303641!important}
.bottom-status{background:#12151a!important;border-color:#303641!important;color:#8d97a5!important}
.left-panel,.right-panel,.properties{background:#181b21!important;border-color:#303641!important;color:#f0f2f5!important}
.panel-title{background:#181b21!important;color:#c7cdd7!important;border-color:#303641!important}
.section-header{background:#1b1f26!important;color:#d6dbe3!important;border-color:#303641!important}
.tree-item:hover{background:#242932!important}.tree-item.selected{background:#343b47!important}

/* Propiedades originales R101. */
details.property-fold,.property-fold{background:#181c22!important;border-color:#343b46!important}
details.property-fold>summary,.property-fold>summary,
.panorama-properties .property-fold>summary,.classic-section-title,.property-group-header,
.inspector-section-title,.skin-property-section-title,.property-section-title{
  background:#20252d!important;color:#dce3ea!important;border-color:#303641!important
}
details.property-fold>.property-fold-body,.property-fold-body,
.panorama-properties .property-fold-body,.classic-section-body,.property-group,.property-card,
.inspector-section,.skin-property-section,.skin-responsive-layout-box,.showhide-target-panel,
.action-reference-panel,.pilot-waypoint-panel,.pilot-waypoint-properties,.flat-panorama-layout,
.toggle-grid label,.snap-settings{
  background:#181d24!important;color:#d5dbe4!important;border-color:#343b46!important
}
.field label,.group-title,.small-note,.hint,.muted{color:#9ba4b2!important}
input:not([type=checkbox]):not([type=radio]):not([type=color]),select,textarea,
.field input:not([type=color]),.field select,.search-input{
  background:#11141a!important;color:#f0f2f5!important;border-color:#39404c!important
}
input:focus,select:focus,textarea:focus{border-color:#1d9ed6!important;box-shadow:0 0 0 1px rgba(29,158,214,.18)!important}

/* Sistema de ventanas: colores originales R101. */
.studio-modal,.modal-overlay,
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal){
  background:#0009!important;backdrop-filter:none!important
}
.modal-window,.vista-modal-window,.studio-dialog-window,
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal) .modal-window{
  background:#1f232a!important;color:#d1d7df!important;border:1px solid #414852!important;
  box-shadow:0 20px 70px #000b!important
}
.modal-titlebar,.vista-modal-titlebar,
:is(#actionLibraryModal,#actionConfigModal,#actionMediaPickerModal,#actionChainPickerModal,#actionPreviewModal,#imageLibraryModal,#mediaLibraryManagerModal,#albumEditorModal,#albumImagePickerModal) .modal-titlebar{
  background:#1f232a!important;color:#f0f2f5!important;border:0!important;
  border-bottom:3px solid #1d9ed6!important;box-shadow:none!important
}
.vista-modal-kicker{color:#1d9ed6!important}.vista-modal-title{color:#f0f2f5!important}
.vista-modal-close,.modal-titlebar>button,.vista-modal-titlebar>button{
  background:transparent!important;color:#aeb7c4!important;border-color:transparent!important
}
.vista-modal-close:hover,.modal-titlebar>button:hover,.vista-modal-titlebar>button:hover{
  background:#2a3039!important;color:#fff!important;border-color:#414852!important
}
.modal-body,.vista-modal-body{background:#1f232a!important;color:#d1d7df!important}
.modal-footer{background:#1f232a!important;color:#d1d7df!important;border-top:1px solid #3d444e!important}

.studio-modal input:not([type=checkbox]):not([type=radio]):not([type=color]),
.studio-modal select,.studio-modal textarea,
.modal-window input:not([type=checkbox]):not([type=radio]):not([type=color]),
.modal-window select,.modal-window textarea,
.studio-dialog-window input:not([type=checkbox]):not([type=radio]):not([type=color]),
.studio-dialog-window select,.studio-dialog-window textarea{
  background:#11141a!important;color:#f0f2f5!important;border-color:#39404c!important
}

/* Nueva acción: mantiene el nuevo diseño pero con la identidad de R101. */
#actionLibraryModal .action-library-window.vista-action-hub{background:#1f232a!important}
#actionLibraryModal .vista-action-intro{background:#20242c!important;border-color:#343b46!important}
#actionLibraryModal .vista-action-intro-icon{background:#181b21!important;border-color:#39404c!important;color:#1d9ed6!important}
#actionLibraryModal .vista-action-intro b{color:#f0f2f5!important}
#actionLibraryModal .vista-action-intro span{color:#9ba4b2!important}
#actionLibraryModal .vista-action-grid{background:#1f232a!important}
#actionLibraryModal .action-choice,#actionLibraryModal .vista-action-card{
  background:#262b32!important;border-color:#343b46!important;color:#d1d7df!important;box-shadow:none!important
}
#actionLibraryModal .action-choice:hover,#actionLibraryModal .vista-action-card:hover{
  background:#303641!important;border-color:#1d9ed6!important;box-shadow:none!important
}
#actionLibraryModal .action-card-icon{
  background:#181b21!important;border-color:#39404c!important;color:#1d9ed6!important
}
#actionLibraryModal .action-card-copy strong{color:#f0f2f5!important}
#actionLibraryModal .action-card-copy small{color:#9ba4b2!important}
#actionLibraryModal .action-choice[data-action-kind="showHideComponents"] .action-card-icon,
#actionLibraryModal .action-choice[data-action-kind="showHideHotspots"] .action-card-icon{
  background:#2c2518!important;border-color:#7a5a1f!important;color:#f0b448!important
}

/* Configuradores de acciones: referencia cromática de R101. */
#actionConfigModal .action-config-layout{background:#29272e!important}
#actionConfigModal .action-config-left,#actionConfigModal .action-config-right{background:#29272e!important}
#actionConfigModal .action-config-left{border-right:1px solid #3d444e!important}
#actionConfigModal .field label,#actionConfigModal .delay-row,#actionConfigModal .small-note{color:#aaa!important}
#actionConfigModal input:not([type=checkbox]):not([type=radio]):not([type=color]),
#actionConfigModal select,#actionConfigModal textarea{
  background:#403e45!important;border-color:#403e45!important;color:#d0d0d4!important
}
#actionConfigModal .target-row,#actionConfigModal .action-target-row,#actionConfigModal .action-reference-panel,
#actionConfigModal .showhide-target-panel,#actionConfigModal .classic-action-checks{
  background:#29272e!important;border-color:#3d3b42!important;color:#d0d0d4!important
}
#actionConfigModal .action-ref-preview,#actionConfigModal .target-media-preview{
  background:#111015!important;border-color:#3d3b42!important;color:#888!important
}
#actionConfigModal .action-config-right .classic-section-title,
#actionConfigModal .action-config-right .section-header{
  background:#29272e!important;color:#d0d0d4!important;border-color:#3d3b42!important
}
#actionConfigModal .modal-footer{background:#29272e!important;border-color:#424047!important}

/* Bibliotecas y selectores: misma familia R101. */
#imageLibraryModal .library-main,#imageLibraryModal .library-grid,
#mediaLibraryManagerModal .media-library-main,#mediaLibraryManagerModal .media-library-grid,
#albumEditorModal .album-editor-content,#albumImagePickerModal .album-image-picker-content,
.media-picker-grid,.panorama-picker-grid,.album-picker-grid,.selector-grid{
  background:#1f232a!important;color:#d1d7df!important;border-color:#414852!important
}
#mediaLibraryManagerModal .media-library-card,#actionMediaPickerModal .action-media-picker-item,
.media-picker-item,.panorama-picker-item,.album-picker-item,.selector-card{
  background:#262b32!important;border-color:#343b46!important;color:#d1d7df!important
}
#mediaLibraryManagerModal .media-library-card:hover,#actionMediaPickerModal .action-media-picker-item:hover,
.media-picker-item:hover,.panorama-picker-item:hover,.album-picker-item:hover,.selector-card:hover{
  background:#303641!important;border-color:#1d9ed6!important
}
#mediaLibraryManagerModal .media-library-thumb,.selector-thumb{background:#11141a!important;border-color:#39404c!important}
#mediaLibraryManagerModal .media-library-card-name{color:#f0f2f5!important}
#mediaLibraryManagerModal .media-library-card-type{color:#9ba4b2!important}

/* Paneles auxiliares dentro de modales. */
.studio-modal .property-card,.studio-modal .property-group,.studio-modal .inspector-section,
.studio-modal .showhide-target-panel,.studio-modal .action-reference-panel,
.modal-window .property-card,.modal-window .property-group,.modal-window .inspector-section,
.modal-window .showhide-target-panel,.modal-window .action-reference-panel{
  background:#20242c!important;border-color:#343b46!important;color:#d1d7df!important
}
.studio-modal .section-header,.modal-window .section-header,
.studio-modal .classic-section-title,.modal-window .classic-section-title{
  background:#20242c!important;border-color:#343b46!important;color:#dce3ea!important
}

/* Botones R101. */
.btn{background:#262b34!important;border-color:#3c4350!important;color:#f0f2f5!important}
.btn:hover{background:#303641!important}
.btn.primary,#addPanoramaBtn,#publishBtn{
  background:#e59d22!important;border-color:#e59d22!important;color:#141414!important;font-weight:700!important
}
.btn.primary:hover,#addPanoramaBtn:hover,#publishBtn:hover{background:#f4a62a!important;border-color:#f4a62a!important}
.btn.danger{background:#3a2226!important;border-color:#63353b!important;color:#ffc5c5!important}

/* Compatibilidad permanente: esta opción no debe reaparecer. */
label:has(#panoramaIncludeCarousel),label:has(#actionVideoIncludeCarousel),
label:has(input[id*="IncludeCarousel"]),label[data-vista360-hidden-carousel="1"]{display:none!important}


/* v4.61 R110 — limpieza cromática R101 + compactación + iconografía semántica */
#actionConfigModal .classic-folder-field,
#actionConfigModal .classic-folder-field button,
#actionConfigModal .classic-folder-field .folder-label,
#actionConfigModal .action-ref-preview,
#actionConfigModal .target-media-preview,
#actionConfigModal .action-media-card-thumb,
#actionConfigModal .action-ref-select-media{
  background:#1f232a !important;
  border-color:#414852 !important;
  color:#d4dbe4 !important;
}
#actionConfigModal .action-ref-preview,
#actionConfigModal .target-media-preview{
  box-shadow:inset 0 0 0 1px rgba(76,84,96,.55) !important;
}
#actionConfigModal .action-ref-preview.empty::before,
#actionConfigModal .target-media-preview:empty::before{
  color:#8b96a5 !important;
}
#actionConfigModal .classic-preview-title{
  background:rgba(24,29,36,.88) !important;
  color:#dde5ee !important;
}
#actionConfigModal .field,
#actionConfigModal .showhide-apply-field{margin-bottom:8px !important;}
#actionConfigModal .field label,
#actionConfigModal .showhide-apply-field>label{
  margin-bottom:5px !important;
  font-size:10px !important;
  line-height:1.15 !important;
}
#actionConfigModal input:not([type=checkbox]):not([type=radio]):not([type=color]),
#actionConfigModal select,
#actionConfigModal textarea,
#actionConfigModal .showhide-target-panel .search-input,
#actionConfigModal .showhide-apply-field input,
#actionConfigModal .classic-folder-field,
#actionConfigModal .classic-folder-field button,
#actionConfigModal .target-select-all{
  min-height:32px !important;
  height:32px !important;
  line-height:32px !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}
#actionConfigModal input:not([type=checkbox]):not([type=radio]):not([type=color]),
#actionConfigModal select,
#actionConfigModal textarea,
#actionConfigModal .showhide-target-panel .search-input,
#actionConfigModal .showhide-apply-field input,
#actionConfigModal .classic-folder-field .folder-label{
  font-size:11px !important;
}
#actionConfigModal textarea{padding:7px 10px !important;min-height:80px !important;line-height:1.25 !important;}
#actionConfigModal .action-ref-row{gap:8px !important;margin:7px 0 !important;}
#actionConfigModal .classic-dual-number,
#actionConfigModal .classic-segmented,
#actionConfigModal .classic-action-checks{margin:8px 0 !important;gap:7px !important;}
#actionConfigModal .classic-effect-grid{gap:6px 12px !important;}
#actionConfigModal .showhide-device-tabs{
  min-height:40px !important;
  margin:0 0 10px !important;
  background:#0f1319 !important;
}
#actionConfigModal .showhide-device-tabs .device-tab{
  height:40px !important;
  font-size:12px !important;
}
#actionConfigModal .showhide-device-tabs .device-tab.active::before{
  border-left-width:7px !important;
  border-right-width:7px !important;
  border-top-width:7px !important;
}
#actionConfigModal .target-search-selectall-row{gap:10px !important;margin-bottom:6px !important;}
#actionConfigModal .showhide-target-panel .target-check-list.classic-target-list{min-height:220px !important;padding-top:0 !important;}
#actionConfigModal .showhide-target-panel .target-row{
  min-height:28px !important;
  padding:2px 4px !important;
}
#actionConfigModal .showhide-target-panel .target-row span{font-size:12px !important;}
#actionConfigModal .showhide-target-panel .target-row small{font-size:8px !important;}

.action-card-icon svg,
.library-top-icon svg{
  width:24px;
  height:24px;
  display:block;
}
.action-card-icon{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.action-card-icon svg{width:28px;height:28px;}
.library-top-icon{display:inline-flex;align-items:center;justify-content:center;}
.library-top-icon span,
.library-top-icon svg{display:block;}
.library-top-icon.active svg,
.library-top-icon:hover svg{filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
#actionLibraryModal .action-choice[data-action-kind="showHideComponents"] .action-card-icon svg,
#actionLibraryModal .action-choice[data-action-kind="showHideHotspots"] .action-card-icon svg{width:27px;height:27px;}

#imageLibraryModal .library-main,
#imageLibraryModal .library-grid,
#imageLibraryModal .image-library-sidebar,
#imageLibraryModal .library-scroll-filters{
  background:#1f232a !important;
}
#imageLibraryModal .library-top-icon{
  background:#171b21 !important;
  border-color:#34404d !important;
  color:#20b7ea !important;
}
#imageLibraryModal .library-top-icon.active,
#imageLibraryModal .library-top-icon:hover{
  background:#232933 !important;
  border-color:#20b7ea !important;
  color:#7ad9ff !important;
}

/* v4.62 R111 — PDF preview + separación biblioteca */
.vista-pdf-thumb-object,
.vista-pdf-object{display:block;width:100%;height:100%;border:0;background:#fff;}
.vista-pdf-thumb-object{pointer-events:none;}
.vista-pdf-thumb-badge{position:absolute;top:8px;right:8px;padding:2px 6px;border-radius:999px;background:rgba(8,18,28,.84);border:1px solid rgba(72,128,168,.45);color:#eaf6ff;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;pointer-events:none;}
.vista-pdf-thumb-fallback,.vista-pdf-fallback{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;height:100%;padding:16px;text-align:center;background:linear-gradient(180deg,#17212a,#0f171f);color:#eaf3f9;font:600 14px/1.2 "Segoe UI",Arial,sans-serif;}
.vista-pdf-thumb-fallback span,.vista-pdf-fallback span{font-size:11px;font-weight:500;color:#9fb4c3;}
.vista-pdf-fallback a{color:#7ddcff;text-decoration:none;font-size:12px;font-weight:700;}
.popup-runtime-card .vista-pdf-object{flex:1 1 auto;min-height:0;border-radius:14px;background:#fff;}
.popup-runtime-card.popup-runtime-pdf-card{overflow:hidden;}
.action-media-card-thumb,.media-library-thumb,.action-ref-preview{position:relative;}
.action-ref-preview .vista-pdf-thumb-object{height:100%;min-height:140px;background:#fff;border-radius:10px;}
#imageLibraryModal .library-main{padding-top:10px!important;box-sizing:border-box!important;}
#imageLibraryModal .image-library-sidebar{padding-top:6px!important;}
#imageLibraryModal .image-library-content{padding-top:22px!important;}
#imageLibraryModal .library-toolbar-vertical{padding-top:2px!important;}


/* v4.63 R112 — PDF real embebido + iconos emergentes con flecha visible */
.vista-pdf-thumb-object{display:block!important;width:100%!important;height:100%!important;min-height:135px!important;background:#fff!important;border:0!important;overflow:hidden!important;}
.vista-pdf-object{display:block!important;width:100%!important;height:100%!important;min-height:0!important;flex:1 1 auto!important;background:#fff!important;border:0!important;}
.popup-runtime-card.popup-runtime-pdf-card{background:#fff!important;}
#actionLibraryModal .action-choice[data-action-kind="imagePopup"] .action-card-icon svg,
#actionLibraryModal .action-choice[data-action-kind="albumPopup"] .action-card-icon svg,
#actionLibraryModal .action-choice[data-action-kind="webPopup"] .action-card-icon svg,
#actionLibraryModal .action-choice[data-action-kind="pdfPopup"] .action-card-icon svg{width:31px!important;height:31px!important;overflow:visible!important;}


/* v4.64 R113 — PDF 60x90 + biblioteca espaciada + AutoConnect sin flash/editable */
#imageLibraryModal .library-main{
  padding-top:20px!important;
  box-sizing:border-box!important;
}
#imageLibraryModal .image-library-sidebar{
  padding-top:12px!important;
}
#imageLibraryModal .library-toolbar-vertical{
  margin-top:0!important;
  padding-top:0!important;
}
#imageLibraryModal .image-library-content{
  padding-top:20px!important;
}
.vista-pdf-thumb-object,
.vista-pdf-object{
  display:block!important;
  width:100%!important;
  height:100%!important;
  border:0!important;
  background:#fff!important;
}
.vista-pdf-thumb-object{pointer-events:none!important;}
#viewer.auto-connect-transition-hide-hotspots .projective-object,
#viewer.auto-connect-transition-hide-hotspots .projective-spherical-mesh,
#viewer.auto-connect-transition-hide-hotspots .polygon-layer-object{
  visibility:hidden!important;
}

/* R114 — bloqueo integral de propiedades de Objetos/Hotspots y Componentes Skin */
.properties-lock-notice{
  margin:8px 0 10px;
  padding:8px 10px;
  border:1px solid rgba(226,174,82,.45);
  border-radius:5px;
  background:rgba(127,91,35,.18);
  color:#e4c88f;
  font-size:10px;
  line-height:1.35;
}
.properties-edit-locked input:disabled,
.properties-edit-locked select:disabled,
.properties-edit-locked textarea:disabled,
.properties-edit-locked button:disabled{
  cursor:not-allowed!important;
  opacity:.48!important;
}
.properties-edit-locked .replace-source-btn,
.properties-edit-locked .tag-editor,
.properties-edit-locked .action-row,
.properties-edit-locked .text-color-control,
.properties-edit-locked .polygon-vertex-editor{
  opacity:.72;
}
.properties-edit-locked .locked-tag-pill,
.locked-action-row{
  cursor:not-allowed!important;
  opacity:.62;
}
.properties-edit-locked #lockHotspot:not(:disabled),
.properties-edit-locked #lockPolygon:not(:disabled),
.properties-edit-locked #skinPropLocked:not(:disabled),
.properties-edit-locked #objectGroupLocked:not(:disabled){
  cursor:pointer!important;
  opacity:1!important;
}

/* Vista360Cloud v4.64 R115 — confirmación de propiedades compartidas con miembros bloqueados */
#studioDialogModal .studio-dialog-message{max-height:min(52vh,440px);overflow:auto;padding-right:6px;scrollbar-gutter:stable}
#studioDialogModal .studio-dialog-buttons{flex-wrap:wrap}
#studioDialogModal .studio-dialog-buttons .btn:disabled{opacity:.45;cursor:not-allowed}