@mercury-fx/ui 2.4.0

package/src/styles/index.css

@@ -0,0 +1,5 @@
+/* Mercury UI — single stylesheet entry. Tokens first, then components. */
+@import "./tokens.css";
+@import "./mercury.css";
+@import "./additions.css";
+@import "./layout.css";

package/src/styles/layout.css

@@ -0,0 +1,55 @@
+/* mx.8.3 — Layout composition tier (Wave A). STRUCTURAL rules only; every spacing,
+   colour, radius, and alignment VALUE is an inline token var set by the component
+   props (the AspectRatio non-color-inline idiom). No new token, no hex. */
+
+.mx-stack {
+  display: flex;
+  flex-direction: column;
+}
+
+.mx-flex {
+  display: flex;
+}
+
+.mx-grid {
+  display: grid;
+}
+
+.mx-container {
+  width: 100%;
+}
+
+.mx-spacer {
+  flex: 1 1 0%;
+}
+
+/* .mx-box — a styled block; padding/surface/radius/border/shadow are inline props.
+   No base structural rule (a Box with no props is a plain div). */
+
+/* mx.8.4 — Layout composition tier (Wave B, the 5 composites). Structural only;
+   placement/spacing VALUES are inline token vars set by props. */
+
+/* .mx-grid-item — placement (span/start) is inline; no base rule (like .mx-box). */
+
+.mx-center {
+  display: grid;
+  place-items: center;
+}
+
+.mx-sidebar {
+  display: flex;
+}
+.mx-sidebar-main {
+  flex: 1 1 0%;
+  min-width: 0;
+}
+
+.mx-cluster {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.mx-section {
+  display: flex;
+  flex-direction: column;
+}