/* Estilos que antes se inyectaban desde JavaScript. La política de seguridad del sitio
   (style-src 'self') bloquea los <style> creados por script, por eso viven acá. */

/* advanced.js */
#offset-dialog{position:fixed;margin:0;width:min(390px,calc(100vw - 24px));max-height:calc(100dvh - 28px);overflow:auto;padding:18px;border:1px solid #b7c0cb;border-radius:12px;box-shadow:0 14px 46px #0004;background:var(--panel,#fff);color:inherit;z-index:50}#offset-dialog::backdrop{background:transparent;backdrop-filter:none}#offset-dialog h2{cursor:grab;user-select:none;touch-action:none;margin:0 0 8px;font-size:1.16rem}#offset-dialog h2:active{cursor:grabbing}#offset-dialog .offset-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}#offset-dialog label{display:flex;flex-direction:column;gap:5px;font-size:.87rem}#offset-dialog input:not([type=checkbox]),#offset-dialog select{width:100%;min-width:0;padding:7px;border:1px solid #b3bcc8;border-radius:6px;background:var(--panel,#fff);color:inherit}#offset-dialog .offset-sides{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;margin:8px 0;padding:8px 10px;border:1px solid #d3d9e1;border-radius:6px}#offset-dialog .offset-sides legend{font-size:.82rem;padding:0 4px}#offset-dialog .offset-sides label{flex-direction:row;align-items:center;gap:6px}#offset-dialog .offset-sides small{grid-column:1/-1;font-size:.76rem;line-height:1.35;opacity:.75}#offset-dialog .offset-check{flex-direction:row;align-items:center;gap:8px;margin:10px 0}#offset-dialog .offset-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}#offset-dialog .offset-help{font-size:.81rem;line-height:1.45;opacity:.8;margin:7px 0}#offset-message[data-error=true]{color:#c83b37}#offset-message{min-height:2em;font-size:.82rem;margin:8px 0}#offset-dialog input[type=range]{padding:0;border:0;background:transparent;accent-color:#ed891d;cursor:pointer}#offset-button{white-space:normal}

/* advanced.js */
#flex-dialog{position:fixed;margin:0;width:min(400px,calc(100vw - 24px));max-height:calc(100dvh - 28px);overflow:auto;padding:16px 18px;border:0;border-radius:12px;box-shadow:0 18px 50px #0004}#flex-dialog::backdrop{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}#flex-dialog h2{margin:0 0 6px;font-size:1.12rem}#flex-dialog .flex-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px 10px;margin:10px 0}#flex-dialog label{display:flex;flex-direction:column;gap:4px;font-size:.85rem}#flex-dialog .flex-wide{grid-column:1/-1}#flex-dialog input,#flex-dialog select{padding:6px;border:1px solid #b3bcc8;border-radius:6px;min-width:0}#flex-dialog details{font-size:.85rem;margin:6px 0}#flex-dialog .flex-summary{background:#eef5fd;border-radius:8px;padding:8px 10px;font-size:.86rem;line-height:1.5}#flex-dialog .flex-help{font-size:.78rem;opacity:.75;line-height:1.4;margin:6px 0}#flex-dialog .flex-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}

/* advanced.js */
#pen-menu{position:fixed;z-index:60;display:flex;flex-direction:column;gap:3px;padding:6px;background:#fff;border:1px solid #cfd6e0;border-radius:10px;box-shadow:0 12px 30px #0003;width:86px}#pen-menu[hidden]{display:none}#pen-menu button{width:100%}#pen-group b{font-weight:600}

/* corner-radius.js */
#corner-mode-switch{position:fixed;z-index:1000;display:flex;align-items:center;gap:5px;padding:7px;border:1px solid #d5dce2;border-radius:9px;background:#fffdf9;box-shadow:0 6px 20px #1824302b;font:12px system-ui,sans-serif;color:#3d4b56;white-space:nowrap}#corner-mode-switch[hidden]{display:none!important}#corner-mode-switch span{font-weight:600;padding:0 6px}#corner-mode-switch button{border:1px solid #c9d3dc;border-radius:6px;background:#fff;color:#263744;padding:8px 10px;cursor:pointer}#corner-mode-switch button[aria-pressed="true"]{border-color:#f58a25;background:#fff0df;color:#873b00;font-weight:700}

