/* editor.css — Editor de mapas (rediseño "plano de obra") + editor de HUD móvil.
   Las dos reglas #hudEditor* son del editor de HUD (no del mapa) y se conservan tal cual. */

#hudEditorOverlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,50,0,0.5);z-index:5000;display:none;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,0.1) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.1) 1px,transparent 1px);background-size:20px 20px;}

#hudEditorControls{position:absolute;top:10px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.8);padding:10px;border-radius:8px;border:1px solid var(--primary);pointer-events:auto;display:flex;gap:10px;}

/* ───────────── Editor de mapas ───────────── */
#editorUI{position:fixed;inset:0;z-index:900;overflow:hidden;pointer-events:none;background:#0e0c09;touch-action:none}
#editorUI>*{pointer-events:auto}
#editorCanvas{position:absolute;inset:0;display:block;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;outline:0}
#editorUI .ed-tip{pointer-events:none}

.ed-top{position:absolute;z-index:4;left:0;right:0;top:0;display:flex;align-items:center;gap:.45em;
  padding:calc(.4em + env(safe-area-inset-top,0px)) calc(.5em + env(safe-area-inset-right,0px)) .4em calc(.5em + env(safe-area-inset-left,0px));
  background:rgba(14,12,9,.92);border-bottom:1px solid var(--mn-line);touch-action:manipulation}
.ed-spacer{flex:1 1 0;min-width:0}
/* Alturas táctiles (>=44px). Con id para ganar a .mn-sm{min-height:32px} del tema, que se carga después. */
#editorUI .ed-btn,.ed-over .ed-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.4em;flex:none;
  min-height:44px;min-width:44px;padding:0 .8em;font-size:.9em;white-space:nowrap}
#editorUI .ed-sq,.ed-over .ed-sq{padding:0;width:44px}
.ed-ico{width:1.4em;height:1.4em;flex:none;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ed-ico circle{fill:currentColor;stroke:none}
.ed-dot{display:none;position:absolute;top:.3em;right:.3em;width:.6em;height:.6em;background:var(--mn-paint);border:1px solid var(--mn-line)}
.ed-dirty .ed-dot{display:block}
.ed-i-ok{display:none}
.ed-ok{color:var(--mn-paint)}
.ed-ok .ed-i-ok{display:block}
.ed-ok .ed-i-save,.ed-ok .ed-dot{display:none}
.ed-seg{display:flex;flex:none;gap:0}
#editorUI .ed-chip{display:flex;align-items:center;gap:.5em;min-height:44px;min-width:0;flex:0 1 15em;padding:0 .6em;text-align:left}
.ed-chip-ico{width:2em;height:2em;flex:none}
.ed-chip-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9em}
.ed-chev{width:1.1em;height:1.1em;flex:none;transition:transform .15s}
.ed-chip.open .ed-chev{transform:rotate(180deg)}

.ed-drawer{position:absolute;z-index:3;left:calc(.4em + env(safe-area-inset-left,0px));top:calc(var(--ed-top,56px) + .35em);
  bottom:calc(.4em + env(safe-area-inset-bottom,0px));width:min(22em,48vw);display:flex;min-height:0;
  background:rgba(29,22,16,.95);border:1px solid var(--mn-line);box-shadow:inset 0 .08em 0 rgba(255,220,180,.12)}
.ed-drawer.closed{display:none}
.ed-rail{flex:none;width:7em;display:flex;flex-direction:column;padding:.25em;border-right:1px solid var(--mn-sep);
  overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}
.ed-rail *,.ed-tiles *{touch-action:pan-y}
.ed-rail button,.ed-tiles button{touch-action:manipulation}
#editorUI .ed-cat{flex:none;min-height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.05em;padding:.15em .1em;margin-bottom:.15em}
.ed-cat canvas{width:1.5em;height:1.5em}
.ed-cat span{font-size:max(9px,.55em);line-height:1.05;letter-spacing:0;text-align:center;overflow-wrap:normal;word-break:keep-all;max-width:100%}
.ed-tiles{flex:1;min-width:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(5.4em,1fr));gap:.35em;align-content:start;
  padding:.35em;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}
#editorUI .ed-tile{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.2em;min-width:0;min-height:44px;padding:.35em .2em}
.ed-tile canvas{flex:none}
.ed-tname{font-size:max(9px,.62em);line-height:1.1;letter-spacing:0;text-align:center;overflow-wrap:break-word}

