:root{--silver:#c0c0c0;--blue:#000080;--paper:#fffff3;--purple:#52168f;--yellow:#ffd900;--ui:Tahoma,"MS Sans Serif",Arial,sans-serif;--mono:"Lucida Console","Courier New",monospace}*{box-sizing:border-box}html,body{height:100%}body{margin:0;overflow:hidden;background:var(--silver);color:#111;font:12px var(--ui)}button,input,select{font:12px var(--ui)}button{cursor:pointer}.app{height:100%;display:grid;grid-template-rows:auto auto 1fr auto}.menu,.toolbar{display:flex;align-items:center;gap:4px;padding:3px 5px;background:var(--silver);border-bottom:1px solid #808080;white-space:nowrap}.menu button{padding:3px 8px;border:0;background:transparent}.menu button:hover{background:var(--blue);color:#fff}.brand{margin-left:auto;font:10px var(--mono)}.toolbar{padding:6px;border-top:1px solid #fff;border-bottom:2px solid #808080;overflow:auto}.btn,.preset,.icon-btn{border:0;border-top:2px solid #fff;border-left:2px solid #fff;border-right:2px solid #404040;border-bottom:2px solid #404040;background:var(--silver)}.btn{min-height:28px;padding:4px 10px}.btn:active,.btn.active,.preset:active,.preset.active,.icon-btn:active{border-color:#404040 #fff #fff #404040;background:#b4b4b4}.btn.primary{font-weight:700;background:var(--yellow)}.btn.danger{color:#900}.sep{width:1px;height:25px;background:#777;border-right:1px solid #fff}.filename{margin-left:auto;font:10px var(--mono)}.workspace{min-width:0;min-height:0;display:grid;grid-template-columns:210px minmax(420px,1fr) 320px;gap:7px;padding:7px;background:#858585}.panel{min-width:0;min-height:0;border:2px outset #fff;background:#d1d1d1}.panel-title{min-height:27px;padding:5px 7px;background:var(--blue);color:#fff;font-weight:700}.presets-panel,.controls{overflow:auto}.preset-list{display:grid;gap:5px;padding:7px}.preset{min-height:34px;padding:5px 7px;text-align:left;background:var(--purple);color:#fff;font:700 10px var(--mono);text-transform:uppercase}.preset.active{background:#271048;color:#fff76b}.preset small{display:block;margin-top:2px;color:#ddd;font-weight:400}.tip{margin:0 7px 8px;padding:8px;border:2px inset #fff;background:var(--paper);font:10px/1.5 var(--mono)}.preview-panel{display:grid;grid-template-rows:auto 1fr auto}.preview-stage{position:relative;min-height:0;display:grid;place-items:center;padding:12px;overflow:hidden;background:#383838;background-image:linear-gradient(45deg,#484848 25%,transparent 25%),linear-gradient(-45deg,#484848 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#484848 75%),linear-gradient(-45deg,transparent 75%,#484848 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}.preview-stage.drag{outline:4px dashed #fff;outline-offset:-8px}.compare-shell{position:relative;max-width:100%;max-height:100%;overflow:hidden;border:2px outset #fff;background:#111;box-shadow:4px 4px rgba(0,0,0,.25);touch-action:none}.compare-shell canvas{display:block;max-width:100%;max-height:calc(100vh - 190px);object-fit:contain}.original-layer{position:absolute;inset:0;width:50%;overflow:hidden;border-right:2px solid #fff}.original-layer canvas{max-width:none;height:100%;width:auto}.split-handle{position:absolute;top:50%;left:50%;width:24px;height:42px;transform:translate(-50%,-50%);display:grid;place-items:center;background:var(--silver);border:2px outset #fff;font-weight:700;pointer-events:none}.side-label{position:absolute;top:8px;padding:3px 6px;background:#000080;color:#fff;border:1px solid #fff;font:9px var(--mono);pointer-events:none}.side-label.before{left:8px}.side-label.after{right:8px}.empty{position:absolute;inset:0;display:none;place-items:center;color:#8cff9a;background:#111;font:12px var(--mono)}.empty.show{display:grid}.preview-info{display:flex;align-items:center;gap:8px;padding:5px 7px;background:var(--paper);border-top:1px solid #777;font:10px var(--mono)}.preview-info input{flex:1;accent-color:#000080}.controls-body{padding:7px}.group{margin:0 0 7px;border:2px groove #fff}.group-title{padding:4px 6px;background:#dfdfdf;border-bottom:1px solid #888;color:#000080;font:700 10px var(--mono)}.group-body{padding:7px}.field{display:grid;grid-template-columns:110px 1fr;gap:6px;align-items:center;margin:6px 0}.field label{font:700 10px var(--mono)}input[type=number],input[type=text],select{width:100%;min-width:0;padding:3px;border:2px inset #fff;background:#fff}.dynamic.hidden{display:none}.palette{max-height:176px;overflow:auto;display:grid;gap:4px;padding-right:2px}.color-row{display:grid;grid-template-columns:30px 1fr 23px;gap:4px}.color-row input[type=color]{width:30px;height:25px;padding:1px;border:2px inset #fff;background:#fff}.icon-btn{width:23px;height:25px;padding:0}.palette-actions{display:flex;gap:5px;margin-top:6px}.process-row{display:flex;gap:5px}.process-row .btn{flex:1}.stats{width:100%;border-collapse:collapse;font:9px var(--mono)}.stats th,.stats td{padding:3px 4px;border:1px solid #888;text-align:right}.stats th:first-child,.stats td:first-child{text-align:left}.download-row{display:flex;gap:5px;margin-top:6px}.download-row .btn{flex:1}.status{display:flex;align-items:center;gap:8px;padding:4px 7px;border-top:2px solid #fff;background:var(--silver);font:10px var(--mono)}.status b{color:var(--blue)}.status .state{margin-left:auto;padding:2px 6px;border:1px solid #444;background:#111;color:#8cff9a}.dialog-backdrop{position:fixed;inset:0;z-index:40;display:none;place-items:center;padding:16px;background:rgba(0,0,0,.45)}.dialog-backdrop.open{display:grid}.dialog{width:min(500px,95vw);border:2px outset #fff;background:var(--silver);box-shadow:5px 5px rgba(0,0,0,.35)}.dialog-title{padding:5px 7px;background:var(--blue);color:#fff;font-weight:700}.dialog-body{padding:14px;font:11px/1.55 var(--mono)}.dialog-actions{display:flex;justify-content:flex-end;padding:0 14px 14px}@media(max-width:900px){body{overflow:auto}.app{height:auto;min-height:100%}.workspace{grid-template-columns:190px 1fr}.controls{grid-column:1/-1}.preview-panel{min-height:540px}.compare-shell canvas{max-height:430px}.brand,.filename{display:none}}@media(max-width:620px){.toolbar{flex-wrap:wrap;white-space:normal}.toolbar .sep{display:none}.workspace{grid-template-columns:1fr}.preview-panel{grid-row:1}.presets-panel,.controls{grid-column:auto}.preset-list{grid-template-columns:repeat(2,1fr)}.field{grid-template-columns:100px 1fr}}
