feat(styles): one stylesheet source for react and svelte (#3350)

* feat(styles): create stylesheets for react and svelte based on one source

* refactor(styling): cleanup

* refactor(postcss): share a config

* refactor(postcss): replace env hack with env file

packages/react/src/styles/style.css

@@ -1,110 +1,4 @@
 /* this gets exported as style.css and can be used for the default theming */
-@import './init.css';
-@import './node-resizer.css';
-
-.react-flow__edge {
-  &.updating {
-    .react-flow__edge-path {
-      stroke: #777;
-    }
-  }
-
-  &-text {
-    font-size: 10px;
-  }
-}
-
-.react-flow__node.selectable {
-  &:focus,
-  &:focus-visible {
-    outline: none;
-  }
-}
-
-.react-flow__node-default,
-.react-flow__node-input,
-.react-flow__node-output,
-.react-flow__node-group {
-  padding: 10px;
-  border-radius: 3px;
-  width: 150px;
-  font-size: 12px;
-  color: #222;
-  text-align: center;
-  border-width: 1px;
-  border-style: solid;
-  border-color: #1a192b;
-  background-color: white;
-
-  &.selectable {
-    &:hover {
-      box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.08);
-    }
-
-    &.selected,
-    &:focus,
-    &:focus-visible {
-      box-shadow: 0 0 0 0.5px #1a192b;
-    }
-  }
-}
-
-.react-flow__node-group {
-  background-color: rgba(240, 240, 240, 0.25);
-}
-
-.react-flow__nodesselection-rect,
-.react-flow__selection {
-  background: rgba(0, 89, 220, 0.08);
-  border: 1px dotted rgba(0, 89, 220, 0.8);
-
-  &:focus,
-  &:focus-visible {
-    outline: none;
-  }
-}
-
-.react-flow__handle {
-  width: 6px;
-  height: 6px;
-  background: #1a192b;
-  border: 1px solid white;
-  border-radius: 100%;
-}
-
-.react-flow__controls {
-  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.08);
-
-  &-button {
-    border: none;
-    background: #fefefe;
-    border-bottom: 1px solid #eee;
-    box-sizing: content-box;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 16px;
-    height: 16px;
-    cursor: pointer;
-    user-select: none;
-    padding: 5px;
-
-    &:hover {
-      background: #f4f4f4;
-    }
-
-    svg {
-      width: 100%;
-      max-width: 12px;
-      max-height: 12px;
-    }
-
-    &:disabled {
-      pointer-events: none;
-
-      svg {
-        fill-opacity: 0.4;
-      }
-    }
-  }
-}
+@import '../../../system/src/styles/init.css';
+@import '../../../system/src/styles/style.css';
+@import '../../../system/src/styles/node-resizer.css';