*{box-sizing:border-box;margin:0;padding:0}
html,body{background:#EFE6D8}
body{font-family:'Barlow Condensed',system-ui,sans-serif;display:flex;flex-direction:column;
 align-items:center;padding:22px 10px 60px;gap:16px}
.barra{display:flex;gap:9px;flex-wrap:wrap;justify-content:center}
.barra button{font-family:'Barlow Condensed',sans-serif;font-size:14px;letter-spacing:.14em;
 text-transform:uppercase;font-weight:700;background:#fff;color:#B3123C;border:2px solid #B3123C;
 padding:9px 16px;border-radius:3px;cursor:pointer}
.barra button:hover{background:#B3123C;color:#fff}
.barra button:focus-visible{outline:3px solid #0E8A6E;outline-offset:2px}
.nota{font-size:14px;color:#6B5B4A;text-align:center;max-width:700px;line-height:1.5;letter-spacing:.04em}
.escala{width:100%;overflow:hidden}
.escala>.lienzo{transform-origin:top left}
.pieza{position:relative;overflow:hidden;background:#fff}
.pieza img{display:block}
[contenteditable]:focus{outline:2px dashed #0E8A6E;outline-offset:3px}
@media print{body{padding:0;background:#fff;gap:0}.barra,.nota{display:none}
 .escala>.lienzo{transform:none!important}@page{margin:0}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

.volver{width:100%;max-width:1560px;font-size:14px;letter-spacing:.06em}
.volver a{color:#B3123C;text-decoration:none;font-weight:600}
.volver a:hover{text-decoration:underline}
.app{display:flex;gap:18px;align-items:flex-start;width:100%;max-width:1560px}
.panel-ed{position:sticky;top:14px;flex:0 0 312px;background:#fff;border:2px solid #2E1A10;
 border-radius:10px;padding:14px;max-height:95vh;overflow:auto;box-shadow:5px 5px 0 rgba(46,26,16,.16);z-index:40}
.panel-ed h3{font-family:'Chivo',sans-serif;font-weight:900;font-size:15px;text-transform:uppercase;
 letter-spacing:.13em;color:#B3123C;margin:0 0 10px}
.panel-ed h4{font-family:'Chivo',sans-serif;font-weight:900;font-size:11.5px;text-transform:uppercase;
 letter-spacing:.15em;color:#2E1A10;margin:16px 0 7px;padding-top:11px;border-top:2px solid #EFE0C6}
.fila{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.fila label{font-size:14px;color:#2E1A10;letter-spacing:.03em;flex:1}
.fila input[type=range]{width:118px;accent-color:#EC0B7B}
.fila select{font:inherit;font-size:13px;padding:4px 6px;border:1px solid #C9BCA8;border-radius:4px;background:#fff;max-width:150px}
.fila input[type=checkbox]{width:17px;height:17px;accent-color:#0E8A6E}
.destino{width:100%;font:inherit;font-size:13.5px;padding:6px;border:2px solid #2E1A10;border-radius:5px;
 background:#FFF6E3;margin-bottom:9px;font-weight:600}
.swatches{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin-bottom:8px}
.sw{aspect-ratio:1;border-radius:4px;border:2px solid rgba(46,26,16,.22);cursor:pointer;padding:0}
.sw:hover{transform:scale(1.16)}
.sw:focus-visible{outline:3px solid #0E8A6E;outline-offset:2px}
.libre{display:flex;gap:6px;align-items:center;margin-bottom:6px}
.libre input[type=color]{width:44px;height:30px;padding:0;border:1px solid #C9BCA8;border-radius:4px;background:none;cursor:pointer}
.libre span{font-size:12.5px;color:#6B5B4A;line-height:1.25}
.btnfila{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.mini{font-family:'Chivo',sans-serif;font-size:11.5px;font-weight:900;letter-spacing:.09em;
 text-transform:uppercase;background:#fff;color:#B3123C;border:2px solid #B3123C;border-radius:5px;
 padding:8px 10px;cursor:pointer;flex:1;min-width:84px}
.mini:hover{background:#B3123C;color:#fff}
.mini:focus-visible{outline:3px solid #0E8A6E;outline-offset:2px}
.mini.full{flex:1 0 100%}
.mini.verde{color:#0E8A6E;border-color:#0E8A6E}
.mini.verde:hover{background:#0E8A6E;color:#fff}
.tip{font-size:12.5px;color:#6B5B4A;line-height:1.45;margin-top:7px}
.modos{display:flex;border:2px solid #2E1A10;border-radius:7px;overflow:hidden;margin-bottom:4px}
.modos button{flex:1;font-family:'Chivo',sans-serif;font-size:12px;font-weight:900;letter-spacing:.08em;
 text-transform:uppercase;padding:11px 4px;border:none;background:#fff;color:#2E1A10;cursor:pointer}
.modos button+button{border-left:2px solid #2E1A10}
.modos button[aria-pressed=true]{background:#0E8A6E;color:#fff}
.lienzos{flex:1;min-width:0;display:flex;flex-direction:column;gap:14px;align-items:center}
.pestanas{display:flex;border:2px solid #2E1A10;border-radius:8px;overflow:hidden;align-self:flex-start}
.pestanas button{font-family:'Chivo',sans-serif;font-size:12.5px;font-weight:900;letter-spacing:.08em;
 text-transform:uppercase;padding:10px 20px;border:none;background:#fff;color:#2E1A10;cursor:pointer}
.pestanas button+button{border-left:2px solid #2E1A10}
.pestanas button[aria-pressed=true]{background:#B3123C;color:#fff}
.oculta{display:none!important}
.escala>.lienzo{will-change:transform;backface-visibility:hidden}
.rotulo{font-family:'Chivo',sans-serif;font-weight:900;font-size:12.5px;letter-spacing:.16em;
 text-transform:uppercase;color:#6B5B4A;align-self:flex-start}
.pieza.acomodar{cursor:crosshair}
.pieza.acomodar *{user-select:none}

#marcaSel{position:fixed;border:2px solid #0E8A6E;box-shadow:0 0 0 2px rgba(255,255,255,.85);
 pointer-events:none;display:none;z-index:61}
.tirador{position:fixed;width:15px;height:15px;background:#fff;border:3px solid #0E8A6E;border-radius:50%;
 display:none;z-index:62;touch-action:none}
.tirador.lado{border-radius:3px;width:13px;height:13px;border-color:#EC0B7B}
.tirador:hover{background:#0E8A6E}
#mando{position:fixed;display:none;z-index:63;background:#2E1A10;border-radius:9px;padding:7px;
 box-shadow:0 8px 22px rgba(0,0,0,.34);gap:5px;align-items:center}
#mando.on{display:flex}
#mando button{width:32px;height:32px;border:none;border-radius:6px;background:#4A3122;color:#fff;
 font-size:14px;font-weight:700;cursor:pointer;font-family:'Chivo',sans-serif;line-height:1;
 display:flex;align-items:center;justify-content:center}
#mando button:hover{background:#EC0B7B}
#mando button.ancho{width:auto;padding:0 11px;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase}
#mando .sep{width:2px;height:24px;background:rgba(255,255,255,.22);border-radius:2px}
#mando .flechas{display:grid;grid-template-columns:repeat(3,32px);grid-template-rows:repeat(2,32px);gap:3px}
#mando .flechas button:nth-child(1){grid-area:1/2}
#mando .flechas button:nth-child(2){grid-area:2/1}
#mando .flechas button:nth-child(3){grid-area:2/2}
#mando .flechas button:nth-child(4){grid-area:2/3}
#menu{position:fixed;display:none;z-index:70;background:#fff;border:2px solid #2E1A10;border-radius:8px;
 padding:5px;box-shadow:0 10px 26px rgba(0,0,0,.28);min-width:186px}
#menu.on{display:block}
#menu button{display:block;width:100%;text-align:left;border:none;background:none;cursor:pointer;
 font-family:'Barlow Condensed',sans-serif;font-size:15px;letter-spacing:.03em;color:#2E1A10;
 padding:7px 10px;border-radius:5px}
#menu button:hover{background:#EC0B7B;color:#fff}
#menu button:disabled{opacity:.35;cursor:default}
#menu button:disabled:hover{background:none;color:#2E1A10}
#menu .linea{height:2px;background:#EFE0C6;margin:4px 2px;border-radius:2px}
.base-piso{position:absolute;pointer-events:none}
#etiqueta{position:fixed;background:#0E8A6E;color:#fff;font-family:'Chivo',sans-serif;font-size:10.5px;
 font-weight:900;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;border-radius:5px;
 display:none;z-index:63;pointer-events:none;white-space:nowrap}
@media (max-width:980px){.app{flex-direction:column}.panel-ed{position:relative;flex:1 0 auto;width:100%;max-height:none}}
@media print{.panel-ed,.rotulo,.nota,#mando,#etiqueta,#marcaSel,.tirador{display:none!important}
 .app{display:block}.lienzos{gap:0}}