
.okmae-cotizador{--y:#ffd400;--green:#25D366;--line:#e1e5ea;--ink:#161616;font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:var(--ink);max-width:1400px;margin:24px auto;background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 16px 50px rgba(20,35,55,.08)}
.okmae-cotizador *{box-sizing:border-box}.okm-head{padding:18px 22px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.okm-logo{font-size:27px;font-weight:950}.okm-logo span{color:#d6aa00}.okm-head small{display:block;color:#6d7783}.okm-pill{display:inline-block;background:#fff6bf;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:900}
.okm-grid{display:grid;grid-template-columns:300px 1fr 340px;min-height:760px}.okm-panel{padding:18px;background:#fafafa;border-right:1px solid var(--line)}.okm-summary-panel{border-right:0;border-left:1px solid var(--line);background:#fff}.okm-panel section{padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--line)}.okm-panel h3{margin:0 0 11px;font-size:17px}
.okm-product-img{width:100%;aspect-ratio:1/1;object-fit:contain;background:white;border:1px solid var(--line);border-radius:14px;margin:10px 0}.okm-input{width:100%;padding:11px;border:1px solid #ccd2d9;border-radius:11px;background:#fff;font:inherit}.okm-change-product{width:100%;border:0;background:var(--y);padding:11px;border-radius:11px;font-weight:900;cursor:pointer}.okm-vip{display:flex;gap:9px;align-items:center;margin-top:11px;padding:11px;border-radius:12px;background:#fff7c9;font-weight:800}.okm-panel small,.okm-muted{font-size:12px;color:#68717d;line-height:1.4}.okm-row{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid #eee;font-size:13px}
.okm-viewer{position:relative;background:radial-gradient(circle,#fff,#e9ecef 74%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 105px 85px}.okm-tip{position:absolute;top:14px;left:50%;transform:translateX(-50%);background:#fff;border:1px solid var(--line);padding:8px 12px;border-radius:999px;font-size:12px;font-weight:900;white-space:nowrap}.okm-stage{position:relative;width:330px;max-width:65vw;aspect-ratio:270/420;background:#ddd;box-shadow:0 12px 30px rgba(0,0,0,.13)}.okm-view{position:absolute;inset:0;display:none}.okm-view.active{display:block}.okm-view>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.okm-zone{position:absolute;border:2px dashed var(--y);background:rgba(255,255,255,.8);border-radius:10px;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:950;font-size:18px;cursor:pointer;color:#a78500;padding:0}.okm-zone span{display:block;color:#111;font-size:10px;line-height:1.05}.okm-zone img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:3px}.okm-zone.has-design{background:rgba(255,255,255,.45)}.okm-zone.has-design>span{display:none}.pecho-der{left:30%;top:40%;width:17%;height:9%}.pecho-izq{left:53%;top:40%;width:17%;height:9%}.pecho-centro{left:34%;top:50%;width:32%;height:18%}.manga-izq{left:47%;top:39%;width:17%;height:15%;transform:rotate(-5deg)}.manga-der{left:18%;top:37%;width:20%;height:11%;transform:rotate(8deg)}.nuca{left:39%;top:34%;width:22%;height:7%}.espalda-centro{left:32%;top:43%;width:36%;height:21%}.espalda-inferior{left:35%;top:64%;width:30%;height:8%}
.okm-view-buttons{position:absolute;right:14px;top:75px;display:grid;gap:8px}.okm-view-buttons button{border:2px solid transparent;border-radius:11px;background:#fff;padding:8px 10px;font-weight:900;font-size:11px;cursor:pointer;box-shadow:0 3px 12px rgba(0,0,0,.08)}.okm-view-buttons button.active{border-color:var(--y)}
.okm-line{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #eee;font-size:13px}.okm-total{display:flex;justify-content:space-between;gap:12px;align-items:end;margin:14px 0 4px;font-size:22px;font-weight:950}.okm-whatsapp{display:block;background:var(--green);color:#fff!important;text-decoration:none!important;text-align:center;padding:14px;border-radius:13px;font-weight:950;margin-top:14px}
.okm-modal{position:fixed;inset:0;background:rgba(0,0,0,.52);display:none;align-items:center;justify-content:center;z-index:999999;padding:18px}.okm-modal.open{display:flex}.okm-modal-box{width:min(430px,100%);background:#fff;border-radius:20px;padding:20px;box-shadow:0 24px 70px rgba(0,0,0,.28)}.okm-upload{display:block;background:var(--y);padding:14px;text-align:center;border-radius:12px;font-weight:950;cursor:pointer}.okm-modal-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.okm-modal-actions button{border:0;padding:11px;border-radius:11px;background:#eee;font-weight:900;cursor:pointer}.okm-design-row{display:flex;justify-content:space-between;gap:8px;padding:7px 0;border-bottom:1px solid #eee;font-size:12px}
.okm-product-picker{width:min(900px,96vw);max-height:88vh;overflow:auto}.okm-product-picker-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.okm-product-picker-head button{border:0;background:#eee;width:36px;height:36px;border-radius:50%;cursor:pointer;font-weight:900}.okm-product-filters{display:grid;grid-template-columns:1fr 240px;gap:10px;margin:12px 0}.okm-product-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.okm-product-card{border:1px solid var(--line);border-radius:14px;padding:10px;background:#fff;cursor:pointer;text-align:left}.okm-product-card:hover{border-color:var(--y);box-shadow:0 6px 18px rgba(0,0,0,.07)}.okm-product-card img{width:100%;aspect-ratio:1/1;object-fit:contain;background:#fafafa;border-radius:10px}.okm-product-card strong{display:block;margin-top:8px;font-size:13px}.okm-product-card small{display:block;color:#68717d;margin-top:4px}.okm-product-card b{display:block;margin-top:5px}.okmae-cot-error{padding:16px;border:1px solid #e2bcbc;background:#fff0f0;border-radius:10px}
@media(max-width:1050px){.okm-grid{grid-template-columns:1fr}.okm-panel,.okm-summary-panel{border:0;border-bottom:1px solid var(--line)}.okm-viewer{min-height:720px;padding-left:20px;padding-right:100px}.okm-product-results{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.okmae-cotizador{border-radius:0;margin:0}.okm-viewer{padding:70px 78px 85px 12px;min-height:620px}.okm-stage{width:280px}.okm-view-buttons{right:7px}.okm-tip{font-size:10px;white-space:normal;width:75%;text-align:center}.okm-product-filters{grid-template-columns:1fr}.okm-product-results{grid-template-columns:1fr}}


/* V1.2 — colores OK MAE + corrección de lateral derecho */
.okm-view-buttons button{
  color:#222 !important;
}
.okm-view-buttons button.active{
  background:#ffbd59 !important;
  border-color:#ffbd59 !important;
  color:#222 !important;
}
.okm-zone{
  color:#ffbd59 !important;
}
.okm-zone span{
  color:#222 !important;
  text-shadow:none !important;
}

/* Vista lateral derecha: el sujeto debe mirar hacia la derecha */
.okm-view[data-view="right"] > img,
.okm-view-right > img,
.okm-right-mascot{
  transform:scaleX(-1);
  transform-origin:center center;
}

/* Reubicar la zona de manga derecha después del espejo */
.okm-view[data-view="right"] .manga-der{
  left:58%;
  top:37%;
  width:20%;
  height:11%;
  transform:rotate(-8deg);
}


/* V1.3 — identidad visual OK MAE */
.okmae-cotizador{
  --brand-yellow:#ffbd59;
  --brand-black:#222222;
  --brand-white:#ffffff;
  --brand-soft:#f7f7f7;
  --brand-line:#e7e7e7;
  font-family:"Poppins", Arial, sans-serif !important;
}
.okmae-cotizador,
.okmae-cotizador input,
.okmae-cotizador select,
.okmae-cotizador button,
.okmae-cotizador a{
  font-family:"Poppins", Arial, sans-serif !important;
}
.okmae-cotizador strong,
.okmae-cotizador b,
.okmae-cotizador h1,
.okmae-cotizador h2,
.okmae-cotizador h3,
.okmae-cotizador .okm-logo,
.okmae-cotizador .okm-pill,
.okmae-cotizador .okm-change-product,
.okmae-cotizador .okm-product-card strong{
  font-weight:700 !important;
}
.okmae-cotizador,
.okmae-cotizador p,
.okmae-cotizador small,
.okmae-cotizador input,
.okmae-cotizador select{
  font-weight:400;
}

/* Quitar azul anterior del catálogo */
.okm-product-card{
  background:#fff !important;
  color:#222 !important;
  border:1px solid #e5e5e5 !important;
}
.okm-product-card:hover{
  border-color:#ffbd59 !important;
  box-shadow:0 8px 20px rgba(0,0,0,.08) !important;
}
.okm-product-card strong,
.okm-product-card b{
  color:#222 !important;
}
.okm-product-card small{
  color:#777 !important;
}
.okm-product-card img{
  background:#f8f8f8 !important;
}
.okm-change-product{
  background:#ffbd59 !important;
  color:#222 !important;
}
.okm-pill{
  background:#fff1c7 !important;
  color:#222 !important;
}
.okm-product-picker{
  background:#fff !important;
}
.okm-product-picker h3{
  color:#222 !important;
}
.okm-product-filters .okm-input{
  border:1px solid #cfcfcf !important;
  color:#222 !important;
}
.okm-product-filters .okm-input:focus{
  border-color:#ffbd59 !important;
  outline:2px solid rgba(255,189,89,.18);
}

/* Paginación */
.okm-pagination{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  margin-top:18px;
  padding-bottom:4px;
}
.okm-pagination button{
  min-width:38px;
  height:38px;
  border:1px solid #d8d8d8;
  border-radius:9px;
  background:#fff;
  color:#222;
  font-weight:700;
  cursor:pointer;
}
.okm-pagination button:hover{
  border-color:#ffbd59;
}
.okm-pagination button.active{
  background:#ffbd59;
  border-color:#ffbd59;
  color:#222;
}
.okm-pagination button:disabled{
  opacity:.4;
  cursor:not-allowed;
}
.okm-pagination .okm-page-info{
  font-size:12px;
  color:#777;
  margin:0 4px;
}


/* V1.6 — nube informativa por personalización */
.okm-tech-cloud{
  position:relative;
  margin-top:12px;
  padding:14px 15px 14px 16px;
  border-radius:14px;
  background:#fff4d8;
  border:1px solid #ffbd59;
  color:#222;
  font-family:"Poppins",Arial,sans-serif;
  font-size:12px;
  line-height:1.45;
  box-shadow:0 6px 18px rgba(0,0,0,.05);
}
.okm-tech-cloud:before{
  content:"";
  position:absolute;
  top:-8px;
  left:24px;
  width:14px;
  height:14px;
  background:#fff4d8;
  border-left:1px solid #ffbd59;
  border-top:1px solid #ffbd59;
  transform:rotate(45deg);
}
.okm-tech-cloud strong{
  display:block;
  margin-bottom:4px;
  font-weight:700;
}
.okm-tech-cloud span{
  display:block;
  font-weight:400;
}


/* V1.8 — producto del cliente + transparencia PNG */
.okm-source-toggle{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:12px;
}
.okm-source-toggle button{
  border:1px solid #ddd;
  background:#fff;
  color:#222;
  border-radius:11px;
  padding:10px 8px;
  font-weight:700;
  cursor:pointer;
}
.okm-source-toggle button.active{
  background:#ffbd59;
  border-color:#ffbd59;
}
.okm-customer-card{
  background:#fff8df;
  border:1px solid #ffbd59;
  border-radius:12px;
  padding:12px;
  margin-bottom:12px;
}
.okm-customer-card strong{display:block;color:#222}
.okm-customer-card small{display:block;margin-top:3px}
.okm-field-label{
  display:block;
  font-size:12px;
  font-weight:700;
  color:#222;
  margin:8px 0 5px;
}

/* Cuando hay PNG transparente no pintar un fondo encima */
.okm-zone.has-design{
  background:transparent !important;
}
.okm-zone.has-design img{
  background:transparent !important;
}
.okm-zone.has-design{
  border-style:dashed;
}


/* V1.9 — responsive corregido para selector de origen */
.okmae-cotizador{
  overflow-x:hidden;
}
.okm-panel{
  min-width:0;
}
.okm-source-toggle{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
.okm-source-toggle button{
  width:100%;
  min-width:0;
  white-space:normal;
  line-height:1.2;
  overflow-wrap:anywhere;
}
.okm-customer-card,
[data-customer-mode],
[data-store-mode]{
  min-width:0;
  max-width:100%;
}
.okm-customer-card strong,
.okm-customer-card small{
  overflow-wrap:anywhere;
}
.okm-input,
.okm-change-product{
  max-width:100%;
}
@media(max-width:720px){
  .okm-grid{
    grid-template-columns:1fr !important;
  }
  .okm-panel{
    width:100%;
    max-width:100%;
    padding:16px !important;
  }
  .okm-source-toggle{
    grid-template-columns:1fr !important;
    gap:8px;
  }
  .okm-source-toggle button{
    width:100%;
    font-size:13px;
    padding:12px 10px;
  }
  .okm-customer-card{
    width:100%;
    padding:12px;
  }
  .okm-viewer{
    width:100%;
    min-width:0;
    overflow:hidden;
  }
}
@media(max-width:430px){
  .okm-head{
    padding:14px 16px;
  }
  .okm-logo{
    font-size:22px;
  }
  .okm-panel h3{
    font-size:15px;
  }
  .okm-source-toggle button{
    font-size:12px;
  }
}


/* V2.0 — ZONAS LATERALES CORREGIDAS
   En los laterales solo debe verse la zona de la manga.
   Las posiciones están ajustadas sobre la tela blanca de cada manga. */

/* Lateral izquierdo */
.okm-view[data-view="left"] .manga-izq{
  left:57% !important;
  top:36% !important;
  width:18% !important;
  height:14% !important;
  transform:rotate(-6deg) !important;
}

/* Lateral derecho */
.okm-view[data-view="right"] .manga-der{
  left:24% !important;
  top:36% !important;
  width:18% !important;
  height:14% !important;
  transform:rotate(6deg) !important;
}

/* En vistas laterales, ocultar por seguridad cualquier zona que no sea manga */
.okm-view[data-view="left"] .okm-zone:not(.manga-izq),
.okm-view[data-view="right"] .okm-zone:not(.manga-der){
  display:none !important;
}

/* Hacer el área de manga más limpia visualmente */
.okm-view[data-view="left"] .manga-izq,
.okm-view[data-view="right"] .manga-der{
  border-radius:9px !important;
  background:rgba(255,255,255,.68) !important;
  padding:0 !important;
}

.okm-view[data-view="left"] .manga-izq.has-design,
.okm-view[data-view="right"] .manga-der.has-design{
  background:transparent !important;
}

/* La vista lateral derecha debe mirar hacia la derecha */
.okm-view[data-view="right"] > img{
  transform:scaleX(-1) !important;
  transform-origin:center center !important;
}


/* V2.2 — vistas individuales restauradas */
.okm-viewer{
  background:#fff !important;
}
.okm-stage{
  background:#fff !important;
  box-shadow:none !important;
  overflow:hidden !important;
}
.okm-view{
  background:#fff !important;
}
.okm-view>img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  background:#fff !important;
  transform:none !important;
}

/* En cada vista SOLO aparecen sus zonas correspondientes */
.okm-view[data-view="front"] .okm-zone:not(.pecho-der):not(.pecho-izq):not(.pecho-centro){
  display:none !important;
}
.okm-view[data-view="left"] .okm-zone:not(.manga-izq){
  display:none !important;
}
.okm-view[data-view="right"] .okm-zone:not(.manga-der){
  display:none !important;
}
.okm-view[data-view="back"] .okm-zone:not(.nuca):not(.espalda-centro):not(.espalda-inferior){
  display:none !important;
}

/* Zonas sin relleno: solo trazo amarillo */
.okm-zone{
  background:transparent !important;
  border:2px dashed #ffbd59 !important;
  color:#ffbd59 !important;
  box-shadow:none !important;
}
.okm-zone span{
  color:#222 !important;
  background:rgba(255,255,255,.88) !important;
  border-radius:6px;
  padding:2px 4px;
}
.okm-zone:hover{
  background:rgba(255,189,89,.06) !important;
}
.okm-zone.has-design{
  background:transparent !important;
}
.okm-zone.has-design img{
  background:transparent !important;
  object-fit:contain !important;
}

/* Posiciones sobre las vistas individuales nuevas */
.pecho-der{
  left:30% !important;
  top:35% !important;
  width:16% !important;
  height:9% !important;
}
.pecho-izq{
  left:54% !important;
  top:35% !important;
  width:16% !important;
  height:9% !important;
}
.pecho-centro{
  left:35% !important;
  top:46% !important;
  width:30% !important;
  height:19% !important;
}
.okm-view[data-view="right"] .manga-der{
  left:31% !important;
  top:38% !important;
  width:18% !important;
  height:13% !important;
  transform:rotate(3deg) !important;
}
.okm-view[data-view="left"] .manga-izq{
  left:51% !important;
  top:38% !important;
  width:18% !important;
  height:13% !important;
  transform:rotate(-3deg) !important;
}
.nuca{
  left:40% !important;
  top:31% !important;
  width:20% !important;
  height:7% !important;
}
.espalda-centro{
  left:33% !important;
  top:41% !important;
  width:34% !important;
  height:22% !important;
}
.espalda-inferior{
  left:36% !important;
  top:64% !important;
  width:28% !important;
  height:8% !important;
}


/* V2.3 — vistas individuales reales, sin láminas compuestas */
.okm-viewer{background:#fff !important}
.okm-stage{
  background:#fff !important;
  box-shadow:none !important;
  overflow:hidden !important;
}
.okm-view{background:#fff !important}
.okm-view>img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  background:#fff !important;
  transform:none !important;
}

/* Frente */
.pecho-der{
  left:31% !important;
  top:36% !important;
  width:16% !important;
  height:8% !important;
}
.pecho-izq{
  left:53% !important;
  top:36% !important;
  width:16% !important;
  height:8% !important;
}
.pecho-centro{
  left:35% !important;
  top:46% !important;
  width:30% !important;
  height:18% !important;
}

/* Laterales: solo manga */
.okm-view[data-view="left"] .okm-zone:not(.manga-izq),
.okm-view[data-view="right"] .okm-zone:not(.manga-der){
  display:none !important;
}
.okm-view[data-view="left"] .manga-izq{
  left:53% !important;
  top:36% !important;
  width:17% !important;
  height:13% !important;
  transform:rotate(-3deg) !important;
}
.okm-view[data-view="right"] .manga-der{
  left:30% !important;
  top:36% !important;
  width:17% !important;
  height:13% !important;
  transform:rotate(3deg) !important;
}

/* Espalda */
.nuca{
  left:40% !important;
  top:31% !important;
  width:20% !important;
  height:7% !important;
}
.espalda-centro{
  left:33% !important;
  top:41% !important;
  width:34% !important;
  height:21% !important;
}
.espalda-inferior{
  left:36% !important;
  top:62% !important;
  width:28% !important;
  height:8% !important;
}

/* Selección solo con trazo amarillo */
.okm-zone{
  background:transparent !important;
  border:2px dashed #ffbd59 !important;
  box-shadow:none !important;
  color:#ffbd59 !important;
}
.okm-zone span{
  color:#222 !important;
  background:rgba(255,255,255,.9) !important;
  border-radius:6px;
  padding:2px 4px;
}
.okm-zone.has-design,
.okm-zone.has-design img{
  background:transparent !important;
}


/* V2.4 — mascota ampliada dentro del emulador */
.okm-stage{
  width:390px !important;
  max-width:min(78vw,390px) !important;
  aspect-ratio:3/4 !important;
}
.okm-view>img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}

/* Frente — zonas proporcionales a la mascota ampliada */
.pecho-der{
  left:31% !important;
  top:34% !important;
  width:17% !important;
  height:9% !important;
}
.pecho-izq{
  left:52% !important;
  top:34% !important;
  width:17% !important;
  height:9% !important;
}
.pecho-centro{
  left:34% !important;
  top:44% !important;
  width:32% !important;
  height:20% !important;
}

/* Espalda */
.nuca{
  left:39% !important;
  top:29% !important;
  width:22% !important;
  height:7% !important;
}
.espalda-centro{
  left:32% !important;
  top:39% !important;
  width:36% !important;
  height:23% !important;
}
.espalda-inferior{
  left:35% !important;
  top:63% !important;
  width:30% !important;
  height:8% !important;
}

/* Laterales */
.okm-view[data-view="left"] .manga-izq{
  left:53% !important;
  top:34% !important;
  width:18% !important;
  height:13% !important;
}
.okm-view[data-view="right"] .manga-der{
  left:29% !important;
  top:34% !important;
  width:18% !important;
  height:13% !important;
}

@media(max-width:600px){
  .okm-stage{
    width:310px !important;
    max-width:calc(100vw - 92px) !important;
  }
}


/* V2.5 — ajuste fino de escala de mascota */
.okm-stage{
  width:410px !important;
  max-width:min(82vw,410px) !important;
  aspect-ratio:3/4 !important;
}

/* La mascota ocupa prácticamente todo el lienzo */
.okm-view>img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
}

/* Frente */
.pecho-der{
  left:30.5% !important;
  top:33.5% !important;
  width:17.5% !important;
  height:9% !important;
}
.pecho-izq{
  left:52% !important;
  top:33.5% !important;
  width:17.5% !important;
  height:9% !important;
}
.pecho-centro{
  left:33.5% !important;
  top:43.5% !important;
  width:33% !important;
  height:20.5% !important;
}

/* Espalda */
.nuca{
  left:39% !important;
  top:28.5% !important;
  width:22% !important;
  height:7% !important;
}
.espalda-centro{
  left:31.5% !important;
  top:38.5% !important;
  width:37% !important;
  height:23.5% !important;
}
.espalda-inferior{
  left:35% !important;
  top:62.5% !important;
  width:30% !important;
  height:8% !important;
}

/* Laterales */
.okm-view[data-view="left"] .manga-izq{
  left:52.5% !important;
  top:33.5% !important;
  width:18.5% !important;
  height:13.5% !important;
}
.okm-view[data-view="right"] .manga-der{
  left:29% !important;
  top:33.5% !important;
  width:18.5% !important;
  height:13.5% !important;
}

@media(max-width:600px){
  .okm-stage{
    width:325px !important;
    max-width:calc(100vw - 86px) !important;
  }
}


/* V2.6 — mascota más grande respecto a las zonas */
.okm-stage{
  overflow:hidden !important;
}

/* Ampliar solo la imagen de la mascota, no las zonas */
.okm-view>img{
  transform:scale(1.14) !important;
  transform-origin:center center !important;
  object-fit:contain !important;
}

/* Frente: cuadros un poco más adentro para quedar totalmente sobre la tela */
.pecho-der{
  left:32% !important;
  top:34.5% !important;
  width:15.5% !important;
  height:8.5% !important;
}
.pecho-izq{
  left:52.5% !important;
  top:34.5% !important;
  width:15.5% !important;
  height:8.5% !important;
}
.pecho-centro{
  left:35% !important;
  top:44.5% !important;
  width:30% !important;
  height:19% !important;
}

/* Espalda proporcional a la nueva escala */
.nuca{
  left:40% !important;
  top:29.5% !important;
  width:20% !important;
  height:6.5% !important;
}
.espalda-centro{
  left:33% !important;
  top:40% !important;
  width:34% !important;
  height:22% !important;
}
.espalda-inferior{
  left:36% !important;
  top:63% !important;
  width:28% !important;
  height:7.5% !important;
}

/* Mangas proporcionalmente más centradas sobre la tela */
.okm-view[data-view="left"] .manga-izq{
  left:53% !important;
  top:35% !important;
  width:16.5% !important;
  height:12% !important;
}
.okm-view[data-view="right"] .manga-der{
  left:30.5% !important;
  top:35% !important;
  width:16.5% !important;
  height:12% !important;
}

/* En móvil ampliar un poco menos para evitar recortes */
@media(max-width:600px){
  .okm-view>img{
    transform:scale(1.10) !important;
  }
}


/* V2.7 — corrección real del tamaño del emulador */
.okm-stage{
  width:430px !important;
  max-width:min(84vw,430px) !important;
  aspect-ratio:500/760 !important;
  overflow:visible !important;
  background:#fff !important;
}

.okm-view{
  overflow:visible !important;
  background:#fff !important;
}

.okm-view>img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  transform:none !important;
  background:#fff !important;
}

/* Frente — zonas centradas sobre la camiseta */
.pecho-der{
  left:31% !important;
  top:35% !important;
  width:16% !important;
  height:8% !important;
}
.pecho-izq{
  left:53% !important;
  top:35% !important;
  width:16% !important;
  height:8% !important;
}
.pecho-centro{
  left:35% !important;
  top:45% !important;
  width:30% !important;
  height:18% !important;
}

/* Espalda */
.nuca{
  left:40% !important;
  top:30% !important;
  width:20% !important;
  height:6.5% !important;
}
.espalda-centro{
  left:33% !important;
  top:40.5% !important;
  width:34% !important;
  height:21% !important;
}
.espalda-inferior{
  left:36% !important;
  top:63% !important;
  width:28% !important;
  height:7.5% !important;
}

/* Laterales */
.okm-view[data-view="left"] .manga-izq{
  left:53% !important;
  top:35% !important;
  width:17% !important;
  height:12% !important;
}
.okm-view[data-view="right"] .manga-der{
  left:30% !important;
  top:35% !important;
  width:17% !important;
  height:12% !important;
}

/* Solo contorno amarillo */
.okm-zone{
  background:transparent !important;
  border:2px dashed #ffbd59 !important;
  box-shadow:none !important;
}
.okm-zone.has-design,
.okm-zone.has-design img{
  background:transparent !important;
}

@media(max-width:600px){
  .okm-stage{
    width:320px !important;
    max-width:calc(100vw - 84px) !important;
  }
}


/* V2.8 — corrección puntual de MANGA DERECHA
   En esta vista la manga real está al lado derecho visual del torso.
   Movemos la zona desde el pecho hacia la tela blanca de la manga. */
.okm-view[data-view="right"] .manga-der{
  left:61% !important;
  top:35.5% !important;
  width:15.5% !important;
  height:12.5% !important;
  transform:rotate(-8deg) !important;
  transform-origin:center center !important;
}

/* En el lateral derecho únicamente debe existir esta zona */
.okm-view[data-view="right"] .okm-zone:not(.manga-der){
  display:none !important;
}

/* Mantener la selección limpia */
.okm-view[data-view="right"] .manga-der{
  background:transparent !important;
  border:2px dashed #ffbd59 !important;
  box-shadow:none !important;
}

/* V2.9 — WhatsApp + guardado de cotización */
.okm-whatsapp{cursor:pointer}

/* V3.0 */
.okm-whatsapp{cursor:pointer}

/* V3.1 */
.okm-whatsapp{cursor:pointer}

/* V3.6: guardado progresivo */
.okm-uploading-note{font-size:11px;color:#777}
