layout-style-css 2.1.0 → 2.1.1

package/dist/personalities/bauhaus.css

@@ -16,14 +16,22 @@
   }
 
   /* Cap the fallback rail until the wider personality template is eligible. */
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
     :where(.ly-root[data-ly-layout="bauhaus"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-columns: minmax(min(100%, 14rem), 0.3fr) minmax(0, 1fr);
     }
   }
 
-  @container ly-personality (min-width: 52rem) {
+  @container (min-width: 52rem) {
+    :where(.ly-root[data-ly-layout="bauhaus"]) .ly-grid > :nth-child(3n + 1) {
+      grid-column: span 2;
+      grid-row: span 2;
+    }
+  }
+
+  /* The four-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="bauhaus"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -37,10 +45,5 @@
         minmax(0, 1.3fr)
         minmax(min(100%, 18rem), 0.3fr);
     }
-
-    :where(.ly-root[data-ly-layout="bauhaus"]) .ly-grid > :nth-child(3n + 1) {
-      grid-column: span 2;
-      grid-row: span 2;
-    }
   }
 }

package/dist/personalities/bento.css

@@ -14,7 +14,21 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
+    :where(.ly-root[data-ly-layout="bento"]) .ly-grid > :nth-child(6n + 1) {
+      grid-column: span 2;
+      grid-row: span 2;
+    }
+
+    :where(.ly-root[data-ly-layout="bento"])
+      :where(.ly-card-grid, [data-ly-recipe="card-grid"])
+      > :nth-child(6n + 1) {
+      grid-column: span 2;
+    }
+  }
+
+  /* The three-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="bento"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -28,16 +42,5 @@
         minmax(0, 1fr)
         minmax(0, 1fr);
     }
-
-    :where(.ly-root[data-ly-layout="bento"]) .ly-grid > :nth-child(6n + 1) {
-      grid-column: span 2;
-      grid-row: span 2;
-    }
-
-    :where(.ly-root[data-ly-layout="bento"])
-      :where(.ly-card-grid, [data-ly-recipe="card-grid"])
-      > :nth-child(6n + 1) {
-      grid-column: span 2;
-    }
   }
 }

package/dist/personalities/brutalism.css

@@ -15,7 +15,14 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
+    :where(.ly-root[data-ly-layout="brutalism"]) .ly-grid > :nth-child(3n) {
+      grid-column: span 2;
+    }
+  }
+
+  /* The three-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="brutalism"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -28,9 +35,5 @@
         minmax(min(100%, 16rem), 0.7fr)
         minmax(min(100%, 18rem), 0.34fr);
     }
-
-    :where(.ly-root[data-ly-layout="brutalism"]) .ly-grid > :nth-child(3n) {
-      grid-column: span 2;
-    }
   }
 }

package/dist/personalities/cyberpunk.css

@@ -15,7 +15,14 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 44rem) {
+  @container (min-width: 44rem) {
+    :where(.ly-root[data-ly-layout="cyberpunk"]) .ly-grid > :nth-child(4n + 2) {
+      grid-column: span 3;
+    }
+  }
+
+  /* The three-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="cyberpunk"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -28,9 +35,5 @@
         minmax(0, 1fr)
         minmax(min(100%, 19rem), 0.32fr);
     }
-
-    :where(.ly-root[data-ly-layout="cyberpunk"]) .ly-grid > :nth-child(4n + 2) {
-      grid-column: span 3;
-    }
   }
 }

package/dist/personalities/f-pattern.css

@@ -15,14 +15,26 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
     :where(.ly-root[data-ly-layout="f-pattern"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-columns: minmax(min(100%, 16rem), 0.3fr) minmax(0, 1fr);
     }
   }
 
-  @container ly-personality (min-width: 56rem) {
+  @container (min-width: 56rem) {
+    :where(.ly-root[data-ly-layout="f-pattern"]) .ly-grid > :nth-child(3n + 1) {
+      grid-column: span 2;
+    }
+
+    :where(.ly-root[data-ly-layout="f-pattern"])
+      :where(.ly-split-hero, [data-ly-recipe="split-hero"]) {
+      grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.65fr);
+    }
+  }
+
+  /* The three-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="f-pattern"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -35,14 +47,5 @@
         minmax(0, 1.35fr)
         minmax(min(100%, 18rem), 0.65fr);
     }
-
-    :where(.ly-root[data-ly-layout="f-pattern"]) .ly-grid > :nth-child(3n + 1) {
-      grid-column: span 2;
-    }
-
-    :where(.ly-root[data-ly-layout="f-pattern"])
-      :where(.ly-split-hero, [data-ly-recipe="split-hero"]) {
-      grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.65fr);
-    }
   }
 }

package/dist/personalities/maximalist.css

@@ -14,14 +14,29 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
     :where(.ly-root[data-ly-layout="maximalist"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-columns: minmax(min(100%, 18rem), 0.3fr) minmax(0, 1fr);
     }
   }
 
-  @container ly-personality (min-width: 56rem) {
+  @container (min-width: 56rem) {
+    :where(.ly-root[data-ly-layout="maximalist"]) .ly-grid > :nth-child(7n + 1) {
+      grid-column: span 3;
+      grid-row: span 2;
+    }
+
+    :where(.ly-root[data-ly-layout="maximalist"])
+      :where(.ly-gallery, [data-ly-recipe="gallery"])
+      > :nth-child(5n + 1) {
+      grid-column: span 2;
+      grid-row: span 2;
+    }
+  }
+
+  /* The four-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="maximalist"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -35,17 +50,5 @@
         minmax(min(100%, 15rem), 0.32fr)
         minmax(min(100%, 18rem), 0.38fr);
     }
-
-    :where(.ly-root[data-ly-layout="maximalist"]) .ly-grid > :nth-child(7n + 1) {
-      grid-column: span 3;
-      grid-row: span 2;
-    }
-
-    :where(.ly-root[data-ly-layout="maximalist"])
-      :where(.ly-gallery, [data-ly-recipe="gallery"])
-      > :nth-child(5n + 1) {
-      grid-column: span 2;
-      grid-row: span 2;
-    }
   }
 }

package/dist/personalities/minimal-saas.css

@@ -15,8 +15,14 @@
     min-inline-size: 0;
   }
 
-  /* Named areas rearrange the shell without changing its mobile DOM or focus order. */
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
+    :where(.ly-root[data-ly-layout="minimal-saas"]) .ly-grid > :nth-child(4n + 1) {
+      grid-column: span 2;
+    }
+  }
+
+  /* The three-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="minimal-saas"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -29,9 +35,5 @@
         minmax(0, 1fr)
         minmax(min(100%, 16rem), 0.28fr);
     }
-
-    :where(.ly-root[data-ly-layout="minimal-saas"]) .ly-grid > :nth-child(4n + 1) {
-      grid-column: span 2;
-    }
   }
 }

package/dist/personalities/mondrian.css

@@ -15,14 +15,22 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
     :where(.ly-root[data-ly-layout="mondrian"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-columns: minmax(min(100%, 13rem), 0.3fr) minmax(0, 1fr);
     }
   }
 
-  @container ly-personality (min-width: 52rem) {
+  @container (min-width: 52rem) {
+    :where(.ly-root[data-ly-layout="mondrian"]) .ly-grid > :nth-child(5n + 1) {
+      grid-column: span 2;
+      grid-row: span 2;
+    }
+  }
+
+  /* The three-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="mondrian"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -35,10 +43,5 @@
         minmax(0, 1.45fr)
         minmax(min(100%, 18rem), 0.55fr);
     }
-
-    :where(.ly-root[data-ly-layout="mondrian"]) .ly-grid > :nth-child(5n + 1) {
-      grid-column: span 2;
-      grid-row: span 2;
-    }
   }
 }

package/dist/personalities/neumorphism.css

@@ -15,14 +15,14 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
     :where(.ly-root[data-ly-layout="neumorphism"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-columns: minmax(min(100%, 17rem), 0.3fr) minmax(0, 1fr);
     }
   }
 
-  @container ly-personality (min-width: 52rem) {
+  @container (min-width: 52rem) {
     :where(.ly-root[data-ly-layout="neumorphism"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:

package/dist/personalities/retro-glass.css

@@ -15,14 +15,22 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
     :where(.ly-root[data-ly-layout="retro-glass"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-columns: minmax(min(100%, 18rem), 0.3fr) minmax(0, 1fr);
     }
   }
 
-  @container ly-personality (min-width: 56rem) {
+  @container (min-width: 56rem) {
+    :where(.ly-root[data-ly-layout="retro-glass"]) .ly-grid > :nth-child(4n) {
+      grid-column: span 2;
+      grid-row: span 2;
+    }
+  }
+
+  /* The three-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="retro-glass"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -35,10 +43,5 @@
         minmax(0, 0.75fr)
         minmax(min(100%, 18rem), 0.32fr);
     }
-
-    :where(.ly-root[data-ly-layout="retro-glass"]) .ly-grid > :nth-child(4n) {
-      grid-column: span 2;
-      grid-row: span 2;
-    }
   }
 }

package/dist/personalities/retrofuturism.css

@@ -15,7 +15,14 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
+    :where(.ly-root[data-ly-layout="retrofuturism"]) .ly-grid > :nth-child(6n + 1) {
+      grid-column: span 2;
+    }
+  }
+
+  /* The three-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="retrofuturism"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -28,9 +35,5 @@
         minmax(0, 1fr)
         minmax(min(100%, 17rem), 0.3fr);
     }
-
-    :where(.ly-root[data-ly-layout="retrofuturism"]) .ly-grid > :nth-child(6n + 1) {
-      grid-column: span 2;
-    }
   }
 }

package/dist/personalities/split-screen.css

@@ -15,7 +15,7 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
     :where(.ly-root[data-ly-layout="split-screen"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:

package/dist/personalities/synthwave.css

@@ -16,14 +16,14 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
     :where(.ly-root[data-ly-layout="synthwave"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-columns: minmax(min(100%, 16rem), 0.3fr) minmax(0, 1fr);
     }
   }
 
-  @container ly-personality (min-width: 64rem) {
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="synthwave"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:

package/dist/personalities/tactile.css

@@ -15,7 +15,7 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
     :where(.ly-root[data-ly-layout="tactile"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:

package/dist/personalities/y2k.css

@@ -15,7 +15,14 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
+    :where(.ly-root[data-ly-layout="y2k"]) .ly-grid > :nth-child(5n + 1) {
+      grid-column: span 3;
+    }
+  }
+
+  /* The three-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="y2k"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -28,9 +35,5 @@
         minmax(0, 1fr)
         minmax(min(100%, 16rem), 0.28fr);
     }
-
-    :where(.ly-root[data-ly-layout="y2k"]) .ly-grid > :nth-child(5n + 1) {
-      grid-column: span 3;
-    }
   }
 }

package/dist/personalities/z-pattern.css

@@ -15,14 +15,27 @@
     min-inline-size: 0;
   }
 
-  @container ly-personality (min-width: 48rem) {
+  @container (min-width: 48rem) {
     :where(.ly-root[data-ly-layout="z-pattern"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-columns: minmax(min(100%, 17rem), 0.3fr) minmax(0, 1fr);
     }
   }
 
-  @container ly-personality (min-width: 60rem) {
+  @container (min-width: 60rem) {
+    :where(.ly-root[data-ly-layout="z-pattern"]) .ly-grid > :nth-child(4n + 2) {
+      grid-column: span 2;
+      align-self: end;
+    }
+
+    :where(.ly-root[data-ly-layout="z-pattern"])
+      :where(.ly-split-hero, [data-ly-recipe="split-hero"]) {
+      grid-template-columns: minmax(0, 1.5fr) minmax(0, 0.5fr);
+    }
+  }
+
+  /* The three-track shell waits for a locally feasible allocation. */
+  @container (min-width: 64rem) {
     :where(.ly-root[data-ly-layout="z-pattern"])
       :where(.ly-app-shell, [data-ly-recipe="app-shell"]) {
       grid-template-areas:
@@ -35,15 +48,5 @@
         minmax(min(100%, 19rem), 0.55fr)
         minmax(min(100%, 17rem), 0.3fr);
     }
-
-    :where(.ly-root[data-ly-layout="z-pattern"]) .ly-grid > :nth-child(4n + 2) {
-      grid-column: span 2;
-      align-self: end;
-    }
-
-    :where(.ly-root[data-ly-layout="z-pattern"])
-      :where(.ly-split-hero, [data-ly-recipe="split-hero"]) {
-      grid-template-columns: minmax(0, 1.5fr) minmax(0, 0.5fr);
-    }
   }
 }

