{"id":9416,"date":"2026-03-03T00:06:22","date_gmt":"2026-03-03T05:06:22","guid":{"rendered":"https:\/\/www.ezcalculatoronline.com\/?page_id=9416"},"modified":"2026-05-09T22:34:44","modified_gmt":"2026-05-10T03:34:44","slug":"paint-in-the-browser","status":"publish","type":"page","link":"https:\/\/www.ezcalculatoronline.com\/online-tools\/paint-in-the-browser\/","title":{"rendered":"Paint in the browser"},"content":{"rendered":"<div id=\"tdi_1\" class=\"tdc-zone\"><div class=\"tdc_zone tdi_2  wpb_row td-pb-row\"  >\n<style scoped>\n\n\/* custom css *\/\n.tdi_2{\r\n                    min-height: 0;\r\n                }\n<\/style><div id=\"tdi_3\" class=\"tdc-row\"><div class=\"vc_row tdi_4  wpb_row td-pb-row\" >\n<style scoped>\n\n\/* custom css *\/\n.tdi_4,\r\n                .tdi_4 .tdc-columns{\r\n                    min-height: 0;\r\n                }.tdi_4,\r\n\t\t\t\t.tdi_4 .tdc-columns{\r\n\t\t\t\t    display: block;\r\n\t\t\t\t}.tdi_4 .tdc-columns{\r\n\t\t\t\t    width: 100%;\r\n\t\t\t\t}\n<\/style><div class=\"vc_column tdi_6  wpb_column vc_column_container tdc-column td-pb-span12\">\n<style scoped>\n\n\/* custom css *\/\n.tdi_6{\r\n                    vertical-align: baseline;\r\n                }.tdi_6 > .wpb_wrapper,\r\n\t\t\t\t.tdi_6 > .wpb_wrapper > .tdc-elements{\r\n\t\t\t\t    display: block;\r\n\t\t\t\t}.tdi_6 > .wpb_wrapper > .tdc-elements{\r\n\t\t\t\t    width: 100%;\r\n\t\t\t\t}.tdi_6 > .wpb_wrapper > .vc_row_inner{\r\n\t\t\t\t    width: auto;\r\n\t\t\t\t}.tdi_6 > .wpb_wrapper{\r\n\t\t\t\t    width: auto;\r\n\t\t\t\t    height: auto;\r\n\t\t\t\t}\n\/* inline tdc_css att *\/\n\n.tdi_6{\nmargin-top:20px !important;\n}\n\n<\/style><div class=\"wpb_wrapper\" ><div class=\"wpb_wrapper wpb_text_column td_block_wrap td_block_wrap vc_column_text tdi_7  tagdiv-type td-pb-border-top td_block_template_1\"  data-td-block-uid=\"tdi_7\" ><div class=\"td-block-title-wrap\"><\/div><div class=\"td-fix-index\"><style id=\"mwp-pro-css\">\n.mwp{--bg:#1b1c20;--panel:#24252a;--panel2:#2c2d33;--border:#37383f;--text:#e8e9eb;--muted:#9b9da5;--accent:#4c8dff;--accent2:rgba(76,141,255,.16);--hover:#33353c;--vpbg:#141518;--danger:#ff5a5f;\n  position:relative;display:flex;flex-direction:column;height:var(--mwp-h,760px);min-height:480px;max-width:100%;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:12px;overflow:hidden;\n  font:13px\/1.35 -apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Inter,Arial,sans-serif;text-align:left;user-select:none;-webkit-user-select:none;container-type:inline-size;letter-spacing:normal}\n.mwp.mwp-light{--bg:#eceef2;--panel:#ffffff;--panel2:#f4f5f7;--border:#dcdfe5;--text:#1d2127;--muted:#6b7280;--accent:#2f6fec;--accent2:rgba(47,111,236,.12);--hover:#eef0f3;--vpbg:#d6d9df}\n.mwp *,.mwp *::before,.mwp *::after{box-sizing:border-box}\n.mwp:fullscreen{height:100vh;border:0;border-radius:0}\n.mwp :where(button){all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;color:inherit;font:inherit;border-radius:6px;line-height:1}\n.mwp :where(button):focus-visible{outline:2px solid var(--accent);outline-offset:1px}\n.mwp :where(button)[disabled]{opacity:.35;cursor:default}\n.mwp svg{width:18px;height:18px;flex:none;display:block}\n.mwp input,.mwp select{font:inherit;font-size:12px;color:var(--text);background:var(--panel2);border:1px solid var(--border);border-radius:6px;padding:3px 6px;height:28px;margin:0;box-shadow:none;width:auto;max-width:none;min-height:0;line-height:normal;outline:none}\n.mwp input:focus,.mwp select:focus{border-color:var(--accent)}\n.mwp input[type=range]{padding:0;height:18px;background:transparent;border:0;accent-color:var(--accent);width:110px;cursor:pointer}\n.mwp input[type=checkbox]{width:14px;height:14px;padding:0;accent-color:var(--accent);cursor:pointer}\n.mwp input[type=number]{-moz-appearance:textfield}\n.mwp input[type=number]::-webkit-inner-spin-button{opacity:.5}\n.mwp canvas{max-width:none;display:block;margin:0}\n.mwp kbd{font:11px ui-monospace,Menlo,Consolas,monospace;background:none;border:0;box-shadow:none;padding:0;color:inherit;opacity:.55;margin-left:18px}\n.mwp hr{border:0;border-top:1px solid var(--border);margin:5px 4px;height:0;background:none}\n\/* menubar *\/\n.mwp-bar{display:flex;align-items:center;gap:2px;height:42px;padding:0 8px;background:var(--panel);border-bottom:1px solid var(--border);flex:none;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}\n.mwp-bar::-webkit-scrollbar{display:none}\n.mwp-brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;margin-right:8px;white-space:nowrap}\n.mwp-logo{width:22px;height:22px;border-radius:7px;background:conic-gradient(from 200deg,#ff5f6d,#ffc371,#4cd964,#4c8dff,#b06ab3,#ff5f6d);flex:none;box-shadow:inset 0 0 0 5px rgba(255,255,255,.18)}\n.mwp-menu-btn{padding:7px 10px;color:var(--muted);white-space:nowrap}\n.mwp-menu-btn:hover,.mwp-menu.open .mwp-menu-btn{background:var(--hover);color:var(--text)}\n.mwp-dd{display:none;position:fixed;min-width:240px;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:6px;box-shadow:0 14px 40px rgba(0,0,0,.35);z-index:99999}\n.mwp-menu.open .mwp-dd{display:block}\n.mwp-dd button{display:flex;width:100%;justify-content:space-between;padding:8px 10px;border-radius:6px;white-space:nowrap}\n.mwp-dd button:hover{background:var(--accent);color:#fff}\n.mwp-spacer{flex:1;min-width:8px}\n.mwp-vsep{width:1px;height:20px;background:var(--border);margin:0 4px;flex:none}\n.mwp-ib{width:32px;height:32px;color:var(--muted);flex:none}\n.mwp-ib:hover{background:var(--hover);color:var(--text)}\n.mwp-danger:hover{color:var(--danger)}\n\/* options bar *\/\n.mwp-opts{display:flex;align-items:center;height:44px;padding:0 6px;background:var(--panel);border-bottom:1px solid var(--border);overflow-x:auto;overflow-y:hidden;white-space:nowrap;flex:none;scrollbar-width:thin}\n.mwp-og{display:flex;align-items:center;gap:8px;padding:0 12px;border-right:1px solid var(--border);height:28px;flex:none}\n.mwp-og label{color:var(--muted);font-size:12px;margin:0;font-weight:400}\n.mwp-num{width:58px}\n.mwp-unit,.mwp-val{color:var(--muted);font-size:12px;min-width:30px;font-variant-numeric:tabular-nums}\n.mwp .mwp-chk{display:inline-flex;align-items:center;gap:6px;color:var(--text);cursor:pointer}\n.mwp-tip{color:var(--muted);font-size:12px}\n.mwp-seg{display:inline-flex;background:var(--panel2);border:1px solid var(--border);border-radius:7px;padding:2px;gap:2px}\n.mwp-seg button{width:28px;height:24px;color:var(--muted)}\n.mwp-seg button svg{width:16px;height:16px}\n.mwp-seg button:hover{color:var(--text)}\n.mwp-seg button.active{background:var(--accent);color:#fff}\n.mwp-btn{height:28px;padding:0 12px;border:1px solid var(--border);background:var(--panel2);font-size:12px;white-space:nowrap}\n.mwp-btn:hover{border-color:var(--muted)}\n.mwp-btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}\n\/* main *\/\n.mwp-main{flex:1;display:flex;min-height:0;position:relative}\n.mwp-tools{width:50px;flex:none;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 0;overflow-y:auto;scrollbar-width:none}\n.mwp-tool{width:38px;height:38px;color:var(--muted);flex:none;border-radius:8px}\n.mwp-tool:hover{background:var(--hover);color:var(--text)}\n.mwp-tool.active{background:var(--accent2);color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}\n.mwp-sep{width:26px;height:1px;background:var(--border);margin:4px 0;flex:none}\n.mwp-mini{position:relative;width:38px;height:38px;margin-top:auto;flex:none}\n.mwp-mini button,.mwp-pair button{position:absolute;border-radius:6px;border:2px solid var(--panel);box-shadow:0 0 0 1px var(--border)}\n.mwp-mini .mwp-c-primary{left:0;top:0;width:26px;height:26px;z-index:1}\n.mwp-mini .mwp-c-secondary{right:0;bottom:0;width:26px;height:26px}\n\/* viewport *\/\n.mwp-vp{flex:1;position:relative;overflow:hidden;background:var(--vpbg);touch-action:none;cursor:crosshair;min-width:0}\n.mwp-vp[data-tool=hand],.mwp-vp.space{cursor:grab}\n.mwp-vp.panning{cursor:grabbing}\n.mwp-vp[data-tool=move]{cursor:move}\n.mwp-vp[data-tool=text]{cursor:text}\n.mwp-vp[data-tool=picker]{cursor:copy}\n.mwp-stage{position:absolute;left:0;top:0;transform-origin:0 0;background-color:#fff;background-image:linear-gradient(45deg,#dadada 25%,transparent 25%),linear-gradient(-45deg,#dadada 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#dadada 75%),linear-gradient(-45deg,transparent 75%,#dadada 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0;box-shadow:0 0 0 1px rgba(0,0,0,.35),0 10px 40px rgba(0,0,0,.4)}\n.mwp-host{position:absolute;inset:0;isolation:isolate;overflow:hidden}\n.mwp-host canvas,.mwp-overlay{position:absolute;left:0;top:0;width:100%;height:100%}\n.mwp-host.pixelated canvas{image-rendering:pixelated}\n.mwp-temp{display:none;pointer-events:none}\n.mwp-overlay{pointer-events:none}\n.mwp-grid{position:absolute;inset:0;pointer-events:none;display:none;background-image:linear-gradient(rgba(76,141,255,.4) 1px,transparent 1px),linear-gradient(90deg,rgba(76,141,255,.4) 1px,transparent 1px);background-size:25px 25px}\n.mwp-cursor{position:absolute;left:0;top:0;border-radius:50%;border:1px solid #fff;pointer-events:none;display:none;z-index:5;mix-blend-mode:difference}\n.mwp textarea.mwp-textbox{position:absolute;z-index:6;margin:0!important;padding:0!important;border:1px dashed var(--accent)!important;border-radius:0;background:rgba(127,127,127,.08);outline:none;resize:none;overflow:hidden;white-space:pre;box-sizing:content-box!important;min-width:20px;min-height:0!important;max-width:none;box-shadow:none;user-select:text;-webkit-user-select:text}\n\/* panels *\/\n.mwp-panels{width:268px;flex:none;background:var(--panel);border-left:1px solid var(--border);display:flex;flex-direction:column;min-height:0;overflow-y:auto}\n.mwp.mwp-panels-hidden .mwp-panels{display:none}\n.mwp-sec{padding:12px;border-bottom:1px solid var(--border)}\n.mwp-sec-h{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}\n.mwp-sub{font-size:11px;color:var(--muted);margin:10px 0 6px}\n.mwp-crow{display:flex;align-items:center;gap:8px;margin-bottom:10px}\n.mwp-pair{position:relative;width:48px;height:48px;flex:none}\n.mwp-pair .mwp-c-primary{left:0;top:0;width:34px;height:34px;z-index:1}\n.mwp-pair .mwp-c-secondary{right:0;bottom:0;width:34px;height:34px}\n.mwp-hex{flex:1;min-width:0;font-family:ui-monospace,Menlo,Consolas,monospace!important;text-transform:uppercase}\n.mwp-native{position:absolute;width:1px!important;height:1px!important;opacity:0;pointer-events:none;padding:0!important;border:0!important}\n.mwp-sv{position:relative;height:130px;border-radius:8px;overflow:hidden;cursor:crosshair;touch-action:none}\n.mwp-sv canvas{width:100%;height:100%}\n.mwp-sv-knob{position:absolute;width:14px;height:14px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.5);transform:translate(-50%,-50%);pointer-events:none}\n.mwp input.mwp-hue{width:100%;margin-top:10px;-webkit-appearance:none;appearance:none;height:12px;border-radius:6px;background:linear-gradient(90deg,red,#ff0,lime,cyan,blue,#f0f,red)}\n.mwp-hue::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:transparent;border:3px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.5)}\n.mwp-hue::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:transparent;border:3px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.5)}\n.mwp-swatches,.mwp-recent{display:grid;grid-template-columns:repeat(12,1fr);gap:4px}\n.mwp-swatches{margin-top:12px}\n.mwp-recent{min-height:16px}\n.mwp .mwp-sw{display:block;aspect-ratio:1\/1;border-radius:4px;box-shadow:inset 0 0 0 1px rgba(127,127,127,.35)}\n.mwp .mwp-sw:hover{transform:scale(1.18);box-shadow:0 0 0 2px var(--accent)}\n.mwp-layers{flex:1;display:flex;flex-direction:column;min-height:240px;padding:12px}\n.mwp-lprops{display:flex;gap:8px;align-items:center;margin-bottom:8px}\n.mwp-lblend{flex:1;min-width:0}\n.mwp .mwp-lop{width:70px}\n.mwp-llist{flex:1;overflow-y:auto;border:1px solid var(--border);border-radius:8px;background:var(--panel2);min-height:90px}\n.mwp-li{display:flex;align-items:center;gap:8px;padding:6px 8px;border-bottom:1px solid var(--border);cursor:pointer}\n.mwp-li:hover{background:var(--hover)}\n.mwp-li.active{background:var(--accent2);box-shadow:inset 3px 0 0 var(--accent)}\n.mwp-li.hid .mwp-tw,.mwp-li.hid .mwp-ln{opacity:.4}\n.mwp-eye{width:24px;height:24px;color:var(--muted);flex:none}\n.mwp-eye svg{width:16px;height:16px}\n.mwp-tw{width:44px;height:44px;display:flex;align-items:center;justify-content:center;flex:none}\n.mwp-thumb{box-shadow:0 0 0 1px var(--border);background:#fff linear-gradient(45deg,#ddd 25%,transparent 25%,transparent 75%,#ddd 75%) 0 0\/8px 8px}\n.mwp-ln{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.mwp-lmeta{font-size:11px;color:var(--muted)}\n.mwp input.mwp-rename{flex:1;min-width:0;height:24px}\n.mwp-lfoot{display:flex;justify-content:space-between;margin-top:8px}\n\/* status *\/\n.mwp-status{display:flex;align-items:center;gap:14px;height:28px;padding:0 10px;background:var(--panel);border-top:1px solid var(--border);color:var(--muted);font-size:12px;flex:none;white-space:nowrap;overflow:hidden}\n.mwp-status b{color:var(--text);font-weight:600}\n.mwp-hint{overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}\n.mwp-flash{color:var(--accent);font-weight:500}\n.mwp-xy,.mwp-docsize{font-variant-numeric:tabular-nums}\n.mwp-zoomctl{display:flex;align-items:center;gap:2px}\n.mwp-zoomctl button{min-width:22px;height:22px;padding:0 4px}\n.mwp-zoomctl button:hover{background:var(--hover);color:var(--text)}\n.mwp-zoomv{min-width:48px!important;font-variant-numeric:tabular-nums}\n\/* modal *\/\n.mwp-modal{position:absolute;inset:0;background:rgba(0,0,0,.5);display:none;align-items:center;justify-content:center;z-index:100;backdrop-filter:blur(2px)}\n.mwp-modal.open{display:flex}\n.mwp-dialog{width:min(440px,calc(100% - 32px));max-height:calc(100% - 32px);overflow:auto;background:var(--panel);border:1px solid var(--border);border-radius:14px;box-shadow:0 24px 60px rgba(0,0,0,.5);animation:mwpPop .2s ease}\n@keyframes mwpPop{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}\n.mwp-dlg-h{display:flex;justify-content:space-between;align-items:center;padding:12px 12px 12px 16px;font-weight:700;font-size:15px;border-bottom:1px solid var(--border)}\n.mwp-dlg-b{padding:16px;display:flex;flex-direction:column;gap:12px}\n.mwp-dlg-b label{display:flex;flex-direction:column;gap:5px;color:var(--muted);font-size:12px;margin:0}\n.mwp-dlg-b label.mwp-chk{flex-direction:row}\n.mwp-dlg-b input[type=number],.mwp-dlg-b select,.mwp-dlg-b input[type=range]{width:100%}\n.mwp-dlg-b label span{color:var(--text);float:right}\n.mwp-row{display:flex;gap:10px}\n.mwp-row>label{flex:1}\n.mwp-note{margin:0;color:var(--muted);font-size:12px}\n.mwp-dlg-f{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--border)}\n.mwp-keys{display:grid;grid-template-columns:auto 1fr;gap:7px 16px;font-size:13px;color:var(--text)}\n.mwp-keys kbd{opacity:1;margin:0;background:var(--panel2);border:1px solid var(--border);border-radius:5px;padding:2px 6px;white-space:nowrap;justify-self:start}\n\/* responsive (container based) *\/\n@container (max-width: 860px){\n  .mwp-panels{position:absolute;right:0;top:0;bottom:0;z-index:40;box-shadow:-12px 0 30px rgba(0,0,0,.35)}\n  .mwp:not(.mwp-panels-open) .mwp-panels{display:none}\n  .mwp-hint,.mwp-docsize{display:none}\n  .mwp-brand span{display:none}\n  .mwp-menu-btn{padding:7px 7px}\n}\n@media (max-width:760px){.mwp{height:min(var(--mwp-h,760px),88vh)}}\n<\/style>\n<script id=\"mwp-pro-js\">\n(function(){\nif(window.MWPaint) return;\nvar I={\n move:'M5 9l-3 3 3 3M9 5l3-3 3 3M15 19l-3 3-3-3M19 9l3 3-3 3M2 12h20M12 2v20',\n hand:'M18 11V6a2 2 0 0 0-4 0M14 10V4a2 2 0 0 0-4 0v2M10 10.5V6a2 2 0 0 0-4 0v8M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-6-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15',\n brush:'M9.06 11.9l8.07-8.06a2.85 2.85 0 1 1 4.03 4.03l-8.06 8.08M7.07 14.94c-1.66 0-3 1.35-3 3.02 0 1.33-2.5 1.52-2 2.02 1.08 1.1 2.49 2.02 4 2.02 2.2 0 4-1.8 4-4.04a3.01 3.01 0 0 0-3-3.02z',\n eraser:'M7 21l-4.3-4.3c-1-1-1-2.5 0-3.4l9.6-9.6c1-1 2.5-1 3.4 0l5.6 5.6c1 1 1 2.5 0 3.4L13 21M22 21H7M5 11l9 9',\n spray:'M3 3h.01M7 5h.01M11 7h.01M3 7h.01M7 9h.01M3 11h.01M15 5h4v3h-4zM14 8h6a1 1 0 0 1 1 1v11a2 2 0 0 1-2 2h-4a2 2 0 0 1-2-2V9a1 1 0 0 1 1-1z',\n bucket:'M19 11l-8-8-8.6 8.6a2 2 0 0 0 0 2.8l5.2 5.2c.8.8 2 .8 2.8 0L19 11ZM5 2l5 5M2 13h15M22 20a2 2 0 1 1-4 0c0-1.6 1.7-2.4 2-4 .3 1.6 2 2.4 2 4Z',\n gradient:'M3 3h18v18H3zM3 9h18M3 15h18M9 3v6M15 9v6M9 15v6',\n picker:'M2 22l1-1h3l9-9M3 21v-3l9-9M15 6l3.4-3.4a2.1 2.1 0 1 1 3 3L18 9l.4.4a2.1 2.1 0 1 1-3 3l-3.8-3.8a2.1 2.1 0 1 1 3-3l.4.4Z',\n text:'M4 7V4h16v3M9 20h6M12 4v16',\n shapes:'M8.3 10a.7.7 0 0 1-.63-1.06l3.7-6.05a.7.7 0 0 1 1.23 0l3.7 6.05A.7.7 0 0 1 15.7 10zM3 14h7v7H3zM17.5 13.5a3.75 3.75 0 1 0 0 7.5a3.75 3.75 0 1 0 0-7.5z',\n crop:'M6 2v14a2 2 0 0 0 2 2h14M18 22V8a2 2 0 0 0-2-2H2',\n undo:'M3 7v6h6M21 17a9 9 0 0 0-15-6.7L3 13',\n redo:'M21 7v6h-6M3 17a9 9 0 0 1 15-6.7l3 2.7',\n download:'M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M7 10l5 5 5-5M12 15V3',\n sun:'M12 8a4 4 0 1 0 0 8a4 4 0 1 0 0-8zM12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M6.3 17.7l-1.4 1.4M19.1 4.9l-1.4 1.4',\n panels:'M3 3h18v18H3zM15 3v18',\n full:'M8 3H5a2 2 0 0 0-2 2v3M21 8V5a2 2 0 0 0-2-2h-3M3 16v3a2 2 0 0 0 2 2h3M16 21h3a2 2 0 0 0 2-2v-3',\n swap:'M16 3l4 4-4 4M20 7H4M8 21l-4-4 4-4M4 17h16',\n plus:'M12 5v14M5 12h14',\n copy:'M8 8h12v12H8zM4 16V4h12',\n up:'M12 19V5M5 12l7-7 7 7',\n down:'M12 5v14M19 12l-7 7-7-7',\n merge:'M8 6l4-4 4 4M12 2v10.3a4 4 0 0 1-1.2 2.9L4 22M20 22l-5-5',\n trash:'M3 6h18M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2',\n eye:'M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7ZM12 9a3 3 0 1 0 0 6a3 3 0 1 0 0-6z',\n eyeOff:'M3 3l18 18M10.6 10.6a2 2 0 0 0 2.8 2.8M9.9 4.2A10 10 0 0 1 12 4c7 0 10 8 10 8a13 13 0 0 1-1.7 2.7M6.6 6.6A13 13 0 0 0 2 12s3 8 10 8a9 9 0 0 0 5.4-1.6',\n x:'M18 6L6 18M6 6l12 12',\n rect:'M4 5h16v14H4z',\n rrect:'M4 9a4 4 0 0 1 4-4h8a4 4 0 0 1 4 4v6a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4z',\n ellipse:'M2 12a10 7 0 1 0 20 0a10 7 0 1 0-20 0',\n triangle:'M12 4L21 20H3z',\n hexagon:'M12 2l8.66 5v10L12 22l-8.66-5V7z',\n star:'M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01z',\n line:'M5 19L19 5',\n arrow:'M5 19L19 5M9 5h10v10'\n};\nfunction ico(n){return '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.9\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"'+(I[n]||'')+'\"\/><\/svg>';}\nvar BLENDS=['normal','multiply','screen','overlay','darken','lighten','color-dodge','color-burn','hard-light','soft-light','difference','exclusion','hue','saturation','color','luminosity'];\nvar PALETTE=['#000000','#3c3c3c','#7a7a7a','#bdbdbd','#ffffff','#e53935','#fb8c00','#fdd835','#43a047','#00acc1','#1e88e5','#5e35b1','#8e24aa','#d81b60','#6d4c41','#ffcdd2','#ffe0b2','#fff9c4','#c8e6c9','#b2ebf2','#bbdefb','#d1c4e9','#f8bbd0','#d7ccc8'];\nvar PRESETS=[['Custom',0,0],['Web 1200 \u00d7 800',1200,800],['HD 1920 \u00d7 1080',1920,1080],['Square post 1080 \u00d7 1080',1080,1080],['Story \/ Reel 1080 \u00d7 1920',1080,1920],['Facebook \/ OG 1200 \u00d7 630',1200,630],['YouTube thumbnail 1280 \u00d7 720',1280,720],['A4 @300dpi 2480 \u00d7 3508',2480,3508],['Letter @300dpi 2550 \u00d7 3300',2550,3300],['Icon 512 \u00d7 512',512,512]];\nvar MC=document.createElement('canvas').getContext('2d');\nvar PC=document.createElement('canvas');PC.width=PC.height=1;var PCX=PC.getContext('2d',{willReadFrequently:true});\nvar FILTER_OK=(function(){try{var c=document.createElement('canvas').getContext('2d');if(typeof c.filter!=='string')return false;c.filter='blur(1px)';return c.filter==='blur(1px)';}catch(e){return false;}})();\nvar current=null;\n\nfunction clamp(v,a,b){return Math.max(a,Math.min(b,v));}\nfunction dist(a,b){return Math.hypot(b.x-a.x,b.y-a.y);}\nfunction gco(b){return b==='normal'?'source-over':b;}\nfunction hexToRgb(h){h=String(h).replace('#','');if(h.length===3)h=h.split('').map(function(c){return c+c;}).join('');var n=parseInt(h,16)||0;return [n>>16&255,n>>8&255,n&255];}\nfunction rgbToHex(r,g,b){return '#'+[r,g,b].map(function(v){return clamp(Math.round(v),0,255).toString(16).padStart(2,'0');}).join('');}\nfunction rgbToHsv(r,g,b){r\/=255;g\/=255;b\/=255;var mx=Math.max(r,g,b),mn=Math.min(r,g,b),d=mx-mn,h=0;if(d){if(mx===r)h=((g-b)\/d)%6;else if(mx===g)h=(b-r)\/d+2;else h=(r-g)\/d+4;h*=60;if(h<0)h+=360;}return [h,mx?d\/mx:0,mx];}\nfunction hsvToRgb(h,s,v){function f(n){var k=(n+h\/60)%6;return (v-v*s*Math.max(0,Math.min(k,4-k,1)))*255;}return [f(5),f(3),f(1)];}\nfunction cloneCanvas(c){var n=document.createElement('canvas');n.width=c.width;n.height=c.height;n.getContext('2d').drawImage(c,0,0);return n;}\nfunction rrPath(t,x,y,w,h,r){r=Math.min(r,w\/2,h\/2);t.moveTo(x+r,y);t.arcTo(x+w,y,x+w,y+h,r);t.arcTo(x+w,y+h,x,y+h,r);t.arcTo(x,y+h,x,y,r);t.arcTo(x,y,x+w,y,r);t.closePath();}\nfunction esc(s){return String(s).replace(\/[&<>\"]\/g,function(c){return {'&':'&amp;','<':'&lt;','>':'&gt;','\"':'&quot;'}[c];});}\n\nfunction init(root){\n if(!root||root._mwp) return;\n function $(s){return root.querySelector(s);}\n function $$(s){return Array.prototype.slice.call(root.querySelectorAll(s));}\n $$('[data-icon]').forEach(function(el){el.insertAdjacentHTML('afterbegin',ico(el.dataset.icon));});\n\n var vp=$('.mwp-vp'),stage=$('.mwp-stage'),host=$('.mwp-host'),temp=$('.mwp-temp'),over=$('.mwp-overlay'),gridEl=$('.mwp-grid'),cur=$('.mwp-cursor'),modalEl=$('.mwp-modal'),fileIn=$('.mwp-file');\n var tctx=temp.getContext('2d'),octx=over.getContext('2d');\n var S={W:clamp(parseInt(root.dataset.w,10)||1200,16,8000),H:clamp(parseInt(root.dataset.h,10)||800,16,8000),layers:[],active:null,tool:'brush',\n  primary:'#1f1f1f',secondary:'#ffffff',size:12,opacity:100,smoothing:35,brushStyle:'round',pressure:true,eraserSoft:false,density:40,\n  shape:'rect',shapeMode:'stroke',tolerance:24,contiguous:true,sampleAll:false,expand:true,gradType:'linear',gradEnd:'secondary',\n  font:'Arial, sans-serif',fontSize:48,bold:false,italic:false,zoom:1,panX:0,panY:0,autoFit:true,recent:[]};\n var uid=0,mode=null,space=false,lastPt=null,panStart=null,dragA=null,dragB=null,dragMods={},moveSnap=null,cropStart=null,cropRect=null,stroke=null,eraseRAF=0,sprayRAF=0,sprayPt=null,sprayColor=null,textBox=null,pinch=null,flashT=0,nudgeT=0,pendOp=null;\n var undoS=[],redoS=[],MAXH=30,ptrs=new Map();\n var NAMES={move:'Move',hand:'Hand',brush:'Brush',eraser:'Eraser',spray:'Spray',fill:'Paint bucket',gradient:'Gradient',picker:'Eyedropper',text:'Text',shape:'Shapes',crop:'Crop'};\n var HINTS={\n  move:'Drag to move the active layer \u00b7 Arrow keys nudge 1px (Shift = 10px)',\n  hand:'Drag to pan \u00b7 Ctrl + wheel \/ pinch to zoom',\n  brush:'Drag to paint \u00b7 Shift+click: straight line \u00b7 Alt+click: pick color \u00b7 Right-drag: secondary color \u00b7 [ ] size',\n  eraser:'Drag to erase to transparency \u00b7 Shift+click: straight line \u00b7 [ ] size',\n  spray:'Hold and drag to spray \u00b7 Right-drag: secondary color',\n  fill:'Click to fill \u00b7 Right-click: fill with secondary color',\n  gradient:'Drag to draw a gradient \u00b7 Shift: snap angle 45\u00b0',\n  picker:'Click: primary color \u00b7 Right-click: secondary color',\n  text:'Click to place text \u00b7 Ctrl+Enter to commit \u00b7 Esc to cancel',\n  shape:'Drag to draw \u00b7 Shift: keep proportions \u00b7 Alt: draw from center',\n  crop:'Drag to select area \u00b7 Shift: square \u00b7 Enter apply \u00b7 Esc cancel'};\n var TIPS={text:'Ctrl+Enter or click outside to place text',picker:'Samples the visible (merged) image',move:'Arrow keys nudge',hand:'Hold Space with any tool to pan',crop:'Drag a selection on the canvas'};\n\n \/* ---------- layers ---------- *\/\n function makeLayer(id,name){var c=document.createElement('canvas');c.className='mwp-layer';c.width=S.W;c.height=S.H;var th=document.createElement('canvas');th.className='mwp-thumb';var nid=id||('L'+(++uid));\n  return {id:nid,name:name||('Layer '+uid),canvas:c,ctx:c.getContext('2d'),thumb:th,visible:true,opacity:1,blend:'normal'};}\n function findL(id){for(var i=0;i<S.layers.length;i++)if(S.layers[i].id===id)return S.layers[i];return null;}\n function insertLayer(L){var i=S.active?S.layers.indexOf(S.active)+1:S.layers.length;S.layers.splice(i,0,L);S.active=L;rebuild();thumb(L);}\n function rebuild(){\n  $$('canvas.mwp-layer').forEach(function(c){if(!S.layers.some(function(l){return l.canvas===c;}))c.remove();});\n  S.layers.forEach(function(l){host.appendChild(l.canvas);l.canvas.style.opacity=l.opacity;l.canvas.style.mixBlendMode=l.blend;l.canvas.style.visibility=l.visible?'visible':'hidden';l.canvas.style.filter='';});\n  if(!S.active||S.layers.indexOf(S.active)<0)S.active=S.layers[S.layers.length-1];\n  renderPanel();\n }\n function sizeThumb(L){var m=40,w=m,h=m;if(S.W>=S.H)h=Math.max(6,Math.round(m*S.H\/S.W));else w=Math.max(6,Math.round(m*S.W\/S.H));if(L.thumb.width!==w||L.thumb.height!==h){L.thumb.width=w;L.thumb.height=h;}}\n var thumbQ=[],thumbRAF=0;\n function thumb(L){L=L||S.active;if(thumbQ.indexOf(L)<0)thumbQ.push(L);if(!thumbRAF)thumbRAF=requestAnimationFrame(function(){thumbRAF=0;thumbQ.forEach(function(l){sizeThumb(l);var t=l.thumb.getContext('2d');t.clearRect(0,0,l.thumb.width,l.thumb.height);t.drawImage(l.canvas,0,0,l.thumb.width,l.thumb.height);});thumbQ=[];});}\n function thumbsAll(){S.layers.forEach(function(l){thumb(l);});}\n var list=$('.mwp-llist'),lop=$('.mwp-lop'),lblend=$('.mwp-lblend');\n lblend.innerHTML=BLENDS.map(function(b){return '<option value=\"'+b+'\">'+b.replace('-',' ').replace(\/^.\/,function(c){return c.toUpperCase();})+'<\/option>';}).join('');\n function renderPanel(){\n  list.innerHTML='';\n  for(var i=S.layers.length-1;i>=0;i--){var L=S.layers[i];var it=document.createElement('div');it.className='mwp-li'+(L===S.active?' active':'')+(L.visible?'':' hid');it.dataset.id=L.id;\n   it.innerHTML='<button class=\"mwp-eye\" title=\"Show \/ hide\">'+ico(L.visible?'eye':'eyeOff')+'<\/button><span class=\"mwp-tw\"><\/span><span class=\"mwp-ln\"><\/span><span class=\"mwp-lmeta\"><\/span>';\n   it.querySelector('.mwp-tw').appendChild(L.thumb);it.querySelector('.mwp-ln').textContent=L.name;\n   it.querySelector('.mwp-lmeta').textContent=(L.blend!=='normal'?L.blend+' ':'')+(L.opacity<1?Math.round(L.opacity*100)+'%':'');\n   list.appendChild(it);}\n  var A=S.active;lop.value=Math.round(A.opacity*100);$('.mwp-lopv').textContent=Math.round(A.opacity*100)+'%';lblend.value=A.blend;$('.mwp-lcount').textContent=S.layers.length;\n }\n list.addEventListener('click',function(e){var it=e.target.closest('.mwp-li');if(!it)return;var L=findL(it.dataset.id);if(!L)return;\n  if(e.target.closest('.mwp-eye')){L.visible=!L.visible;rebuild();return;}\n  if(S.active!==L){finishText();S.active=L;renderPanel();}});\n list.addEventListener('dblclick',function(e){var n=e.target.closest('.mwp-ln');if(!n)return;var L=findL(n.closest('.mwp-li').dataset.id);\n  var inp=document.createElement('input');inp.className='mwp-rename';inp.value=L.name;n.replaceWith(inp);inp.focus();inp.select();var done=false;\n  function fin(ok){if(done)return;done=true;var v=inp.value.trim();if(ok&&v&&v!==L.name){pushHistory([]);L.name=v;}renderPanel();}\n  inp.addEventListener('keydown',function(ev){ev.stopPropagation();if(ev.key==='Enter')fin(true);if(ev.key==='Escape')fin(false);});inp.addEventListener('blur',function(){fin(true);});});\n lop.addEventListener('input',function(){if(!pendOp)pendOp=record([]);S.active.opacity=lop.value\/100;S.active.canvas.style.opacity=S.active.opacity;$('.mwp-lopv').textContent=lop.value+'%';});\n lop.addEventListener('change',function(){if(pendOp){pushRec(pendOp);pendOp=null;}renderPanel();});\n lblend.addEventListener('change',function(){pushHistory([]);S.active.blend=lblend.value;rebuild();});\n\n \/* ---------- history ---------- *\/\n function record(ids){var r={w:S.W,h:S.H,active:S.active?S.active.id:null,partial:!!ids,data:{},meta:S.layers.map(function(l){return {id:l.id,name:l.name,visible:l.visible,opacity:l.opacity,blend:l.blend};})};\n  S.layers.forEach(function(l){if(!ids||ids.indexOf(l.id)>=0)r.data[l.id]=l.ctx.getImageData(0,0,S.W,S.H);});return r;}\n function pushRec(r){undoS.push(r);if(undoS.length>MAXH)undoS.shift();redoS.length=0;histUI();}\n function pushHistory(ids){pushRec(record(ids));}\n function applyRecord(r){var sized=r.w!==S.W||r.h!==S.H;S.W=r.w;S.H=r.h;var old={};S.layers.forEach(function(l){old[l.id]=l;});\n  S.layers=r.meta.map(function(m){var l=old[m.id],fresh=false;if(!l){l=makeLayer(m.id,m.name);fresh=true;}l.name=m.name;l.visible=m.visible;l.opacity=m.opacity;l.blend=m.blend;if(sized&&!fresh){l.canvas.width=S.W;l.canvas.height=S.H;}return l;});\n  Object.keys(r.data).forEach(function(id){var l=findL(id);if(l)l.ctx.putImageData(r.data[id],0,0);});\n  S.active=findL(r.active)||S.layers[S.layers.length-1];if(sized){resizeStage();fit();}rebuild();thumbsAll();}\n function swapState(from,to){if(!from.length)return;finishText();cancelOp();cropRect=null;var r=from.pop();\n  var ids=null;if(r.partial){ids=Object.keys(r.data);S.layers.forEach(function(l){if(!r.meta.some(function(m){return m.id===l.id;}))ids.push(l.id);});}\n  to.push(record(ids));applyRecord(r);histUI();drawOverlay();}\n function undo(){swapState(undoS,redoS);}\n function redo(){swapState(redoS,undoS);}\n function histUI(){$$('[data-cmd=undo]').forEach(function(b){b.disabled=!undoS.length;});$$('[data-cmd=redo]').forEach(function(b){b.disabled=!redoS.length;});}\n\n \/* ---------- view ---------- *\/\n function resizeStage(){stage.style.width=S.W+'px';stage.style.height=S.H+'px';temp.width=over.width=S.W;temp.height=over.height=S.H;$('.mwp-docsize').textContent=S.W+' \u00d7 '+S.H+' px';}\n function applyView(){stage.style.transform='translate('+S.panX+'px,'+S.panY+'px) scale('+S.zoom+')';host.classList.toggle('pixelated',S.zoom>=3);$('.mwp-zoomv').textContent=Math.round(S.zoom*100)+'%';updateCursorSize();styleText();drawOverlay();}\n function fit(up){var r=vp.getBoundingClientRect();if(!r.width||!r.height)return;var pad=r.width<600?20:56;var z=Math.min((r.width-pad)\/S.W,(r.height-pad)\/S.H);if(!up)z=Math.min(z,1);\n  S.zoom=clamp(z,0.02,32);S.panX=Math.round((r.width-S.W*S.zoom)\/2);S.panY=Math.round((r.height-S.H*S.zoom)\/2);applyView();}\n function zoomAt(z,cx,cy){z=clamp(z,0.02,32);var dx=(cx-S.panX)\/S.zoom,dy=(cy-S.panY)\/S.zoom;S.zoom=z;S.panX=cx-dx*z;S.panY=cy-dy*z;S.autoFit=false;applyView();}\n function zoomStep(dir){var r=vp.getBoundingClientRect();zoomAt(S.zoom*(dir>0?1.25:0.8),r.width\/2,r.height\/2);}\n function toDoc(e){var r=vp.getBoundingClientRect();return {x:(e.clientX-r.left-S.panX)\/S.zoom,y:(e.clientY-r.top-S.panY)\/S.zoom};}\n function updateCursorSize(){var d=Math.max(4,S.size*S.zoom);cur.style.width=d+'px';cur.style.height=d+'px';}\n function cursorTool(){return S.tool==='brush'||S.tool==='eraser'||S.tool==='spray';}\n function flash(msg){var f=$('.mwp-flash');f.textContent=msg;clearTimeout(flashT);flashT=setTimeout(function(){f.textContent='';},2600);}\n\n \/* ---------- temp \/ overlay ---------- *\/\n function showTemp(L){host.insertBefore(temp,L.canvas.nextSibling);temp.style.display='block';temp.style.opacity=(S.opacity\/100)*L.opacity;temp.style.mixBlendMode=L.blend;tctx.clearRect(0,0,S.W,S.H);}\n function hideTemp(){temp.style.display='none';tctx.clearRect(0,0,S.W,S.H);}\n function commitTemp(){var L=S.active;L.ctx.save();L.ctx.globalAlpha=S.opacity\/100;L.ctx.drawImage(temp,0,0);L.ctx.restore();hideTemp();thumb(L);}\n function drawOverlay(){octx.clearRect(0,0,S.W,S.H);var lw=1\/S.zoom;\n  if(S.tool==='crop'&&cropRect){var c=cropRect;octx.fillStyle='rgba(0,0,0,.55)';octx.fillRect(0,0,S.W,S.H);octx.clearRect(c.x,c.y,c.w,c.h);\n   octx.strokeStyle='#fff';octx.lineWidth=lw*1.5;octx.strokeRect(c.x,c.y,c.w,c.h);octx.globalAlpha=.45;octx.lineWidth=lw;octx.beginPath();\n   for(var i=1;i<3;i++){octx.moveTo(c.x+c.w*i\/3,c.y);octx.lineTo(c.x+c.w*i\/3,c.y+c.h);octx.moveTo(c.x,c.y+c.h*i\/3);octx.lineTo(c.x+c.w,c.y+c.h*i\/3);}octx.stroke();octx.globalAlpha=1;}\n  if(mode==='gradient'&&dragA&&dragB){octx.lineWidth=2*lw;octx.strokeStyle='#fff';octx.setLineDash([6*lw,4*lw]);octx.beginPath();octx.moveTo(dragA.x,dragA.y);octx.lineTo(dragB.x,dragB.y);octx.stroke();octx.setLineDash([]);\n   [dragA,dragB].forEach(function(p){octx.beginPath();octx.arc(p.x,p.y,5*lw,0,Math.PI*2);octx.fillStyle='#fff';octx.fill();octx.strokeStyle='#000';octx.lineWidth=lw;octx.stroke();});}}\n\n \/* ---------- brush engine ---------- *\/\n function pressureOf(e){return (S.pressure&&e.pointerType==='pen'&&e.pressure>0)?0.15+0.85*e.pressure:1;}\n function rgba(hex,a){var c=hexToRgb(hex);return 'rgba('+c[0]+','+c[1]+','+c[2]+','+a+')';}\n function softDab(t,x,y,r,col){r=Math.max(1,r);var g=t.createRadialGradient(x,y,0,x,y,r);g.addColorStop(0,rgba(col,0.2));g.addColorStop(1,rgba(col,0));t.fillStyle=g;t.fillRect(x-r,y-r,r*2,r*2);}\n function dab(p,pr){var t=tctx,w=Math.max(0.5,S.size*pr),st=stroke.style,col=stroke.color;t.save();t.fillStyle=col;t.strokeStyle=col;\n  if(st==='soft')softDab(t,p.x,p.y,w\/2,col);\n  else if(st==='marker')t.fillRect(p.x-w\/2,p.y-w\/2,w,w);\n  else if(st==='calligraphy'){var n=w\/2*Math.SQRT1_2;t.lineWidth=1.5;t.beginPath();t.moveTo(p.x+n,p.y-n);t.lineTo(p.x-n,p.y+n);t.stroke();}\n  else{var r=st==='pencil'?Math.max(0.5,w*0.2):w\/2;if(st==='neon'){t.shadowColor=col;t.shadowBlur=w*1.2;}t.beginPath();t.arc(p.x,p.y,r,0,Math.PI*2);t.fill();}\n  t.restore();}\n function drawSeg(a,c,b,pr){var t=tctx,st=stroke.style,col=stroke.color,w=Math.max(0.5,S.size*pr);t.save();t.strokeStyle=col;t.fillStyle=col;\n  if(st==='soft'){var d=dist(a,b)+0.001,step=Math.max(1,w*0.08),s=stroke.carry;for(;s<=d;s+=step){var k=s\/d,u=1-k;softDab(t,u*u*a.x+2*u*k*c.x+k*k*b.x,u*u*a.y+2*u*k*c.y+k*k*b.y,w\/2,col);}stroke.carry=s-d;}\n  else if(st==='calligraphy'){var n=w\/2*Math.SQRT1_2;t.beginPath();t.moveTo(a.x+n,a.y-n);t.quadraticCurveTo(c.x+n,c.y-n,b.x+n,b.y-n);t.lineTo(b.x-n,b.y+n);t.quadraticCurveTo(c.x-n,c.y+n,a.x-n,a.y+n);t.closePath();t.fill();t.lineWidth=1;t.stroke();}\n  else{var lw=st==='pencil'?Math.max(0.8,w*0.4):w;t.lineWidth=lw;t.lineCap=st==='marker'?'square':'round';t.lineJoin=st==='marker'?'miter':'round';\n   if(st==='neon'){t.shadowColor=col;t.shadowBlur=lw*1.2;}\n   t.beginPath();t.moveTo(a.x,a.y);t.quadraticCurveTo(c.x,c.y,b.x,b.y);t.stroke();\n   if(st==='pencil'){var m=Math.ceil(dist(a,b)*0.8);t.globalAlpha=0.35;for(var i=0;i<m;i++){var q=Math.random();t.fillRect(a.x+(b.x-a.x)*q+(Math.random()-.5)*lw*2.2,a.y+(b.y-a.y)*q+(Math.random()-.5)*lw*2.2,1,1);}}\n   if(st==='neon'){t.shadowBlur=0;t.strokeStyle='rgba(255,255,255,.9)';t.lineWidth=Math.max(1,lw*0.33);t.beginPath();t.moveTo(a.x,a.y);t.quadraticCurveTo(c.x,c.y,b.x,b.y);t.stroke();}}\n  t.restore();}\n function beginStroke(e,p,erase){var L=S.active;pushHistory([L.id]);tctx.clearRect(0,0,S.W,S.H);var pr=pressureOf(e);\n  stroke={erase:erase,color:erase?'#000000':(e.button===2?S.secondary:S.primary),style:erase?(S.eraserSoft?'soft':'round'):S.brushStyle,carry:0,pr:pr};\n  if(erase){stroke.snap=cloneCanvas(L.canvas);temp.style.display='none';}else showTemp(L);\n  var start=(e.shiftKey&&lastPt)?{x:lastPt.x,y:lastPt.y}:{x:p.x,y:p.y};\n  dab(start,pr);\n  if(start.x!==p.x||start.y!==p.y){drawSeg(start,{x:(start.x+p.x)\/2,y:(start.y+p.y)\/2},p,pr);}\n  stroke.sm={x:p.x,y:p.y};stroke.prev={x:p.x,y:p.y};stroke.mid={x:p.x,y:p.y};lastPt={x:p.x,y:p.y};\n  if(erase)renderErase();}\n function addPoint(p,pr){var k=1-S.smoothing\/100*0.9,sm=stroke.sm;sm.x+=(p.x-sm.x)*k;sm.y+=(p.y-sm.y)*k;lastPt={x:p.x,y:p.y};stroke.pr=pr;\n  var prev=stroke.prev;if(Math.abs(sm.x-prev.x)<0.25&&Math.abs(sm.y-prev.y)<0.25)return;\n  var mid={x:(prev.x+sm.x)\/2,y:(prev.y+sm.y)\/2};drawSeg(stroke.mid,prev,mid,pr);stroke.mid=mid;stroke.prev={x:sm.x,y:sm.y};}\n function doErase(){var L=S.active,c=L.ctx;c.save();c.clearRect(0,0,S.W,S.H);c.drawImage(stroke.snap,0,0);c.globalCompositeOperation='destination-out';c.globalAlpha=S.opacity\/100;c.drawImage(temp,0,0);c.restore();}\n function renderErase(){if(eraseRAF)return;eraseRAF=requestAnimationFrame(function(){eraseRAF=0;if(stroke&&stroke.erase)doErase();});}\n function endStroke(){if(!stroke)return;if(lastPt)drawSeg(stroke.mid,stroke.prev,lastPt,stroke.pr);var L=S.active;\n  if(stroke.erase){cancelAnimationFrame(eraseRAF);eraseRAF=0;doErase();tctx.clearRect(0,0,S.W,S.H);thumb(L);}\n  else{commitTemp();addRecent(stroke.color);}stroke=null;}\n function beginSpray(e,p){var L=S.active;pushHistory([L.id]);showTemp(L);sprayPt=p;sprayColor=e.button===2?S.secondary:S.primary;\n  (function loop(){sprayAt(sprayPt);sprayRAF=requestAnimationFrame(loop);})();}\n function sprayAt(p){var r=S.size\/2,n=Math.max(3,Math.round(S.density*r*r\/400+S.density\/8)),ds=Math.max(1,S.size\/70);tctx.fillStyle=sprayColor;\n  for(var i=0;i<n;i++){var a=Math.random()*Math.PI*2,d=r*Math.sqrt(Math.random());tctx.fillRect(p.x+Math.cos(a)*d,p.y+Math.sin(a)*d,ds,ds);}}\n function endSpray(){cancelAnimationFrame(sprayRAF);sprayRAF=0;commitTemp();addRecent(sprayColor);}\n\n \/* ---------- shapes & gradient ---------- *\/\n function shapePath(t,T,a,b,m){var x=a.x,y=a.y,w=b.x-a.x,h=b.y-a.y;\n  if(m.shift){var s=Math.max(Math.abs(w),Math.abs(h));w=(w<0?-1:1)*s;h=(h<0?-1:1)*s;}\n  if(m.alt){x=a.x-w;y=a.y-h;w*=2;h*=2;}\n  if(w<0){x+=w;w=-w;}if(h<0){y+=h;h=-h;}\n  var cx=x+w\/2,cy=y+h\/2,i,ang;t.beginPath();\n  if(T==='rect')t.rect(x,y,w,h);\n  else if(T==='roundRect')rrPath(t,x,y,w,h,Math.min(w,h)*0.18);\n  else if(T==='ellipse')t.ellipse(cx,cy,w\/2,h\/2,0,0,Math.PI*2);\n  else if(T==='triangle'){t.moveTo(cx,y);t.lineTo(x+w,y+h);t.lineTo(x,y+h);t.closePath();}\n  else if(T==='hexagon'){for(i=0;i<6;i++){ang=-Math.PI\/2+i*Math.PI\/3;var px=cx+Math.cos(ang)*w\/2,py=cy+Math.sin(ang)*h\/2;if(i)t.lineTo(px,py);else t.moveTo(px,py);}t.closePath();}\n  else if(T==='star'){for(i=0;i<10;i++){var rr=i%2?0.42:1;ang=-Math.PI\/2+i*Math.PI\/5;var sx=cx+Math.cos(ang)*w\/2*rr,sy=cy+Math.sin(ang)*h\/2*rr;if(i)t.lineTo(sx,sy);else t.moveTo(sx,sy);}t.closePath();}}\n function renderShape(t,a,b,m){var T=S.shape;t.save();t.lineWidth=S.size;t.lineJoin='round';t.lineCap='round';t.strokeStyle=S.primary;t.fillStyle=S.primary;\n  if(T==='line'||T==='arrow'){var x1=b.x,y1=b.y;if(m.shift){var an=Math.atan2(y1-a.y,x1-a.x),len=dist(a,b),sn=Math.round(an\/(Math.PI\/12))*(Math.PI\/12);x1=a.x+Math.cos(sn)*len;y1=a.y+Math.sin(sn)*len;}\n   var ang=Math.atan2(y1-a.y,x1-a.x),ex=x1,ey=y1;\n   if(T==='arrow'){var hl=Math.max(12,S.size*3.2);ex=x1-Math.cos(ang)*hl*0.6;ey=y1-Math.sin(ang)*hl*0.6;t.beginPath();t.moveTo(x1,y1);t.lineTo(x1-hl*Math.cos(ang-0.42),y1-hl*Math.sin(ang-0.42));t.lineTo(x1-hl*Math.cos(ang+0.42),y1-hl*Math.sin(ang+0.42));t.closePath();t.fill();}\n   t.beginPath();t.moveTo(a.x,a.y);t.lineTo(ex,ey);t.stroke();t.restore();return;}\n  shapePath(t,T,a,b,m);if(S.shapeMode!=='stroke'){t.fillStyle=S.shapeMode==='both'?S.secondary:S.primary;t.fill();}if(S.shapeMode!=='fill')t.stroke();t.restore();}\n function snapGrad(p,shift){if(!shift)return p;var an=Math.atan2(p.y-dragA.y,p.x-dragA.x),len=dist(dragA,p),sn=Math.round(an\/(Math.PI\/4))*(Math.PI\/4);return {x:dragA.x+Math.cos(sn)*len,y:dragA.y+Math.sin(sn)*len};}\n function renderGrad(){var t=tctx,a=dragA,b=dragB,g;t.clearRect(0,0,S.W,S.H);\n  if(S.gradType==='radial')g=t.createRadialGradient(a.x,a.y,0,a.x,a.y,Math.max(1,dist(a,b)));else g=t.createLinearGradient(a.x,a.y,b.x,b.y);\n  g.addColorStop(0,S.primary);g.addColorStop(1,S.gradEnd==='transparent'?rgba(S.primary,0):S.secondary);t.fillStyle=g;t.fillRect(0,0,S.W,S.H);}\n\n \/* ---------- fill & picker ---------- *\/\n function floodMask(img,sx,sy,tol){var w=img.width,h=img.height,d=img.data,mask=new Uint8Array(w*h),i0=(sy*w+sx)*4,r0=d[i0],g0=d[i0+1],b0=d[i0+2],a0=d[i0+3];\n  function ok(p){if(mask[p])return false;var i=p*4;return Math.abs(d[i]-r0)<=tol&&Math.abs(d[i+1]-g0)<=tol&&Math.abs(d[i+2]-b0)<=tol&&Math.abs(d[i+3]-a0)<=tol;}\n  if(!S.contiguous){for(var p=0;p<w*h;p++)if(ok(p))mask[p]=1;return mask;}\n  var stack=[sy*w+sx];\n  while(stack.length){var q=stack.pop();if(!ok(q))continue;var x=q%w,y=(q-x)\/w,l=x,r=x;\n   while(l>0&&ok(y*w+l-1))l--;while(r<w-1&&ok(y*w+r+1))r++;var up=false,dn=false;\n   for(var k=l;k<=r;k++){var z=y*w+k;mask[z]=1;\n    if(y>0){if(ok(z-w)){if(!up){stack.push(z-w);up=true;}}else up=false;}\n    if(y<h-1){if(ok(z+w)){if(!dn){stack.push(z+w);dn=true;}}else dn=false;}}}\n  return mask;}\n function fillAt(p,color){var x=Math.floor(p.x),y=Math.floor(p.y);if(x<0||y<0||x>=S.W||y>=S.H)return;var L=S.active;\n  var src=S.sampleAll?composite().getContext('2d'):L.ctx,img=src.getImageData(0,0,S.W,S.H),mask=floodMask(img,x,y,S.tolerance),c=hexToRgb(color);\n  var out=new ImageData(S.W,S.H),d=out.data,any=false;for(var i=0;i<mask.length;i++)if(mask[i]){var j=i*4;d[j]=c[0];d[j+1]=c[1];d[j+2]=c[2];d[j+3]=255;any=true;}\n  if(!any)return;var mc=document.createElement('canvas');mc.width=S.W;mc.height=S.H;mc.getContext('2d').putImageData(out,0,0);var fc=mc;\n  if(S.expand){fc=document.createElement('canvas');fc.width=S.W;fc.height=S.H;var f=fc.getContext('2d');[[0,0],[1,0],[-1,0],[0,1],[0,-1]].forEach(function(o){f.drawImage(mc,o[0],o[1]);});}\n  pushHistory([L.id]);L.ctx.save();L.ctx.globalAlpha=S.opacity\/100;L.ctx.drawImage(fc,0,0);L.ctx.restore();thumb(L);addRecent(color);}\n function samplePx(x,y){PCX.clearRect(0,0,1,1);S.layers.forEach(function(l){if(!l.visible)return;PCX.globalAlpha=l.opacity;PCX.globalCompositeOperation=gco(l.blend);PCX.drawImage(l.canvas,x,y,1,1,0,0,1,1);});\n  PCX.globalAlpha=1;PCX.globalCompositeOperation='source-over';return PCX.getImageData(0,0,1,1).data;}\n function pick(p,secondary){var x=Math.floor(p.x),y=Math.floor(p.y);if(x<0||y<0||x>=S.W||y>=S.H)return;var d=samplePx(x,y);\n  if(d[3]===0){flash('Transparent pixel');return;}var hex=rgbToHex(d[0],d[1],d[2]);setColor(secondary?'secondary':'primary',hex);flash('Picked '+hex.toUpperCase());}\n\n \/* ---------- text ---------- *\/\n function textFont(z){return (S.italic?'italic ':'')+(S.bold?'700 ':'')+(S.fontSize*(z||1))+'px '+S.font;}\n function startText(p){var ta=document.createElement('textarea');ta.className='mwp-textbox';ta.spellcheck=false;ta.placeholder='Type\u2026';vp.appendChild(ta);textBox={ta:ta,x:p.x,y:p.y};styleText();\n  ta.addEventListener('input',styleText);ta.addEventListener('pointerdown',function(ev){ev.stopPropagation();});\n  ta.addEventListener('keydown',function(ev){ev.stopPropagation();if(ev.key==='Escape'){ev.preventDefault();cancelText();}else if(ev.key==='Enter'&&(ev.ctrlKey||ev.metaKey)){ev.preventDefault();finishText();}});\n  setTimeout(function(){ta.focus();},0);}\n function styleText(){if(!textBox)return;var ta=textBox.ta,z=S.zoom,fs=S.fontSize*z;ta.style.left=(S.panX+textBox.x*z-1)+'px';ta.style.top=(S.panY+textBox.y*z-1)+'px';\n  ta.style.font=textFont(z);ta.style.lineHeight='1.2';ta.style.color=S.primary;MC.font=textFont(z);var lines=ta.value.split('\\n'),w=0;\n  lines.forEach(function(l){w=Math.max(w,MC.measureText(l||' ').width);});ta.style.width=Math.ceil(w+fs*0.6+6)+'px';ta.style.height=Math.ceil(lines.length*fs*1.2+2)+'px';}\n function finishText(){if(!textBox)return;var tb=textBox,v=tb.ta.value;tb.ta.remove();textBox=null;if(!v.trim())return;var L=S.active;if(!L.visible){flash('Layer is hidden');return;}\n  pushHistory([L.id]);var c=L.ctx;c.save();c.font=textFont(1);c.fillStyle=S.primary;c.globalAlpha=S.opacity\/100;c.textBaseline='top';\n  v.split('\\n').forEach(function(ln,i){c.fillText(ln,tb.x,tb.y+i*S.fontSize*1.2+S.fontSize*0.1);});c.restore();thumb(L);addRecent(S.primary);}\n function cancelText(){if(textBox){textBox.ta.remove();textBox=null;}}\n\n \/* ---------- crop ---------- *\/\n function clampPt(p){return {x:clamp(p.x,0,S.W),y:clamp(p.y,0,S.H)};}\n function normRect(a,b,sq){var w=b.x-a.x,h=b.y-a.y;if(sq){var s=Math.min(Math.abs(w),Math.abs(h));w=(w<0?-1:1)*s;h=(h<0?-1:1)*s;}\n  var x=w<0?a.x+w:a.x,y=h<0?a.y+h:a.y;return {x:x,y:y,w:Math.abs(w),h:Math.abs(h)};}\n function updateCropUI(){$$('.mwp-crop-apply').forEach(function(b){b.disabled=!cropRect;});\n  if(S.tool==='crop')$('.mwp-tip').textContent=cropRect?('Selection '+Math.round(cropRect.w)+' \u00d7 '+Math.round(cropRect.h)+' px'):TIPS.crop;}\n function applyCrop(){if(!cropRect)return;var x=Math.round(cropRect.x),y=Math.round(cropRect.y),w=Math.max(1,Math.round(cropRect.w)),h=Math.max(1,Math.round(cropRect.h));cropRect=null;\n  transformAll(w,h,function(c,s){c.drawImage(s,-x,-y);});updateCropUI();}\n function cancelCrop(){cropRect=null;drawOverlay();updateCropUI();}\n\n \/* ---------- document transforms ---------- *\/\n function transformAll(nw,nh,fn){finishText();pushHistory(null);S.layers.forEach(function(L){var src=cloneCanvas(L.canvas);L.canvas.width=nw;L.canvas.height=nh;L.ctx.save();L.ctx.imageSmoothingQuality='high';fn(L.ctx,src);L.ctx.restore();});\n  S.W=nw;S.H=nh;resizeStage();rebuild();thumbsAll();fit();}\n function layerOp(fn){var L=S.active;finishText();pushHistory([L.id]);var src=cloneCanvas(L.canvas);L.ctx.save();L.ctx.clearRect(0,0,S.W,S.H);fn(L.ctx,src);L.ctx.restore();thumb(L);}\n function filterLayer(fn){var L=S.active;finishText();pushHistory([L.id]);var img=L.ctx.getImageData(0,0,S.W,S.H);fn(img.data,S.W,S.H);L.ctx.putImageData(img,0,0);thumb(L);}\n function composite(){var c=document.createElement('canvas');c.width=S.W;c.height=S.H;var x=c.getContext('2d');\n  S.layers.forEach(function(l){if(!l.visible)return;x.globalAlpha=l.opacity;x.globalCompositeOperation=gco(l.blend);x.drawImage(l.canvas,0,0);});return c;}\n function newDoc(w,h,bg){finishText();cancelOp();cropRect=null;S.W=w;S.H=h;uid=0;S.layers=[];S.active=null;var L=makeLayer(null,'Background');\n  if(bg&&bg!=='transparent'){L.ctx.fillStyle=bg==='black'?'#000':bg==='primary'?S.primary:'#fff';L.ctx.fillRect(0,0,w,h);}\n  S.layers=[L];S.active=L;lastPt=null;resizeStage();rebuild();thumb(L);undoS.length=0;redoS.length=0;histUI();S.autoFit=true;fit();drawOverlay();}\n function fitDims(w,h){var s=Math.min(1,8000\/w,8000\/h,Math.sqrt(16e6\/(w*h)));return [Math.max(1,Math.round(w*s)),Math.max(1,Math.round(h*s))];}\n function loadFile(file,asDoc){if(!file||!\/^image\\\/\/.test(file.type))return;var url=URL.createObjectURL(file),img=new Image();\n  img.onload=function(){URL.revokeObjectURL(url);var nm=(file.name||'Image').replace(\/\\.[^.]+$\/,'');\n   if(asDoc){var d=fitDims(img.naturalWidth,img.naturalHeight);newDoc(d[0],d[1],'transparent');S.active.name=nm;S.active.ctx.drawImage(img,0,0,d[0],d[1]);rebuild();thumb();}\n   else addImageLayer(img,nm);};\n  img.onerror=function(){flash('Could not open image');};img.src=url;}\n function addImageLayer(img,name){finishText();pushHistory([]);var L=makeLayer(null,name||'Image'),w=img.naturalWidth||img.width,h=img.naturalHeight||img.height,s=Math.min(1,S.W\/w,S.H\/h);\n  w*=s;h*=s;L.ctx.drawImage(img,(S.W-w)\/2,(S.H-h)\/2,w,h);insertLayer(L);setTool('move');flash('Placed as new layer \u2014 drag to position');}\n function exportImg(fmt){finishText();var c=composite(),type='image\/'+fmt;\n  if(fmt==='jpeg'){var j=document.createElement('canvas');j.width=S.W;j.height=S.H;var x=j.getContext('2d');x.fillStyle='#fff';x.fillRect(0,0,S.W,S.H);x.drawImage(c,0,0);c=j;}\n  c.toBlob(function(b){if(!b){flash('Export failed');return;}var a=document.createElement('a');a.href=URL.createObjectURL(b);a.download='artwork.'+(fmt==='jpeg'?'jpg':fmt);document.body.appendChild(a);a.click();a.remove();setTimeout(function(){URL.revokeObjectURL(a.href);},3000);flash('Exported '+a.download);},type,0.92);}\n function copyImage(){try{composite().toBlob(function(b){navigator.clipboard.write([new ClipboardItem({'image\/png':b})]).then(function(){flash('Image copied to clipboard');},function(){flash('Clipboard not available');});},'image\/png');}catch(e){flash('Clipboard not available');}}\n\n \/* ---------- pixel filters ---------- *\/\n function adjustData(d,b,c,s,hd){var h=hd*Math.PI\/180,cs=Math.cos(h),sn=Math.sin(h);\n  var M1=[0.213+0.787*s,0.715-0.715*s,0.072-0.072*s,0.213-0.213*s,0.715+0.285*s,0.072-0.072*s,0.213-0.213*s,0.715-0.715*s,0.072+0.928*s];\n  var M2=[0.213+cs*0.787-sn*0.213,0.715-cs*0.715-sn*0.715,0.072-cs*0.072+sn*0.928,0.213-cs*0.213+sn*0.143,0.715+cs*0.285+sn*0.140,0.072-cs*0.072-sn*0.283,0.213-cs*0.213-sn*0.787,0.715-cs*0.715+sn*0.715,0.072+cs*0.928+sn*0.072];\n  function cl(v){return v<0?0:v>255?255:v;}\n  for(var i=0;i<d.length;i+=4){var r=cl(d[i]*b),g=cl(d[i+1]*b),bl=cl(d[i+2]*b);r=cl((r-127.5)*c+127.5);g=cl((g-127.5)*c+127.5);bl=cl((bl-127.5)*c+127.5);\n   var r2=cl(M1[0]*r+M1[1]*g+M1[2]*bl),g2=cl(M1[3]*r+M1[4]*g+M1[5]*bl),b2=cl(M1[6]*r+M1[7]*g+M1[8]*bl);\n   d[i]=cl(M2[0]*r2+M2[1]*g2+M2[2]*b2);d[i+1]=cl(M2[3]*r2+M2[4]*g2+M2[5]*b2);d[i+2]=cl(M2[6]*r2+M2[7]*g2+M2[8]*b2);}}\n function boxBlur(d,w,h,rad){var r=Math.max(1,Math.round(rad\/1.7)),t=new Uint8ClampedArray(d.length);\n  function pass(src,dst,hor){var len=hor?w:h,lines=hor?h:w,div=2*r+1;for(var l=0;l<lines;l++){for(var ch=0;ch<4;ch++){var base=hor?(l*w*4+ch):(l*4+ch),st=hor?4:w*4,sum=0,i;\n   for(i=-r;i<=r;i++)sum+=src[base+clamp(i,0,len-1)*st];\n   for(i=0;i<len;i++){dst[base+i*st]=sum\/div;sum+=src[base+Math.min(len-1,i+r+1)*st]-src[base+Math.max(0,i-r)*st];}}}}\n  for(var k=0;k<3;k++){pass(d,t,true);pass(t,d,false);}}\n function sharpen(d,w,h){var s=new Uint8ClampedArray(d);for(var y=1;y<h-1;y++)for(var x=1;x<w-1;x++){var i=(y*w+x)*4;for(var c=0;c<3;c++){var v=5*s[i+c]-s[i+c-4]-s[i+c+4]-s[i+c-w*4]-s[i+c+w*4];d[i+c]=v;}}}\n\n \/* ---------- dialogs ---------- *\/\n var modalCancel=null;\n function dialog(title,body,o){o=o||{};closeModal();\n  modalEl.innerHTML='<div class=\"mwp-dialog\" role=\"dialog\"><div class=\"mwp-dlg-h\"><span>'+title+'<\/span><button class=\"mwp-ib\" data-x title=\"Close\">'+ico('x')+'<\/button><\/div><div class=\"mwp-dlg-b\">'+body+'<\/div><div class=\"mwp-dlg-f\">'+(o.noCancel?'':'<button class=\"mwp-btn\" data-x>Cancel<\/button>')+'<button class=\"mwp-btn primary\" data-ok>'+(o.ok||'OK')+'<\/button><\/div><\/div>';\n  modalEl.classList.add('open');function q(s){return modalEl.querySelector(s);}modalCancel=o.onCancel||null;\n  modalEl.querySelectorAll('[data-x]').forEach(function(b){b.onclick=function(){closeModal();};});\n  q('[data-ok]').onclick=function(){if(o.onOk&&o.onOk(q)===false)return;modalCancel=null;closeModal();};\n  if(o.onInput)q('.mwp-dlg-b').addEventListener('input',function(){o.onInput(q);});if(o.init)o.init(q);\n  var f=q('.mwp-dlg-b input,.mwp-dlg-b select');if(f)f.focus();}\n function closeModal(){if(modalCancel){var f=modalCancel;modalCancel=null;f();}modalEl.classList.remove('open');modalEl.innerHTML='';}\n modalEl.addEventListener('pointerdown',function(e){if(e.target===modalEl)closeModal();});\n function rng(name,label,min,max,val,unit){return '<label>'+label+' <span data-v=\"'+name+'\">'+val+(unit||'')+'<\/span><input type=\"range\" name=\"'+name+'\" min=\"'+min+'\" max=\"'+max+'\" value=\"'+val+'\" data-unit=\"'+(unit||'')+'\"><\/label>';}\n function syncRng(q){modalEl.querySelectorAll('input[type=range]').forEach(function(r){var s=q('[data-v=\"'+r.name+'\"]');if(s)s.textContent=r.value+r.dataset.unit;});}\n function dlgNew(){dialog('New document','<label>Preset<select name=\"preset\">'+PRESETS.map(function(p,i){return '<option value=\"'+i+'\">'+p[0]+'<\/option>';}).join('')+'<\/select><\/label>'+\n  '<div class=\"mwp-row\"><label>Width (px)<input type=\"number\" name=\"w\" min=\"1\" max=\"8000\" value=\"'+S.W+'\"><\/label><label>Height (px)<input type=\"number\" name=\"h\" min=\"1\" max=\"8000\" value=\"'+S.H+'\"><\/label><\/div>'+\n  '<label>Background<select name=\"bg\"><option value=\"white\">White<\/option><option value=\"transparent\">Transparent<\/option><option value=\"black\">Black<\/option><option value=\"primary\">Primary color<\/option><\/select><\/label><p class=\"mwp-note\">The current artwork will be replaced.<\/p>',\n  {ok:'Create',init:function(q){q('[name=preset]').onchange=function(e){var p=PRESETS[e.target.value];if(p[1]){q('[name=w]').value=p[1];q('[name=h]').value=p[2];}};},\n   onOk:function(q){var w=clamp(parseInt(q('[name=w]').value,10)||0,1,8000),h=clamp(parseInt(q('[name=h]').value,10)||0,1,8000);if(w*h>40e6){alert('Canvas is too large (max 40 megapixels).');return false;}newDoc(w,h,q('[name=bg]').value);}});}\n function dlgResize(){var ratio=S.W\/S.H;dialog('Image size','<div class=\"mwp-row\"><label>Width (px)<input type=\"number\" name=\"w\" min=\"1\" max=\"8000\" value=\"'+S.W+'\"><\/label><label>Height (px)<input type=\"number\" name=\"h\" min=\"1\" max=\"8000\" value=\"'+S.H+'\"><\/label><\/div><label class=\"mwp-chk\"><input type=\"checkbox\" name=\"keep\" checked> Keep aspect ratio<\/label><p class=\"mwp-note\">All layers are resampled.<\/p>',\n  {ok:'Resize',init:function(q){var W=q('[name=w]'),H=q('[name=h]'),K=q('[name=keep]');W.oninput=function(){if(K.checked)H.value=Math.max(1,Math.round(W.value\/ratio));};H.oninput=function(){if(K.checked)W.value=Math.max(1,Math.round(H.value*ratio));};},\n   onOk:function(q){var w=clamp(parseInt(q('[name=w]').value,10)||1,1,8000),h=clamp(parseInt(q('[name=h]').value,10)||1,1,8000);if(w===S.W&&h===S.H)return;transformAll(w,h,function(c,s){c.drawImage(s,0,0,w,h);});}});}\n function dlgCanvas(){dialog('Canvas size','<div class=\"mwp-row\"><label>Width (px)<input type=\"number\" name=\"w\" min=\"1\" max=\"8000\" value=\"'+S.W+'\"><\/label><label>Height (px)<input type=\"number\" name=\"h\" min=\"1\" max=\"8000\" value=\"'+S.H+'\"><\/label><\/div><label>Anchor<select name=\"an\"><option value=\"cc\">Center<\/option><option value=\"tl\">Top left<\/option><option value=\"tc\">Top center<\/option><option value=\"tr\">Top right<\/option><option value=\"bl\">Bottom left<\/option><option value=\"bc\">Bottom center<\/option><option value=\"br\">Bottom right<\/option><\/select><\/label>',\n  {ok:'Apply',onOk:function(q){var w=clamp(parseInt(q('[name=w]').value,10)||1,1,8000),h=clamp(parseInt(q('[name=h]').value,10)||1,1,8000),an=q('[name=an]').value,ow=S.W,oh=S.H;\n   var ox=an[1]==='l'?0:an[1]==='r'?w-ow:Math.round((w-ow)\/2),oy=an[0]==='t'?0:an[0]==='b'?h-oh:Math.round((h-oh)\/2);transformAll(w,h,function(c,s){c.drawImage(s,ox,oy);});}});}\n function previewFilter(css){S.active.canvas.style.filter=css;}\n function dlgBlur(){dialog('Gaussian blur',rng('r','Radius',1,60,4,'px'),{ok:'Apply',init:function(q){previewFilter('blur(4px)');},onInput:function(q){syncRng(q);previewFilter('blur('+q('[name=r]').value+'px)');},\n  onCancel:function(){previewFilter('');},onOk:function(q){var r=+q('[name=r]').value;previewFilter('');\n   if(FILTER_OK)layerOp(function(c,s){c.filter='blur('+r+'px)';c.drawImage(s,0,0);c.filter='none';});else filterLayer(function(d,w,h){boxBlur(d,w,h,r);});}});}\n function dlgPixelate(){dialog('Pixelate',rng('n','Cell size',2,80,10,'px'),{ok:'Apply',onInput:syncRng,onOk:function(q){var n=+q('[name=n]').value;layerOp(function(c,s){var sw=Math.max(1,Math.round(S.W\/n)),sh=Math.max(1,Math.round(S.H\/n)),t=document.createElement('canvas');t.width=sw;t.height=sh;t.getContext('2d').drawImage(s,0,0,sw,sh);c.imageSmoothingEnabled=false;c.drawImage(t,0,0,S.W,S.H);});}});}\n function dlgAdjust(){function css(q){return 'brightness('+q('[name=b]').value\/100+') contrast('+q('[name=c]').value\/100+') saturate('+q('[name=s]').value\/100+') hue-rotate('+q('[name=h]').value+'deg)';}\n  dialog('Adjustments',rng('b','Brightness',0,200,100,'%')+rng('c','Contrast',0,200,100,'%')+rng('s','Saturation',0,200,100,'%')+rng('h','Hue',-180,180,0,'\u00b0'),\n  {ok:'Apply',onInput:function(q){syncRng(q);previewFilter(css(q));},onCancel:function(){previewFilter('');},\n   onOk:function(q){var b=q('[name=b]').value\/100,c=q('[name=c]').value\/100,s=q('[name=s]').value\/100,h=+q('[name=h]').value;previewFilter('');filterLayer(function(d){adjustData(d,b,c,s,h);});}});}\n function dlgHelp(){var k=[['B','Brush'],['E','Eraser'],['S','Spray'],['F','Paint bucket'],['G','Gradient'],['I','Eyedropper'],['T','Text'],['U','Shapes'],['V','Move layer'],['H \/ Space','Pan'],['C','Crop'],['[ ]','Brush size'],['1 \u2026 0','Opacity 10 \u2026 100%'],['X \/ D','Swap \/ default colors'],['Ctrl+Z \/ Ctrl+Y','Undo \/ Redo'],['Ctrl+S','Export PNG'],['Ctrl+O','Open image'],['Ctrl+V','Paste image as layer'],['Ctrl+Shift+N','New layer'],['Ctrl+J \/ Ctrl+E','Duplicate \/ Merge down'],['Ctrl+0 \/ Ctrl+1','Fit \/ 100%'],['Ctrl + wheel','Zoom at cursor'],['Wheel \/ Shift+wheel','Pan'],[\"'\",'Grid'],['Del','Clear layer']];\n  dialog('Keyboard shortcuts','<div class=\"mwp-keys\">'+k.map(function(r){return '<kbd>'+r[0]+'<\/kbd><span>'+r[1]+'<\/span>';}).join('')+'<\/div><p class=\"mwp-note\">Touch: two fingers to pinch-zoom and pan. Pen pressure is supported on tablets &amp; styluses.<\/p>',{ok:'Got it',noCancel:true});}\n\n \/* ---------- color panel ---------- *\/\n var sv=$('.mwp-sv canvas'),svx=sv.getContext('2d'),knob=$('.mwp-sv-knob'),hue=$('.mwp-hue'),hexIn=$('.mwp-hex'),nat=$('.mwp-native'),natTarget='primary',hsv=[0,0,0.12];\n function drawSV(){var w=sv.width,h=sv.height,g;svx.fillStyle='hsl('+hsv[0]+',100%,50%)';svx.fillRect(0,0,w,h);g=svx.createLinearGradient(0,0,w,0);g.addColorStop(0,'#fff');g.addColorStop(1,'rgba(255,255,255,0)');svx.fillStyle=g;svx.fillRect(0,0,w,h);\n  g=svx.createLinearGradient(0,0,0,h);g.addColorStop(0,'rgba(0,0,0,0)');g.addColorStop(1,'#000');svx.fillStyle=g;svx.fillRect(0,0,w,h);knob.style.left=(hsv[1]*100)+'%';knob.style.top=((1-hsv[2])*100)+'%';knob.style.background=S.primary;hue.value=hsv[0];}\n function setColor(which,hex,fromSV){hex=String(hex).toLowerCase();S[which]=hex;$$('.mwp-c-'+which).forEach(function(el){el.style.background=hex;});\n  if(which==='primary'){if(document.activeElement!==hexIn)hexIn.value=hex.toUpperCase();if(!fromSV){var c=hexToRgb(hex),h=rgbToHsv(c[0],c[1],c[2]);if(h[1]===0||h[2]===0)h[0]=hsv[0];hsv=h;}drawSV();styleText();}}\n function fromHSV(){var c=hsvToRgb(hsv[0],hsv[1],hsv[2]);setColor('primary',rgbToHex(c[0],c[1],c[2]),true);}\n var svDrag=false;function svPick(e){var r=sv.getBoundingClientRect();hsv[1]=clamp((e.clientX-r.left)\/r.width,0,1);hsv[2]=1-clamp((e.clientY-r.top)\/r.height,0,1);fromHSV();}\n sv.parentNode.addEventListener('pointerdown',function(e){svDrag=true;try{sv.parentNode.setPointerCapture(e.pointerId);}catch(_){}svPick(e);});\n sv.parentNode.addEventListener('pointermove',function(e){if(svDrag)svPick(e);});\n sv.parentNode.addEventListener('pointerup',function(){svDrag=false;});\n hue.addEventListener('input',function(){hsv[0]=+hue.value;fromHSV();});\n hexIn.addEventListener('change',function(){var v=hexIn.value.trim().replace('#','');if(\/^([0-9a-f]{3}|[0-9a-f]{6})$\/i.test(v)){var c=hexToRgb(v);setColor('primary',rgbToHex(c[0],c[1],c[2]));}else hexIn.value=S.primary.toUpperCase();});\n hexIn.addEventListener('keydown',function(e){if(e.key==='Enter')hexIn.blur();});\n ['primary','secondary'].forEach(function(w){$$('.mwp-c-'+w).forEach(function(el){el.addEventListener('click',function(){natTarget=w;nat.value=S[w];nat.click();});});});\n nat.addEventListener('input',function(){setColor(natTarget,nat.value);});\n function swapColors(){var p=S.primary;setColor('primary',S.secondary);setColor('secondary',p);}\n function resetColors(){setColor('primary','#000000');setColor('secondary','#ffffff');}\n function swatchHTML(c){return '<button class=\"mwp-sw\" data-c=\"'+c+'\" style=\"background:'+c+'\" title=\"'+c.toUpperCase()+' \u2014 click: primary, right-click: secondary\"><\/button>';}\n $('.mwp-swatches').innerHTML=PALETTE.map(swatchHTML).join('');\n function addRecent(c){if(!c)return;S.recent=[c].concat(S.recent.filter(function(x){return x!==c;})).slice(0,12);$('.mwp-recent').innerHTML=S.recent.map(swatchHTML).join('');}\n $('.mwp-panels').addEventListener('click',function(e){var b=e.target.closest('.mwp-sw');if(b)setColor(e.shiftKey?'secondary':'primary',b.dataset.c);});\n $('.mwp-panels').addEventListener('contextmenu',function(e){var b=e.target.closest('.mwp-sw');if(b){e.preventDefault();setColor('secondary',b.dataset.c);}});\n\n \/* ---------- options bar ---------- *\/\n function setOpt(k,v,src){if(k==='size')v=clamp(Math.round(v),1,500);if(k==='opacity')v=clamp(Math.round(v),1,100);if(k==='fontSize')v=clamp(Math.round(v),6,600);S[k]=v;syncOpts(src);updateCursorSize();styleText();}\n function syncOpts(skip){$$('[data-opt]').forEach(function(el){if(el===skip)return;var v=S[el.dataset.opt];if(el.type==='checkbox')el.checked=!!v;else el.value=v;});\n  $$('[data-optv]').forEach(function(el){el.textContent=S[el.dataset.optv]+(el.dataset.unit||'');});\n  $$('[data-shape]').forEach(function(b){b.classList.toggle('active',b.dataset.shape===S.shape);});\n  $$('[data-toggle]').forEach(function(b){b.classList.toggle('active',!!S[b.dataset.toggle]);});}\n $$('[data-opt]').forEach(function(el){var ev=(el.type==='checkbox'||el.tagName==='SELECT')?'change':'input';el.addEventListener(ev,function(){\n  var v=el.type==='checkbox'?el.checked:(el.type==='range'||el.type==='number')?parseFloat(el.value):el.value;if(typeof v==='number'&&isNaN(v))return;setOpt(el.dataset.opt,v,el);});});\n $$('[data-shape]').forEach(function(b){b.addEventListener('click',function(){S.shape=b.dataset.shape;syncOpts();});});\n $$('[data-toggle]').forEach(function(b){b.addEventListener('click',function(){S[b.dataset.toggle]=!S[b.dataset.toggle];syncOpts();styleText();});});\n\n \/* ---------- tools ---------- *\/\n function setTool(t){finishText();if(S.tool==='crop'&&t!=='crop')cancelCrop();S.tool=t;\n  $$('.mwp-tool').forEach(function(b){b.classList.toggle('active',b.dataset.tool===t);});\n  $$('[data-tools]').forEach(function(g){g.style.display=g.dataset.tools.split(' ').indexOf(t)>=0?'':'none';});\n  vp.dataset.tool=t;$('.mwp-toolname').textContent=NAMES[t];$('.mwp-hint').textContent=HINTS[t];$('.mwp-tip').textContent=TIPS[t]||'';cur.style.display='none';drawOverlay();if(t==='crop')updateCropUI();}\n $$('.mwp-tool').forEach(function(b){b.addEventListener('click',function(){setTool(b.dataset.tool);});});\n\n \/* ---------- pointer handling ---------- *\/\n function cancelOp(){var L=S.active;\n  if(mode==='stroke'&&stroke){if(stroke.erase){cancelAnimationFrame(eraseRAF);eraseRAF=0;L.ctx.clearRect(0,0,S.W,S.H);L.ctx.drawImage(stroke.snap,0,0);}hideTemp();undoS.pop();stroke=null;}\n  else if(mode==='spray'){cancelAnimationFrame(sprayRAF);sprayRAF=0;hideTemp();undoS.pop();}\n  else if(mode==='shape'||mode==='gradient'){hideTemp();}\n  else if(mode==='move'&&moveSnap){L.ctx.clearRect(0,0,S.W,S.H);L.ctx.drawImage(moveSnap,0,0);undoS.pop();}\n  mode=null;histUI();drawOverlay();}\n vp.addEventListener('pointerdown',function(e){closeMenus();var r=vp.getBoundingClientRect();ptrs.set(e.pointerId,{x:e.clientX-r.left,y:e.clientY-r.top});\n  try{vp.setPointerCapture(e.pointerId);}catch(_){}\n  if(ptrs.size===2){cancelOp();var a=Array.from(ptrs.values());pinch={d:Math.max(1,dist(a[0],a[1])),cx:(a[0].x+a[1].x)\/2,cy:(a[0].y+a[1].y)\/2,z:S.zoom,px:S.panX,py:S.panY};mode='pinch';return;}\n  if(ptrs.size>2||mode)return;\n  var p=toDoc(e),t=S.tool;\n  if(e.button===1||space||t==='hand'){mode='pan';panStart={x:e.clientX,y:e.clientY,px:S.panX,py:S.panY};vp.classList.add('panning');e.preventDefault();return;}\n  if(e.button!==0&&e.button!==2)return;\n  if(t==='text'){if(textBox){finishText();return;}if(!S.active.visible){flash('Layer is hidden \u2014 show it to edit');return;}startText(p);return;}\n  if(t==='picker'||(e.altKey&&(t==='brush'||t==='spray'||t==='fill'||t==='gradient'))){pick(p,e.button===2);return;}\n  if(t==='crop'){mode='crop';cropStart=clampPt(p);cropRect=null;return;}\n  if(!S.active.visible){flash('Layer is hidden \u2014 show it to edit');return;}\n  if(t==='fill'){fillAt(p,e.button===2?S.secondary:S.primary);return;}\n  if(t==='brush'||t==='eraser'){mode='stroke';beginStroke(e,p,t==='eraser');return;}\n  if(t==='spray'){mode='spray';beginSpray(e,p);return;}\n  if((t==='shape'||t==='gradient')&&e.button===0){mode=t;dragA=p;dragB=p;dragMods={shift:e.shiftKey,alt:e.altKey};showTemp(S.active);return;}\n  if(t==='move'){mode='move';pushHistory([S.active.id]);moveSnap=cloneCanvas(S.active.canvas);dragA=p;return;}\n });\n vp.addEventListener('pointermove',function(e){var r=vp.getBoundingClientRect();if(ptrs.has(e.pointerId))ptrs.set(e.pointerId,{x:e.clientX-r.left,y:e.clientY-r.top});\n  if(mode==='pinch'){if(ptrs.size>=2){var a=Array.from(ptrs.values()),d=dist(a[0],a[1]),cx=(a[0].x+a[1].x)\/2,cy=(a[0].y+a[1].y)\/2,z=clamp(pinch.z*d\/pinch.d,0.02,32),dx=(pinch.cx-pinch.px)\/pinch.z,dy=(pinch.cy-pinch.py)\/pinch.z;\n   S.zoom=z;S.panX=cx-dx*z;S.panY=cy-dy*z;S.autoFit=false;applyView();}return;}\n  var p=toDoc(e);$('.mwp-xy').textContent=Math.floor(p.x)+', '+Math.floor(p.y);\n  if(cursorTool()&&e.pointerType!=='touch'&&!space&&mode!=='pan'){cur.style.display='block';cur.style.transform='translate('+(e.clientX-r.left)+'px,'+(e.clientY-r.top)+'px) translate(-50%,-50%)';}else cur.style.display='none';\n  if(mode==='pan'){S.panX=panStart.px+e.clientX-panStart.x;S.panY=panStart.py+e.clientY-panStart.y;S.autoFit=false;applyView();}\n  else if(mode==='stroke'){var evs=(e.getCoalescedEvents&&e.getCoalescedEvents())||[];if(!evs.length)evs=[e];evs.forEach(function(ev){addPoint(toDoc(ev),pressureOf(ev));});if(stroke.erase)renderErase();}\n  else if(mode==='spray'){sprayPt=p;}\n  else if(mode==='shape'){dragB=p;dragMods={shift:e.shiftKey,alt:e.altKey};tctx.clearRect(0,0,S.W,S.H);renderShape(tctx,dragA,dragB,dragMods);}\n  else if(mode==='gradient'){dragB=snapGrad(p,e.shiftKey);renderGrad();drawOverlay();}\n  else if(mode==='move'){var L=S.active;L.ctx.clearRect(0,0,S.W,S.H);L.ctx.drawImage(moveSnap,Math.round(p.x-dragA.x),Math.round(p.y-dragA.y));}\n  else if(mode==='crop'){cropRect=normRect(cropStart,clampPt(p),e.shiftKey);drawOverlay();updateCropUI();}\n });\n function onUp(e){ptrs.delete(e.pointerId);\n  if(mode==='pinch'){if(ptrs.size<2)mode=null;return;}\n  if(mode==='pan')vp.classList.remove('panning');\n  else if(mode==='stroke')endStroke();\n  else if(mode==='spray')endSpray();\n  else if(mode==='shape'){if(dist(dragA,dragB)>1){pushHistory([S.active.id]);commitTemp();addRecent(S.primary);}else hideTemp();}\n  else if(mode==='gradient'){if(dist(dragA,dragB)>1){pushHistory([S.active.id]);commitTemp();}else hideTemp();mode=null;drawOverlay();}\n  else if(mode==='move'){moveSnap=null;thumb();}\n  else if(mode==='crop'){if(cropRect&&(cropRect.w<2||cropRect.h<2))cropRect=null;drawOverlay();updateCropUI();}\n  mode=null;}\n vp.addEventListener('pointerup',onUp);\n vp.addEventListener('pointercancel',function(e){if(mode&&mode!=='pinch'&&mode!=='pan'&&mode!=='crop')cancelOp();onUp(e);});\n vp.addEventListener('pointerleave',function(){cur.style.display='none';});\n vp.addEventListener('contextmenu',function(e){e.preventDefault();});\n vp.addEventListener('wheel',function(e){if(current!==api&&!document.fullscreenElement)return;e.preventDefault();var r=vp.getBoundingClientRect();\n  if(e.ctrlKey||e.metaKey||e.altKey){zoomAt(S.zoom*Math.exp(-e.deltaY*(e.deltaMode===1?0.05:0.0022)),e.clientX-r.left,e.clientY-r.top);}\n  else{var dx=e.deltaX,dy=e.deltaY;if(e.shiftKey&&!dx){dx=dy;dy=0;}if(e.deltaMode===1){dx*=16;dy*=16;}S.panX-=dx;S.panY-=dy;S.autoFit=false;applyView();}},{passive:false});\n vp.addEventListener('dragover',function(e){e.preventDefault();});\n vp.addEventListener('drop',function(e){e.preventDefault();var f=e.dataTransfer&&e.dataTransfer.files[0];if(f)loadFile(f,false);});\n\n \/* ---------- menus ---------- *\/\n function closeMenus(){$$('.mwp-menu.open').forEach(function(m){m.classList.remove('open');});}\n function openMenu(m){closeMenus();var b=m.querySelector('.mwp-menu-btn').getBoundingClientRect(),dd=m.querySelector('.mwp-dd');m.classList.add('open');\n  dd.style.top=(b.bottom+4)+'px';dd.style.left=Math.max(4,Math.min(b.left,window.innerWidth-dd.offsetWidth-8))+'px';}\n $$('.mwp-menu-btn').forEach(function(btn){var m=btn.parentNode;\n  btn.addEventListener('click',function(e){e.stopPropagation();if(m.classList.contains('open'))closeMenus();else openMenu(m);});\n  btn.addEventListener('mouseenter',function(){if($('.mwp-menu.open')&&!m.classList.contains('open'))openMenu(m);});});\n document.addEventListener('pointerdown',function(e){if(!e.target.closest||!e.target.closest('.mwp-menu'))closeMenus();});\n $('.mwp-bar').addEventListener('scroll',closeMenus);\n window.addEventListener('resize',closeMenus);\n\n \/* ---------- commands ---------- *\/\n function openFile(asDoc){fileIn.dataset.doc=asDoc?'1':'';fileIn.value='';fileIn.click();}\n fileIn.addEventListener('change',function(){if(fileIn.files[0])loadFile(fileIn.files[0],fileIn.dataset.doc==='1');});\n function moveLayer(dir){var i=S.layers.indexOf(S.active),j=i+dir;if(j<0||j>=S.layers.length)return;pushHistory([]);S.layers.splice(i,1);S.layers.splice(j,0,S.active);rebuild();}\n function togglePanels(){if(root.clientWidth<=860)root.classList.toggle('mwp-panels-open');else root.classList.toggle('mwp-panels-hidden');setTimeout(function(){if(S.autoFit)fit();},30);}\n function toggleFull(){var d=document;if(d.fullscreenElement===root||d.webkitFullscreenElement===root){(d.exitFullscreen||d.webkitExitFullscreen).call(d);}else{var f=root.requestFullscreen||root.webkitRequestFullscreen;if(f)f.call(root);else flash('Fullscreen not supported');}}\n var CMD={\n  'new':dlgNew,open:function(){openFile(true);},openLayer:function(){openFile(false);},\n  png:function(){exportImg('png');},jpg:function(){exportImg('jpeg');},webp:function(){exportImg('webp');},copy:copyImage,\n  undo:undo,redo:redo,\n  clear:function(){var L=S.active;finishText();pushHistory([L.id]);L.ctx.clearRect(0,0,S.W,S.H);thumb(L);},\n  fillLayer:function(){var L=S.active;pushHistory([L.id]);L.ctx.save();L.ctx.globalAlpha=S.opacity\/100;L.ctx.fillStyle=S.primary;L.ctx.fillRect(0,0,S.W,S.H);L.ctx.restore();thumb(L);},\n  swap:swapColors,resetColors:resetColors,\n  resize:dlgResize,canvasSize:dlgCanvas,crop:function(){setTool('crop');},cropApply:applyCrop,cropCancel:cancelCrop,\n  rotCW:function(){var w=S.W,h=S.H;transformAll(h,w,function(c,s){c.translate(h,0);c.rotate(Math.PI\/2);c.drawImage(s,0,0);});},\n  rotCCW:function(){var w=S.W,h=S.H;transformAll(h,w,function(c,s){c.translate(0,w);c.rotate(-Math.PI\/2);c.drawImage(s,0,0);});},\n  flipH:function(){var w=S.W,h=S.H;transformAll(w,h,function(c,s){c.translate(w,0);c.scale(-1,1);c.drawImage(s,0,0);});},\n  flipV:function(){var w=S.W,h=S.H;transformAll(w,h,function(c,s){c.translate(0,h);c.scale(1,-1);c.drawImage(s,0,0);});},\n  lflipH:function(){layerOp(function(c,s){c.translate(S.W,0);c.scale(-1,1);c.drawImage(s,0,0);});},\n  lflipV:function(){layerOp(function(c,s){c.translate(0,S.H);c.scale(1,-1);c.drawImage(s,0,0);});},\n  lnew:function(){finishText();pushHistory([]);insertLayer(makeLayer());},\n  ldup:function(){finishText();var L=S.active;pushHistory([]);var N=makeLayer(null,L.name+' copy');N.ctx.drawImage(L.canvas,0,0);N.opacity=L.opacity;N.blend=L.blend;insertLayer(N);},\n  ldel:function(){if(S.layers.length<2){flash(\"Can't delete the only layer\");return;}finishText();var L=S.active,i=S.layers.indexOf(L);pushHistory([L.id]);S.layers.splice(i,1);S.active=S.layers[Math.max(0,i-1)];rebuild();},\n  lup:function(){moveLayer(1);},ldown:function(){moveLayer(-1);},\n  lmerge:function(){var L=S.active,i=S.layers.indexOf(L);if(i<1){flash('No layer below to merge into');return;}finishText();var B=S.layers[i-1];pushHistory([L.id,B.id]);\n   if(L.visible){B.ctx.save();B.ctx.globalAlpha=L.opacity;B.ctx.globalCompositeOperation=gco(L.blend);B.ctx.drawImage(L.canvas,0,0);B.ctx.restore();}S.layers.splice(i,1);S.active=B;rebuild();thumb(B);},\n  flatten:function(){finishText();pushHistory(null);var c=composite(),L=S.layers[0];L.ctx.clearRect(0,0,S.W,S.H);L.ctx.drawImage(c,0,0);L.opacity=1;L.blend='normal';L.visible=true;L.name='Background';S.layers=[L];S.active=L;rebuild();thumb(L);},\n  gray:function(){filterLayer(function(d){for(var i=0;i<d.length;i+=4){var v=.299*d[i]+.587*d[i+1]+.114*d[i+2];d[i]=d[i+1]=d[i+2]=v;}});},\n  invert:function(){filterLayer(function(d){for(var i=0;i<d.length;i+=4){d[i]=255-d[i];d[i+1]=255-d[i+1];d[i+2]=255-d[i+2];}});},\n  sepia:function(){filterLayer(function(d){for(var i=0;i<d.length;i+=4){var r=d[i],g=d[i+1],b=d[i+2];d[i]=r*.393+g*.769+b*.189;d[i+1]=r*.349+g*.686+b*.168;d[i+2]=r*.272+g*.534+b*.131;}});},\n  sharpen:function(){filterLayer(sharpen);},\n  noise:function(){filterLayer(function(d){for(var i=0;i<d.length;i+=4){if(!d[i+3])continue;var n=(Math.random()-.5)*50;d[i]+=n;d[i+1]+=n;d[i+2]+=n;}});},\n  blur:dlgBlur,pixelate:dlgPixelate,adjust:dlgAdjust,\n  zin:function(){zoomStep(1);},zout:function(){zoomStep(-1);},zfit:function(){S.autoFit=true;fit(true);},\n  z100:function(){var r=vp.getBoundingClientRect();S.zoom=1;S.panX=Math.round((r.width-S.W)\/2);S.panY=Math.round((r.height-S.H)\/2);S.autoFit=false;applyView();},\n  grid:function(){gridEl.style.display=gridEl.style.display==='block'?'none':'block';},\n  panels:togglePanels,full:toggleFull,help:dlgHelp,\n  theme:function(){root.classList.toggle('mwp-light');try{localStorage.setItem('mwp-theme',root.classList.contains('mwp-light')?'light':'dark');}catch(_){}}\n };\n root.addEventListener('click',function(e){var b=e.target.closest('[data-cmd]');if(!b||b.disabled||!root.contains(b))return;closeMenus();var f=CMD[b.dataset.cmd];if(f)f();});\n\n \/* ---------- keyboard ---------- *\/\n function nudge(dx,dy){var L=S.active;if(!nudgeT)pushHistory([L.id]);clearTimeout(nudgeT);nudgeT=setTimeout(function(){nudgeT=0;},700);var s=cloneCanvas(L.canvas);L.ctx.clearRect(0,0,S.W,S.H);L.ctx.drawImage(s,dx,dy);thumb(L);}\n var TOOLKEYS={b:'brush',e:'eraser',s:'spray',f:'fill',g:'gradient',i:'picker',t:'text',u:'shape',v:'move',h:'hand',c:'crop'};\n function onKeyDown(e){var tg=e.target,typing=tg&&(tg.tagName==='INPUT'||tg.tagName==='TEXTAREA'||tg.tagName==='SELECT'||tg.isContentEditable);\n  if(modalEl.classList.contains('open')){if(e.key==='Escape'){e.preventDefault();closeModal();}else if(e.key==='Enter'&&tg.tagName!=='TEXTAREA'){e.preventDefault();var ok=modalEl.querySelector('[data-ok]');if(ok)ok.click();}return;}\n  if(typing)return;var k=(e.key||'').toLowerCase(),mod=e.ctrlKey||e.metaKey;\n  if(mod){var map={z:e.shiftKey?'redo':'undo',y:'redo',s:'png',o:e.shiftKey?'openLayer':'open','0':'zfit','1':'z100','=':'zin','+':'zin','-':'zout',j:'ldup',e:'lmerge',i:'invert'};\n   if(e.shiftKey&&k==='n')map.n='lnew';if(e.shiftKey&&k==='c')map.c='copy';var c=map[k];if(c){e.preventDefault();CMD[c]();}return;}\n  if(e.altKey&&k==='n'){e.preventDefault();dlgNew();return;}\n  if(e.code==='Space'){e.preventDefault();if(!space){space=true;vp.classList.add('space');cur.style.display='none';}return;}\n  if(S.tool==='crop'){if(e.key==='Enter'){applyCrop();return;}if(e.key==='Escape'){cancelCrop();return;}}\n  if(S.tool==='move'&&\/^Arrow\/.test(e.key)){e.preventDefault();var st=e.shiftKey?10:1;nudge(e.key==='ArrowLeft'?-st:e.key==='ArrowRight'?st:0,e.key==='ArrowUp'?-st:e.key==='ArrowDown'?st:0);return;}\n  if(e.altKey)return;\n  if(TOOLKEYS[k]){setTool(TOOLKEYS[k]);return;}\n  if(k==='x'){swapColors();return;}if(k==='d'){resetColors();return;}\n  if(k==='['){setOpt('size',S.size-Math.max(1,Math.round(S.size*0.12)));return;}\n  if(k===']'){setOpt('size',S.size+Math.max(1,Math.round(S.size*0.12)));return;}\n  if(\/^[0-9]$\/.test(k)){setOpt('opacity',k==='0'?100:(+k)*10);flash('Opacity '+S.opacity+'%');return;}\n  if(e.key==='Delete'){e.preventDefault();CMD.clear();return;}\n  if(k===\"'\"){CMD.grid();return;}\n  if(k==='?'||e.key==='F1'){e.preventDefault();dlgHelp();return;}\n  if(e.key==='Escape'&&mode){cancelOp();}}\n function onKeyUp(e){if(e.code==='Space'){space=false;vp.classList.remove('space');}}\n function onPaste(e){var tg=e.target;if(tg&&(tg.tagName==='INPUT'||tg.tagName==='TEXTAREA'))return;var items=(e.clipboardData&&e.clipboardData.items)||[];\n  for(var i=0;i<items.length;i++){if(items[i].kind==='file'&&\/^image\\\/\/.test(items[i].type)){e.preventDefault();var f=items[i].getAsFile();if(f)loadFile(f,false);return;}}}\n var api={onKeyDown:onKeyDown,onKeyUp:onKeyUp,onPaste:onPaste};root._mwp=api;\n\n \/* ---------- boot ---------- *\/\n try{var th=localStorage.getItem('mwp-theme');if(th==='light')root.classList.add('mwp-light');else if(th==='dark')root.classList.remove('mwp-light');}catch(_){}\n resizeStage();newDoc(S.W,S.H,root.dataset.bg||'white');\n setColor('primary',S.primary);setColor('secondary',S.secondary);syncOpts();setTool('brush');histUI();\n document.addEventListener('fullscreenchange',function(){setTimeout(function(){fit();},60);});\n if(window.ResizeObserver){new ResizeObserver(function(){if(S.autoFit)fit();else applyView();}).observe(vp);}\n requestAnimationFrame(function(){fit();});\n}\n\nwindow.MWPaint={init:init};\ndocument.addEventListener('pointerdown',function(e){var r=e.target&&e.target.closest?e.target.closest('.mwp'):null;current=r&&r._mwp?r._mwp:null;},true);\nwindow.addEventListener('keydown',function(e){if(current)current.onKeyDown(e);});\nwindow.addEventListener('keyup',function(e){if(current)current.onKeyUp(e);});\nwindow.addEventListener('paste',function(e){if(current)current.onPaste(e);});\n})();\n<\/script>\n\t<div class=\"mwp \" id=\"mwp-1\" data-w=\"1200\" data-h=\"800\" data-bg=\"white\" style=\"--mwp-h:760px\">\n\n\t<!-- ===== MENU BAR ===== -->\n\t<div class=\"mwp-bar\">\n\t\t<div class=\"mwp-brand\"><i class=\"mwp-logo\"><\/i><span>Paint Online - EzCalculatorOnline<\/span><\/div>\n\n\t\t<div class=\"mwp-menu\"><button class=\"mwp-menu-btn\">File<\/button>\n\t\t\t<div class=\"mwp-dd\">\n\t\t\t\t<button data-cmd=\"new\">New document\u2026<kbd>Alt+N<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"open\">Open image\u2026<kbd>Ctrl+O<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"openLayer\">Place image as layer\u2026<kbd>Ctrl+\u21e7+O<\/kbd><\/button>\n\t\t\t\t<hr>\n\t\t\t\t<button data-cmd=\"png\">Export PNG<kbd>Ctrl+S<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"jpg\">Export JPG<\/button>\n\t\t\t\t<button data-cmd=\"webp\">Export WebP<\/button>\n\t\t\t\t<button data-cmd=\"copy\">Copy image<kbd>Ctrl+\u21e7+C<\/kbd><\/button>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<div class=\"mwp-menu\"><button class=\"mwp-menu-btn\">Edit<\/button>\n\t\t\t<div class=\"mwp-dd\">\n\t\t\t\t<button data-cmd=\"undo\">Undo<kbd>Ctrl+Z<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"redo\">Redo<kbd>Ctrl+Y<\/kbd><\/button>\n\t\t\t\t<hr>\n\t\t\t\t<button data-cmd=\"clear\">Clear layer<kbd>Del<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"fillLayer\">Fill layer with primary<\/button>\n\t\t\t\t<hr>\n\t\t\t\t<button data-cmd=\"swap\">Swap colors<kbd>X<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"resetColors\">Default colors<kbd>D<\/kbd><\/button>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<div class=\"mwp-menu\"><button class=\"mwp-menu-btn\">Image<\/button>\n\t\t\t<div class=\"mwp-dd\">\n\t\t\t\t<button data-cmd=\"resize\">Image size\u2026<\/button>\n\t\t\t\t<button data-cmd=\"canvasSize\">Canvas size\u2026<\/button>\n\t\t\t\t<button data-cmd=\"crop\">Crop<kbd>C<\/kbd><\/button>\n\t\t\t\t<hr>\n\t\t\t\t<button data-cmd=\"rotCW\">Rotate 90\u00b0 clockwise<\/button>\n\t\t\t\t<button data-cmd=\"rotCCW\">Rotate 90\u00b0 counter-clockwise<\/button>\n\t\t\t\t<button data-cmd=\"flipH\">Flip horizontal<\/button>\n\t\t\t\t<button data-cmd=\"flipV\">Flip vertical<\/button>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<div class=\"mwp-menu\"><button class=\"mwp-menu-btn\">Layer<\/button>\n\t\t\t<div class=\"mwp-dd\">\n\t\t\t\t<button data-cmd=\"lnew\">New layer<kbd>Ctrl+\u21e7+N<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"ldup\">Duplicate layer<kbd>Ctrl+J<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"ldel\">Delete layer<\/button>\n\t\t\t\t<hr>\n\t\t\t\t<button data-cmd=\"lup\">Move layer up<\/button>\n\t\t\t\t<button data-cmd=\"ldown\">Move layer down<\/button>\n\t\t\t\t<button data-cmd=\"lmerge\">Merge down<kbd>Ctrl+E<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"flatten\">Flatten image<\/button>\n\t\t\t\t<hr>\n\t\t\t\t<button data-cmd=\"lflipH\">Flip layer horizontal<\/button>\n\t\t\t\t<button data-cmd=\"lflipV\">Flip layer vertical<\/button>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<div class=\"mwp-menu\"><button class=\"mwp-menu-btn\">Filter<\/button>\n\t\t\t<div class=\"mwp-dd\">\n\t\t\t\t<button data-cmd=\"adjust\">Adjustments\u2026<\/button>\n\t\t\t\t<button data-cmd=\"blur\">Gaussian blur\u2026<\/button>\n\t\t\t\t<button data-cmd=\"sharpen\">Sharpen<\/button>\n\t\t\t\t<button data-cmd=\"pixelate\">Pixelate\u2026<\/button>\n\t\t\t\t<button data-cmd=\"noise\">Add noise<\/button>\n\t\t\t\t<hr>\n\t\t\t\t<button data-cmd=\"gray\">Grayscale<\/button>\n\t\t\t\t<button data-cmd=\"sepia\">Sepia<\/button>\n\t\t\t\t<button data-cmd=\"invert\">Invert<kbd>Ctrl+I<\/kbd><\/button>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<div class=\"mwp-menu\"><button class=\"mwp-menu-btn\">View<\/button>\n\t\t\t<div class=\"mwp-dd\">\n\t\t\t\t<button data-cmd=\"zin\">Zoom in<kbd>Ctrl++<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"zout\">Zoom out<kbd>Ctrl+-<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"zfit\">Fit to screen<kbd>Ctrl+0<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"z100\">Actual size<kbd>Ctrl+1<\/kbd><\/button>\n\t\t\t\t<hr>\n\t\t\t\t<button data-cmd=\"grid\">Toggle grid<kbd>'<\/kbd><\/button>\n\t\t\t\t<button data-cmd=\"panels\">Toggle panels<\/button>\n\t\t\t\t<button data-cmd=\"full\">Fullscreen<\/button>\n\t\t\t\t<button data-cmd=\"theme\">Light \/ dark theme<\/button>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<div class=\"mwp-menu\"><button class=\"mwp-menu-btn\">Help<\/button>\n\t\t\t<div class=\"mwp-dd\">\n\t\t\t\t<button data-cmd=\"help\">Keyboard shortcuts<kbd>?<\/kbd><\/button>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t<div class=\"mwp-spacer\"><\/div>\n\t\t<button class=\"mwp-ib\" data-cmd=\"undo\" data-icon=\"undo\" title=\"Undo (Ctrl+Z)\"><\/button>\n\t\t<button class=\"mwp-ib\" data-cmd=\"redo\" data-icon=\"redo\" title=\"Redo (Ctrl+Y)\"><\/button>\n\t\t<i class=\"mwp-vsep\"><\/i>\n\t\t<button class=\"mwp-ib\" data-cmd=\"png\" data-icon=\"download\" title=\"Export PNG (Ctrl+S)\"><\/button>\n\t\t<button class=\"mwp-ib\" data-cmd=\"theme\" data-icon=\"sun\" title=\"Light \/ dark theme\"><\/button>\n\t\t<button class=\"mwp-ib\" data-cmd=\"panels\" data-icon=\"panels\" title=\"Toggle panels\"><\/button>\n\t\t<button class=\"mwp-ib\" data-cmd=\"full\" data-icon=\"full\" title=\"Fullscreen\"><\/button>\n\t<\/div>\n\n\t<!-- ===== OPTIONS BAR (context sensitive) ===== -->\n\t<div class=\"mwp-opts\">\n\t\t<div class=\"mwp-og\" data-tools=\"brush\">\n\t\t\t<label>Brush<\/label>\n\t\t\t<select data-opt=\"brushStyle\">\n\t\t\t\t<option value=\"round\">Round (hard)<\/option>\n\t\t\t\t<option value=\"soft\">Soft airbrush<\/option>\n\t\t\t\t<option value=\"pencil\">Pencil<\/option>\n\t\t\t\t<option value=\"marker\">Marker<\/option>\n\t\t\t\t<option value=\"calligraphy\">Calligraphy<\/option>\n\t\t\t\t<option value=\"neon\">Neon glow<\/option>\n\t\t\t<\/select>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"shape\">\n\t\t\t<div class=\"mwp-seg\">\n\t\t\t\t<button data-shape=\"rect\" data-icon=\"rect\" title=\"Rectangle\"><\/button>\n\t\t\t\t<button data-shape=\"roundRect\" data-icon=\"rrect\" title=\"Rounded rectangle\"><\/button>\n\t\t\t\t<button data-shape=\"ellipse\" data-icon=\"ellipse\" title=\"Ellipse\"><\/button>\n\t\t\t\t<button data-shape=\"triangle\" data-icon=\"triangle\" title=\"Triangle\"><\/button>\n\t\t\t\t<button data-shape=\"hexagon\" data-icon=\"hexagon\" title=\"Hexagon\"><\/button>\n\t\t\t\t<button data-shape=\"star\" data-icon=\"star\" title=\"Star\"><\/button>\n\t\t\t\t<button data-shape=\"line\" data-icon=\"line\" title=\"Line\"><\/button>\n\t\t\t\t<button data-shape=\"arrow\" data-icon=\"arrow\" title=\"Arrow\"><\/button>\n\t\t\t<\/div>\n\t\t\t<select data-opt=\"shapeMode\" title=\"Fill mode\">\n\t\t\t\t<option value=\"stroke\">Outline<\/option>\n\t\t\t\t<option value=\"fill\">Fill<\/option>\n\t\t\t\t<option value=\"both\">Fill (secondary) + outline<\/option>\n\t\t\t<\/select>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"brush eraser spray shape\">\n\t\t\t<label>Size<\/label>\n\t\t\t<input type=\"range\" data-opt=\"size\" min=\"1\" max=\"300\">\n\t\t\t<input type=\"number\" class=\"mwp-num\" data-opt=\"size\" min=\"1\" max=\"500\"><span class=\"mwp-unit\">px<\/span>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"brush eraser spray shape fill gradient text\">\n\t\t\t<label>Opacity<\/label>\n\t\t\t<input type=\"range\" data-opt=\"opacity\" min=\"1\" max=\"100\">\n\t\t\t<span class=\"mwp-val\" data-optv=\"opacity\" data-unit=\"%\"><\/span>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"brush eraser\">\n\t\t\t<label>Smoothing<\/label>\n\t\t\t<input type=\"range\" data-opt=\"smoothing\" min=\"0\" max=\"100\">\n\t\t\t<span class=\"mwp-val\" data-optv=\"smoothing\" data-unit=\"%\"><\/span>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"brush\">\n\t\t\t<label class=\"mwp-chk\"><input type=\"checkbox\" data-opt=\"pressure\"> Pen pressure<\/label>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"eraser\">\n\t\t\t<label class=\"mwp-chk\"><input type=\"checkbox\" data-opt=\"eraserSoft\"> Soft edge<\/label>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"spray\">\n\t\t\t<label>Density<\/label>\n\t\t\t<input type=\"range\" data-opt=\"density\" min=\"5\" max=\"100\">\n\t\t\t<span class=\"mwp-val\" data-optv=\"density\"><\/span>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"fill\">\n\t\t\t<label>Tolerance<\/label>\n\t\t\t<input type=\"range\" data-opt=\"tolerance\" min=\"0\" max=\"255\">\n\t\t\t<span class=\"mwp-val\" data-optv=\"tolerance\"><\/span>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"fill\">\n\t\t\t<label class=\"mwp-chk\"><input type=\"checkbox\" data-opt=\"contiguous\"> Contiguous<\/label>\n\t\t\t<label class=\"mwp-chk\"><input type=\"checkbox\" data-opt=\"sampleAll\"> Sample all layers<\/label>\n\t\t\t<label class=\"mwp-chk\"><input type=\"checkbox\" data-opt=\"expand\"> Expand 1px<\/label>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"gradient\">\n\t\t\t<label>Type<\/label>\n\t\t\t<select data-opt=\"gradType\"><option value=\"linear\">Linear<\/option><option value=\"radial\">Radial<\/option><\/select>\n\t\t\t<label>To<\/label>\n\t\t\t<select data-opt=\"gradEnd\"><option value=\"secondary\">Secondary color<\/option><option value=\"transparent\">Transparent<\/option><\/select>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"text\">\n\t\t\t<select data-opt=\"font\" title=\"Font\">\n\t\t\t\t<option value=\"Arial, sans-serif\">Arial<\/option>\n\t\t\t\t<option value=\"Helvetica, Arial, sans-serif\">Helvetica<\/option>\n\t\t\t\t<option value=\"Verdana, sans-serif\">Verdana<\/option>\n\t\t\t\t<option value=\"'Trebuchet MS', sans-serif\">Trebuchet<\/option>\n\t\t\t\t<option value=\"Georgia, serif\">Georgia<\/option>\n\t\t\t\t<option value=\"'Times New Roman', serif\">Times New Roman<\/option>\n\t\t\t\t<option value=\"'Courier New', monospace\">Courier New<\/option>\n\t\t\t\t<option value=\"Impact, sans-serif\">Impact<\/option>\n\t\t\t\t<option value=\"'Comic Sans MS', cursive\">Comic Sans<\/option>\n\t\t\t\t<option value=\"system-ui, sans-serif\">System UI<\/option>\n\t\t\t<\/select>\n\t\t\t<input type=\"number\" class=\"mwp-num\" data-opt=\"fontSize\" min=\"6\" max=\"600\" title=\"Font size\"><span class=\"mwp-unit\">px<\/span>\n\t\t\t<div class=\"mwp-seg\">\n\t\t\t\t<button data-toggle=\"bold\" title=\"Bold\"><b>B<\/b><\/button>\n\t\t\t\t<button data-toggle=\"italic\" title=\"Italic\"><i style=\"font-family:serif\">I<\/i><\/button>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"text picker move hand crop\"><span class=\"mwp-tip\"><\/span><\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"move\">\n\t\t\t<button class=\"mwp-btn\" data-cmd=\"lflipH\">Flip H<\/button>\n\t\t\t<button class=\"mwp-btn\" data-cmd=\"lflipV\">Flip V<\/button>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"hand\">\n\t\t\t<button class=\"mwp-btn\" data-cmd=\"zfit\">Fit<\/button>\n\t\t\t<button class=\"mwp-btn\" data-cmd=\"z100\">100%<\/button>\n\t\t<\/div>\n\t\t<div class=\"mwp-og\" data-tools=\"crop\">\n\t\t\t<button class=\"mwp-btn primary mwp-crop-apply\" data-cmd=\"cropApply\">Apply crop<\/button>\n\t\t\t<button class=\"mwp-btn\" data-cmd=\"cropCancel\">Cancel<\/button>\n\t\t<\/div>\n\t<\/div>\n\n\t<!-- ===== MAIN ===== -->\n\t<div class=\"mwp-main\">\n\t\t<div class=\"mwp-tools\">\n\t\t\t<button class=\"mwp-tool\" data-tool=\"move\" data-icon=\"move\" title=\"Move layer (V)\"><\/button>\n\t\t\t<button class=\"mwp-tool\" data-tool=\"hand\" data-icon=\"hand\" title=\"Hand \/ Pan (H, hold Space)\"><\/button>\n\t\t\t<i class=\"mwp-sep\"><\/i>\n\t\t\t<button class=\"mwp-tool\" data-tool=\"brush\" data-icon=\"brush\" title=\"Brush (B)\"><\/button>\n\t\t\t<button class=\"mwp-tool\" data-tool=\"eraser\" data-icon=\"eraser\" title=\"Eraser (E)\"><\/button>\n\t\t\t<button class=\"mwp-tool\" data-tool=\"spray\" data-icon=\"spray\" title=\"Spray (S)\"><\/button>\n\t\t\t<i class=\"mwp-sep\"><\/i>\n\t\t\t<button class=\"mwp-tool\" data-tool=\"fill\" data-icon=\"bucket\" title=\"Paint bucket (F)\"><\/button>\n\t\t\t<button class=\"mwp-tool\" data-tool=\"gradient\" data-icon=\"gradient\" title=\"Gradient (G)\"><\/button>\n\t\t\t<button class=\"mwp-tool\" data-tool=\"picker\" data-icon=\"picker\" title=\"Eyedropper (I)\"><\/button>\n\t\t\t<i class=\"mwp-sep\"><\/i>\n\t\t\t<button class=\"mwp-tool\" data-tool=\"text\" data-icon=\"text\" title=\"Text (T)\"><\/button>\n\t\t\t<button class=\"mwp-tool\" data-tool=\"shape\" data-icon=\"shapes\" title=\"Shapes (U)\"><\/button>\n\t\t\t<button class=\"mwp-tool\" data-tool=\"crop\" data-icon=\"crop\" title=\"Crop (C)\"><\/button>\n\t\t\t<div class=\"mwp-mini\">\n\t\t\t\t<button class=\"mwp-c-primary\" title=\"Primary color\"><\/button>\n\t\t\t\t<button class=\"mwp-c-secondary\" title=\"Secondary color\"><\/button>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t<div class=\"mwp-vp\" data-tool=\"brush\">\n\t\t\t<div class=\"mwp-stage\">\n\t\t\t\t<div class=\"mwp-host\"><canvas class=\"mwp-temp\"><\/canvas><\/div>\n\t\t\t\t<div class=\"mwp-grid\"><\/div>\n\t\t\t\t<canvas class=\"mwp-overlay\"><\/canvas>\n\t\t\t<\/div>\n\t\t\t<div class=\"mwp-cursor\"><\/div>\n\t\t<\/div>\n\n\t\t<div class=\"mwp-panels\">\n\t\t\t<div class=\"mwp-sec\">\n\t\t\t\t<div class=\"mwp-sec-h\">Color<\/div>\n\t\t\t\t<div class=\"mwp-crow\">\n\t\t\t\t\t<div class=\"mwp-pair\">\n\t\t\t\t\t\t<button class=\"mwp-c-primary\" title=\"Primary color (click to open system picker)\"><\/button>\n\t\t\t\t\t\t<button class=\"mwp-c-secondary\" title=\"Secondary color\"><\/button>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<button class=\"mwp-ib\" data-cmd=\"swap\" data-icon=\"swap\" title=\"Swap colors (X)\"><\/button>\n\t\t\t\t\t<input type=\"text\" class=\"mwp-hex\" maxlength=\"7\" spellcheck=\"false\" aria-label=\"Hex color\">\n\t\t\t\t\t<input type=\"color\" class=\"mwp-native\" tabindex=\"-1\" aria-hidden=\"true\">\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"mwp-sv\"><canvas width=\"240\" height=\"130\"><\/canvas><div class=\"mwp-sv-knob\"><\/div><\/div>\n\t\t\t\t<input type=\"range\" class=\"mwp-hue\" min=\"0\" max=\"360\" aria-label=\"Hue\">\n\t\t\t\t<div class=\"mwp-swatches\"><\/div>\n\t\t\t\t<div class=\"mwp-sub\">Recent<\/div>\n\t\t\t\t<div class=\"mwp-recent\"><\/div>\n\t\t\t<\/div>\n\t\t\t<div class=\"mwp-layers\">\n\t\t\t\t<div class=\"mwp-sec-h\">Layers <span class=\"mwp-lcount\"><\/span><\/div>\n\t\t\t\t<div class=\"mwp-lprops\">\n\t\t\t\t\t<select class=\"mwp-lblend\" title=\"Blend mode\"><\/select>\n\t\t\t\t\t<input type=\"range\" class=\"mwp-lop\" min=\"0\" max=\"100\" title=\"Layer opacity\">\n\t\t\t\t\t<span class=\"mwp-val mwp-lopv\"><\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"mwp-llist\"><\/div>\n\t\t\t\t<div class=\"mwp-lfoot\">\n\t\t\t\t\t<button class=\"mwp-ib\" data-cmd=\"lnew\" data-icon=\"plus\" title=\"New layer\"><\/button>\n\t\t\t\t\t<button class=\"mwp-ib\" data-cmd=\"ldup\" data-icon=\"copy\" title=\"Duplicate layer\"><\/button>\n\t\t\t\t\t<button class=\"mwp-ib\" data-cmd=\"lup\" data-icon=\"up\" title=\"Move up\"><\/button>\n\t\t\t\t\t<button class=\"mwp-ib\" data-cmd=\"ldown\" data-icon=\"down\" title=\"Move down\"><\/button>\n\t\t\t\t\t<button class=\"mwp-ib\" data-cmd=\"lmerge\" data-icon=\"merge\" title=\"Merge down\"><\/button>\n\t\t\t\t\t<button class=\"mwp-ib mwp-danger\" data-cmd=\"ldel\" data-icon=\"trash\" title=\"Delete layer\"><\/button>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\n\t<!-- ===== STATUS BAR ===== -->\n\t<div class=\"mwp-status\">\n\t\t<b class=\"mwp-toolname\"><\/b>\n\t\t<span class=\"mwp-hint\"><\/span>\n\t\t<span class=\"mwp-flash\"><\/span>\n\t\t<span class=\"mwp-xy\">0, 0<\/span>\n\t\t<span class=\"mwp-docsize\"><\/span>\n\t\t<span class=\"mwp-zoomctl\">\n\t\t\t<button data-cmd=\"zout\" title=\"Zoom out\">\u2212<\/button>\n\t\t\t<button class=\"mwp-zoomv\" data-cmd=\"zfit\" title=\"Fit to screen\">100%<\/button>\n\t\t\t<button data-cmd=\"zin\" title=\"Zoom in\">+<\/button>\n\t\t<\/span>\n\t<\/div>\n\n\t<div class=\"mwp-modal\"><\/div>\n\t<input type=\"file\" class=\"mwp-file\" accept=\"image\/*\" hidden>\n<\/div>\n<script>window.MWPaint && MWPaint.init(document.getElementById(\"mwp-1\"));<\/script>\n\t\n<\/div><\/div><div class=\"wpb_wrapper td_block_wrap vc_raw_html tdi_9 \">\n<style scoped>\n\n\/* inline tdc_css att *\/\n\n.tdi_9{\njustify-content:center !important;\ntext-align:center !important;\n}\n\n<\/style><div class=\"td-fix-index\"><script async src=\"https:\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js?client=ca-pub-7396755811986582\"\n     crossorigin=\"anonymous\"><\/script>\n<!-- 728x90 -->\n<ins class=\"adsbygoogle\"\n     style=\"display:inline-block;width:728px;height:90px\"\n     data-ad-client=\"ca-pub-7396755811986582\"\n     data-ad-slot=\"1358723719\"><\/ins>\n<script>\n     (adsbygoogle = window.adsbygoogle || []).push({});\n<\/script><\/div><\/div><div class=\"wpb_wrapper wpb_text_column td_block_wrap td_block_wrap vc_column_text tdi_10  tagdiv-type td-pb-border-top td_block_template_1\"  data-td-block-uid=\"tdi_10\" ><div class=\"td-block-title-wrap\"><\/div><div class=\"td-fix-index\"><h1 data-path-to-node=\"2\"><strong>\ud83c\udfa8 Discover Our Ultimate &#8220;Mini Paint&#8221; Tool Right in Your Browser!<\/strong><\/h1>\n<p data-path-to-node=\"3\">Need to edit an image quickly, add some notes, or just want to relax and draw? No need to download or install complex software! Now, you can unleash your creativity directly on our website with the all-new <b data-path-to-node=\"3\" data-index-in-node=\"206\">Mini Paint<\/b> tool \u2013 fully integrated, smooth, and incredibly easy to use.<\/p>\n<p data-path-to-node=\"4\">Whether you are on a desktop or browsing on your mobile phone, this tool delivers a flawless drawing experience!<\/p>\n<h2 data-path-to-node=\"5\"><strong>\ud83c\udf1f Key Features<\/strong><\/h2>\n<ul data-path-to-node=\"6\">\n<li>\n<p data-path-to-node=\"6,0,0\"><b data-path-to-node=\"6,0,0\" data-index-in-node=\"0\">Classic Tools:<\/b> Everything you need, including a Brush, Spray Can, Eraser, and Fill Bucket.\n<\/li>\n<li>\n<p data-path-to-node=\"6,1,0\"><b data-path-to-node=\"6,1,0\" data-index-in-node=\"0\">Smart Text Insertion:<\/b> Type directly onto your images. Supports <b data-path-to-node=\"6,1,0\" data-index-in-node=\"63\">Bold<\/b>, <i data-path-to-node=\"6,1,0\" data-index-in-node=\"69\">Italic<\/i>, and flexible font sizing.\n<\/li>\n<li>\n<p data-path-to-node=\"6,2,0\"><b data-path-to-node=\"6,2,0\" data-index-in-node=\"0\">Versatile Shapes:<\/b> Draw straight lines, directional arrows, rounded rectangles, circles, and triangles&#8230; extremely handy for mind maps or annotations.\n<\/li>\n<li>\n<p data-path-to-node=\"6,3,0\"><b data-path-to-node=\"6,3,0\" data-index-in-node=\"0\">Quick Photo Filters:<\/b> Turn your color images into Black &#038; White (Grayscale) or Invert colors with just one click.\n<\/li>\n<li>\n<p data-path-to-node=\"6,4,0\"><b data-path-to-node=\"6,4,0\" data-index-in-node=\"0\">Limitless Customization:<\/b> Zoom in\/out without losing quality and easily resize your canvas workspace.\n<\/li>\n<\/ul>\n<h2 data-path-to-node=\"8\"><strong>\ud83d\udcd6 Step-by-Step Guide<\/strong><\/h2>\n<p data-path-to-node=\"9\">The interface of Mini Paint is designed to be super intuitive. Here is how to make the most of its main features:<\/p>\n<h3 data-path-to-node=\"10\"><strong>1. File Handling (Open &#038; Save)<\/strong><\/h3>\n<ul data-path-to-node=\"11\">\n<li>\n<p data-path-to-node=\"11,0,0\"><b data-path-to-node=\"11,0,0\" data-index-in-node=\"0\">\ud83d\udcc2 Open:<\/b> Click here to upload an image from your phone or computer. The canvas will automatically expand or shrink to fit your image perfectly without distortion.\n<\/li>\n<li>\n<p data-path-to-node=\"11,1,0\"><b data-path-to-node=\"11,1,0\" data-index-in-node=\"0\">\ud83d\udcbe Save:<\/b> Click to download your final masterpiece to your device as a crisp, high-quality <code data-path-to-node=\"11,1,0\" data-index-in-node=\"90\">.png<\/code> file.\n<\/li>\n<\/ul>\n<h3 data-path-to-node=\"12\"><strong>2. Canvas Size &#038; View Options<\/strong><\/h3>\n<ul data-path-to-node=\"13\">\n<li>\n<p data-path-to-node=\"13,0,0\"><b data-path-to-node=\"13,0,0\" data-index-in-node=\"0\">\ud83d\udccf Resize Canvas:<\/b> Click the ruler icon to reveal the dimension inputs. Enter your preferred Width (W) and Height (H) in pixels, then click <b data-path-to-node=\"13,0,0\" data-index-in-node=\"139\">Set<\/b>. The input box will automatically hide itself to keep your workspace clean!\n<\/li>\n<li>\n<p data-path-to-node=\"13,1,0\"><b data-path-to-node=\"13,1,0\" data-index-in-node=\"0\">\ud83d\udd0d Zoom In\/Out:<\/b> Use the <b data-path-to-node=\"13,1,0\" data-index-in-node=\"24\">\ud83d\udd0d+<\/b> and <b data-path-to-node=\"13,1,0\" data-index-in-node=\"32\">\ud83d\udd0d-<\/b> buttons to zoom in for fine details or zoom out for a broader view. The <b data-path-to-node=\"13,1,0\" data-index-in-node=\"108\">100%<\/b> button instantly resets the canvas to its original size.\n<\/li>\n<\/ul>\n<h3 data-path-to-node=\"14\"><strong>3. Drawing Tools &#038; Shapes<\/strong><\/h3>\n<ul data-path-to-node=\"15\">\n<li>\n<p data-path-to-node=\"15,0,0\">Pick your favorite tool from the toolbar (\ud83d\udd8c\ufe0f Brush, \ud83d\udca8 Spray, \ud83e\uddfd Eraser).\n<\/li>\n<li>\n<p data-path-to-node=\"15,1,0\">Drag the <b data-path-to-node=\"15,1,0\" data-index-in-node=\"9\">Size (\ud83d\udd8c\ufe0f)<\/b> slider to make your brush strokes thicker or thinner.\n<\/li>\n<li>\n<p data-path-to-node=\"15,2,0\">Click the color circle (\ud83d\udca7) to pick the perfect color.\n<\/li>\n<li>\n<p data-path-to-node=\"15,3,0\">Need to point something out? Select the Arrow (\u2197\ufe0f) or Rounded Rectangle (\ud83d\udd32) icon, then simply click and drag on the canvas to draw.\n<\/li>\n<\/ul>\n<h3 data-path-to-node=\"16\"><strong>4. How to Use the Text Tool Like a Pro<\/strong><\/h3>\n<ol start=\"1\" data-path-to-node=\"17\">\n<li>\n<p data-path-to-node=\"17,0,0\">Select the <b data-path-to-node=\"17,0,0\" data-index-in-node=\"11\">\ud83d\udd24 (Text)<\/b> icon.\n<\/li>\n<li>\n<p data-path-to-node=\"17,1,0\">Enter your desired font size in the number box next to it. You can also click the <b data-path-to-node=\"17,1,0\" data-index-in-node=\"82\">B<\/b> (Bold) or <b data-path-to-node=\"17,1,0\" data-index-in-node=\"94\">I<\/b> (Italic) buttons to format your text.\n<\/li>\n<li>\n<p data-path-to-node=\"17,2,0\">Click anywhere on the canvas where you want the text to appear.\n<\/li>\n<li>\n<p data-path-to-node=\"17,3,0\">Type your message into the smart text box.\n<\/li>\n<li>\n<p data-path-to-node=\"17,4,0\">When you are done typing, press the <b data-path-to-node=\"17,4,0\" data-index-in-node=\"47\">Enter<\/b> key on your keyboard OR <b data-path-to-node=\"17,4,0\" data-index-in-node=\"77\">click anywhere outside the text box<\/b>. The text will instantly be stamped onto your image!\n<\/li>\n<\/ol>\n<h3 data-path-to-node=\"19\"><strong>\ud83d\udca1 Pro-Tip for Mobile Users!<\/strong><\/h3>\n<p data-path-to-node=\"20\">Is your phone screen feeling a bit cramped? Don&#8217;t worry! Just tap the <b data-path-to-node=\"20\" data-index-in-node=\"70\">&#8220;\ud83d\udee0\ufe0f Tools&#8221;<\/b> button at the top of the app. The entire toolbar will hide, giving you 100% of your screen space to comfortably swipe and draw with your fingers. Tap it again whenever you need to bring the tools back.<\/p>\n<p data-path-to-node=\"20\">    <style>\n        @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700&display=swap');\n\n        .ez-faq-wrapper { \n            box-sizing: border-box; max-width: 850px; margin: 40px auto; \n            background: #ffffff !important; border-radius: 12px; \n            box-shadow: 0 4px 20px rgba(0,0,0,0.06); padding: 35px 40px; \n            font-family: 'Inter', sans-serif !important; \n        }\n        .ez-faq-wrapper *, .ez-faq-wrapper *::before, .ez-faq-wrapper *::after {\n            box-sizing: border-box;\n        }\n\n        .ez-faq-wrapper h2.ez-faq-header {\n            font-size: 28px !important; font-weight: 700 !important; color: #1a202c !important;\n            margin: 0 0 20px 0 !important; text-align: center !important;\n            border-bottom: 2px solid #edf2f7 !important; padding-bottom: 15px !important;\n            line-height: 1.3 !important; background: transparent !important;\n        }\n\n        .ez-faq-search-box { position: relative; margin-bottom: 25px; }\n        .ez-faq-search-box input.ez-faq-search-input {\n            width: 100% !important; padding: 14px 20px 14px 45px !important;\n            border: 1px solid #e2e8f0 !important; border-radius: 8px !important;\n            font-family: 'Inter', sans-serif !important; font-size: 16px !important;\n            color: #2d3748 !important; background: #f8fafc !important;\n            box-shadow: none !important; outline: none !important; transition: all 0.3s ease !important;\n        }\n        .ez-faq-search-box input.ez-faq-search-input:focus {\n            border-color: #2b6cb0 !important; background: #ffffff !important;\n            box-shadow: 0 0 0 3px rgba(43, 108, 176, 0.1) !important;\n        }\n        .ez-faq-search-box .ez-faq-search-icon {\n            position: absolute; left: 15px; top: 50%; transform: translateY(-50%);\n            color: #a0aec0; font-size: 18px; pointer-events: none;\n        }\n\n        .ez-faq-wrapper .ez-faq-container { display: flex; flex-direction: column; }\n        .ez-faq-wrapper .ez-faq-item-front { border-bottom: 1px solid #edf2f7; margin: 0; padding: 0; }\n        .ez-faq-wrapper .ez-faq-item-front:last-child { border-bottom: none; }\n\n        .ez-faq-wrapper button.ez-faq-question-front { \n            width: 100%; background: transparent !important; border: none !important; \n            padding: 20px 0 !important; margin: 0 !important;\n            font-size: 17px !important; font-weight: 600 !important; color: #2d3748 !important; \n            text-align: left !important; cursor: pointer; display: flex; \n            justify-content: space-between; align-items: center; \n            transition: color 0.3s ease; line-height: 1.5 !important;\n            box-shadow: none !important; outline: none !important;\n        }\n        .ez-faq-wrapper button.ez-faq-question-front:hover { color: #2b6cb0 !important; }\n\n        .ez-faq-wrapper .ez-faq-icon-front { \n            font-size: 26px !important; font-weight: 300 !important; color: #a0aec0 !important; \n            margin-left: 15px; flex-shrink: 0; transition: transform 0.35s ease;\n        }\n        .ez-faq-wrapper .ez-faq-item-front.active .ez-faq-icon-front { \n            transform: rotate(45deg); color: #2b6cb0 !important; \n        }\n\n        .ez-faq-wrapper .ez-faq-answer-front { \n            max-height: 0; overflow: hidden; transition: max-height 0.4s ease; \n        }\n        .ez-faq-wrapper .ez-faq-answer-content-front { \n            padding-bottom: 20px; color: #4a5568 !important; line-height: 1.7 !important; \n            font-size: 16px !important; font-weight: 400 !important;\n        }\n        .ez-faq-wrapper .ez-faq-answer-content-front p { margin: 0 0 10px 0 !important; }\n        .ez-faq-wrapper .ez-faq-answer-content-front p:last-child { margin-bottom: 0 !important; }\n\n        .ez-faq-no-results {\n            display: none; text-align: center; padding: 25px 0;\n            color: #718096 !important; font-size: 16px !important; font-weight: 500 !important;\n        }\n        \n        @media (max-width: 768px) {\n            .ez-faq-wrapper { padding: 20px 25px; }\n            .ez-faq-wrapper h2.ez-faq-header { font-size: 24px !important; }\n            .ez-faq-wrapper button.ez-faq-question-front { font-size: 16px !important; }\n        }\n    <\/style>\n\n    <div class=\"ez-faq-wrapper\" id=\"ez-faq-wrapper-9416\">\n                    <h2 class=\"ez-faq-header\">Frequently Asked Questions<\/h2>\n        \n        <div class=\"ez-faq-search-box\">\n            <span class=\"ez-faq-search-icon\">\ud83d\udd0d<\/span>\n            <input type=\"text\" class=\"ez-faq-search-input\" placeholder=\"Search FAQs...\" autocomplete=\"off\">\n        <\/div>\n\n        <div class=\"ez-faq-container\">\n                            <div class=\"ez-faq-item-front\">\n                    <button class=\"ez-faq-question-front\" aria-expanded=\"false\">\n                        <span class=\"ez-faq-question-text\">What is Paint in the Browser?<\/span>\n                        <span class=\"ez-faq-icon-front\">+<\/span>\n                    <\/button>\n                    <div class=\"ez-faq-answer-front\">\n                        <div class=\"ez-faq-answer-content-front\">\n                            <p>Paint in the Browser is a free online drawing tool that lets you create, edit, and sketch directly on your screen without installing any software.<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                            <div class=\"ez-faq-item-front\">\n                    <button class=\"ez-faq-question-front\" aria-expanded=\"false\">\n                        <span class=\"ez-faq-question-text\">Do I need to download or install anything?<\/span>\n                        <span class=\"ez-faq-icon-front\">+<\/span>\n                    <\/button>\n                    <div class=\"ez-faq-answer-front\">\n                        <div class=\"ez-faq-answer-content-front\">\n                            <p>No. The tool works entirely in your web browser, so you can start drawing instantly with no downloads or sign-up required.<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                            <div class=\"ez-faq-item-front\">\n                    <button class=\"ez-faq-question-front\" aria-expanded=\"false\">\n                        <span class=\"ez-faq-question-text\">Is this tool free to use?<\/span>\n                        <span class=\"ez-faq-icon-front\">+<\/span>\n                    <\/button>\n                    <div class=\"ez-faq-answer-front\">\n                        <div class=\"ez-faq-answer-content-front\">\n                            <p>Yes, it is completely free with no hidden fees or subscriptions.<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                            <div class=\"ez-faq-item-front\">\n                    <button class=\"ez-faq-question-front\" aria-expanded=\"false\">\n                        <span class=\"ez-faq-question-text\">What features does the tool offer?<\/span>\n                        <span class=\"ez-faq-icon-front\">+<\/span>\n                    <\/button>\n                    <div class=\"ez-faq-answer-front\">\n                        <div class=\"ez-faq-answer-content-front\">\n                            <p>You can typically:<br \/>\n- Draw using brushes or pencil tools<br \/>\n- Add shapes (lines, rectangles, circles)<br \/>\n- Insert text<br \/>\n- Choose colors and adjust sizes<br \/>\n- Erase or undo actions<br \/>\nThese are standard features found in browser-based paint tools similar to MS Paint<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                            <div class=\"ez-faq-item-front\">\n                    <button class=\"ez-faq-question-front\" aria-expanded=\"false\">\n                        <span class=\"ez-faq-question-text\">Does it work on mobile devices?<\/span>\n                        <span class=\"ez-faq-icon-front\">+<\/span>\n                    <\/button>\n                    <div class=\"ez-faq-answer-front\">\n                        <div class=\"ez-faq-answer-content-front\">\n                            <p>Yes, the tool works on most modern devices, including smartphones and tablets, as long as your browser supports it.<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                            <div class=\"ez-faq-item-front\">\n                    <button class=\"ez-faq-question-front\" aria-expanded=\"false\">\n                        <span class=\"ez-faq-question-text\">Is my data safe?<\/span>\n                        <span class=\"ez-faq-icon-front\">+<\/span>\n                    <\/button>\n                    <div class=\"ez-faq-answer-front\">\n                        <div class=\"ez-faq-answer-content-front\">\n                            <p>Yes. Since the tool runs directly in your browser and does not require login, your drawings typically stay on your device unless you choose to save or share them.<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                            <div class=\"ez-faq-item-front\">\n                    <button class=\"ez-faq-question-front\" aria-expanded=\"false\">\n                        <span class=\"ez-faq-question-text\">Is it safe to upload images to edit?<\/span>\n                        <span class=\"ez-faq-icon-front\">+<\/span>\n                    <\/button>\n                    <div class=\"ez-faq-answer-front\">\n                        <div class=\"ez-faq-answer-content-front\">\n                            <p>Yes. Images are handled locally in your browser, meaning they are not sent to external servers.<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                            <div class=\"ez-faq-item-front\">\n                    <button class=\"ez-faq-question-front\" aria-expanded=\"false\">\n                        <span class=\"ez-faq-question-text\">Does the tool collect my images or data?<\/span>\n                        <span class=\"ez-faq-icon-front\">+<\/span>\n                    <\/button>\n                    <div class=\"ez-faq-answer-front\">\n                        <div class=\"ez-faq-answer-content-front\">\n                            <p>No. The tool does not collect or track your drawings or uploaded images.<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                    <\/div>\n        \n        <div class=\"ez-faq-no-results\">\n            No matching FAQs found.\n        <\/div>\n    <\/div>\n\n    <script>\n        document.addEventListener('DOMContentLoaded', function() {\n            const wrapper = document.getElementById('ez-faq-wrapper-9416');\n            if (!wrapper) return;\n\n            const faqItems = wrapper.querySelectorAll('.ez-faq-item-front');\n            const searchInput = wrapper.querySelector('.ez-faq-search-input');\n            const noResults = wrapper.querySelector('.ez-faq-no-results');\n            \n            faqItems.forEach(item => {\n                const questionBtn = item.querySelector('.ez-faq-question-front');\n                \n                questionBtn.addEventListener('click', () => {\n                    const isActive = item.classList.contains('active');\n                    const answer = item.querySelector('.ez-faq-answer-front');\n                    \n                    faqItems.forEach(otherItem => {\n                        otherItem.classList.remove('active');\n                        otherItem.querySelector('.ez-faq-question-front').setAttribute('aria-expanded', 'false');\n                        otherItem.querySelector('.ez-faq-answer-front').style.maxHeight = null;\n                    });\n\n                    if (!isActive) {\n                        item.classList.add('active');\n                        questionBtn.setAttribute('aria-expanded', 'true');\n                        answer.style.maxHeight = answer.scrollHeight + \"px\";\n                    }\n                });\n            });\n\n            if (searchInput) {\n                searchInput.addEventListener('input', function() {\n                    const searchTerm = this.value.toLowerCase().trim();\n                    let hasVisibleItems = false;\n\n                    faqItems.forEach(item => {\n                        const questionText = item.querySelector('.ez-faq-question-text').textContent.toLowerCase();\n                        const answerText = item.querySelector('.ez-faq-answer-content-front').textContent.toLowerCase();\n\n                        if (questionText.includes(searchTerm) || answerText.includes(searchTerm)) {\n                            item.style.display = 'block';\n                            hasVisibleItems = true;\n                        } else {\n                            item.style.display = 'none';\n                            item.classList.remove('active');\n                            item.querySelector('.ez-faq-question-front').setAttribute('aria-expanded', 'false');\n                            item.querySelector('.ez-faq-answer-front').style.maxHeight = null;\n                        }\n                    });\n\n                    noResults.style.display = (!hasVisibleItems) ? 'block' : 'none';\n                });\n            }\n        });\n    <\/script>\n    <\/p>\n<\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":9436,"parent":4298,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-9416","page","type-page","status-publish","has-post-thumbnail"],"rankMath":{"parentDomain":"ezcalculatoronline.com","noFollowDomains":[],"noFollowExcludeDomains":[],"noFollowExternalLinks":false,"featuredImageNotice":"The featured image should be at least 200 by 200 pixels to be picked up by Facebook and other social media sites.","pluginReviewed":false,"postSettings":{"linkSuggestions":true,"useFocusKeyword":false},"frontEndScore":false,"postName":"paint-in-the-browser","permalinkFormat":"https:\/\/www.ezcalculatoronline.com\/%pagename%\/","showLockModifiedDate":true,"assessor":{"focusKeywordLink":"https:\/\/www.ezcalculatoronline.com\/wp-admin\/edit.php?focus_keyword=%focus_keyword%&post_type=%post_type%","hasTOCPlugin":false,"primaryTaxonomy":false,"serpData":{"title":"Paint Online: Free Browser Drawing &amp; Photo Editor","description":"Discover our free online Mini Paint tool! Draw, edit photos, add text, and use MS Paint features directly in your browser. No installation required.","focusKeywords":"Paint in the browser","pillarContent":false,"canonicalUrl":"","breadcrumbTitle":"","advancedRobots":{"max-snippet":"-1","max-video-preview":"-1","max-image-preview":"large"},"facebookTitle":"","facebookDescription":"","facebookImage":"","facebookImageID":"","facebookHasOverlay":false,"facebookImageOverlay":"","facebookAuthor":"","twitterCardType":"","twitterUseFacebook":true,"twitterTitle":"","twitterDescription":"","twitterImage":"","twitterImageID":"","twitterHasOverlay":false,"twitterImageOverlay":"","twitterPlayerUrl":"","twitterPlayerSize":"","twitterPlayerStream":"","twitterPlayerStreamCtype":"","twitterAppDescription":"","twitterAppIphoneName":"","twitterAppIphoneID":"","twitterAppIphoneUrl":"","twitterAppIpadName":"","twitterAppIpadID":"","twitterAppIpadUrl":"","twitterAppGoogleplayName":"","twitterAppGoogleplayID":"","twitterAppGoogleplayUrl":"","twitterAppCountry":"","robots":{"index":true},"twitterAuthor":"username","primaryTerm":0,"authorName":"Thien Nguyen","titleTemplate":"%title% %sep% %sitename%","descriptionTemplate":"%excerpt%","showScoreFrontend":true,"lockModifiedDate":false},"powerWords":["a cut above","absolute","absolutely","absolutely lowest","absurd","abuse","accurate","accuse","achieve","actionable","adaptable","adequate","admit","adorable","advantage","advice","affordable","aggravate","aggressive","agitated","agonizing","agony","alarmed","alarming","alienated","aligned","alive","all-inclusive","alluring","always","amazing","amp","animated","annihilate","announcing","anonymous","antagonistic","anxious","apocalypse","appalled","approved","approving","argumentative","armageddon","arrogant","ass kicking","assault","assured","astonishing","astounded","astounding","at ease","atrocious","attack","attractive","audacity","authentic","authoritative","authority","avoid","aware","awe-inspiring","awesome","awkward","backbone","backdoor","backed","backlash","backstabbing","badass","balanced","banned","bargain","barrage","basic","battle","beaming","beat down","beating","beautiful","beauty","begging","behind the scenes","belief","belong","best","best-selling","better","beware","big","billion","black market","blacklisted","blast","blessed","blinded","blissful","blood","bloodbath","bloodcurdling","bloody","blunder","blushing","bold","bomb","bona","bona fide","bonanza","bonus","bootleg","bottom line","bountiful","brave","bravery","brazen","break","breaking","breakthrough","breathtaking","bright","brilliant","broke","brutal","budget","buffoon","bullshit","bully","bumbling","buy","cadaver","calm","cancel anytime","capable","captivate","captivating","carefree","case study","cash","cataclysmic","catapult","catastrophe","caution","censored","centered","certain","certainly","certified","challenge","charming","cheap","cheat","cheat-sheet","cheer","cheerful","child-like","clarity","classified","clear","clueless","collapse","colorful","colossal","comfortable","compare","competitive","complete","completely","completeness","comprehensive","compromise","compulsive","concealed","conclusive","condemning","condescending","confess","confession","confessions","confident","confidential","conquer","conscientious","constructive","content","contrary","controlling","controversial","convenient","convert","cool","cooperative","copy","corpse","corrupt","corrupting","courage","courageous","cover-up","covert","coward","cowardly","crammed","crave","crazy","create","creative","cringeworthy","cripple","crisis","critical","crooked","crush","crushing","damaging","danger","dangerous","daring","dazzling","dead","deadline","deadly","death","decadent","deceived","deceptive","deep","defiance","definitely","definitive","defying","dejected","delicious","delight","delighted","delightful","delirious","delivered","demoralizing","deplorable","depraved","desire","desperate","despicable","destiny","destroy","detailed","devastating","devoted","diagnosed","direct","dirty","disadvantages","disastrous","discount","discover","disdainful","disempowered","disgusted","disgusting","dishonest","disillusioned","disoriented","distracted","distraught","distressed","distrustful","divulge","document","dollar","dominate","doomed","double","doubtful","download","dreadful","dreamy","drive","drowning","dumb","dynamic","eager","earnest","easily","easy","economical","ecstatic","edge","effective","efficient","effortless","elated","eliminate","elite","embarrass","embarrassed","embarrassing","emergency","emerging","emphasize","empowered","enchant","encouraged","endorsed","energetic","energy","enormous","enraged","enthusiastic","envy","epic","epidemic","essential","ethical","euphoric","evil","exactly","exasperated","excellent","excited","excitement","exciting","exclusive","exclusivity","excruciating","exhilarated","expensive","expert","explode","exploit","explosive","exposed","exquisite","extra","extraordinary","extremely","exuberant","eye-opening","fail","fail-proof","failure","faith","famous","fantasy","fascinating","fatigued","faux","faux pas","fearless","feast","feeble","festive","fide","fierce","fight","final","fine","fired","first","first ever","flirt","fluid","focus","focused","fool","fooled","foolish","forbidden","force-fed","forever","forgiving","forgotten","formula","fortune","foul","frantic","free","freebie","freedom","frenzied","frenzy","frightening","frisky","frugal","frustrated","fulfill","fulfilled","full","fully","fun","fun-loving","fundamentals","funniest","funny","furious","gambling","gargantuan","genius","genuine","gift","gigantic","giveaway","glamorous","gleeful","glorious","glowing","goddamn","gorgeous","graceful","grateful","gratified","gravity","great","greatest","greatness","greed","greedy","gripping","grit","grounded","growth","guaranteed","guilt","guilt-free","gullible","guts","hack","happiness","happy","harmful","harsh","hate","have you heard","havoc","hazardous","healthy","heart","heartbreaking","heartwarming","heavenly","hell","helpful","helplessness","hero","hesitant","hidden","high tech","highest","highly effective","hilarious","hoak","hoax","honest","honored","hope","hopeful","horribly","horrific","horrifying","horror","hostile","how to","huge","humility","humor","hurricane","hurry","hypnotic","idiot","ignite","illegal","illusive","imagination","immediately","imminently","impatience","impatient","impenetrable","important","impressive","improved","in the zone","incapable","incapacitated","incompetent","inconsiderate","increase","incredible","indecisive","indulgence","indulgent","inexpensive","inferior","informative","infuriated","ingredients","innocent","innovative","insane","insecure","insider","insidious","inspired","inspiring","instant savings","instantly","instructive","insult","intel","intelligent","intense","interesting","intriguing","introducing","invasion","investment","iron-clad","ironclad","irresistible","irs","is here","jackpot","jail","jaw-dropping","jealous","jeopardy","jittery","jovial","joyous","jubilant","judgmental","jumpstart","just arrived","keen","kickass","kickstart","kill","killed","killing","kills","know it all","lame","largest","lascivious","last","last chance","last minute","latest","laugh","laughing","launch","launching","lavishly","lawsuit","lazy","left behind","legendary","legitimate","liberal","liberated","lick","lies","life-changing","lifetime","light","lighthearted","likely","limited","literally","little-known","loathsome","lonely","looming","loser","lost","love","lucrative","lunatic","lurking","lust","luxurious","luxury","lying","magic","magical","magnificent","mainstream","malicious","mammoth","manipulative","marked down","massive","master","masterclass","maul","mediocre","meditative","meltdown","memorability","memorable","menacing","mesmerizing","meticulous","mind-blowing","minimalist","miracle","mired","mischievous","misgiving","missing out","mistake","monetize","money","moneyback","moneygrubbing","monumental","most important","motivated","mouth-watering","murder","mystery","nail","naked","natural","naughty","nazi","nest egg","never","new","nightmare","no good","no obligation","no one talks about","no questions asked","no risk","no strings attached","non-controlling","noted","novelty","now","obnoxious","obsessed","obsession","obvious","odd","off-kilter","off-limits","off-the record","offensive","official","okay","on-demand","open-minded","opportunities","optimistic","ordeal","outlawed","outrageousness","outstanding","overcome","overjoyed","overnight","overwhelmed","packed","painful","painless","painstaking","pale","panic","panicked","paralyzed","pas","passionate","pathetic","pay zero","payback","perfect","peril","perplexed","perspective","pessimistic","pioneering","piranha","pitfall","pitiful","placid","plague","played","playful","pleased","pluck","plummet","plunge","poison","poisonous","polarizing","poor","popular","portfolio","pound","powerful","powerless","practical","preposterous","prestige","price","priceless","pride","prison","privacy","private","privileged","prize","problem","productive","professional","profit","profitable","profound","promiscuous","promising","promote","protect","protected","proven","provocative","provoke","psychological","pummel","punch","punish","pus","quadruple","quality","quarrelsome","quick","quick-start","quickly","quiet","radiant","rare","ravenous","rebellious","recession-proof","reckoning","recognized","recommend","recreate","reduced","reflective","refugee","refund","refundable","reject","relaxed","release","relentless","reliable","remarkable","replicate","report","reprimanding","repulsed","repulsive","research","resentful","resourceful","responsible","responsive","rested","restricted","results","retaliating","reveal","revealing","revenge","revengeful","revisited","revolting","revolutionary","reward","rich","ridiculous","risky","riveting","rookie","rowdy","ruin","rules","ruthless","sabotaging","sacred","sadistic","sadly","sadness","safe","safety","sale","sampler","sarcastic","satisfied","savage","savagery","save","savings","savvy","scam","scandal","scandalous","scarce","scared","scary","scornful","scream","searing","secret","secret agenda","secret plot","secrets","secure","security","seductive","seething","seize","selected","self-hating","self-sufficient","sensational","senseless","sensual","serene","seriously","severe","sex","sexy","shaking","shameful","shameless","shaming","shatter","shellacking","shocking","should","shrewd","sick and tired","signs","silly","simple","simplicity","simplified","simplistic","sincere","sinful","sins","six-figure","sizable","sizzle","sizzled","sizzles","sizzling","sizzlingly","skill","skyrocket","slaughter","slave","sleazy","sleeping","sly","smash","smiling","smug","smuggle","smuggled","sneak-peek","sneaky","sniveling","snob","snooty","snotty","soar","soaring","solid","solution","spank","special","spectacular","speedy","spell-binding","spine","spirit","spirited","spiteful","spoiler","spontaneous","spotlight","spunky","squirming","stable","staggering","startling","steady","steal","stealthy","steamy","step-by-step","still","stoic","stop","strange","strangle","strategy","stressed","strong","strongly suggest","struggle","stuck up","studies","stunning","stupid","stupid-simple","sturdy","sublime","succeed","success","successful","suck","suddenly","suffer","sunny","super","super-human","superb","supercharge","superior","supported","supportive","sure","sure fire","surefire","surge","surging","surprise","surprised","surprising","survival","survive","suspicious","sweaty","swoon","swoon-worthy","tailspin","tank","tantalizing","targeted","tawdry","tease","technology","teetering","tempting","tenacious","tense","terrible","terrific","terrified","terrifying","terror","terrorist","tested","thankful","the truth","threaten","threatened","thrilled","thrilling","thug","ticked off","tickled","timely","today","torture","toxic","track record","trade secret","tragedy","tragic","transform","transparency","trap","trapped","trauma","traumatized","treacherous","treasure","tremendous","trend","tricks","triggers","triple","triumph","truly","trusting","trustworthy","truth","truthful","turbo-charge","turbocharges","tweaks","twitching","ultimate","unadulterated","unassuming","unauthorized","unbelievable","unburdened","uncaring","uncensored","uncertain","uncomfortable","unconditional","uncontrollable","unconventional","uncovered","undeniable","under priced","undercover","underground","underhanded","underused","unexpected","unforgettable","unheard of","unhurried","uninterested","unique","unjustified","unknowingly","unleashed","unlimited","unlock","unparalleled","unpopular","unreliable","unresponsive","unseen","unstable","unstoppable","unsure","unsurpassed","untapped","unusual","up-sell","upbeat","uplifted","uplifting","urge","urgent","useful","useless","validate","valor","valuable","value","vanquish","vaporize","venomous","verify","vibrant","vicious","victim","victory","vigorous","vilified","vindictive","violated","violent","volatile","vulnerable","waiting","wanted","wanton","warning","waste","weak","wealth","weird","what no one tells you","whip","whopping","wicked","wild","willpower","withheld","wonderful","wondrous","woozy","world","worry","worst","worthwhile","wounded","wreaking","youthful","zen","zinger"],"diacritics":{"A":"[\\u0041\\u24B6\\uFF21\\u00C0\\u00C1\\u00C2\\u1EA6\\u1EA4\\u1EAA\\u1EA8\\u00C3\\u0100\\u0102\\u1EB0\\u1EAE\\u1EB4\\u1EB2\\u0226\\u01E0\\u00C4\\u01DE\\u1EA2\\u00C5\\u01FA\\u01CD\\u0200\\u0202\\u1EA0\\u1EAC\\u1EB6\\u1E00\\u0104\\u023A\\u2C6F]","AA":"[\\uA732]","AE":"[\\u00C6\\u01FC\\u01E2]","AO":"[\\uA734]","AU":"[\\uA736]","AV":"[\\uA738\\uA73A]","AY":"[\\uA73C]","B":"[\\u0042\\u24B7\\uFF22\\u1E02\\u1E04\\u1E06\\u0243\\u0182\\u0181]","C":"[\\u0043\\u24B8\\uFF23\\u0106\\u0108\\u010A\\u010C\\u00C7\\u1E08\\u0187\\u023B\\uA73E]","D":"[\\u0044\\u24B9\\uFF24\\u1E0A\\u010E\\u1E0C\\u1E10\\u1E12\\u1E0E\\u0110\\u018B\\u018A\\u0189\\uA779]","DZ":"[\\u01F1\\u01C4]","Dz":"[\\u01F2\\u01C5]","E":"[\\u0045\\u24BA\\uFF25\\u00C8\\u00C9\\u00CA\\u1EC0\\u1EBE\\u1EC4\\u1EC2\\u1EBC\\u0112\\u1E14\\u1E16\\u0114\\u0116\\u00CB\\u1EBA\\u011A\\u0204\\u0206\\u1EB8\\u1EC6\\u0228\\u1E1C\\u0118\\u1E18\\u1E1A\\u0190\\u018E]","F":"[\\u0046\\u24BB\\uFF26\\u1E1E\\u0191\\uA77B]","G":"[\\u0047\\u24BC\\uFF27\\u01F4\\u011C\\u1E20\\u011E\\u0120\\u01E6\\u0122\\u01E4\\u0193\\uA7A0\\uA77D\\uA77E]","H":"[\\u0048\\u24BD\\uFF28\\u0124\\u1E22\\u1E26\\u021E\\u1E24\\u1E28\\u1E2A\\u0126\\u2C67\\u2C75\\uA78D]","I":"[\\u0049\\u24BE\\uFF29\\u00CC\\u00CD\\u00CE\\u0128\\u012A\\u012C\\u0130\\u00CF\\u1E2E\\u1EC8\\u01CF\\u0208\\u020A\\u1ECA\\u012E\\u1E2C\\u0197]","J":"[\\u004A\\u24BF\\uFF2A\\u0134\\u0248]","K":"[\\u004B\\u24C0\\uFF2B\\u1E30\\u01E8\\u1E32\\u0136\\u1E34\\u0198\\u2C69\\uA740\\uA742\\uA744\\uA7A2]","L":"[\\u004C\\u24C1\\uFF2C\\u013F\\u0139\\u013D\\u1E36\\u1E38\\u013B\\u1E3C\\u1E3A\\u0141\\u023D\\u2C62\\u2C60\\uA748\\uA746\\uA780]","LJ":"[\\u01C7]","Lj":"[\\u01C8]","M":"[\\u004D\\u24C2\\uFF2D\\u1E3E\\u1E40\\u1E42\\u2C6E\\u019C]","N":"[\\u004E\\u24C3\\uFF2E\\u01F8\\u0143\\u00D1\\u1E44\\u0147\\u1E46\\u0145\\u1E4A\\u1E48\\u0220\\u019D\\uA790\\uA7A4]","NJ":"[\\u01CA]","Nj":"[\\u01CB]","O":"[\\u004F\\u24C4\\uFF2F\\u00D2\\u00D3\\u00D4\\u1ED2\\u1ED0\\u1ED6\\u1ED4\\u00D5\\u1E4C\\u022C\\u1E4E\\u014C\\u1E50\\u1E52\\u014E\\u022E\\u0230\\u00D6\\u022A\\u1ECE\\u0150\\u01D1\\u020C\\u020E\\u01A0\\u1EDC\\u1EDA\\u1EE0\\u1EDE\\u1EE2\\u1ECC\\u1ED8\\u01EA\\u01EC\\u00D8\\u01FE\\u0186\\u019F\\uA74A\\uA74C]","OI":"[\\u01A2]","OO":"[\\uA74E]","OU":"[\\u0222]","P":"[\\u0050\\u24C5\\uFF30\\u1E54\\u1E56\\u01A4\\u2C63\\uA750\\uA752\\uA754]","Q":"[\\u0051\\u24C6\\uFF31\\uA756\\uA758\\u024A]","R":"[\\u0052\\u24C7\\uFF32\\u0154\\u1E58\\u0158\\u0210\\u0212\\u1E5A\\u1E5C\\u0156\\u1E5E\\u024C\\u2C64\\uA75A\\uA7A6\\uA782]","S":"[\\u0053\\u24C8\\uFF33\\u1E9E\\u015A\\u1E64\\u015C\\u1E60\\u0160\\u1E66\\u1E62\\u1E68\\u0218\\u015E\\u2C7E\\uA7A8\\uA784]","T":"[\\u0054\\u24C9\\uFF34\\u1E6A\\u0164\\u1E6C\\u021A\\u0162\\u1E70\\u1E6E\\u0166\\u01AC\\u01AE\\u023E\\uA786]","TZ":"[\\uA728]","U":"[\\u0055\\u24CA\\uFF35\\u00D9\\u00DA\\u00DB\\u0168\\u1E78\\u016A\\u1E7A\\u016C\\u00DC\\u01DB\\u01D7\\u01D5\\u01D9\\u1EE6\\u016E\\u0170\\u01D3\\u0214\\u0216\\u01AF\\u1EEA\\u1EE8\\u1EEE\\u1EEC\\u1EF0\\u1EE4\\u1E72\\u0172\\u1E76\\u1E74\\u0244]","V":"[\\u0056\\u24CB\\uFF36\\u1E7C\\u1E7E\\u01B2\\uA75E\\u0245]","VY":"[\\uA760]","W":"[\\u0057\\u24CC\\uFF37\\u1E80\\u1E82\\u0174\\u1E86\\u1E84\\u1E88\\u2C72]","X":"[\\u0058\\u24CD\\uFF38\\u1E8A\\u1E8C]","Y":"[\\u0059\\u24CE\\uFF39\\u1EF2\\u00DD\\u0176\\u1EF8\\u0232\\u1E8E\\u0178\\u1EF6\\u1EF4\\u01B3\\u024E\\u1EFE]","Z":"[\\u005A\\u24CF\\uFF3A\\u0179\\u1E90\\u017B\\u017D\\u1E92\\u1E94\\u01B5\\u0224\\u2C7F\\u2C6B\\uA762]","a":"[\\u0061\\u24D0\\uFF41\\u1E9A\\u00E0\\u00E1\\u00E2\\u1EA7\\u1EA5\\u1EAB\\u1EA9\\u00E3\\u0101\\u0103\\u1EB1\\u1EAF\\u1EB5\\u1EB3\\u0227\\u01E1\\u00E4\\u01DF\\u1EA3\\u00E5\\u01FB\\u01CE\\u0201\\u0203\\u1EA1\\u1EAD\\u1EB7\\u1E01\\u0105\\u2C65\\u0250]","aa":"[\\uA733]","ae":"[\\u00E6\\u01FD\\u01E3]","ao":"[\\uA735]","au":"[\\uA737]","av":"[\\uA739\\uA73B]","ay":"[\\uA73D]","b":"[\\u0062\\u24D1\\uFF42\\u1E03\\u1E05\\u1E07\\u0180\\u0183\\u0253]","c":"[\\u0063\\u24D2\\uFF43\\u0107\\u0109\\u010B\\u010D\\u00E7\\u1E09\\u0188\\u023C\\uA73F\\u2184]","d":"[\\u0064\\u24D3\\uFF44\\u1E0B\\u010F\\u1E0D\\u1E11\\u1E13\\u1E0F\\u0111\\u018C\\u0256\\u0257\\uA77A]","dz":"[\\u01F3\\u01C6]","e":"[\\u0065\\u24D4\\uFF45\\u00E8\\u00E9\\u00EA\\u1EC1\\u1EBF\\u1EC5\\u1EC3\\u1EBD\\u0113\\u1E15\\u1E17\\u0115\\u0117\\u00EB\\u1EBB\\u011B\\u0205\\u0207\\u1EB9\\u1EC7\\u0229\\u1E1D\\u0119\\u1E19\\u1E1B\\u0247\\u025B\\u01DD]","f":"[\\u0066\\u24D5\\uFF46\\u1E1F\\u0192\\uA77C]","g":"[\\u0067\\u24D6\\uFF47\\u01F5\\u011D\\u1E21\\u011F\\u0121\\u01E7\\u0123\\u01E5\\u0260\\uA7A1\\u1D79\\uA77F]","h":"[\\u0068\\u24D7\\uFF48\\u0125\\u1E23\\u1E27\\u021F\\u1E25\\u1E29\\u1E2B\\u1E96\\u0127\\u2C68\\u2C76\\u0265]","hv":"[\\u0195]","i":"[\\u0069\\u24D8\\uFF49\\u00EC\\u00ED\\u00EE\\u0129\\u012B\\u012D\\u00EF\\u1E2F\\u1EC9\\u01D0\\u0209\\u020B\\u1ECB\\u012F\\u1E2D\\u0268\\u0131]","j":"[\\u006A\\u24D9\\uFF4A\\u0135\\u01F0\\u0249]","k":"[\\u006B\\u24DA\\uFF4B\\u1E31\\u01E9\\u1E33\\u0137\\u1E35\\u0199\\u2C6A\\uA741\\uA743\\uA745\\uA7A3]","l":"[\\u006C\\u24DB\\uFF4C\\u0140\\u013A\\u013E\\u1E37\\u1E39\\u013C\\u1E3D\\u1E3B\\u017F\\u0142\\u019A\\u026B\\u2C61\\uA749\\uA781\\uA747]","lj":"[\\u01C9]","m":"[\\u006D\\u24DC\\uFF4D\\u1E3F\\u1E41\\u1E43\\u0271\\u026F]","n":"[\\u006E\\u24DD\\uFF4E\\u01F9\\u0144\\u00F1\\u1E45\\u0148\\u1E47\\u0146\\u1E4B\\u1E49\\u019E\\u0272\\u0149\\uA791\\uA7A5]","nj":"[\\u01CC]","o":"[\\u006F\\u24DE\\uFF4F\\u00F2\\u00F3\\u00F4\\u1ED3\\u1ED1\\u1ED7\\u1ED5\\u00F5\\u1E4D\\u022D\\u1E4F\\u014D\\u1E51\\u1E53\\u014F\\u022F\\u0231\\u00F6\\u022B\\u1ECF\\u0151\\u01D2\\u020D\\u020F\\u01A1\\u1EDD\\u1EDB\\u1EE1\\u1EDF\\u1EE3\\u1ECD\\u1ED9\\u01EB\\u01ED\\u00F8\\u01FF\\u0254\\uA74B\\uA74D\\u0275]","oi":"[\\u01A3]","ou":"[\\u0223]","oo":"[\\uA74F]","p":"[\\u0070\\u24DF\\uFF50\\u1E55\\u1E57\\u01A5\\u1D7D\\uA751\\uA753\\uA755]","q":"[\\u0071\\u24E0\\uFF51\\u024B\\uA757\\uA759]","r":"[\\u0072\\u24E1\\uFF52\\u0155\\u1E59\\u0159\\u0211\\u0213\\u1E5B\\u1E5D\\u0157\\u1E5F\\u024D\\u027D\\uA75B\\uA7A7\\uA783]","s":"[\\u0073\\u24E2\\uFF53\\u015B\\u1E65\\u015D\\u1E61\\u0161\\u1E67\\u1E63\\u1E69\\u0219\\u015F\\u023F\\uA7A9\\uA785\\u1E9B]","ss":"[\\u00DF]","t":"[\\u0074\\u24E3\\uFF54\\u1E6B\\u1E97\\u0165\\u1E6D\\u021B\\u0163\\u1E71\\u1E6F\\u0167\\u01AD\\u0288\\u2C66\\uA787]","tz":"[\\uA729]","u":"[\\u0075\\u24E4\\uFF55\\u00F9\\u00FA\\u00FB\\u0169\\u1E79\\u016B\\u1E7B\\u016D\\u00FC\\u01DC\\u01D8\\u01D6\\u01DA\\u1EE7\\u016F\\u0171\\u01D4\\u0215\\u0217\\u01B0\\u1EEB\\u1EE9\\u1EEF\\u1EED\\u1EF1\\u1EE5\\u1E73\\u0173\\u1E77\\u1E75\\u0289]","v":"[\\u0076\\u24E5\\uFF56\\u1E7D\\u1E7F\\u028B\\uA75F\\u028C]","vy":"[\\uA761]","w":"[\\u0077\\u24E6\\uFF57\\u1E81\\u1E83\\u0175\\u1E87\\u1E85\\u1E98\\u1E89\\u2C73]","x":"[\\u0078\\u24E7\\uFF58\\u1E8B\\u1E8D]","y":"[\\u0079\\u24E8\\uFF59\\u1EF3\\u00FD\\u0177\\u1EF9\\u0233\\u1E8F\\u00FF\\u1EF7\\u1E99\\u1EF5\\u01B4\\u024F\\u1EFF]","z":"[\\u007A\\u24E9\\uFF5A\\u017A\\u1E91\\u017C\\u017E\\u1E93\\u1E95\\u01B6\\u0225\\u0240\\u2C6C\\uA763]"},"researchesTests":["contentHasTOC","contentHasShortParagraphs","contentHasAssets","keywordInTitle","keywordInMetaDescription","keywordInPermalink","keywordIn10Percent","keywordInContent","keywordInSubheadings","keywordInImageAlt","keywordDensity","keywordNotUsed","lengthContent","lengthPermalink","linksHasInternal","linksHasExternals","linksNotAllExternals","titleStartWithKeyword","titleSentiment","titleHasPowerWords","titleHasNumber","hasContentAI"],"hasRedirection":true,"hasBreadcrumb":true},"homeUrl":"https:\/\/www.ezcalculatoronline.com","objectID":9416,"objectType":"post","locale":"en","localeFull":"en_US","overlayImages":{"play":{"name":"Play icon","url":"https:\/\/www.ezcalculatoronline.com\/wp-content\/plugins\/seo-by-rank-math\/assets\/admin\/img\/icon-play.png","path":"\/home\/dh_7btfqe\/ezcalculatoronline.com\/wp-content\/plugins\/seo-by-rank-math\/assets\/admin\/img\/icon-play.png","position":"middle_center"},"gif":{"name":"GIF icon","url":"https:\/\/www.ezcalculatoronline.com\/wp-content\/plugins\/seo-by-rank-math\/assets\/admin\/img\/icon-gif.png","path":"\/home\/dh_7btfqe\/ezcalculatoronline.com\/wp-content\/plugins\/seo-by-rank-math\/assets\/admin\/img\/icon-gif.png","position":"middle_center"}},"defautOgImage":"https:\/\/www.ezcalculatoronline.com\/wp-content\/uploads\/2025\/11\/EZCALCULATORONLINE-LOGO-2.png","customPermalinks":true,"isUserRegistered":false,"autoSuggestKeywords":false,"connectSiteUrl":"https:\/\/rankmath.com\/auth?site=https%3A%2F%2Fwww.ezcalculatoronline.com&r=https%3A%2F%2Fwww.ezcalculatoronline.com%2Fis%2Fwp-json%2Fwp%2Fv2%2Fpages%2F9416%3Fnonce%3Def66145470","maxTags":5,"trendsIcon":"<svg viewBox=\"0 0 610 610\"><path d=\"M18.85,446,174.32,290.48l58.08,58.08L76.93,504a14.54,14.54,0,0,1-20.55,0L18.83,466.48a14.54,14.54,0,0,1,0-20.55Z\" style=\"fill:#4285f4\"\/><path d=\"M242.65,242.66,377.59,377.6l-47.75,47.75a14.54,14.54,0,0,1-20.55,0L174.37,290.43l47.75-47.75A14.52,14.52,0,0,1,242.65,242.66Z\" style=\"fill:#ea4335\"\/><polygon points=\"319.53 319.53 479.26 159.8 537.34 217.88 377.61 377.62 319.53 319.53\" style=\"fill:#fabb05\"\/><path d=\"M594.26,262.73V118.61h0a16.94,16.94,0,0,0-16.94-16.94H433.2a16.94,16.94,0,0,0-12,28.92L565.34,274.71h0a16.94,16.94,0,0,0,28.92-12Z\" style=\"fill:#34a853\"\/><rect width=\"610\" height=\"610\" style=\"fill:none\"\/><\/svg>","showScore":true,"siteFavIcon":"https:\/\/www.ezcalculatoronline.com\/wp-content\/uploads\/2025\/05\/cropped-ezcaculator-32x32.webp","canUser":{"general":false,"advanced":false,"snippet":false,"social":false,"analysis":false,"analytics":false,"content_ai":false},"showKeywordIntent":true,"isPro":false,"is_front_page":false,"trendsUpgradeLink":"https:\/\/rankmath.com\/pricing\/?utm_source=Plugin&utm_medium=CE%20General%20Tab%20Trends&utm_campaign=WP","trendsUpgradeLabel":"Upgrade","trendsPreviewImage":"https:\/\/www.ezcalculatoronline.com\/wp-content\/plugins\/seo-by-rank-math\/assets\/admin\/img\/trends-preview.jpg","currentEditor":false,"homepageData":{"assessor":{"powerWords":["a cut above","absolute","absolutely","absolutely lowest","absurd","abuse","accurate","accuse","achieve","actionable","adaptable","adequate","admit","adorable","advantage","advice","affordable","aggravate","aggressive","agitated","agonizing","agony","alarmed","alarming","alienated","aligned","alive","all-inclusive","alluring","always","amazing","amp","animated","annihilate","announcing","anonymous","antagonistic","anxious","apocalypse","appalled","approved","approving","argumentative","armageddon","arrogant","ass kicking","assault","assured","astonishing","astounded","astounding","at ease","atrocious","attack","attractive","audacity","authentic","authoritative","authority","avoid","aware","awe-inspiring","awesome","awkward","backbone","backdoor","backed","backlash","backstabbing","badass","balanced","banned","bargain","barrage","basic","battle","beaming","beat down","beating","beautiful","beauty","begging","behind the scenes","belief","belong","best","best-selling","better","beware","big","billion","black market","blacklisted","blast","blessed","blinded","blissful","blood","bloodbath","bloodcurdling","bloody","blunder","blushing","bold","bomb","bona","bona fide","bonanza","bonus","bootleg","bottom line","bountiful","brave","bravery","brazen","break","breaking","breakthrough","breathtaking","bright","brilliant","broke","brutal","budget","buffoon","bullshit","bully","bumbling","buy","cadaver","calm","cancel anytime","capable","captivate","captivating","carefree","case study","cash","cataclysmic","catapult","catastrophe","caution","censored","centered","certain","certainly","certified","challenge","charming","cheap","cheat","cheat-sheet","cheer","cheerful","child-like","clarity","classified","clear","clueless","collapse","colorful","colossal","comfortable","compare","competitive","complete","completely","completeness","comprehensive","compromise","compulsive","concealed","conclusive","condemning","condescending","confess","confession","confessions","confident","confidential","conquer","conscientious","constructive","content","contrary","controlling","controversial","convenient","convert","cool","cooperative","copy","corpse","corrupt","corrupting","courage","courageous","cover-up","covert","coward","cowardly","crammed","crave","crazy","create","creative","cringeworthy","cripple","crisis","critical","crooked","crush","crushing","damaging","danger","dangerous","daring","dazzling","dead","deadline","deadly","death","decadent","deceived","deceptive","deep","defiance","definitely","definitive","defying","dejected","delicious","delight","delighted","delightful","delirious","delivered","demoralizing","deplorable","depraved","desire","desperate","despicable","destiny","destroy","detailed","devastating","devoted","diagnosed","direct","dirty","disadvantages","disastrous","discount","discover","disdainful","disempowered","disgusted","disgusting","dishonest","disillusioned","disoriented","distracted","distraught","distressed","distrustful","divulge","document","dollar","dominate","doomed","double","doubtful","download","dreadful","dreamy","drive","drowning","dumb","dynamic","eager","earnest","easily","easy","economical","ecstatic","edge","effective","efficient","effortless","elated","eliminate","elite","embarrass","embarrassed","embarrassing","emergency","emerging","emphasize","empowered","enchant","encouraged","endorsed","energetic","energy","enormous","enraged","enthusiastic","envy","epic","epidemic","essential","ethical","euphoric","evil","exactly","exasperated","excellent","excited","excitement","exciting","exclusive","exclusivity","excruciating","exhilarated","expensive","expert","explode","exploit","explosive","exposed","exquisite","extra","extraordinary","extremely","exuberant","eye-opening","fail","fail-proof","failure","faith","famous","fantasy","fascinating","fatigued","faux","faux pas","fearless","feast","feeble","festive","fide","fierce","fight","final","fine","fired","first","first ever","flirt","fluid","focus","focused","fool","fooled","foolish","forbidden","force-fed","forever","forgiving","forgotten","formula","fortune","foul","frantic","free","freebie","freedom","frenzied","frenzy","frightening","frisky","frugal","frustrated","fulfill","fulfilled","full","fully","fun","fun-loving","fundamentals","funniest","funny","furious","gambling","gargantuan","genius","genuine","gift","gigantic","giveaway","glamorous","gleeful","glorious","glowing","goddamn","gorgeous","graceful","grateful","gratified","gravity","great","greatest","greatness","greed","greedy","gripping","grit","grounded","growth","guaranteed","guilt","guilt-free","gullible","guts","hack","happiness","happy","harmful","harsh","hate","have you heard","havoc","hazardous","healthy","heart","heartbreaking","heartwarming","heavenly","hell","helpful","helplessness","hero","hesitant","hidden","high tech","highest","highly effective","hilarious","hoak","hoax","honest","honored","hope","hopeful","horribly","horrific","horrifying","horror","hostile","how to","huge","humility","humor","hurricane","hurry","hypnotic","idiot","ignite","illegal","illusive","imagination","immediately","imminently","impatience","impatient","impenetrable","important","impressive","improved","in the zone","incapable","incapacitated","incompetent","inconsiderate","increase","incredible","indecisive","indulgence","indulgent","inexpensive","inferior","informative","infuriated","ingredients","innocent","innovative","insane","insecure","insider","insidious","inspired","inspiring","instant savings","instantly","instructive","insult","intel","intelligent","intense","interesting","intriguing","introducing","invasion","investment","iron-clad","ironclad","irresistible","irs","is here","jackpot","jail","jaw-dropping","jealous","jeopardy","jittery","jovial","joyous","jubilant","judgmental","jumpstart","just arrived","keen","kickass","kickstart","kill","killed","killing","kills","know it all","lame","largest","lascivious","last","last chance","last minute","latest","laugh","laughing","launch","launching","lavishly","lawsuit","lazy","left behind","legendary","legitimate","liberal","liberated","lick","lies","life-changing","lifetime","light","lighthearted","likely","limited","literally","little-known","loathsome","lonely","looming","loser","lost","love","lucrative","lunatic","lurking","lust","luxurious","luxury","lying","magic","magical","magnificent","mainstream","malicious","mammoth","manipulative","marked down","massive","master","masterclass","maul","mediocre","meditative","meltdown","memorability","memorable","menacing","mesmerizing","meticulous","mind-blowing","minimalist","miracle","mired","mischievous","misgiving","missing out","mistake","monetize","money","moneyback","moneygrubbing","monumental","most important","motivated","mouth-watering","murder","mystery","nail","naked","natural","naughty","nazi","nest egg","never","new","nightmare","no good","no obligation","no one talks about","no questions asked","no risk","no strings attached","non-controlling","noted","novelty","now","obnoxious","obsessed","obsession","obvious","odd","off-kilter","off-limits","off-the record","offensive","official","okay","on-demand","open-minded","opportunities","optimistic","ordeal","outlawed","outrageousness","outstanding","overcome","overjoyed","overnight","overwhelmed","packed","painful","painless","painstaking","pale","panic","panicked","paralyzed","pas","passionate","pathetic","pay zero","payback","perfect","peril","perplexed","perspective","pessimistic","pioneering","piranha","pitfall","pitiful","placid","plague","played","playful","pleased","pluck","plummet","plunge","poison","poisonous","polarizing","poor","popular","portfolio","pound","powerful","powerless","practical","preposterous","prestige","price","priceless","pride","prison","privacy","private","privileged","prize","problem","productive","professional","profit","profitable","profound","promiscuous","promising","promote","protect","protected","proven","provocative","provoke","psychological","pummel","punch","punish","pus","quadruple","quality","quarrelsome","quick","quick-start","quickly","quiet","radiant","rare","ravenous","rebellious","recession-proof","reckoning","recognized","recommend","recreate","reduced","reflective","refugee","refund","refundable","reject","relaxed","release","relentless","reliable","remarkable","replicate","report","reprimanding","repulsed","repulsive","research","resentful","resourceful","responsible","responsive","rested","restricted","results","retaliating","reveal","revealing","revenge","revengeful","revisited","revolting","revolutionary","reward","rich","ridiculous","risky","riveting","rookie","rowdy","ruin","rules","ruthless","sabotaging","sacred","sadistic","sadly","sadness","safe","safety","sale","sampler","sarcastic","satisfied","savage","savagery","save","savings","savvy","scam","scandal","scandalous","scarce","scared","scary","scornful","scream","searing","secret","secret agenda","secret plot","secrets","secure","security","seductive","seething","seize","selected","self-hating","self-sufficient","sensational","senseless","sensual","serene","seriously","severe","sex","sexy","shaking","shameful","shameless","shaming","shatter","shellacking","shocking","should","shrewd","sick and tired","signs","silly","simple","simplicity","simplified","simplistic","sincere","sinful","sins","six-figure","sizable","sizzle","sizzled","sizzles","sizzling","sizzlingly","skill","skyrocket","slaughter","slave","sleazy","sleeping","sly","smash","smiling","smug","smuggle","smuggled","sneak-peek","sneaky","sniveling","snob","snooty","snotty","soar","soaring","solid","solution","spank","special","spectacular","speedy","spell-binding","spine","spirit","spirited","spiteful","spoiler","spontaneous","spotlight","spunky","squirming","stable","staggering","startling","steady","steal","stealthy","steamy","step-by-step","still","stoic","stop","strange","strangle","strategy","stressed","strong","strongly suggest","struggle","stuck up","studies","stunning","stupid","stupid-simple","sturdy","sublime","succeed","success","successful","suck","suddenly","suffer","sunny","super","super-human","superb","supercharge","superior","supported","supportive","sure","sure fire","surefire","surge","surging","surprise","surprised","surprising","survival","survive","suspicious","sweaty","swoon","swoon-worthy","tailspin","tank","tantalizing","targeted","tawdry","tease","technology","teetering","tempting","tenacious","tense","terrible","terrific","terrified","terrifying","terror","terrorist","tested","thankful","the truth","threaten","threatened","thrilled","thrilling","thug","ticked off","tickled","timely","today","torture","toxic","track record","trade secret","tragedy","tragic","transform","transparency","trap","trapped","trauma","traumatized","treacherous","treasure","tremendous","trend","tricks","triggers","triple","triumph","truly","trusting","trustworthy","truth","truthful","turbo-charge","turbocharges","tweaks","twitching","ultimate","unadulterated","unassuming","unauthorized","unbelievable","unburdened","uncaring","uncensored","uncertain","uncomfortable","unconditional","uncontrollable","unconventional","uncovered","undeniable","under priced","undercover","underground","underhanded","underused","unexpected","unforgettable","unheard of","unhurried","uninterested","unique","unjustified","unknowingly","unleashed","unlimited","unlock","unparalleled","unpopular","unreliable","unresponsive","unseen","unstable","unstoppable","unsure","unsurpassed","untapped","unusual","up-sell","upbeat","uplifted","uplifting","urge","urgent","useful","useless","validate","valor","valuable","value","vanquish","vaporize","venomous","verify","vibrant","vicious","victim","victory","vigorous","vilified","vindictive","violated","violent","volatile","vulnerable","waiting","wanted","wanton","warning","waste","weak","wealth","weird","what no one tells you","whip","whopping","wicked","wild","willpower","withheld","wonderful","wondrous","woozy","world","worry","worst","worthwhile","wounded","wreaking","youthful","zen","zinger"],"diacritics":true,"researchesTests":["contentHasTOC","contentHasShortParagraphs","contentHasAssets","keywordInTitle","keywordInMetaDescription","keywordInPermalink","keywordIn10Percent","keywordInContent","keywordInSubheadings","keywordInImageAlt","keywordDensity","keywordNotUsed","lengthContent","lengthPermalink","linksHasInternal","linksHasExternals","linksNotAllExternals","titleStartWithKeyword","titleSentiment","titleHasPowerWords","titleHasNumber","hasContentAI"],"hasBreadcrumb":true,"serpData":{"title":"%sitename% %sep% %sitedesc%","description":"%sitedesc%","titleTemplate":"%sitename% %page% %sep% %sitedesc%","descriptionTemplate":"","focusKeywords":"","breadcrumbTitle":"Home","robots":{"index":true},"advancedRobots":{"max-snippet":"-1","max-video-preview":"-1","max-image-preview":"large"},"facebookTitle":"","facebookDescription":"","facebookImage":"","facebookImageID":""}}},"tocTitle":"Table of Contents","tocExcludeHeadings":[],"listStyle":"ul"},"_links":{"self":[{"href":"https:\/\/www.ezcalculatoronline.com\/wp-json\/wp\/v2\/pages\/9416","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.ezcalculatoronline.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.ezcalculatoronline.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.ezcalculatoronline.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ezcalculatoronline.com\/wp-json\/wp\/v2\/comments?post=9416"}],"version-history":[{"count":10,"href":"https:\/\/www.ezcalculatoronline.com\/wp-json\/wp\/v2\/pages\/9416\/revisions"}],"predecessor-version":[{"id":9730,"href":"https:\/\/www.ezcalculatoronline.com\/wp-json\/wp\/v2\/pages\/9416\/revisions\/9730"}],"up":[{"embeddable":true,"href":"https:\/\/www.ezcalculatoronline.com\/wp-json\/wp\/v2\/pages\/4298"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.ezcalculatoronline.com\/wp-json\/wp\/v2\/media\/9436"}],"wp:attachment":[{"href":"https:\/\/www.ezcalculatoronline.com\/wp-json\/wp\/v2\/media?parent=9416"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}