.thumbnail[data-v-02fab50c]{width:100%;height:100%}.hamburger-button[data-v-58557520],.hamburger-button[data-v-58557520]:before,.hamburger-button[data-v-58557520]:after{border-style:solid;border-color:#fff;border-left-width:0;border-right-width:0;transition:transform .2s}.hamburger-button[data-v-58557520]:hover,.hamburger-button:hover.hamburger-button[data-v-58557520]:before,.hamburger-button:hover.hamburger-button[data-v-58557520]:after{border-color:var(--gray-200)}.hamburger-button[data-v-58557520]{cursor:pointer;transform-origin:top;border-top-width:2px;border-bottom-width:0;width:1.5rem;height:.75rem;margin-left:auto;margin-right:auto;display:inline-block;position:relative}.hamburger-button[data-v-58557520]:before,.hamburger-button[data-v-58557520]:after{content:"";width:100%;height:100%;display:block;position:absolute}.hamburger-button[data-v-58557520]:before{border-top-width:0;border-bottom-width:2px;top:calc(-1px - 50%)}.hamburger-button[data-v-58557520]:after{transform-origin:top;border-top-width:2px;border-bottom-width:0;top:100%}.hamburger-button.active[data-v-58557520]{transform:translateY(50%)rotate(45deg)}.hamburger-button.active[data-v-58557520]:before{transform:translateY(-50%)}.hamburger-button.active[data-v-58557520]:after{transform:translate(-1px,calc(1px - 100%))rotate(-90deg)}.div-gallery[data-v-267f113d]{margin:0;padding:0}.div-gallery>ul[data-v-267f113d]{flex-flow:wrap;margin:0;padding:0;list-style:none;display:flex}.div-thumbnail[data-v-267f113d]{margin:1rem;position:relative}.div-thumbnail[data-v-267f113d]:not(.new){box-shadow:2px 2px 20px #000}.div-thumbnail a[data-v-267f113d],.new-project-button[data-v-267f113d]{cursor:pointer;border-radius:.5rem;width:200px;height:200px;display:block}.div-thumbnail:not(.new) a[data-v-267f113d]{border:1px solid var(--gray-600);background-color:#d3d3d3;position:relative;overflow:hidden}.div-thumbnail a[data-v-267f113d]:hover,.new-project-button[data-v-267f113d]:hover{border-color:#bfbfbf}.div-thumbnail:not(.options-open) a[data-v-267f113d]:not(:hover):before{content:"";z-index:20;background-image:linear-gradient(#00000040,#000000bf);position:absolute;inset:0}.div-thumbnail a:hover .project-name[data-v-267f113d]{background-color:#000000bf}.div-thumbnail .actions[data-v-267f113d]{z-index:30;list-style:none;animation:.3s from-top-267f113d;position:absolute;top:3rem;right:.5rem}.div-thumbnail.options-open[data-v-267f113d]:before{content:"";z-index:30;background-image:linear-gradient(#000000a6,#000);position:absolute;inset:0}.div-thumbnail .actions>li[data-v-267f113d]{text-align:right;display:block}.div-thumbnail:not(.options-open):not(:hover) .options-toggle[data-v-267f113d]{opacity:0}.div-thumbnail .action-button[data-v-267f113d]{color:#fff;cursor:pointer;text-align:right;background:#0006;border:1px solid #fff;border-radius:.25rem;margin-bottom:.25rem;right:0}.div-thumbnail .options-toggle[data-v-267f113d]:not(:hover),.div-thumbnail:hover .action-button[data-v-267f113d]:not(:hover){opacity:.75}.delete-confirmation-modal[data-v-267f113d]{z-index:30;align-items:center;display:flex}.delete-confirmation-modal .modal[data-v-267f113d]{width:300px;margin-left:auto;margin-right:auto}.project-name[data-v-267f113d]{color:#fff;z-index:20;padding:1rem;position:absolute;bottom:0;left:0;right:0}.options-toggle[data-v-267f113d]{cursor:pointer;z-index:30;background:#00000040;border-radius:.25rem;padding:.25rem;position:absolute;top:.5rem;right:.5rem}.new-project-button[data-v-267f113d]{color:#fff;border-color:var(--gray-800);background-color:#0000;font-size:1.25rem;transition:opacity .2s}.new-project-button[data-v-267f113d]:before{content:"";background-color:var(--gray-700);background-image:linear-gradient(#0000 45%,#fff 45% 55%,#0000 55%),linear-gradient(90deg,#0000 45%,#fff 45% 55%,#0000 55%);background-position:50%,50%;background-repeat:no-repeat;background-size:60% 60%,60% 60%;border-radius:50%;width:2rem;height:2rem;margin:0 auto 1rem;padding:0;transition:transform .2s;display:block}.new-project-button[data-v-267f113d]:hover:before{transform:scale(1.25)}@keyframes from-top-267f113d{0%{opacity:0;transform:translateY(-100%)}}.canvas[data-v-c961c9b9]{width:100%;height:100%}.overlay[data-v-6266e5c0]{position:absolute}.overlay[data-v-6266e5c0]:hover:not(.selected){--stripe-color-dark:#0000ff80;--stripe-color-bright:#ffffff40;background-image:linear-gradient(135deg, var(--stripe-color-bright) 24.5%, var(--stripe-color-dark) 24.5%, var(--stripe-color-dark) 25.5%, var(--stripe-color-bright) 25.5%, var(--stripe-color-bright) 74.5%, var(--stripe-color-dark) 74.5%, var(--stripe-color-dark) 75.5%, var(--stripe-color-bright) 75.5%);background-repeat:repeat;background-size:3px 3px}.overlay.selected[data-v-6266e5c0]{z-index:10}.overlays-wrapper[data-v-d3b3941d]{height:100%;margin:0;position:fixed;top:0;left:0;right:0}.overlays[data-v-d3b3941d]{background-color:#0000!important}.overlays[data-v-d3b3941d],.overlays--main[data-v-d3b3941d],.overlays--before[data-v-d3b3941d],.overlays--after[data-v-d3b3941d]{pointer-events:none}.overlay[data-v-d3b3941d]{pointer-events:all}.handle[data-v-b97475eb]{border:1px solid var(--gray-400);pointer-events:all;background-color:#fff;width:8px;height:8px;position:absolute;top:-4px;left:-4px}.top-left[data-v-b97475eb]{cursor:nwse-resize}.top[data-v-b97475eb]{cursor:ns-resize}.top-right[data-v-b97475eb]{cursor:nesw-resize}.right[data-v-b97475eb]{cursor:ew-resize}.bottom-right[data-v-b97475eb]{cursor:nwse-resize}.bottom[data-v-b97475eb]{cursor:ns-resize}.bottom-left[data-v-b97475eb]{cursor:nesw-resize}.left[data-v-b97475eb]{cursor:ew-resize}.shape-handles-wrapper[data-v-81d3727f]{pointer-events:none;position:fixed;inset:0;overflow:hidden}.workspace[data-v-54fac408],pinch-zoom[data-v-54fac408]{height:100%}.workspace[data-v-54fac408]{background-color:var(--panel-border-color);margin-left:var(--layers-width);margin-right:var(--shape-form-width)}.workspace.adding-shape[data-v-54fac408]{cursor:crosshair}.fake-focus[data-v-54fac408]{z-index:-1;position:absolute}.pinch-zoom-wrapper[data-v-54fac408]{width:100%;height:100%}.full-wrapper[data-v-54fac408]{position:absolute;inset:0}.overlays[data-v-54fac408]{width:100%;height:100%;position:absolute;top:0;left:0}.reset-zoom[data-v-54fac408]{text-align:right;background-color:#ebebeb80;border-radius:.25rem;padding:.5rem;position:absolute;top:10px;right:210px}.reset-zoom .zoom-value[data-v-54fac408]{text-align:left;margin:0 0 .25rem;font-size:.75rem}.workspace:not(.adding-shape) .overlay[data-v-54fac408]:not(.selected):hover{border:1px solid #bae3f7}.root[data-v-aa70885a]{font-size:0}.root[data-v-aa70885a]>*{font-size:.75rem}.shape-name[data-v-aa70885a]{padding-top:.25rem;padding-bottom:.25rem;display:inline-block}span.shape-name[data-v-aa70885a]{white-space:nowrap;text-overflow:ellipsis;cursor:default;border:1px solid #0000;display:inline-block;overflow:hidden}input[data-v-aa70885a]{border:1px solid var(--gray-300);border-radius:.25rem;margin-left:-.25rem}.draggable-indicator[data-v-554b56b5]{cursor:grab;width:1rem;height:.75rem;margin-left:-.25rem;margin-right:.25rem;display:inline-block}.draggable-indicator[data-v-554b56b5]:after{content:"";border-top:1px solid var(--gray-400);border-bottom:1px solid var(--gray-400);width:.5rem;height:.25rem;margin:.25rem;display:block}.list-node.selected .draggable-indicator[data-v-554b56b5]:after{border-top-color:#fff;border-bottom-color:#fff}ul[data-v-554b56b5]{padding:0;list-style:none}.list-node[data-v-554b56b5]{padding-left:.5rem}.shape.list-node[data-v-554b56b5]{background-color:var(--panel-bg-color);border-color:var(--panel-border-color);box-sizing:border-box;width:100%;color:var(--gray-700);flex-direction:row;align-items:center;padding-top:.25rem;padding-bottom:.25rem;padding-right:.25rem;display:flex}.shape.list-node label[data-v-554b56b5]{text-overflow:ellipsis;white-space:nowrap;width:100%;display:block;overflow:hidden}.shape.list-node.dragging[data-v-554b56b5],.shape.list-node.dragging label[data-v-554b56b5],.shape.list-node.dragging .draggable-indicator[data-v-554b56b5]{cursor:grabbing}.shape.list-node[data-v-554b56b5]:not(.dragging){transition:transform .1s}.shape.list-node:not(.selected) label[data-v-554b56b5]{color:var(--gray-700)}.list-node[data-v-554b56b5]:last-child{border-bottom-color:var(--panel-border-color-strong)}li li[data-v-554b56b5]{padding-left:.5rem}.layer:not(.active) label[data-v-554b56b5]{opacity:.35}.root-node[data-v-554b56b5]{flex-direction:row;padding-right:.5rem;display:flex}.root-node .checkbox[data-v-554b56b5]{text-align:right;flex-grow:1}.shapes>.selected[data-v-554b56b5],.layer.selected .root-node[data-v-554b56b5]{background-color:var(--selected-color);color:#fff}.shape-name[data-v-554b56b5]{width:7.5rem}.shape.moved-down[data-v-554b56b5]{animation:.15s moveDown-554b56b5}.shape.moved-up[data-v-554b56b5]{animation:.15s moveUp-554b56b5}@keyframes moveDown-554b56b5{0%{transform:translateY(-100%)}}@keyframes moveUp-554b56b5{0%{transform:translateY(100%)}}.layer:not(.active) .shape-name{opacity:.35}.shape-name{width:6.5rem}.layers[data-v-6403d025]{background-color:var(--panel-bg-color);width:var(--layers-width);border-right:1px solid var(--panel-border-color);margin:0;padding-left:0;overflow-y:auto}ul[data-v-6403d025]{list-style:none}.code-editor[data-v-b4493bb1]{width:100%;height:100%;font-size:.75rem}.code-editor-extra-styles .CodeMirror{height:auto}button[data-v-c4ec145d]{background-color:var(--gray-400);border:0;position:relative}button[data-v-c4ec145d]:hover{background-color:var(--gray-500)}button[data-v-c4ec145d]:before{content:"";background-image:linear-gradient(#0000 40%,#fff 40% 60%,#0000 60%),linear-gradient(90deg,#0000 40%,#fff 40% 60%,#0000 60%);background-position:50%,50%;background-repeat:no-repeat;background-size:60% 60%,60% 60%;width:100%;height:100%;display:block;position:relative;top:0;left:0;transform:rotate(45deg)}a[data-v-703f6379]{--side:1rem;--gray:var(--gray-500);width:var(--side);height:var(--side);cursor:pointer;background-color:#fff;padding:0;display:block;position:absolute;top:0;right:0}a[data-v-703f6379]:hover{background-color:var(--gray-100);border-color:var(--gray-800)}a[data-v-703f6379]:before{--gray:var(--gray-600);content:"";background-image:linear-gradient(transparent 40%, var(--gray) 40%, var(--gray) 60%, transparent 60%), linear-gradient(to right, transparent 40%, var(--gray) 40%, var(--gray) 60%, transparent 60%);width:60%;height:60%;display:block;position:absolute;top:20%;left:20%;transform:rotate(45deg)}a[data-v-703f6379]:not(:hover):before{opacity:.6}.color-picker[data-v-9f9ffebc]{--side:1.5rem;height:var(--side);flex-direction:row;display:flex;position:relative}.color-picker[data-v-9f9ffebc]>*{height:100%}input[type=text][data-v-9f9ffebc]{box-sizing:border-box;border:1px solid #d3d3d3;border-right:0;width:15ch;display:inline-block}.sample[data-v-9f9ffebc]{width:var(--side);box-sizing:border-box;border:1px solid #d3d3d3;height:100%;display:inline-block}input[type=color][data-v-9f9ffebc]{opacity:0;border:0;width:100%;height:100%;padding:0}.color-modal[data-v-9f9ffebc]{z-index:20;position:fixed;top:0;left:0;right:0;overflow:visible}.color-modal.dragging[data-v-9f9ffebc]{bottom:0}.color-modal .picker-container[data-v-9f9ffebc]{margin:0 auto;position:absolute}.color-picker.anchor-bottom-right .color-modal[data-v-9f9ffebc]{bottom:0;right:calc(100% + 1rem)}.color-picker.active input[data-v-9f9ffebc],.color-picker.active .sample[data-v-9f9ffebc]{border-color:var(--selected-color);box-shadow:0 0 5px var(--selected-color)}.picker-container[data-v-9f9ffebc]{box-shadow:0 0 2px #0000004d,0 4px 8px #0000004d}.top-bar[data-v-9f9ffebc]{background-color:#fff;height:1rem}.picker-container .vc-chrome[data-v-9f9ffebc]{box-shadow:none}.stop[data-v-7f12e747]{border-color:var(--panel-border-color);border-style:solid;border-width:1px 0;margin-top:-1px}.list-node[data-v-7f12e747]{padding-bottom:0}.stops[data-v-7f12e747]{margin:.25rem 0 0;padding:0;list-style:none}.stop .color-picker[data-v-7f12e747]{flex-grow:1}.remove-stop[data-v-7f12e747]{box-sizing:border-box;opacity:0;border-radius:50%;width:1rem;height:1rem;min-height:0;margin-left:.5rem;padding:0}.stop[data-v-7f12e747],.add-new[data-v-7f12e747]{background-color:var(--panel-bg-color)}.stop[data-v-7f12e747]{flex-direction:row;align-items:center;padding:.375rem .5rem;display:flex}.stop:hover .remove-stop[data-v-7f12e747]{opacity:1}.add-new[data-v-7f12e747]{padding:.5rem 0}li.dragging[data-v-7f12e747],li.dragging[data-v-7f12e747] *{cursor:grabbing}li[data-v-7f12e747]:not(.dragging){transition:transform .1s}li.moved-down[data-v-7f12e747]{animation:.15s moveDown-7f12e747}li.moved-up[data-v-7f12e747]{animation:.15s moveUp-7f12e747}@keyframes moveDown-7f12e747{0%{transform:translateY(-100%)}}@keyframes moveUp-7f12e747{0%{transform:translateY(100%)}}.stop .color-picker input[type=text]{width:7ch}.stop .color-picker+input[type=text]{width:8ch}.wrapper{box-sizing:border-box;flex-direction:row;justify-content:space-between;width:100%;padding:.25rem 0;display:flex}.shape-props-form .list-node .row{padding-left:1rem;padding-right:1rem}.form .label,.form .units{flex-direction:row;align-items:center;display:flex}.form .label{flex-grow:1}.form .units{margin-left:.5ch}form[data-v-646cd4b7]{background-color:var(--panel-bg-color);width:var(--shape-form-width);border-left:1px solid var(--panel-border-color);height:100%;margin:0;padding-right:0;overflow:visible auto}.current-color-picker[data-v-78cceb4a]{--side:1.75rem;box-sizing:border-box;padding-top:.25rem;padding-bottom:.25rem}button[data-v-74dd61f0]{border-color:var(--panel-border-color-strong);border-radius:2px;align-items:center;width:2rem;height:2rem;margin:2px;padding:0;font-size:0}button[data-v-74dd61f0]:not(.disabled):hover{border-color:var(--panel-border-color-stronger);background-color:#f7f7f7}.icon[data-v-74dd61f0]{width:71%;height:80%;margin:0 auto}button.disabled[data-v-74dd61f0]{cursor:default}button.disabled .icon[data-v-74dd61f0]{opacity:.5}button[data-v-ad7a8de0]{border-color:var(--panel-border-color-strong);border-radius:2px;width:2rem;height:2rem;margin:2px}button[data-v-ad7a8de0]:not(.disabled):hover{border-color:var(--panel-border-color-stronger);background-color:#f7f7f7}section[data-v-43fc5767]{flex-direction:column;display:inline-flex;position:relative}.other-shapes[data-v-43fc5767]{position:absolute;top:100%}.other-shapes button[data-v-43fc5767]{display:block}section:not(:hover) .other-shapes[data-v-43fc5767]{opacity:0;pointer-events:none}button.selected[data-v-43fc5767]{box-shadow:0 0 2px 2px var(--selected-color)}label[data-v-a8ece36a]{flex-direction:colum;align-items:center;margin-right:.25rem;display:flex}input.inactive[data-v-a8ece36a]{pointer-events:none;color:#d3d3d3}.units[data-v-a8ece36a]{margin-left:.25em}button[data-v-5f3eb333]{border-color:var(--panel-border-color-strong);border-radius:2px;align-items:center;width:2rem;height:2rem;margin:2px;padding:0;font-size:0}button[data-v-5f3eb333]:not(.disabled):hover{border-color:var(--panel-border-color-stronger);background-color:#f7f7f7}.icon[data-v-5f3eb333]{width:71%;height:80%;margin:0 auto}button.disabled[data-v-5f3eb333]{cursor:default}button.disabled .icon[data-v-5f3eb333]{opacity:.5}.toolbar[data-v-ff6bf76f]{border-style:solid;border-width:1px 0;border-color:var(--panel-border-color);background-color:var(--panel-bg-color);flex-flow:wrap;justify-content:space-between;padding:.25rem 1rem;font-size:.75rem;display:flex}section button[data-v-ff6bf76f]:first-child{margin-left:0}section button[data-v-ff6bf76f]:last-child{margin-right:0}.toolbar>section[data-v-ff6bf76f]:not(.input)>*{height:100%}.toolbar>section.input[data-v-ff6bf76f]{align-items:center;display:flex}.toolbar>section[data-v-ff6bf76f]:first-child>*,.toolbar>section[data-v-ff6bf76f]:last-child>*{flex-direction:row;align-items:center;height:100%;display:flex}.toolbar section.right section[data-v-ff6bf76f]:not(:first-child){margin-left:.75rem}.toolbar section.right section[data-v-ff6bf76f]:not(:last-child){margin-right:.75rem}.editor[data-v-c969cd2f]{--layers-width:160px;--shape-form-width:200px;flex-direction:column;display:flex}.toolbar[data-v-c969cd2f]{z-index:10}.toolbar+div[data-v-c969cd2f]{flex-grow:1;position:relative}.layers[data-v-c969cd2f],.canvas[data-v-c969cd2f],.props[data-v-c969cd2f]{position:absolute;top:0;bottom:0}.layers[data-v-c969cd2f],.canvas[data-v-c969cd2f]{left:0}.canvas[data-v-c969cd2f],.props[data-v-c969cd2f]{right:0}dl[data-v-221765b3]{max-width:800px;margin:0 auto;padding:0 2rem 2rem;line-height:1.5}dt[data-v-221765b3]{margin:2rem 0 .5rem;font-weight:700}dd[data-v-221765b3]{margin-left:0}button[type=submit][data-v-0ce39f23]{color:#fff;cursor:pointer;background-color:#857099;border:0;border-radius:.25rem;flex-direction:row;align-items:center;padding:.125rem .65rem .125rem .5rem;font-size:.75rem;display:flex}.codepen-icon[data-v-0ce39f23]{width:24px;height:23px;margin-right:.5rem;display:inline-block;transform:scale(.75)}button[type=submit][data-v-0ce39f23]:hover{background-color:#6c5185}.modal-container[data-v-044cefa4]{z-index:20;overflow-y:auto}.output[data-v-044cefa4]{flex-direction:column;max-height:calc(100% - 200px);margin-top:100px;margin-left:50px;margin-right:50px;display:flex}.output .tabs[data-v-044cefa4]{flex-grow:1}.output .tabs a[data-v-044cefa4]{color:var(--gray-700);border-bottom:.25rem solid #0000;padding:.75rem .75rem .5rem;text-decoration:none;display:inline-block}.output .tabs a.router-link-active[data-v-044cefa4]{color:var(--selected-color);border-bottom-color:var(--selected-color)}.output .tabs a[data-v-044cefa4]:hover{background-color:#f7f7f7}.output pre[data-v-044cefa4]{background-color:#ecf4f9;margin:0;padding-top:.5rem;padding-left:1rem;padding-right:1rem;font-family:Courier New,Courier,monospace;font-size:.75rem;overflow-y:auto}.output-code{position:relative}.code-editor{white-space:pre-wrap;word-wrap:break-word;margin:0;font-size:.75rem;overflow-x:auto}.code-editor .cm-content{flex-shrink:initial;width:0}.code-editor .cm-line{white-space:pre-wrap}button.copy-output-to-clipboard{z-index:10;position:absolute;top:.5rem;right:1rem}button[data-v-9cf5ba53]{background-color:var(--gray-750);border:0;min-width:27px;min-height:2rem;font-size:0}button[data-v-9cf5ba53]:hover{background-color:var(--gray-900)}nav[data-v-b326a917]{flex-direction:row;justify-content:space-between;transition:background-color .3s;display:flex}nav.at-root[data-v-b326a917]{z-index:30;position:sticky;top:0}nav[data-v-b326a917]>*{display:inline-block}.breadcrumbs[data-v-b326a917]>*{padding-left:.25rem;padding-right:.25rem;display:inline-block}.link-to-home[data-v-b326a917]{text-decoration:none}.link-to-home[data-v-b326a917],.about-link[data-v-b326a917]{padding-top:.75rem;padding-bottom:.75rem;padding-left:1rem}.about-link[data-v-b326a917]{padding-right:1rem}span[data-v-b326a917]{color:var(--gray-700)}nav>button[data-v-b326a917]{cursor:pointer;border-radius:6px;margin:.45rem 1rem}input[data-v-b326a917]{color:var(--gray-900);border-width:1px;border-color:var(--gray-400);border-style:solid;border-radius:.25rem;width:20ch;padding:.25rem;font-size:1rem}input[data-v-b326a917]:not(:hover){border-color:#0000}.secondary[data-v-b326a917]{border-bottom:4px solid #0000}.secondary.router-link-active[data-v-b326a917]{border-color:#00ffb8}body{--brightness-300:36%;--brightness-400:43%;--brightness-500:59%;--brightness-600:70%;--brightness-650:76%;--brightness-700:82%;--brightness-750:85%;--brightness-800:88%;--brightness-850:93%;--brightness-900:96%;--brightness-950:98%;--panel-bg-color:hsla(0, 0%, calc(var(--brightness-900)), .75);--panel-child-bg-color:hsla(0, 0%, calc(var(--brightness-800)), 1);--panel-border-color:hsl(0, 0%, calc(var(--brightness-800)));--panel-child-border-color:hsla(0, 0%, calc(var(--brightness-650)), .75);--panel-border-color-strong:#c7c7c7;--panel-border-color-stronger:#b3b3b3;--gray-50:#fafafa;--gray-100:#f5f5f5;--gray-200:#eee;--gray-300:#e0e0e0;--gray-350:#f1f1f1;--gray-400:#bdbdbd;--gray-500:#9e9e9e;--gray-600:#757575;--gray-700:#616161;--gray-800:#424242;--gray-900:#212121;--selected-color:#5784ff;--selected-color-strong:#3369ff}#app,input,textarea{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}html,body{margin:0}#app{flex-direction:column;height:100vh;display:flex}#app .editor{flex-grow:1}#app.at-root{height:100%}#app.at-root>nav{background-color:var(--gray-900);color:#fff}#app.at-root>nav a,#app.at-root>nav a:link,#app.at-root>nav a:hover,#app.at-root>nav a:visited{color:#fff;text-decoration:none}#app.at-root>nav a.secondary:not(.router-link-active):not(:hover),#app.at-root>nav a.secondary:link:not(.router-link-active):not(:hover),#app.at-root>nav a.secondary:visited:not(.router-link-active):not(:hover){color:var(--gray-500)}.panel{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.list-node{border-bottom:1px solid var(--panel-border-color);padding:.5rem 0;font-size:.75rem}input[type=text],input[type=number]{padding:.125rem .25rem;font-size:.75rem}input[type=text].w-xs,input[type=number].w-xs{width:3ch}input[type=text].w-s,input[type=number].w-s{width:4ch}input[type=text].w-m,input[type=number].w-m{width:10ch}input[type=text].w-l,input[type=number].w-l{width:12ch}select.w-l{width:calc(12ch + .5rem)}.modal-container{position:fixed;inset:0}.modal .actions>*{margin-left:.5rem;margin-right:.5rem}.modal .main{background-color:#fff;padding:.5rem}.modal-overlay{content:"";z-index:-20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#00000040;position:fixed;inset:0}.modal .actions{border-bottom:1px solid var(--panel-border-color);background:#fff;flex-direction:row;align-items:center;padding-left:.5rem;padding-right:.5rem;display:flex}.modal .actions-bottom{border-top:1px solid var(--gray-200);justify-content:flex-end;padding-top:.5rem;padding-bottom:.5rem;display:flex}.modal .header{background:#fff;margin:0;padding:1rem .5rem 0;font-size:1rem;font-weight:400}.modal .main{font-size:.75rem}button,.button{cursor:pointer;background-color:#fff;border-radius:.25rem;min-height:27px}.main-action{background-color:var(--selected-color);color:#fff}.main-action:hover{background-color:var(--selected-color-strong)}.m-l-s{margin-left:.5rem}.p-h-m{padding-left:1rem;padding-right:1rem}.p-t-s{padding-top:.5rem}button{border-style:solid;border-width:1px;border-color:var(--gray-500) var(--gray-500) var(--gray-600);font-size:.75rem}button:hover{background-color:var(--gray-200);text-decoration:none}