/* IMAGE / EDIT — compact mobile-first image editing surface */
.engines{grid-template-columns:repeat(3,minmax(0,1fr))}
.editbench{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,375px);gap:10px;align-items:start}
.editviewer,.editpanel{min-width:0;border:1px solid var(--edge);border-radius:4px;background:var(--panel);overflow:hidden}
.editbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:9px;background:#17222d;padding:9px 12px;border-bottom:1px solid var(--edge);min-height:45px}
.editbar>div:first-child{display:flex;gap:11px;align-items:center;flex-wrap:wrap}
.editbar b,.editstrip b{font:700 10px ui-monospace,monospace;letter-spacing:.045em}
.editbar span,.editstrip span{font:9px ui-monospace,monospace;color:var(--sub)}
.editbar-actions{display:flex;align-items:center;gap:4px}
.editstage{min-height:490px;max-height:78vh;background:#0b131b;display:grid;place-items:center;position:relative;overflow:auto;isolation:isolate}
.editframe{position:relative;display:inline-block;line-height:0;max-width:100%;max-height:72vh;touch-action:none;user-select:none;box-shadow:0 12px 50px #0008}
.editframe canvas{display:block;width:auto;height:auto;max-width:100%;max-height:72vh}
#editBefore,#editMask{position:absolute;inset:0;width:100%;height:100%;max-height:none}
#editBefore{pointer-events:none;display:none}
#editMask{touch-action:none;cursor:crosshair}
.editframe.whole #editMask{pointer-events:none}
.editempty{display:grid;gap:13px;justify-items:center;padding:24px;max-width:340px;text-align:center;border:1px dashed #365064;background:#111e29b8;color:var(--ink)}
.editemptyicon{width:58px;height:58px;display:grid;place-items:center;border:1px solid #55758a;font:38px ui-monospace,monospace;color:#a7cadc}
.editempty b{font:700 12px ui-monospace,monospace;letter-spacing:.08em}
.editempty span{font-size:11px;color:var(--muted)}
.editbusy{position:absolute;z-index:5;inset:0;background:#0a1520cc;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:13px;text-align:center;padding:20px}
.editbusy strong{font:11px ui-monospace,monospace;letter-spacing:.05em}
.editbusy small{color:var(--muted);font-size:10px}
.editfoot{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:9px 12px;border-block:1px solid var(--edge);background:#101a24;min-height:38px;flex-wrap:wrap}
.editlegend{display:flex;align-items:center;gap:7px;flex-wrap:wrap;color:var(--sub);font:9px ui-monospace,monospace}
.editlegend #editSelectionInfo{color:var(--blue)}
.edit-swatch{height:10px;width:10px;background:#76c0ee77;border:1px solid #9bd0f2}
#editCompareWrap{display:flex;gap:7px;align-items:center;font:9px ui-monospace,monospace;color:var(--muted)}
#editCompareWrap input{width:110px;accent-color:var(--blue)}
.edittools{padding:12px;border-bottom:1px solid var(--edge)}
.edittoolrow{display:flex;flex-wrap:wrap;gap:5px}
.edittool{border:1px solid #364c5d;background:#182631;color:var(--muted);padding:7px 10px;border-radius:3px;font:10px ui-monospace,monospace}
.edittool.active{background:#36566a;border-color:#84b7d4;color:#e5f6ff}
.edittool:disabled{opacity:.5}
.edittoolranges{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:10px}
.edittoolranges label{display:grid;grid-template-columns:1fr auto;gap:4px 8px;font:9px ui-monospace,monospace;color:var(--muted)}
.edittoolranges label output{color:var(--ink)}
.edittoolranges input{grid-column:span 2;width:100%}
.editstrip{display:flex;justify-content:space-between;padding:10px 13px 0}
.editthumbs{display:flex;gap:8px;min-height:92px;padding:10px 12px 13px;overflow-x:auto}
.editthumb{position:relative;flex:0 0 75px;height:75px;padding:0;border:1px solid var(--edge);background:#16232d;overflow:hidden}
.editthumb img{width:100%;height:100%;object-fit:cover}
.editthumb.active{border:2px solid #a4cce3}
.editthumb span{position:absolute;right:2px;bottom:2px;font:9px ui-monospace,monospace;padding:2px 4px;background:#0b141ec7;color:#d9ebf5}
.editpanelbody{padding:12px;display:grid;gap:10px}
.editpanelbody textarea{width:100%;background:#0b141d;color:var(--ink);border:1px solid var(--edge);padding:10px;resize:vertical;min-height:115px;border-radius:3px;font-size:12px;line-height:1.55}
.editpanelbody textarea::placeholder,.edittext::placeholder{color:#6d8294}
.editpanelbody input[type=number],.editpanelbody select,.edittext{width:100%;min-width:0;min-height:34px;color:var(--ink);background:#0c161e;border:1px solid var(--edge);padding:7px;border-radius:3px;font:11px ui-monospace,monospace}
.editpanelbody input[type=range]{accent-color:var(--blue)}
.editpanelbody .fieldtitle span{float:right;color:var(--sub);font-weight:500;font-size:9px}
.editpresets{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.editpresets button{border:1px solid var(--edge);background:#182631;color:var(--muted);padding:8px 4px;font:9px ui-monospace,monospace;letter-spacing:.025em}
.editpresets button:hover{background:#2b465a;color:var(--ink)}
.editgrid{display:grid;grid-template-columns:1fr 1fr;gap:9px;min-width:0}
.editgrid label,.editadvbody label{display:grid;gap:5px;color:var(--muted);font:9px ui-monospace,monospace;letter-spacing:.025em;min-width:0}
.editgrid label output{display:inline;color:var(--ink)}
.editrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.editrow.spread{justify-content:space-between}
.editmicro{font:10px ui-monospace,monospace;color:var(--muted);letter-spacing:.015em}
.edit-chip{border:1px solid #53758b;border-radius:3px;padding:4px 7px;font:9px ui-monospace,monospace;color:#d0e6f1;background:#223847}
.edit-chip.muted{border-color:var(--edge);color:var(--sub);background:#15232d}
.edit-chip.connected{border-color:#558c79;color:#a7dfc9}
.editmuted{font-size:10px;color:var(--sub);margin:0;line-height:1.55}
.editdivider{height:1px;background:var(--edge);margin:2px 0}
.editadvanced{border:1px solid var(--edge);background:#0d1720;border-radius:3px}
.editadvanced summary{cursor:pointer;padding:10px 11px;font:10px ui-monospace,monospace;color:var(--muted)}
.editadvbody{border-top:1px solid var(--edge);padding:10px;display:grid;gap:10px}
.edithuge{flex:1;min-height:42px}
.editnote{padding:9px 10px;border-left:2px solid #99784f;background:#262119;color:#cbb69d;font-size:10px;line-height:1.6}
#editStatus{overflow-wrap:anywhere}
@media(max-width:980px){.editbench{grid-template-columns:1fr}.editstage{min-height:320px;max-height:66vh}.editframe,.editframe canvas{max-height:59vh}}
@media(max-width:560px){.engines{gap:4px}.engines .engine{padding:8px 6px}.engines .engine b{font-size:10px;white-space:nowrap}.engines .engine small{font-size:8px}.editstage{min-height:280px}.editframe,.editframe canvas{max-height:55vh}.editbar{padding:7px 8px}.editbar-actions{gap:0}.editbar-actions button{font-size:9px;padding:5px 6px}.editpanelbody{padding:10px}.edittool{font-size:9px;padding:7px 6px}.editfoot{padding:7px}.edittoolranges{gap:8px}.editmicro{font-size:9px}}

/* Keep drawing coordinates aligned with the visibly scaled photo, including portraits. */
.editframe{width:min(100%,calc(70vh * var(--edit-ratio,1)));max-height:none;aspect-ratio:var(--edit-ratio,1)}
.editframe canvas{width:100%;height:100%;max-width:none;max-height:none}
@media(max-width:980px){.editframe{width:min(100%,calc(58vh * var(--edit-ratio,1)))}}
@media(max-width:560px){.editframe{width:min(100%,calc(52vh * var(--edit-ratio,1)))}}

/* Private GPU backend selector */
.editbackendgroup{display:grid;gap:7px;margin:8px 0}
.editbackendgroup[hidden],#editComfyAdvanced[hidden]{display:none!important}
.editbackendgroup .editmicro{line-height:1.45}
.editbackendgroup input[type="password"]{font:inherit;letter-spacing:.05em}
#editBackend{min-height:39px;cursor:pointer}