package/dist/recipes.css

@@ -239,8 +239,7 @@
         minmax(min(100%, var(--ly-recipe-aside)), 0.35fr);
     }
 
-    :where(.ly-dashboard, [data-ly-recipe="dashboard"]),
-    :where(.ly-docs, [data-ly-recipe="docs"]) {
+    :where(.ly-dashboard, [data-ly-recipe="dashboard"]) {
       grid-template-areas:
         "nav header header"
         "nav main aside"
@@ -251,6 +250,15 @@
         minmax(min(100%, var(--ly-recipe-aside)), 0.35fr);
     }
 
+    :where(.ly-docs, [data-ly-recipe="docs"]) {
+      grid-template-areas:
+        "nav header"
+        "nav main"
+        "nav aside"
+        "nav footer";
+      grid-template-columns: minmax(min(100%, var(--ly-recipe-rail)), auto) minmax(0, 1fr);
+    }
+
     :where(.ly-list-detail, [data-ly-recipe="list-detail"]) {
       grid-template-columns: minmax(min(100%, var(--ly-pane-size)), 0.45fr) minmax(0, 1fr);
     }

package/docs/wiki/Getting-Started.md

@@ -7,7 +7,7 @@ Layout Style CSS 2.0 provides structural layout without prescribing theme or com
 Node.js 20 or newer is required for development scripts.
 
 ```bash
-npm install layout-style-css@2.1.0
+npm install layout-style-css@2.1.1
 ```
 
 ## Import

package/docs/wiki/Home.md

@@ -1,6 +1,6 @@
 # Layout Style CSS Wiki
 
-Version 2.1.0 is a container-first, dependency-free layout library. It ships semantic wrappers, composition primitives, seven recipes, sixteen layout personalities, focused exports, a v2-only compatibility bundle, and refreshed ecosystem fixtures for UI Style Kit CSS 2.1 and Interactive Surface CSS 1.5.
+Version 2.1.1 is a container-first, dependency-free layout library. It ships semantic wrappers, composition primitives, seven recipes, sixteen layout personalities, focused exports, a v2-only compatibility bundle, and refreshed ecosystem fixtures for UI Style Kit CSS 2.1 and Interactive Surface CSS 1.5.
 
 ## Start Here
 
@@ -28,6 +28,6 @@ The package has no runtime or peer dependencies. `ui-style-kit-css@2.1.0` and `i
 
 - Node.js 20 or newer for package development
 - Current evergreen Chromium, Firefox, and WebKit
-- Mobile-first DOM order with core thresholds at `48rem` and `64rem`, plus tested personality-specific overrides
+- Mobile-first DOM order with core thresholds at `48rem` and `64rem`, nearest-container personality overrides, and `64rem` feasibility gates for three- and four-track application shells
 
 The deprecated UI structural bridge remains available for existing UI-prefixed layout aliases, but canonical 2.1 examples use UI Style Kit visual CSS, the UI token bridge, Interactive Surface `state-core.css`, and Layout core.

package/docs/wiki/Installation-And-CDN.md

@@ -5,7 +5,7 @@ Layout Style CSS 2.0 is dependency-free and has no peer dependency contract. Nod
 ## npm
 
 ```bash
-npm install layout-style-css@2.1.0
+npm install layout-style-css@2.1.1
 ```
 
 ## Focused Exports
@@ -57,8 +57,8 @@ The first import block is deprecated compatibility for legacy UI-prefixed struct
 Layout only:
 
 ```html
-<link rel="stylesheet" href="https://unpkg.com/layout-style-css@2.1.0/dist/layout-style-css.min.css">
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/layout-style-css@2.1.0/dist/layout-style-css.min.css">
+<link rel="stylesheet" href="https://unpkg.com/layout-style-css@2.1.1/dist/layout-style-css.min.css">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/layout-style-css@2.1.1/dist/layout-style-css.min.css">
 ```
 
 For optional companions, preserve the same order as the package imports: UI Style Kit visual CSS, UI Style Kit `interactive-surface-theme.css`, Interactive Surface 1.5.0 `state-core.css`, then Layout core. Load `layout-style-css/integrations/ui-style-kit.css` only for deprecated structural aliases.

package/docs/wiki/Layout-Recipes.md

@@ -36,7 +36,7 @@ Place regions in the order that makes sense on a narrow screen. The recipe uses
 
 ## Content And Media Recipes
 
-`docs` creates a documentation shell. `list-detail` arranges primary, secondary, and action regions. `split-hero` arranges content, media, and actions. `gallery` and `card-grid` create responsive repeated-item grids.
+`docs` creates a documentation shell. At `64rem`, its navigation spans the left column while `header`, `main`, `aside`, and `footer` remain in source order and stack in the right column; Dashboard retains its three-column wide shell. `list-detail` arranges primary, secondary, and action regions. `split-hero` arranges content, media, and actions. `gallery` and `card-grid` create responsive repeated-item grids.
 
 ```html
 <section class="ly-split-hero" data-ly-recipe="split-hero">

package/docs/wiki/Layout-Styles.md

@@ -27,7 +27,7 @@ V2 calls spatial styles “personalities” and selects them with the canonical
 | Mosaic | `maximalist` | Staggered editorial spans and broad measure. |
 | Equal split | `split-screen` | Two equally weighted primary regions. |
 
-Every personality changes at least two structural characteristics, such as area placement, shell direction, grid/span rhythm, wrapper measure, or responsive threshold. Personalities never set UI paint or change DOM order.
+Every personality changes at least two structural characteristics, such as area placement, shell direction, grid/span rhythm, wrapper measure, or responsive threshold. Enhancements query the nearest inline-size container: grid rhythms retain their authored thresholds, safe two-track application shells retain their authored thresholds, and three- or four-track application shells wait until the local allocation reaches `64rem`. Personalities never set UI paint or change DOM order.
 
 The v1 `data-layout`, `layout-style`, `.ly-layout-*`, and `.ly-style-*` hooks are available only through `layout-style-css/legacy.css`. New code must use `data-ly-layout`.
 

package/docs/wiki/Migrating-To-2.0.md

@@ -13,7 +13,7 @@ Version 2.0 rebuilds Layout Style CSS as a container-first, dependency-free stru
 Install companions explicitly only when the application uses them:
 
 ```bash
-npm install layout-style-css@2.1.0
+npm install layout-style-css@2.1.1
 npm install ui-style-kit-css@2.1.0 interactive-surface-css@1.5.0
 ```
 

package/docs/wiki/Release-And-Publishing.md

@@ -1,12 +1,12 @@
 # Release And Publishing
 
-This checklist prepares `layout-style-css@2.1.0`. Publishing, tagging, pushing, and creating a GitHub release require separate explicit approval.
+This checklist prepares `layout-style-css@2.1.1`. Publishing, tagging, pushing, and creating a GitHub release require separate explicit approval.
 
 ## Version Contract
 
-- `package.json` and `package-lock.json` identify `2.1.0`.
+- `package.json` and `package-lock.json` identify `2.1.1`.
 - Node.js 20 and 22 pass standalone CI.
-- `CHANGELOG.md` contains the dated 2.1.0 release entry.
+- `CHANGELOG.md` contains the dated 2.1.1 release entry.
 - README, migration guide, wiki, demo, exports, and tarball describe the same v2 API.
 - No peer or runtime dependencies are present.
 
@@ -39,22 +39,22 @@ git diff --check
 
 ## Tag And Version Validation
 
-The publish workflow checks out the selected tag and fails unless it equals `v${package.version}`. For this release the only valid tag is `v2.1.0`.
+The publish workflow checks out the selected tag and fails unless it equals `v${package.version}`. For this release the only valid tag is `v2.1.1`.
 
 After separate approval, an operator may check registry availability:
 
 ```bash
-npm view layout-style-css@2.1.0 version --json
+npm view layout-style-css@2.1.1 version --json
 ```
 
 The eventual release sequence is:
 
 ```bash
-git tag v2.1.0
-git push origin v2.1.0
+git tag v2.1.1
+git push origin v2.1.1
 ```
 
-Publishing the `v2.1.0` GitHub release triggers the npm workflow. A separately approved recovery run may use `release_tag` set to `v2.1.0`.
+Publishing the `v2.1.1` GitHub release triggers the npm workflow. A separately approved recovery run may use `release_tag` set to `v2.1.1`.
 
 ## Workflow Safety
 

package/docs/wiki/UI-Style-Kit-Compatibility.md

@@ -42,7 +42,7 @@ The removed v1 `.ly-surface--raised` selector is not restored by `legacy.css`; i
 
 | Library | Verified fixture | Consumer requirement |
 | --- | --- | --- |
-| Layout Style CSS | `2.1.0` | Required for this API |
+| Layout Style CSS | `2.1.1` | Required for this API |
 | UI Style Kit CSS | `2.1.0` visual CSS and manifest | Optional released fixture |
 | Interactive Surface CSS | `1.5.0` `state-core.css` | Optional released fixture |
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "layout-style-css",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "Dependency-free structural CSS for responsive wrappers, composition primitives, recipes, utilities, and layout personalities.",
   "type": "module",
   "license": "MIT",