/* PortSync V2.5 · prototipo «4 · Fusión» · capa del modelo 3D (pilote-3d.js): lienzo, guías y etiquetas.
   La enlaza toda página que monte el modelo (pilote.html y, si la usa, tecnologia.html), después de los tokens. */
.p3d-lienzo { position: absolute; inset: 0; width: 100%; height: 100%; display: block; cursor: grab; touch-action: pan-y; outline: none; }
.p3d-lienzo.p3d-arrastre { cursor: grabbing; }
.p3d-lienzo:focus-visible { outline: 2px solid var(--focus); outline-offset: -6px; border-radius: var(--r-md); }
.p3d-capa { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.p3d-guias { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.p3d-guias polyline { fill: none; stroke: var(--pl-guia); stroke-width: 1; opacity: 0; transition: opacity 250ms var(--ease-out); }
.p3d-guias circle { fill: var(--pl-guia); opacity: 0; transition: opacity 250ms var(--ease-out); }
.p3d-etiquetas { position: absolute; inset: 0; }
.p3d-etq {
  position: absolute; left: 0; top: 0; max-width: 232px; padding: 5px 10px 6px 8px;
  border-radius: var(--r-xs); border: 1px solid var(--pl-vidrio-borde); background: var(--pl-vidrio);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: var(--sombra-1);
  font-family: var(--f-texto); font-size: var(--t-rotulo); font-weight: var(--peso-rotulo); line-height: 1.25; letter-spacing: 0.01em;
  color: var(--ink); opacity: 0; transition: opacity 250ms var(--ease-out); will-change: transform; white-space: normal;
}
.p3d-etq b { display: inline-block; width: 7px; height: 7px; margin-right: 7px; background: var(--accent); vertical-align: 1px; }
.p3d-etq__d { display: block; margin-top: 2px; padding-left: 14px; font-size: 12px; font-weight: 400; letter-spacing: 0; color: var(--ink-2); }
.p3d-etq--compacta { padding: 4px 8px 4px 6px; max-width: 132px; font-size: 12px; }
.p3d-etq--compacta .p3d-etq__d { display: none; }
.p3d-datum {
  position: absolute; left: 0; top: 0; white-space: nowrap; opacity: 0; transition: opacity 250ms var(--ease-out);
  font-family: var(--f-texto); font-size: 12px; font-weight: 500; line-height: 1; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-3);
}
.p3d-sin-webgl {
  position: absolute; left: 16px; right: 16px; top: 40%; margin: 0; padding: 14px 16px; border-radius: var(--r-md);
  background: var(--pl-vidrio); border: 1px solid var(--line-strong); color: var(--ink-2); font: 400 15px/1.5 var(--f-texto); text-align: center;
}
@media (prefers-reduced-motion: reduce) {
  .p3d-etq, .p3d-datum, .p3d-guias polyline, .p3d-guias circle { transition: none; }
}