/* ============================================================================
 * Plano de planta — aspecto
 * ----------------------------------------------------------------------------
 * Mismo lenguaje visual que Cómputo y presupuesto y que Evaluar5: neón cian y
 * magenta sobre azul profundo. Se reusan los nombres --e4-* a propósito, para
 * que un retoque de la paleta del evaluador arrastre a este módulo también.
 * ========================================================================== */

.zmc-planta-modal {
  --e4-cyan: #38e7ff;
  --e4-magenta: #ff43d7;
  --e4-violet: #7655ff;
  --e4-verde: #37f5a8;
  --e4-ambar: #ffc857;
  position: fixed;
  inset: 0;
  /* Igual que el presupuesto: los modales del sitio viven en 9999 y la ventana
     del modelo es uno de ellos, así que por debajo de 10000 esto quedaría
     tapado por el visor. */
  z-index: 10010;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 32% 22%, rgba(21, 120, 196, .28), transparent 38%), rgba(0, 2, 12, .86);
  backdrop-filter: blur(14px);
}
.zmc-planta-modal[hidden] { display: none; }

.zmc-planta-shell {
  display: flex;
  flex-direction: column;
  width: min(1240px, 96vw);
  height: min(840px, 94vh);
  overflow: hidden;
  border: 1px solid rgba(72, 226, 255, .46);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(3, 8, 30, .98), rgba(5, 26, 49, .97));
  box-shadow: 0 0 70px rgba(47, 160, 255, .38), inset 0 0 50px rgba(31, 222, 255, .05);
}

/* ── Encabezado ──────────────────────────────────────────────────────────── */
.zmc-planta-header {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 14px;
  align-items: center;
  padding: 12px 18px;
  border-bottom: 1px solid rgba(69, 224, 255, .24);
  background: linear-gradient(90deg, rgba(14, 31, 78, .9), rgba(10, 52, 87, .72));
}
.zmc-planta-header p {
  margin: 0;
  color: var(--e4-cyan);
  font-size: .62rem;
  font-weight: 900;
  letter-spacing: .16em;
}
.zmc-planta-header h3 {
  margin: 2px 0 0;
  color: #eaf7ff;
  font-size: 1.02rem;
  font-weight: 700;
}
.zmc-planta-sello {
  color: rgba(190, 226, 255, .62);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .06em;
}
/* El boton de cerrar ya no tiene estilo propio: usa el unico del sitio
   (.modal-close en style.css), para que este en el mismo lugar en todas las
   ventanas. */

/* ── Las dos columnas ────────────────────────────────────────────────────── */
.zmc-planta-content {
  display: grid;
  grid-template-columns: 330px 1fr;
  flex: 1;
  min-height: 0;
}
.zmc-planta-controles {
  overflow-y: auto;
  padding: 16px;
  border-right: 1px solid rgba(69, 224, 255, .18);
  background: rgba(2, 10, 28, .5);
}
.zmc-planta-panel {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  padding: 16px 18px;
}

