.app{overflow:hidden;width:100%;height:100%;position:relative}.container{position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden}.nodes-container,.connections-container{position:absolute;top:0;left:0;width:100%;height:100%;transform-origin:top-left}.node{position:absolute;width:100px;height:100px;display:flex;align-items:flex-start;justify-content:flex-start;border-radius:8px}body{text-align:center;background-color:#fff;background:linear-gradient(0deg,#f2f1f9bf,#f2f1f9bf),url(https://www.transparenttextures.com/patterns/graphy.png);background-attachment:fixed}.ruler{position:absolute;top:0;left:0}kbd{border-radius:3px;padding:1px 2px 0;margin:1px 2px 0;font-size:.8em;background-color:#e2e2e2;border:1px solid black}html,body{-ms-overflow-style:none;scrollbar-width:none;-webkit-overflow-scrolling:touch}::-webkit-scrollbar{display:none}#canvas{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;margin:0 auto}.grid-bg{background-color:#efefefe6;background-size:100px 100px,100px 100px,10px 10px,10px 10px;background-position:-2px -2px,-2px -2px,-1px -1px,-1px -1px;background-image:linear-gradient(rgba(50,50,50,.8) 2px,transparent 2px),linear-gradient(90deg,rgba(50,50,50,.8) 2px,transparent 2px),linear-gradient(rgba(50,50,50,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(50,50,50,.5) 1px,transparent 1px)}#root{text-align:center;vertical-align:center}.guides{z-index:600}#color-picker-wrapper{flex-direction:column;justify-content:center;display:flex;gap:10px;flex:1;width:100%}#recent-colors-wrapper{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;width:100%;box-shadow:0 0 3px 1px #0006 inset;background-color:#eee;border-radius:8px;padding:10px;max-height:100px;overflow:scroll;-ms-overflow-style:none;scrollbar-width:none;margin-top:5px;margin-bottom:5px}#PaletteList{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;box-shadow:0 0 5px #0003 inset;background-color:#fff;border-radius:8px;padding:10px;width:100%}.Colors{width:100%;padding:5px}@font-face{font-family:Noto Sans Variable;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62.5% 100%;src:url(/assets/noto-sans-cyrillic-ext-wdth-normal-zQkj1eUQ.woff2) format("woff2-variations");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Noto Sans Variable;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62.5% 100%;src:url(/assets/noto-sans-cyrillic-wdth-normal-Dwi59Xcd.woff2) format("woff2-variations");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Noto Sans Variable;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62.5% 100%;src:url(/assets/noto-sans-devanagari-wdth-normal-qk_M9ieD.woff2) format("woff2-variations");unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+20F0,U+25CC,U+A830-A839,U+A8E0-A8FF,U+11B00-11B09}@font-face{font-family:Noto Sans Variable;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62.5% 100%;src:url(/assets/noto-sans-greek-ext-wdth-normal-Cxw7meSW.woff2) format("woff2-variations");unicode-range:U+1F00-1FFF}@font-face{font-family:Noto Sans Variable;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62.5% 100%;src:url(/assets/noto-sans-greek-wdth-normal-Dp_TwM2P.woff2) format("woff2-variations");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:Noto Sans Variable;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62.5% 100%;src:url(/assets/noto-sans-vietnamese-wdth-normal-_owzkeK-.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Noto Sans Variable;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62.5% 100%;src:url(/assets/noto-sans-latin-ext-wdth-normal-DdL1_Fl7.woff2) format("woff2-variations");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Noto Sans Variable;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62.5% 100%;src:url(/assets/noto-sans-latin-wdth-normal-DDg5-XUU.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}.picker{position:relative}.swatch{width:24px;height:24px;border-radius:12px;border:3px solid #fff;box-shadow:0 0 0 1px #0000001a,inset 0 0 0 1px #0000001a;cursor:pointer}.popover{display:flex;justify-content:center;align-items:center;left:0;border-radius:9px;box-shadow:0 6px 12px #00000026;z-index:999}.popover .react-colorful{width:100%;height:auto}.fv-inner,.fv-wrapper,.FiniteViewer,.fv-outer{padding:0;margin:0;position:relative;height:100%}.fv-guides.fv-horizontal{position:absolute;height:30px;left:30px;width:calc(100% - 30px)}.fv-guides.fv-vertical{position:absolute;width:30px;top:30px;height:calc(100% - 30px)}.viewer{position:absolute;top:30px;left:30px;width:calc(100% - 30px);height:calc(100% - 30px)}.viewport{position:relative;border:2px solid #ccc;width:100%;height:100%}.resetViewport{position:absolute;top:0;right:0;padding:5px;background-color:#fff;border:1px solid #ccc;border-radius:5px;cursor:pointer}