.main.svelte-1y8t7rd{display:flex;flex-direction:row;justify-content:space-between;inline-size:100%;block-size:100%}.menu.svelte-1y8t7rd{order:1;inline-size:13%;min-inline-size:5rem;display:flex;flex-direction:column;justify-content:center}.menu.svelte-1y8t7rd .menu-column:where(.svelte-1y8t7rd){display:flex;flex-direction:row}.menu.svelte-1y8t7rd button:where(.svelte-1y8t7rd){background-color:transparent;border:none;transition:all .2s}@media (any-hover: hover){.menu.svelte-1y8t7rd button:where(.svelte-1y8t7rd):not([aria-disabled=true]):hover{filter:brightness(93%)}}.menu.svelte-1y8t7rd button:where(.svelte-1y8t7rd):not([aria-disabled=true]):active{filter:brightness(85%);transform:scale(.98)}.menu.svelte-1y8t7rd button[aria-disabled=true]:where(.svelte-1y8t7rd){filter:opacity(.5) brightness(.6);pointer-events:none}.menu.svelte-1y8t7rd button.oekaki-mode:where(.svelte-1y8t7rd){inline-size:100%;aspect-ratio:1/1}.menu.svelte-1y8t7rd button.turn-back:where(.svelte-1y8t7rd),.menu.svelte-1y8t7rd button.delete:where(.svelte-1y8t7rd){inline-size:50%;aspect-ratio:1/1}.menu.svelte-1y8t7rd button.checked:where(.svelte-1y8t7rd){inline-size:100%;aspect-ratio:405 / 319}.drawer.svelte-1y8t7rd{order:2;container-type:size;flex:1;background-repeat:no-repeat;background-position:center}.drawer.svelte-1y8t7rd .canvas-container:where(.svelte-1y8t7rd){position:relative;touch-action:pinch-zoom;margin:0 auto;top:50%;translate:0 -45.5%;inline-size:min(var(--max-inline-size),calc((var(--aspect-inline) / var(--aspect-block)) * var(--max-block-size)));block-size:min(var(--max-block-size),calc((var(--aspect-block) / var(--aspect-inline)) * var(--max-inline-size)))}.drawer.svelte-1y8t7rd .ref-image:where(.svelte-1y8t7rd){position:absolute;-webkit-user-select:none;user-select:none;top:0;left:0;pointer-events:none;inline-size:100%;block-size:100%}.drawer.svelte-1y8t7rd canvas:where(.svelte-1y8t7rd){position:absolute;top:0;left:0;image-rendering:pixelated;touch-action:pinch-zoom;transform-origin:left top}.tool-menu.svelte-1y8t7rd{order:3;inline-size:13%;min-inline-size:5rem;display:flex;flex-direction:column;justify-content:space-evenly}.tool-menu.svelte-1y8t7rd ul:where(.svelte-1y8t7rd){display:flex;flex-direction:column;gap:1rem;list-style-type:none;overflow:hidden}.tool-menu.svelte-1y8t7rd button:where(.svelte-1y8t7rd){background-color:transparent;border:none;transition:all .2s ease}.tool-menu.svelte-1y8t7rd button.drawing-tool:where(.svelte-1y8t7rd){inline-size:100%;aspect-ratio:25857 / 10529;transform-origin:left center;translate:30% 0;filter:drop-shadow(-2px 0px 0px white) drop-shadow(-2px -4px 0px white) drop-shadow(-2px 4px 0px white)}@media (any-hover: hover){.tool-menu.svelte-1y8t7rd button.drawing-tool:where(.svelte-1y8t7rd):hover{filter:brightness(93%) drop-shadow(-2px 0px 0px white) drop-shadow(-2px -4px 0px white) drop-shadow(-2px 4px 0px white);translate:29% 0}}.tool-menu.svelte-1y8t7rd button.drawing-tool:where(.svelte-1y8t7rd):active{filter:brightness(85%) drop-shadow(-2px 0px 0px white) drop-shadow(-2px -4px 0px white) drop-shadow(-2px 4px 0px white);translate:25% 0}.tool-menu.svelte-1y8t7rd button.drawing-tool[aria-current=true]:where(.svelte-1y8t7rd){translate:10% 0}.tool-menu.svelte-1y8t7rd button.color-change:where(.svelte-1y8t7rd){inline-size:50%;aspect-ratio:1/1}@media (any-hover: hover){.tool-menu.svelte-1y8t7rd button.color-change:where(.svelte-1y8t7rd):hover{filter:brightness(93%)}}.tool-menu.svelte-1y8t7rd button.color-change:where(.svelte-1y8t7rd):active{filter:brightness(85%);transform:scale(.98)}.tool-menu.svelte-1y8t7rd .palette:where(.svelte-1y8t7rd){position:absolute;display:none;inline-size:40rem;max-inline-size:70%;aspect-ratio:100 / 41}.tool-menu.svelte-1y8t7rd .palette:where(.svelte-1y8t7rd) .palette-inner:where(.svelte-1y8t7rd){position:relative;inline-size:100%;block-size:100%}.tool-menu.svelte-1y8t7rd .palette:where(.svelte-1y8t7rd) img:where(.svelte-1y8t7rd){inline-size:100%}.tool-menu.svelte-1y8t7rd .palette:where(.svelte-1y8t7rd) .palette-colordots:where(.svelte-1y8t7rd){position:absolute;top:0;left:0;inline-size:100%;block-size:100%;display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:4%;padding-inline:5% 10%;padding-block:5%}