.react-resizable{position:relative}.react-resizable-handle{position:absolute;width:20px;height:20px;background-repeat:no-repeat;background-origin:content-box;box-sizing:border-box;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+);background-position:bottom right;padding:0 3px 3px 0}.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}.react-resizable-handle-w,.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-resizable-handle-n,.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}.FolderTree .CheckBox{display:inline-block;margin-right:3px}.FolderTree .TreeNode{padding:2px 0}.FolderTree .TreeNode .TreeNodeToolBar{margin-left:3px}.FolderTree .TreeNode .TreeNodeToolBar svg{padding:0 2px}.FolderTree .TreeNode .iconContainer{padding:0 2px}.FolderTree .TreeNode .iconContainer svg{padding-top:1px;vertical-align:text-top}.FolderTree .TreeNode .iconContainer:not(.typeIconContainer) svg:hover{cursor:pointer}.FolderTree .EditableName .displayName:hover{color:#4d94ff;cursor:pointer}.FolderTree .EditableName .editableNameToolbar{margin-left:3px}.FolderTree .EditableName .editableNameToolbar svg{margin:0 2px}.FolderTree .icon:hover.OKIcon{color:#5cd65c}.FolderTree .icon:hover.CancelIcon{color:#f33}.FolderTree .icon:hover.EditIcon{color:#b3f}.FolderTree .icon:hover.DeleteIcon{color:#ff66b3}.FolderTree .icon:hover.AddFileIcon,.FolderTree .icon:hover.AddFolderIcon{color:#009973}.figma-app{display:grid;grid-template-columns:1fr 1fr 2fr 1fr;height:100vh}.components-panel,.tree-panel{border-right:1px solid #ccc}.canvas-panel{background-color:#f8f8f8}.properties-panel{border-left:1px solid #ccc}.component-item{padding:8px;margin:4px 0;background-color:#fff;border:1px solid #ddd;cursor:pointer}.component-item:hover{background-color:#f0f0f0}.component-tree{padding:10px;background-color:#f0f0f0;border:1px solid #ccc;min-height:100px}.column{height:100vh;overflow-y:auto;display:flex;flex-direction:column}.figma-app{display:flex}.column.canvas{width:100%;height:100%;display:flex;flex-grow:1;flex-direction:column;overflow-y:auto}.canvas-element{width:100%;height:100%;display:block}.column.properties-panel{min-width:300px}.column.default-components{width:300px;min-width:275px;max-width:400px}.column.tree-view-column{min-width:275px;background-color:#f5f5f5}