canvas.svelte-1sswqpx{position:relative;touch-action:none;cursor:var(--image-encoder-cursor, move);background-color:var(--image-encoder-background-color, transparent)}.drop-area.svelte-186px3q{box-sizing:border-box;display:grid;align-items:center;align-content:center;justify-content:center;width:100%;height:100%;text-align:center;vertical-align:center;border:var(--image-loader-border-width, 2px) var(--image-loader-border-style, dashed) var(--image-loader-border-color, #ccc);border-radius:var(--image-loader-border-radius, 0);background-color:var(--image-loader-background-color, #f9f9f9);color:var(--image-loader-text-color, inherit)}.drop-area.svelte-186px3q:hover{border-color:var(--image-loader-hover-border-color, #999);background-color:var(--image-loader-hover-background-color, #f0f0f0)}.drop-area.svelte-186px3q:focus{outline:2px solid var(--image-loader-focus-outline-color, #4a7cf8);outline-offset:2px}button.svelte-186px3q{cursor:pointer;color:var(--image-loader-button-color, inherit);background:var(--image-loader-button-background, transparent);border-radius:var(--image-loader-button-border-radius, revert);padding:.5em 1em;transition:background-color .2s ease,color .2s ease;border-width:var(--image-loader-button-border-width, revert);border-style:var(--image-loader-button-border-style, revert);border-color:var(--image-loader-button-border-color, revert)}button.svelte-186px3q:hover{color:var(--image-loader-button-hover-color, inherit);background:var(--image-loader-button-hover-background, transparent);border-color:var(--image-loader-button-hover-border-color, revert)}.hidden.svelte-186px3q{display:none}.ImageInput.svelte-huqjm5{position:relative;box-sizing:content-box;display:grid;align-items:center;justify-items:center;width:var(--image-input-width);height:var(--image-input-height);background:var(--image-input-background, transparent)}.ImageInput.svelte-huqjm5>button:where(.svelte-huqjm5){position:absolute;top:.25em;right:.25em;display:flex;align-items:center;justify-content:center;padding:.25em;line-height:1;border:none;border-color:var(--image-input-clear-button-border-color, transparent);border-radius:var(--image-input-clear-button-border-radius, 0);background-color:var(--image-input-clear-button-background, rgba(0, 0, 0, .1));color:var(--image-input-clear-button-color, inherit);cursor:pointer}.ImageInput.svelte-huqjm5>button:where(.svelte-huqjm5) svg:where(.svelte-huqjm5){display:block;width:var(--image-input-clear-button-size, 1em);height:var(--image-input-clear-button-size, 1em);margin:0;stroke:currentColor}.ImageInput.svelte-huqjm5>button:where(.svelte-huqjm5):hover{border-color:var(--image-input-clear-button-hover-border-color, transparent);background-color:var(--image-input-clear-button-hover-background, rgba(0, 0, 0, .2));color:var(--image-input-clear-button-hover-color, inherit)}.container.svelte-1uha8ag{--primary-color: #4a7cf8;--text-color: #333;--link-color: #0366d6}body{background-color:#f3f3f3}.container.svelte-1uha8ag{display:flex;flex-direction:column;align-items:center;font-family:sans-serif;max-width:800px;margin:0 auto;padding:2rem;background-color:#fff;border-radius:4px;box-shadow:0 2px 4px #0000001a}h1.svelte-1uha8ag,h2.svelte-1uha8ag,h3.svelte-1uha8ag,p.svelte-1uha8ag{color:var(--text-color)}.purpose.svelte-1uha8ag{font-size:1.1em;text-align:center;margin:1rem 0 2rem;color:#666;font-style:italic}h2.svelte-1uha8ag,h3.svelte-1uha8ag{color:var(--primary-color)}.controls.svelte-1uha8ag{display:flex;gap:1rem;margin-top:1rem;flex-wrap:wrap;justify-content:center}.demo.svelte-1uha8ag{display:grid;grid-auto-flow:column;grid-gap:1rem;align-items:start;margin-top:1rem}.imagebox.svelte-1uha8ag{width:256px;height:256px;box-sizing:border-box;box-shadow:1px 1px 2px #000000bf;border-radius:4px;overflow:hidden}a.svelte-1uha8ag{color:var(--link-color);text-decoration:none}a.svelte-1uha8ag:hover{text-decoration:underline}.doc-link.svelte-1uha8ag{font-size:.9em;margin-left:.25em;opacity:.7;transition:opacity .2s ease}.doc-link.svelte-1uha8ag:hover{opacity:1;text-decoration:none}.documentation.svelte-1uha8ag{margin-top:2rem;padding-top:2rem;border-top:1px solid #e0e0e0;width:100%}.documentation.svelte-1uha8ag ul:where(.svelte-1uha8ag){list-style:none;padding:0;margin:1rem 0}.documentation.svelte-1uha8ag li:where(.svelte-1uha8ag){margin:.5rem 0;padding-left:1.5rem;position:relative}.documentation.svelte-1uha8ag li:where(.svelte-1uha8ag):before{content:"→";position:absolute;left:0;color:var(--primary-color)}.theme-dark.svelte-1uha8ag{--image-loader-border-color: #666;--image-loader-background-color: #2a2a2a;--image-loader-text-color: #fff;--image-loader-hover-border-color: #888;--image-loader-hover-background-color: #333;--image-loader-button-color: #fff;--image-encoder-background-color: #1a1a1a;--image-input-clear-button-color: #fff;--image-input-clear-button-hover-background: rgba(255, 255, 255, .1);--image-input-clear-button-hover-border-color: rgba(255, 255, 255, .2)}.theme-brand.svelte-1uha8ag{--image-loader-border-color: #4a7cf8;--image-loader-background-color: #f0f4ff;--image-loader-text-color: #333;--image-loader-hover-border-color: #2a5cd6;--image-loader-hover-background-color: #e0e8ff;--image-loader-button-color: #4a7cf8;--image-loader-button-hover-color: #2a5cd6;--image-input-clear-button-color: #fff;--image-input-clear-button-background: rgba(74, 124, 248, .8);--image-input-clear-button-border-color: #4a7cf8;--image-input-clear-button-border-radius: 50%;--image-input-clear-button-hover-background: rgba(74, 124, 248, 1);--image-input-clear-button-hover-border-color: #2a5cd6}.theme-sophisticated.svelte-1uha8ag{--image-loader-border-color: #e8e8e8;--image-loader-border-width: 1px;--image-loader-border-style: solid;--image-loader-border-radius: 12px;--image-loader-background-color: #fafafa;--image-loader-text-color: #5a5a5a;--image-loader-hover-border-color: #d0d0d0;--image-loader-hover-background-color: #f5f5f5;--image-loader-button-color: #fff;--image-loader-button-background: #6b7280;--image-loader-button-border-width: 0;--image-loader-button-border-radius: 24px;--image-loader-button-hover-color: #fff;--image-loader-button-hover-background: #4b5563;--image-encoder-background-color: #ffffff;--image-input-clear-button-color: #fff;--image-input-clear-button-background: rgba(107, 114, 128, .8);--image-input-clear-button-border-color: transparent;--image-input-clear-button-border-radius: 50%;--image-input-clear-button-hover-background: rgba(107, 114, 128, 1);--image-input-clear-button-hover-border-color: transparent}