canvas,#vector,#canvas_grid_overlay{position:absolute;bottom:0;left:0;display:block;width:100%;height:100%;margin:0;padding:0}canvas{z-index:9999}#debug{pointer-events:none;position:absolute;top:0;left:0;z-index:99999;color:#fff;display:flex;flex-direction:column;width:10vw;opacity:.7;background-color:#000;padding:.5em;margin:.5em}h1,h2,h3,h4,h5,h6{font-family:ADLaM Display,Verdana,Geneva,Tahoma,sans-serif}body,#root{font-family:abeezee-regular,Verdana,Geneva,Tahoma,sans-serif;font-size:14px;padding:0;margin:0;width:100dvw;height:100dvh;overflow:hidden;touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none}.canvas{position:relative;z-index:1;width:100vw;height:calc(100% - 84pt);display:block}input[type=color]{border-radius:50%;aspect-ratio:1;width:16pt;height:16pt;padding:0;margin:0 .5em;-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block}input[type=color]::-webkit-color-swatch-wrapper{margin:0;padding:10%}input[type=color]::-webkit-color-swatch{border-radius:50%}@media (prefers-color-scheme: dark){:root,input,input::placeholder{color:#3d245a}body{background:#1e1a20}}@media (prefers-color-scheme: light){:root,input,input::placeholder{color:#3d245a}body{background:#7f5aa9}}header{background-color:#28183b;height:84pt;box-shadow:0 4px 10px #0003}header .toolbar{display:flex;width:calc(100% - 2em);height:48pt;padding:0 1em}header .toolbar h1{color:#d7a8e1;align-self:center;margin-left:10px}header .toolbar .nav_icons_bar{display:flex;flex-direction:row-reverse;width:100%;gap:1rem}header .nav_icons,header #pencolor{height:28.8pt;width:28.8pt;color:#d7a8e1;align-self:center}header .toolbar_sub{background-color:#6d538b;align-content:center;display:flex;justify-content:space-between;align-items:center;height:36pt;padding:0 1em}header .toolbar_sub svg{height:20px;width:20px}.nav_icon_with_dropdown{position:relative;display:inline-block;align-content:center}.nav_icon_with_dropdown .dropdown-container{position:absolute;top:48pt;right:0;z-index:10}.modal_backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0d011aa1;display:flex;align-items:center;justify-content:center;z-index:1000}.modal_content{background:#3b1364;padding:2rem;border-radius:8px;max-width:90%;max-height:90%;overflow-y:auto;color:#fff}.modal_header{display:flex;justify-content:space-between;align-items:center;padding-bottom:.5rem;border-bottom:1px solid #ccc}.modal_close_btn{background:none;border:none;cursor:pointer;font-size:1.25rem;display:flex;color:#fff}.settings_dropdown{background-color:#28183b;border-radius:0 0 6px 6px;box-shadow:0 3px 10px #0003;padding:.8rem 1rem;font-size:14px;color:#ddd;align-content:center;z-index:9999;width:min(100vw,256pt)}.settings_dropdown .dropdown_title{margin-bottom:.6rem;font-weight:600;font-size:1.15rem;border-bottom:1px solid #ddd;padding-bottom:.3rem}.settings_dropdown .settings_section{margin-bottom:.9rem}.settings_dropdown .settings_section h4{font-weight:600;margin-bottom:.4rem;font-size:1rem}.settings_dropdown .settings_section ul{list-style:none;margin:0;padding-left:0}.settings_dropdown .settings_section ul li{padding:.25rem .4rem;border-radius:4px;cursor:pointer;transition:background-color .15s ease;margin:8pt 0}.settings_dropdown .settings_section ul li:hover,.settings_dropdown .settings_section ul li:focus{background-color:var(--dropdown-hover-bg, #f2f2f2);outline:none}.grid_overlay_modal{display:flex;flex-direction:column;gap:.75rem;overflow-x:clip}.grid_overlay_modal .modal_description{font-size:.95rem;margin-bottom:1rem}.grid_overlay_modal .modal_options:first-of-type{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;padding-bottom:.5rem;border-bottom:1px solid #ccc}.grid_overlay_modal .modal_options:not(:first-of-type) label{flex-direction:column;align-items:flex-start;margin-top:.5rem}.grid_overlay_modal label{display:flex;align-items:center;gap:.5rem}.grid_overlay_modal label input[type=checkbox],.grid_overlay_modal label input[type=color]{width:1.5rem;height:1.5rem;flex-shrink:0;margin:0;border:none;cursor:pointer}.grid_overlay_modal label input[type=color]{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgb(118,118,118);border-radius:3px;padding:0;background-color:transparent}.grid_overlay_modal label input[type=color]::-webkit-color-swatch-wrapper{padding:0}.grid_overlay_modal label input[type=color]::-webkit-color-swatch{border:none;border-radius:3px;background-color:inherit}.grid_overlay_modal label input[type=color]::-moz-color-swatch{border:none;border-radius:3px;background-color:inherit}select,#lineWidth{width:100%}.size_of_grid{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:.75rem}.size_of_grid .input-group{display:flex;flex-direction:column;min-width:0;width:100%}.size_of_grid .input-group input[type=number]{font-size:1rem;border:1px solid #ccc;padding:.25rem}.size_of_grid .icon-wrapper{display:flex;align-items:center;justify-content:center;padding-bottom:.25rem}.size_of_grid .icon-wrapper svg{width:24px;height:24px}.modal_option select{width:100%}.modal_option:has(select){flex-direction:column;align-items:flex-start;width:100%}.fab_wrapper{position:fixed;bottom:30px;right:40px;width:80px;height:80px;overflow:visible;z-index:10}.fab_wrapper .floating_button{position:relative;width:80px;height:80px;border-radius:50%;background-color:#28183b;color:#fff;font-size:30px;border:none;box-shadow:0 4px 10px #0003;cursor:pointer;transition:background-color .3s ease;display:flex;justify-content:center;align-items:center;overflow:visible}.fab_wrapper .floating_button:hover{background-color:#7647ad}.fab_wrapper .floating_button:focus{outline:none}.fab_main_icon{height:50px;width:50px;transform:rotate(180deg);color:#d7a8e1;padding:15px}.smaller_circle{all:unset;position:absolute;top:25%;left:30%;width:47px;height:47px;border-radius:50%;background-color:#4a2277;box-shadow:0 4px 10px #0003;opacity:0;visibility:hidden;transform-origin:center center;transform:scale(0) translate(0);transition:opacity .8s ease-in-out,transform .8s ease-in-out,visibility .8s ease-in-out}.smaller_circle svg{height:28.2px;width:28.2px;color:#f4b3ff;padding:8px}.smaller_circle:hover{background-color:#7647ad}.smaller_circle:focus{outline:none}.smaller_circle:nth-child(2){--x: calc(77px*cos(300deg + -150deg * 0 / 3)) ;--y: calc(77px*sin(300deg + -150deg * 0 / 3)) }.smaller_circle:nth-child(3){--x: calc(77px*cos(300deg + -150deg * 1 / 3)) ;--y: calc(77px*sin(300deg + -150deg * 1 / 3)) }.smaller_circle:nth-child(4){--x: calc(77px*cos(300deg + -150deg * 2 / 3)) ;--y: calc(77px*sin(300deg + -150deg * 2 / 3)) }.smaller_circle:nth-child(5){--x: calc(77px*cos(300deg + -150deg * 3 / 3)) ;--y: calc(77px*sin(300deg + -150deg * 3 / 3)) }.fab_wrapper.open .smaller_circle{opacity:1;visibility:visible;transform:scale(1) translate(var(--x),var(--y));pointer-events:auto}.fab_wrapper.open .smaller_circle:nth-child(2){transition-delay:.48s}.fab_wrapper.open .smaller_circle:nth-child(3){transition-delay:.36s}.fab_wrapper.open .smaller_circle:nth-child(4){transition-delay:.24s}.fab_wrapper.open .smaller_circle:nth-child(5){transition-delay:.12s}.fab_wrapper:not(.open) .smaller_circle{opacity:0;visibility:hidden;pointer-events:none;transform:scale(0) translate(0)}.fab_wrapper:not(.open) .smaller_circle:nth-child(2){transition-delay:0s}.fab_wrapper:not(.open) .smaller_circle:nth-child(3){transition-delay:.12s}.fab_wrapper:not(.open) .smaller_circle:nth-child(4){transition-delay:.24s}.fab_wrapper:not(.open) .smaller_circle:nth-child(5){transition-delay:.36s}