/* inline-dimensions.js */
#inline-dimension-editor{position:absolute;z-index:60;width:min(342px,calc(100% - 12px));box-sizing:border-box;background:#fffdf9;border:1px solid #e58f2f;box-shadow:0 12px 36px #17253636;border-radius:10px;padding:12px;color:#28333d;font:12px/1.4 system-ui,sans-serif}#inline-dimension-editor[hidden]{display:none!important}#inline-dimension-editor .inline-dimension-title{display:flex;justify-content:space-between;font-weight:700;font-size:13px;align-items:center;margin-bottom:12px}#inline-dimension-editor .inline-dimension-title button{border:0;background:none;font-size:19px;cursor:pointer;padding:0 4px;color:#68737e}#inline-dimension-editor .inline-dimension-pair{display:grid;grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr);gap:7px;align-items:end}#inline-dimension-editor .inline-dimension-pair label{display:block;min-width:0;font-weight:600;color:#394a59}#inline-dimension-editor .inline-dimension-times{text-align:center;font-size:20px;font-weight:600;color:#84919e;line-height:35px}#inline-dimension-editor .inline-dimension-number{display:flex;align-items:center;gap:5px;margin-top:6px}#inline-dimension-editor .inline-dimension-number span{color:#72808a;font-size:11px}#inline-dimension-editor .inline-dimension-number input{width:100%;min-width:0;box-sizing:border-box;border:1px solid #a9b8c6;border-radius:6px;padding:7px 7px;font:600 15px system-ui,sans-serif;color:#202b37;background:#fff}#inline-dimension-editor .inline-dimension-number input:focus{outline:2px solid #ff9c51;outline-offset:1px}#inline-dimension-editor #inline-dimension-hint{font-size:10px;color:#647481;margin-top:8px}#inline-dimension-editor .inline-dimension-actions{display:flex;justify-content:flex-end;gap:6px;margin-top:11px}#inline-dimension-editor .inline-dimension-actions button{padding:6px 10px;border:1px solid #ccd3d9;border-radius:6px;background:white;cursor:pointer}#inline-dimension-editor .inline-dimension-actions button[type=submit]{background:#ff7a1a;border-color:#ff7a1a;color:white;font-weight:700}

/* advanced.js: asa para mover la selección en pantallas táctiles */
#move-handle{cursor:move}
#move-handle g{touch-action:none}