.zmc-planta-titulo {
  margin: 0 0 8px;
  color: var(--e4-cyan);
  font-size: .6rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.zmc-planta-titulo + .zmc-planta-titulo,
.zmc-planta-controles > .zmc-planta-titulo:not(:first-child) { margin-top: 20px; }

/* ── Plantillas ──────────────────────────────────────────────────────────── */
.zmc-planta-tpl {
  display: block;
  width: 100%;
  margin-bottom: 7px;
  padding: 9px 11px;
  border: 1px solid rgba(72, 226, 255, .22);
  border-radius: 10px;
  background: rgba(10, 32, 62, .5);
  color: #d6ecff;
  text-align: left;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.zmc-planta-tpl:hover { border-color: rgba(72, 226, 255, .6); background: rgba(16, 52, 96, .6); }
.zmc-planta-tpl.es-activa {
  border-color: var(--e4-verde);
  background: rgba(55, 245, 168, .12);
  box-shadow: 0 0 16px rgba(55, 245, 168, .18);
}
.zmc-planta-tpl b { display: block; font-size: .8rem; font-weight: 700; }
.zmc-planta-tpl small {
  display: block;
  margin-top: 2px;
  color: rgba(178, 214, 245, .72);
  font-size: .66rem;
  line-height: 1.35;
}

/* ── Controles ───────────────────────────────────────────────────────────── */
.zmc-planta-formas { display: flex; gap: 6px; margin-bottom: 14px; }
.zmc-planta-formas button {
  flex: 1;
  padding: 8px 4px;
  border: 1px solid rgba(72, 226, 255, .28);
  border-radius: 9px;
  background: rgba(10, 32, 62, .5);
  color: #cfe8ff;
  font-size: .72rem;
  font-weight: 700;
  cursor: pointer;
}
.zmc-planta-formas button.es-activa {
  border-color: var(--e4-cyan);
  background: rgba(56, 231, 255, .18);
  color: #eafaff;
}

.zmc-planta-campo { display: flex; align-items: center; gap: 10px; margin-bottom: 9px; }
.zmc-planta-campo label {
  flex: 1;
  color: #bcd9f2;
  font-size: .73rem;
  font-weight: 600;
}
.zmc-planta-campo input[type="number"] {
  width: 84px;
  padding: 6px 8px;
  border: 1px solid rgba(72, 226, 255, .3);
  border-radius: 7px;
  background: rgba(2, 12, 30, .8);
  color: #eaf7ff;
  font-size: .8rem;
  font-weight: 700;
  text-align: right;
}
.zmc-planta-campo input[type="number"]:focus {
  outline: none;
  border-color: var(--e4-cyan);
  box-shadow: 0 0 0 2px rgba(56, 231, 255, .18);
}
.zmc-planta-campo.es-check { cursor: pointer; }
.zmc-planta-campo input[type="checkbox"] { width: 15px; height: 15px; accent-color: #38e7ff; cursor: pointer; }

/* ── Dibujo ──────────────────────────────────────────────────────────────── */
.zmc-planta-dibujo {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(69, 224, 255, .2);
  border-radius: 12px;
  background:
    linear-gradient(rgba(56, 231, 255, .045) 1px, transparent 1px) 0 0 / 26px 26px,
    linear-gradient(90deg, rgba(56, 231, 255, .045) 1px, transparent 1px) 0 0 / 26px 26px,
    rgba(2, 10, 26, .62);
}
.zmc-planta-dibujo svg { width: 100%; height: 100%; }

/* ── Los cuatro pasos del flujo ──────────────────────────────────────────── */
/* Cada paso es un bloque con su numero, un boton grande y sus opciones
   plegadas. La linea de la izquierda los encadena visualmente: se lee como una
   secuencia y no como cuatro cajas sueltas. */
.zmc-planta-paso {
  border-left: 2px solid rgba(69, 224, 255, .28);
  padding: 2px 0 10px 12px;
  margin: 0 0 10px 6px;
}
.zmc-planta-paso h4 {
  display: flex; align-items: center; gap: 8px;
  margin: 0 0 8px; font-size: .82rem; color: #7dd3fc; font-weight: 700;
}
.zmc-planta-paso h4 span {
  display: inline-grid; place-items: center;
  width: 20px; height: 20px; border-radius: 50%;
  background: rgba(69, 224, 255, .18); color: #bfe9ff;
  font-size: .72rem; font-weight: 800;
  /* Centrado optico: el numero queda un pelo alto con la linea base normal. */
  line-height: 1;
}
/* El boton principal de cada paso: uno solo, y se ve que es el que hay que
   apretar. Los secundarios del mismo paso quedan discretos por contraste. */
.zmc-planta-principal {
  width: 100%; padding: 10px 12px; margin-bottom: 6px;
  border: 0; border-radius: 9px; cursor: pointer;
  background: linear-gradient(180deg, #0ea5e9, #0284c7);
  color: #04101f; font-weight: 800; font-size: .82rem;
}
.zmc-planta-principal:hover { filter: brightness(1.08); }
.zmc-planta-principal:disabled { opacity: .45; cursor: default; filter: none; }
.zmc-planta-pista {
  margin: 0 0 8px; color: #93b4d6; font-size: .73rem; line-height: 1.45;
}
.zmc-planta-pista strong { color: #bfe9ff; }

/* Deshacer y rehacer: dos flechas curvas, sin texto. El contador va chiquito
   al lado, y el nombre vive en el title -y en el aria-label, para el lector de
   pantalla-. */
.zmc-planta-flecha { font-size: 1.15rem; line-height: 1; }
.zmc-planta-atras .zmc-planta-deshacer {
  flex: 0 0 auto; width: auto; min-width: 44px; padding: 7px 10px;
}
.zmc-planta-atras .zmc-planta-deshacer sub {
  font-size: .62rem; vertical-align: super; margin-left: 2px; opacity: .8;
}

/* ── Las opciones de reparto guardadas ───────────────────────────────────── */
.zmc-planta-opcion {
  border: 1px solid rgba(69, 224, 255, .18);
  border-radius: 8px; padding: 8px 10px; margin-bottom: 6px;
  background: rgba(8, 21, 43, .55);
}
/* La que esta en pantalla se distingue sola: si no, uno no sabe cual de las
   seis esta mirando. */
.zmc-planta-opcion.es-actual {
  border-color: rgba(14, 165, 233, .7);
  background: rgba(14, 165, 233, .1);
}
.zmc-planta-opcion-cifras { color: #cfe8ff; font-size: .78rem; }
.zmc-planta-opcion-cifras b { color: #7dd3fc; }
.zmc-planta-opcion-ajustes {
  color: #8fb2d4; font-size: .68rem; margin-top: 2px; line-height: 1.4;
}
.zmc-planta-opcion-ajustes em { color: #4ade80; font-style: normal; }
.zmc-planta-opcion-usar {
  margin-top: 6px; padding: 4px 10px; font-size: .72rem; cursor: pointer;
  border: 1px solid rgba(69, 224, 255, .35); border-radius: 6px;
  background: transparent; color: #7dd3fc;
}
.zmc-planta-opcion-usar:hover { background: rgba(69, 224, 255, .12); }
.zmc-planta-opcion-actual {
  display: inline-block; margin-top: 6px; font-size: .68rem;
  color: #0ea5e9; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
}

/* ── Resumen y acciones ──────────────────────────────────────────────────── */
.zmc-planta-cifras { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.zmc-planta-cifra {
  flex: 1 1 130px;
  padding: 8px 11px;
  border: 1px solid rgba(72, 226, 255, .22);
  border-radius: 10px;
  background: rgba(8, 26, 52, .55);
}
.zmc-planta-cifra small {
  display: block;
  color: rgba(178, 214, 245, .7);
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.zmc-planta-cifra b { color: var(--e4-cyan); font-size: 1.02rem; font-weight: 800; }

.zmc-planta-acciones { display: flex; align-items: center; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.zmc-planta-usar {
  padding: 11px 22px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(135deg, #0e7f5c, #16a34a);
  color: #eafff5;
  font-size: .88rem;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 0 22px rgba(55, 245, 168, .3);
  transition: transform .15s ease, box-shadow .15s ease;
}
.zmc-planta-usar:hover { transform: translateY(-1px); box-shadow: 0 0 30px rgba(55, 245, 168, .45); }
.zmc-planta-usar:disabled { opacity: .5; cursor: default; transform: none; box-shadow: none; }
.zmc-planta-bajar {
  padding: 11px 18px;
  border: 1px solid rgba(72, 226, 255, .4);
  border-radius: 10px;
  background: rgba(56, 231, 255, .1);
  color: #cdefff;
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
}
.zmc-planta-bajar:hover { background: rgba(56, 231, 255, .22); }
.zmc-planta-aviso {
  flex: 1;
  color: rgba(190, 226, 255, .78);
  font-size: .72rem;
  line-height: 1.35;
}
/* Mientras se espera al modelo: renglon propio, y un punto que late para que
   se vea que sigue vivo aunque el numero tarde un segundo en cambiar. */
.zmc-planta-aviso.es-esperando {
  flex: 0 0 100%;
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; border-radius: 8px;
  border: 1px solid rgba(69, 224, 255, .22);
  background: rgba(8, 21, 43, .6);
  font-size: .76rem; font-variant-numeric: tabular-nums;
}
.zmc-planta-aviso.es-esperando::before {
  content: ''; flex: 0 0 auto;
  width: 8px; height: 8px; border-radius: 50%;
  background: #0ea5e9;
  animation: zmc-planta-late 1s ease-in-out infinite;
}
@keyframes zmc-planta-late { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .zmc-planta-aviso.es-esperando::before { animation: none; opacity: .9; }
}
.zmc-planta-aviso.es-ok { color: var(--e4-verde); }
.zmc-planta-aviso.es-mal { color: #ff9ecd; }

@media (max-width: 900px) {
  .zmc-planta-content { grid-template-columns: 1fr; }
  .zmc-planta-controles { border-right: none; border-bottom: 1px solid rgba(69, 224, 255, .18); max-height: 46%; }
}

/* ── Modo de trabajo: plantillas o dibujo ────────────────────────────────── */
.zmc-planta-modos {
  display: flex;
  gap: 6px;
  margin-bottom: 16px;
  padding: 4px;
  border: 1px solid rgba(72, 226, 255, .22);
  border-radius: 11px;
  background: rgba(2, 12, 30, .6);
}
.zmc-planta-modos button {
  flex: 1;
  padding: 9px 4px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: #9fc4e2;
  font-size: .76rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.zmc-planta-modos button:hover { color: #d9efff; }
.zmc-planta-modos button.es-activa {
  background: linear-gradient(135deg, rgba(56, 231, 255, .24), rgba(118, 85, 255, .24));
  color: #eafaff;
  box-shadow: 0 0 14px rgba(56, 231, 255, .2);
}

/* ── Instrucciones del dibujo ────────────────────────────────────────────── */
.zmc-planta-ayuda-dibujo {
  margin: 0 0 16px;
  padding: 9px 11px;
  border: 1px solid rgba(255, 200, 87, .28);
  border-left: 3px solid var(--e4-ambar);
  border-radius: 8px;
  background: rgba(255, 200, 87, .07);
  color: #e8dcc0;
  font-size: .7rem;
  line-height: 1.5;
}
.zmc-planta-ayuda-dibujo b { color: var(--e4-ambar); }

/* ── Lista de contornos ──────────────────────────────────────────────────── */
.zmc-planta-vacio {
  margin: 0;
  color: rgba(178, 214, 245, .55);
  font-size: .72rem;
  font-style: italic;
}
.zmc-planta-item {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  padding: 7px 9px;
  border: 1px solid rgba(72, 226, 255, .22);
  border-radius: 9px;
  background: rgba(10, 32, 62, .5);
  color: #d6ecff;
  font-size: .72rem;
}
.zmc-planta-item.es-hueco { border-color: rgba(255, 200, 87, .4); background: rgba(255, 200, 87, .08); }
.zmc-planta-chip {
  padding: 2px 8px;
  border-radius: 20px;
  background: rgba(56, 231, 255, .18);
  color: var(--e4-cyan);
  font-size: .6rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.zmc-planta-item.es-hueco .zmc-planta-chip { background: rgba(255, 200, 87, .2); color: var(--e4-ambar); }
.zmc-planta-item button {
  margin-left: auto;
  width: 22px;
  height: 22px;
  border: none;
  border-radius: 6px;
  background: rgba(255, 67, 215, .15);
  color: #ffc8f1;
  font-size: .9rem;
  line-height: 1;
  cursor: pointer;
}
.zmc-planta-item button:hover { background: rgba(255, 67, 215, .35); }

.zmc-planta-limpiar {
  width: 100%;
  margin-top: 10px;
  padding: 9px;
  border: 1px solid rgba(255, 67, 215, .35);
  border-radius: 9px;
  background: rgba(255, 67, 215, .08);
  color: #ffc8f1;
  font-size: .74rem;
  font-weight: 700;
  cursor: pointer;
}
.zmc-planta-limpiar:hover { background: rgba(255, 67, 215, .22); }

/* ── Herramienta: lápiz o goma ───────────────────────────────────────────── */
.zmc-planta-herram {
  display: flex;
  gap: 6px;
  margin-bottom: 16px;
}
.zmc-planta-herram button {
  flex: 1;
  padding: 8px 4px;
  border: 1px solid rgba(72, 226, 255, .28);
  border-radius: 9px;
  background: rgba(10, 32, 62, .5);
  color: #cfe8ff;
  font-size: .74rem;
  font-weight: 700;
  cursor: pointer;
}
.zmc-planta-herram button.es-activa {
  border-color: var(--e4-ambar);
  background: rgba(255, 200, 87, .16);
  color: #fff3d8;
  box-shadow: 0 0 14px rgba(255, 200, 87, .18);
}

.zmc-planta-restaurar {
  width: 100%;
  margin-top: 10px;
  padding: 9px;
  border: 1px solid rgba(55, 245, 168, .38);
  border-radius: 9px;
  background: rgba(55, 245, 168, .1);
  color: #b8ffe2;
  font-size: .74rem;
  font-weight: 700;
  cursor: pointer;
}
.zmc-planta-restaurar:hover { background: rgba(55, 245, 168, .22); }

/* ── Vigas y columnas puestas a mano ─────────────────────────────────────── */
.zmc-planta-mano {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  padding: 7px 9px;
  border: 1px solid rgba(55, 245, 168, .3);
  border-radius: 9px;
  background: rgba(55, 245, 168, .08);
  color: #b8ffe2;
  font-size: .7rem;
  font-weight: 600;
}
.zmc-planta-mano button {
  margin-left: auto;
  width: 22px;
  height: 22px;
  border: none;
  border-radius: 6px;
  background: rgba(255, 67, 215, .15);
  color: #ffc8f1;
  font-size: .9rem;
  line-height: 1;
  cursor: pointer;
}
.zmc-planta-mano button:hover { background: rgba(255, 67, 215, .35); }

/* Con cuatro herramientas, en una columna de 330 px no entran en una fila. */
.zmc-planta-herram { flex-wrap: wrap; }
.zmc-planta-herram button { flex: 1 1 calc(50% - 3px); }

/* ── Traer la planta de Plantillas ───────────────────────────────────────── */
.zmc-planta-traer {
  width: 100%;
  margin-top: 10px;
  padding: 9px;
  border: 1px solid rgba(118, 85, 255, .45);
  border-radius: 9px;
  background: rgba(118, 85, 255, .12);
  color: #d8ccff;
  font-size: .74rem;
  font-weight: 700;
  cursor: pointer;
}
.zmc-planta-traer:hover { background: rgba(118, 85, 255, .26); }
.zmc-planta-traer.es-confirmando {
  border-color: var(--e4-ambar);
  background: rgba(255, 200, 87, .16);
  color: #fff3d8;
}

/* Un contorno que se cruza o se pisa: el numero que informa no significa nada. */
.zmc-planta-item.es-rota {
  border-color: rgba(255, 90, 90, .55);
  background: rgba(255, 90, 90, .12);
  color: #ffd2d2;
}
.zmc-planta-item.es-rota .zmc-planta-chip { background: rgba(255, 90, 90, .25); color: #ffb3b3; }

/* ── Distribución automática de columnas ─────────────────────────────────── */
.zmc-planta-voronoi {
  width: 100%;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid rgba(56, 231, 255, .5);
  border-radius: 9px;
  background: linear-gradient(135deg, rgba(56, 231, 255, .18), rgba(118, 85, 255, .18));
  color: #ddf6ff;
  font-size: .78rem;
  font-weight: 800;
  cursor: pointer;
}
.zmc-planta-voronoi:hover { background: linear-gradient(135deg, rgba(56, 231, 255, .3), rgba(118, 85, 255, .3)); }
.zmc-planta-voronoi.es-confirmando {
  border-color: var(--e4-ambar);
  background: rgba(255, 200, 87, .16);
  color: #fff3d8;
}

/* ── Se pasó de lo que el modelo aguanta ─────────────────────────────────── */
.zmc-planta-tope {
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 90, 90, .5);
  border-left: 3px solid #ff5a5a;
  border-radius: 9px;
  background: rgba(255, 90, 90, .12);
  color: #ffd2d2;
  font-size: .74rem;
  line-height: 1.45;
}
.zmc-planta-tope[hidden] { display: none; }
.zmc-planta-tope b { color: #ff9a9a; }

/* ── Deshacer ────────────────────────────────────────────────────────────── */
.zmc-planta-deshacer {
  width: 100%;
  margin-bottom: 16px;
  padding: 8px;
  border: 1px solid rgba(72, 226, 255, .3);
  border-radius: 9px;
  background: rgba(10, 32, 62, .5);
  color: #cfe8ff;
  font-size: .74rem;
  font-weight: 700;
  cursor: pointer;
}
.zmc-planta-deshacer:hover:not(:disabled) { background: rgba(16, 52, 96, .7); border-color: rgba(72, 226, 255, .6); }
.zmc-planta-deshacer:disabled { opacity: .38; cursor: default; }

/* ── Calco de fondo y zonas pintadas ─────────────────────────────────────── */
.zmc-planta-calco-tit {
  font-size: .72rem; font-weight: 700; color: #bcd9f2;
  margin: 0 0 6px; padding: 5px 8px; border-radius: 8px;
  background: rgba(56, 231, 255, .07); border: 1px solid rgba(56, 231, 255, .16);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.zmc-planta-calco-tit b { color: #ffc857; font-weight: 700; }
.zmc-planta-zonas-cifra {
  font-size: .72rem; color: #9fc4e0; margin: 6px 0; text-align: center;
}
.zmc-planta-zonas-cifra .es-mas { color: #37f5a8; font-weight: 700; }
.zmc-planta-zonas-cifra .es-menos { color: #ff5c7a; font-weight: 700; }
/* Los dos pinceles se reconocen por el color, igual que lo que pintan. */
.zmc-planta-herram [data-herram="zonaMas"].es-activa { border-color: rgba(55, 245, 168, .55); color: #37f5a8; }
.zmc-planta-herram [data-herram="zonaMenos"].es-activa { border-color: rgba(255, 92, 122, .55); color: #ff5c7a; }

/* ── Los pasos del panel, en orden de trabajo ────────────────────────────── */
.zmc-planta-titulo b {
  display: inline-flex; align-items: center; justify-content: center;
  width: 16px; height: 16px; margin-right: 6px; border-radius: 50%;
  background: rgba(56, 231, 255, .16); border: 1px solid rgba(56, 231, 255, .34);
  color: #7fd4ff; font-size: .62rem; font-weight: 800;
}
.zmc-planta-subtitulo {
  margin: 12px 0 6px; font-size: .66rem; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase; color: #7fd4ff;
}
.zmc-planta-subtitulo span {
  text-transform: none; letter-spacing: 0; font-weight: 600; color: #6d8ba6;
}

/* ── Campos con barra deslizante, como el panel del modelo ──────────────── */
.zmc-planta-campo.es-slider { flex-wrap: wrap; gap: 4px 10px; }
.zmc-planta-campo.es-slider > label { flex: 1 1 100%; }
.zmc-planta-barra { display: flex; align-items: center; gap: 8px; width: 100%; }
.zmc-planta-barra input[type="range"] {
  flex: 1;
  height: 4px;
  margin: 0;
  border-radius: 3px;
  background: rgba(56, 231, 255, .22);
  accent-color: #38e7ff;
  cursor: pointer;
}
.zmc-planta-barra input[type="number"] { width: 64px; padding: 4px 6px; font-size: .74rem; }

/* ── Lo que no se usa todo el tiempo, plegado ────────────────────────────── */
.zmc-planta-mas {
  margin: 8px 0;
  border: 1px solid rgba(72, 226, 255, .18);
  border-radius: 9px;
  background: rgba(8, 24, 48, .4);
}
.zmc-planta-mas[hidden] { display: none; }
.zmc-planta-mas > summary {
  padding: 9px 12px;
  color: #9fc4e0;
  font-size: .72rem;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.zmc-planta-mas > summary::-webkit-details-marker { display: none; }
/* La flecha la dibujamos nosotros para que gire al abrir. */
.zmc-planta-mas > summary::before {
  content: '▸';
  display: inline-block;
  margin-right: 7px;
  color: #38e7ff;
  transition: transform .15s;
}
.zmc-planta-mas[open] > summary::before { transform: rotate(90deg); }
.zmc-planta-mas > summary:hover { color: #cfe8ff; background: rgba(56, 231, 255, .06); }
.zmc-planta-mas[open] > summary { border-bottom: 1px solid rgba(72, 226, 255, .14); }
.zmc-planta-mas > div { padding: 10px 12px 12px; }
/* El boton de repartir es el que mas se usa: se ve como el principal. */
#zmc-planta-voronoi { margin: 12px 0 4px; padding: 12px; font-size: .82rem; }

/* ── Mirar: mover, medir y encuadrar ─────────────────────────────────────── */
#zmc-planta-herram-ver button { font-size: .7rem; }
#zmc-planta-herram-ver [data-herram="mano"].es-activa,
#zmc-planta-herram-ver [data-herram="regla"].es-activa { border-color: var(--e4-ambar); }
.zmc-planta-escala text { font-family: inherit; }

/* ── Deshacer y rehacer, uno al lado del otro ────────────────────────────── */
.zmc-planta-atras { display: flex; gap: 6px; }
.zmc-planta-atras .zmc-planta-deshacer {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  margin-bottom: 12px;
  padding: 8px 4px;
  font-size: .72rem;
}

/* ── Empezar de cero en el modelo ────────────────────────────────────────── */
.zmc-planta-reset {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  border: 1px solid rgba(72, 226, 255, .28);
  border-radius: 9px;
  background: rgba(10, 32, 62, .5);
  color: #cfe8ff;
  font-size: .72rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}
.zmc-planta-reset input { width: 15px; height: 15px; accent-color: #38e7ff; cursor: pointer; }



/* El boton de cerrar flota sobre la esquina (.modal-close, style.css):

   hay que dejarle el lugar o el titulo y el sello de version le pasan

   por debajo. Va al final del archivo a proposito: puesto antes, el

   `padding` de la regla original lo pisaba. */

.zmc-planta-header { position: relative; padding-right: 62px; }



/* ── El plano de fondo, en su propia capa ────────────────────────────────── */
/* Va en un <svg> aparte y por debajo del lienzo: asi el dibujo se rehace en
   cada zoom sin arrastrar las miles de lineas del plano de CAD. */
#zmc-planta-dibujo { position: relative; }
#zmc-planta-fondo,
#zmc-planta-capa-dibujo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
#zmc-planta-fondo { pointer-events: none; }