#root{margin:0 auto;width:100vw;height:100vh;background:url(/assets/bg-B8eQNKZb.jpg) repeat;background-size:400px}:root{--toolbar-foreground: #555;--toolbar-distance: 16px}.selection{cursor:move}.selection.left,.selection.right{cursor:ew-resize}.selection.top,.selection.bottom{cursor:ns-resize}.shape .selection{visibility:hidden;cursor:pointer}.shape:hover>.selection{visibility:visible;fill:#88f1;stroke-width:1;stroke-dasharray:5 5}.toolbar{position:absolute;background:#fdd;color:var(--toolbar-foreground);display:flex;justify-content:space-between;align-items:center;padding:8px;gap:8px;border-radius:8px;box-shadow:0 0 8px #0003;transition:all .2s ease-in-out}.toolbar#tools,.toolbar#colors{left:50%;transform:translate(-50%)}.toolbar#tools{top:var(--toolbar-distance)}.toolbar#delete{top:var(--toolbar-distance);right:var(--toolbar-distance);cursor:pointer}.toolbar#delete:hover{background:#fbb}.toolbar#colors{bottom:var(--toolbar-distance)}.toolbar#colors.hidden{bottom:-60px}.toolbar .item{cursor:pointer;padding:8px;min-width:22px;min-height:22px;line-height:0;border-radius:4px}.toolbar .tool:hover,.toolbar .tool.active{background:#fbb}.toolbar .item.active{cursor:default}#colors .item{padding:2px 2px 8px;position:relative}#colors .item:after{content:"";display:block;height:4px;width:0;bottom:0;left:50%;transform:translate(-50%);position:absolute;border-radius:4px;transition:all .1s ease-in-out;background-color:var(--toolbar-foreground)}#colors .item.active:after{width:16px}#colors .item:hover{border-color:#fff8}#colors .item .color{width:28px;height:28px;border-radius:4px;cursor:pointer;transition:all .1s ease-in-out;box-shadow:0 0 8px #0003}#colors .item .color:hover{box-shadow:0 0 8px #0006}#scene-tree{left:var(--toolbar-distance);top:var(--toolbar-distance);transform:none;min-width:180px;align-items:start;transition:all .2s ease-in-out}#scene-tree.hidden{left:-220px}@media (max-width: 576px){#scene-tree{visibility:hidden}}.editor{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.editor.mode-rectangle .canvas,.editor.mode-ellipse .canvas,.editor.mode-rounded .canvas,.editor.mode-shape .canvas,.editor.mode-line .canvas,.editor.mode-path .canvas{cursor:crosshair}.editor.mode-pan{cursor:grab}.editor .canvas.panning{cursor:grabbing!important}.editor.mode-select .canvas{cursor:default}.editor.mode-select .shape{cursor:pointer}.canvas{position:fixed;top:0;right:0;bottom:0;left:0;-webkit-user-select:none;user-select:none}.selected{stroke-width:1px;stroke:#88f;stroke-dasharray:5 5;fill:transparent;cursor:move}.selected.disabled{pointer-events:none}@keyframes draw{to{stroke-dashoffset:0}}.select-box{stroke-width:1px;stroke:#88f;fill:transparent;cursor:move}.select-box.dashed{stroke-dasharray:5 5}.select-box.filled{fill:#88f3}.select-box-edge-horizontal{cursor:ew-resize;stroke:transparent;pointer-events:stroke}.select-box-edge-vertical{cursor:ns-resize;stroke:transparent;pointer-events:stroke}.scene-tree{height:100%;min-height:40px;width:100%;padding:4px;border-radius:4px;background-color:#fbb;color:var(--toolbar-foreground)}.scene-tree .node{padding:4px;border-radius:2px}.scene-tree .node:hover{background-color:#fdd;cursor:pointer}.scene-tree .node.selected{background-color:#fdd}.scene-tree .children{padding-left:8px;margin-left:8px;border-left:1px solid var(--toolbar-foreground)}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#000000de;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;position:relative;place-items:center}h1{font-size:3.2em;line-height:1.1}button{border-radius:6px;border:1px solid transparent;font-size:1em;font-weight:500;font-family:inherit;background-color:#aaf;height:100%;cursor:pointer;transition:border-color .25s}button:disabled{background-color:#eee;color:#aaa;cursor:initial}button:not(:disabled):hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}@font-face{font-family:Excalifont;src:url(/assets/Excalifont-Regular-C9eKQy_N.woff2);font-weight:400;font-style:normal}@font-face{font-family:GelPen;src:url(/assets/GelPen-BZM5Psdz.ttf);font-weight:400;font-style:normal}@font-face{font-family:GelPen;src:url(/assets/GelPenHeavy-BxMyFcBo.ttf);font-weight:700;font-style:normal}@font-face{font-family:GelPen;src:url(/assets/GelPenLight-CHeQcbhj.ttf);font-weight:lighter;font-style:normal}.card{font-size:16px;padding:4px;border:1px solid #ccc;border-radius:8px;background-color:#fff;box-shadow:0 2px 4px #0000001a}.notifications{position:fixed;display:relative;top:8px;right:8px;z-index:1000}.notification{position:absolute;right:0;top:0;animation:slide-in .2s forwards;transition:all .2s}@keyframes slide-in{0%{transform:translate(100%)}to{transform:translate(0)}}