/* Quitar fondo y recorte con el mouse (advanced.js) */
#bgremove-dialog{width:min(760px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;padding:18px 20px;border:1px solid #b7c0cb;border-radius:12px}
#bgremove-stage{position:relative;overflow:hidden;height:min(380px,48vh);touch-action:none;margin:8px 0;border:1px solid #dce1e9;border-radius:8px;background:conic-gradient(#e9edf2 25%,#fff 0 50%,#e9edf2 0 75%,#fff 0) 0 0/16px 16px}
#bgremove-canvas{position:absolute;left:0;top:0;max-width:none;max-height:none;transform-origin:0 0;cursor:crosshair}#bgremove-canvas.pixelated{image-rendering:pixelated}
.bgremove-zoom{position:absolute;right:8px;bottom:8px;display:flex;align-items:center;gap:4px;padding:4px 6px;border-radius:8px;background:#ffffffe6;box-shadow:0 2px 10px #14202e30;font-size:12px}.bgremove-zoom button{min-width:28px;height:26px;padding:0 6px;border:1px solid #b7c0cb;border-radius:6px;background:#fff;cursor:pointer}.bgremove-zoom span{min-width:42px;text-align:center}
.bgremove-swatch{display:inline-block;width:22px;height:16px;border:1px solid #6b7686;border-radius:4px;vertical-align:middle;margin-left:6px}
#bgremove-dialog output{margin-left:6px;font-weight:700}
#bgremove-dialog input[type=range]{width:100%}
#crop-preview,#crop-preview svg{touch-action:none}#crop-preview svg{cursor:crosshair}

/* Crear matriz: giro propio de cada pieza */
.matrix-spin{display:block;margin:10px 0 2px;font-weight:600}.matrix-spin output{margin-left:6px;font-weight:700;color:#d96a00}.matrix-spin input[type=range]{display:block;width:100%;margin-top:6px}

/* Quitar fondo: lista de colores */
.bgremove-colors-box{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-weight:600}
#bgremove-colors{display:flex;flex-wrap:wrap;gap:6px;min-height:24px;align-items:center}
#bgremove-colors span{font-weight:400;font-size:12px;color:#6b7686}
.bgremove-chip{width:26px;height:22px;padding:0;border:1px solid #6b7686;border-radius:5px;color:#fff;text-shadow:0 0 3px #000;font-size:14px;line-height:1;cursor:pointer}
.bgremove-colors-box>button{margin-left:auto;font-size:12px;padding:4px 8px;border:1px solid #b7c0cb;border-radius:6px;background:#fff;cursor:pointer}

/* Partir pieza (advanced.js): ventana flotante que se puede mover para ver la vista previa */
#split-dialog{position:fixed;inset:auto;margin:0;z-index:60;max-width:390px;width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow-y:auto;padding:18px 20px;border:1px solid #b7c0cb;border-radius:12px}
#split-dialog::backdrop{background:transparent;backdrop-filter:none}
#split-dialog-title{cursor:grab;touch-action:none;user-select:none;font-size:17px;margin:0 0 8px;padding:4px 0 12px;border-bottom:1px solid var(--line)}
#split-dialog-title:active{cursor:grabbing}
#split-dialog .field-grid{gap:5px 10px}
#split-dialog .field-grid label{margin:5px 0}
#split-dialog p{margin:9px 0;font-size:11px}
#split-dialog output{margin-left:6px;font-weight:700}
#split-dialog input[type=range],#split-dialog select{width:100%}
#split-dialog #split-message{min-height:16px;white-space:pre-line;color:#546375}
#split-dialog #split-message[data-error="true"]{color:#b03023}
#split-dialog .split-machine input{width:64px}
#split-dialog [hidden]{display:none}

/* Rompecabezas (advanced.js): ventana flotante como la de Partir pieza */
#puzzle-dialog{position:fixed;inset:auto;margin:0;z-index:60;max-width:390px;width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow-y:auto;padding:18px 20px;border:1px solid #b7c0cb;border-radius:12px}
#puzzle-dialog::backdrop{background:transparent;backdrop-filter:none}
#puzzle-dialog-title{cursor:grab;touch-action:none;user-select:none;font-size:17px;margin:0 0 8px;padding:4px 0 12px;border-bottom:1px solid var(--line)}
#puzzle-dialog-title:active{cursor:grabbing}
#puzzle-dialog .field-grid{gap:5px 10px}
#puzzle-dialog .field-grid label{margin:5px 0}
#puzzle-dialog p{margin:9px 0;font-size:11px}
#puzzle-dialog output{margin-left:6px;font-weight:700}
#puzzle-dialog input[type=range],#puzzle-dialog select{width:100%}
#puzzle-dialog #puzzle-message{min-height:16px;white-space:pre-line;color:#546375}
#puzzle-dialog #puzzle-message[data-error="true"]{color:#b03023}
#puzzle-dialog .split-machine input[type=number]{width:72px}
#puzzle-dialog [hidden]{display:none}

/* Cesto de basura flotante (tablet y teléfono) */
.trash-fab{display:none;position:absolute;right:12px;bottom:58px;width:52px;height:52px;padding:0;border-radius:50%;align-items:center;justify-content:center;background:#fff;border:2px solid #c0392b;color:#c0392b;box-shadow:var(--shadow);z-index:5}
.trash-fab svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.trash-fab:active{background:#c0392b;color:#fff}
@media (hover:none),(pointer:coarse),(max-width:900px){.trash-fab:not([hidden]){display:flex}}