.ed-zoom{position:absolute;z-index:3;right:calc(.5em + env(safe-area-inset-right,0px));bottom:calc(.5em + env(safe-area-inset-bottom,0px));
  display:flex;flex-direction:column;gap:.35em;touch-action:manipulation}
.ed-help{position:absolute;z-index:3;right:calc(5em + env(safe-area-inset-right,0px));bottom:calc(.6em + env(safe-area-inset-bottom,0px));
  max-width:min(26em,44vw);display:flex;align-items:center;gap:.4em;padding:.4em .2em .4em .8em;
  background:var(--mn-scrim);border:1px solid var(--mn-sep);color:var(--mn-bone);font-size:.85em;line-height:1.35}
.ed-help-x{flex:none;min-width:44px;min-height:44px;background:none;border:0;color:var(--mn-bone);font-size:1.6em;line-height:1;cursor:pointer}
.ed-tip{position:absolute;z-index:5;background:var(--mn-ink);color:var(--mn-bone);border:1px solid var(--mn-paint);
  padding:.25em .55em;font-size:.85em;white-space:nowrap}

/* Diálogos (se montan en <body> sobre .mn-over) */
.ed-over{z-index:1100}
.ed-dialog{overflow:hidden!important}
.ed-dbody{flex:1 1 auto;min-height:0;margin-top:.5em;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;text-align:left}
.ed-dbody,.ed-dbody *{touch-action:pan-y}
.ed-dbody button,.ed-dbody input,.ed-dbody textarea{touch-action:manipulation}
.ed-text{margin:.2em 0 0}
.ed-code{display:block;width:100%;min-height:6em;resize:none;font-size:.8em;user-select:text;-webkit-user-select:text}
.ed-err{margin:.4em 0 0}
.ed-danger{color:var(--mn-danger)}
.ed-menu{display:grid;grid-template-columns:1fr 1fr;gap:.4em}
.ed-over .ed-mrow{min-height:44px;width:100%;justify-content:center;text-align:center}
.ed-prow{display:block;margin:.5em 0 .9em}
.ed-prow-sw{display:flex;align-items:center;justify-content:space-between;gap:.8em;min-height:44px;margin:.2em 0 .6em;padding-right:.6em}
.ed-ptop{display:flex;justify-content:space-between;gap:.6em;margin-bottom:.2em;font-size:.9em}
.ed-pval{color:var(--mn-paint)}
.ed-prow .mn-slider{width:100%;margin:.2em 0}

/* Avisos sobre el editor: debajo de la barra, centrados y por encima de todo */
body.ed-open #toastContainer{z-index:1200;top:calc(var(--ed-top,56px) + .5em);left:50%;transform:translateX(-50%);align-items:center;max-width:min(80vw,26em)}

/* Vista previa 3D de props */
.ed-prev{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.8em;align-items:start}
.ed-prev-list{display:flex;flex-direction:column;gap:.3em;max-height:13em;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;touch-action:pan-y}
.ed-over .ed-prev-list button{display:flex;align-items:center;gap:.5em;min-height:44px;text-align:left;width:100%}
.ed-prev-list canvas{width:1.8em;height:1.8em;flex:none}
.ed-prev-view{display:flex;flex-direction:column;align-items:center;gap:.5em}
.ed-prev-view canvas{width:100%;max-width:14em;aspect-ratio:11/9;background:#14100b;border:1px solid var(--mn-line)}
.ed-prev-rot{display:flex;gap:.5em}
.ed-prev-hint{margin:0;font-size:.8em;color:var(--mn-clay);text-align:center}

/* Barras de scroll finas y rústicas (solo editor y menús .mn-root; el HUD conserva las suyas) */
#editorUI *,.ed-over *,.mn-root *{scrollbar-width:thin;scrollbar-color:var(--mn-rust) var(--mn-field)}
#editorUI ::-webkit-scrollbar,.ed-over ::-webkit-scrollbar,.mn-root ::-webkit-scrollbar{width:.5em;height:.5em}
#editorUI ::-webkit-scrollbar-track,.ed-over ::-webkit-scrollbar-track,.mn-root ::-webkit-scrollbar-track{background:var(--mn-field)}
#editorUI ::-webkit-scrollbar-thumb,.ed-over ::-webkit-scrollbar-thumb,.mn-root ::-webkit-scrollbar-thumb{background:var(--mn-rust);border:1px solid var(--mn-line)}
