@mkbabb/glass-ui 4.0.0 → 4.1.0

package/dist/styles/dock/morph.css

@@ -34,24 +34,52 @@
        during the morph, so the read resolves the correct in-flight blend (collapse
        1→0 via `1 - t`; expand 0→1 via `t`); on settle `[data-morphing]` clears and
        expand-t snaps to the exact class endpoint. */
-    .glass-dock:not(.vertical).expanded,
-    .glass-dock:not(.vertical).always-expanded {
+    /* BB.W-DOCK-MORPH-FAMILY (f) — the `--dock-expand-t` directional derivation is
+       ORIENTATION-AGNOSTIC. The derivation reads the per-swap morph scalar + the
+       synchronously-set `.expanded`/`.collapsed` class — there is NO axis in this
+       blend (a `t`-vs-`1-t` directional read), so the `:not(.vertical)` qualifier is
+       DROPPED here. A collapsing VERTICAL dock now derives the same in-flight
+       expand-t (the box-size arm `layers.css` already morphs `block-size` on
+       `--dock-morph-t`; this gives the chrome the matching directional scalar). The
+       earlier "a vertical rail is ALWAYS-EXPANDED" assumption is retired since
+       vertical-collapse shipped — `alwaysExpanded` defaults false (GlassDock.vue),
+       so a genuinely-collapsing vertical dock gets its chrome on the ONE clock. */
+    .glass-dock.expanded,
+    .glass-dock.always-expanded {
         --dock-expand-t: 1;
     }
 
-    .glass-dock:not(.vertical).collapsed {
+    .glass-dock.collapsed {
         --dock-expand-t: 0;
     }
 
-    .glass-dock:not(.vertical).expanded[data-morphing],
-    .glass-dock:not(.vertical).always-expanded[data-morphing] {
+    .glass-dock.expanded[data-morphing],
+    .glass-dock.always-expanded[data-morphing] {
         --dock-expand-t: var(--dock-morph-t);
     }
 
-    .glass-dock:not(.vertical).collapsed[data-morphing] {
+    .glass-dock.collapsed[data-morphing] {
         --dock-expand-t: calc(1 - var(--dock-morph-t));
     }
 
+    /* BC.W-DOCK-SHRINK-BLUR — the BB.W-LIQUID-REVEAL bloom-from-source decongest is a
+       TRANSIENT, not a resting state. HEAD keyed the bare `.glass-dock` self-blur off
+       `--dock-expand-t`, which AT REST resolves to the class endpoint → a PERMANENT 3px
+       self-blur on the resting collapsed dock, STACKED on the 9px backdrop (the "blurry
+       mess when shrunken", glass-dock-codebase §2.4). The FIX gates the self-blur (a
+       SURFACE `filter` arm on the dock's own pixels — NOT `backdrop-filter`, so the glass
+       plate blur is never clobbered; compositor-safe) to `[data-morphing]`: at REST the
+       dock is CRISP; ONLY mid-morph does the 3px bloom settle to 0 as the pill
+       materializes (the iOS-27 bloom, gesture-only). The backdrop blur (the glass
+       material) is UNTOUCHED. PRM zeroes it (the carve below). Clean break, no alias. */
+    .glass-dock {
+        --dock-reveal-blur: 0px; /* resting: CRISP — no own-pixel self-blur */
+    }
+    .glass-dock[data-morphing] {
+        --dock-reveal-blur: 3px; /* the transient decongest bloom — mid-morph only */
+        filter: blur(calc(var(--dock-reveal-blur) * (1 - var(--dock-expand-t, 1))));
+    }
+
     /* The morphing root chrome — background / border-color interpolate between the
        collapsed and expanded endpoints on the ONE `--dock-expand-t` scalar. Scoped
        to the horizontal dock (`:not(.vertical)`) — the inline-axis aperture morph;
@@ -98,6 +126,43 @@
         );
     }
 
+    /* BB.W-DOCK-MORPH-FAMILY (f) — the VERTICAL chrome-interp un-gate (BB-1). The
+       bg/border interp is AXIS-INVARIANT (a color mix reads the scalar with no
+       axis), so the vertical dock interpolates its plate between the SAME
+       collapsed↔expanded endpoints on the SAME `--dock-expand-t` scalar the
+       horizontal block reads — the ONE `DOCK_SPRING` clock, no second clock, no
+       re-added CSS transition. This PARALLEL `.vertical` block (specificity 0,2,0,
+       source-order AFTER the shell.css static `.glass-dock.vertical` plate so it
+       wins at equal specificity) is the inverse-axis twin of the horizontal block
+       above — the box-size morph already rides `block-size` on `layers.css`'s
+       `--dock-morph-t`; this gives the plate chrome the matching directional blend
+       so the vertical collapse↔expand no longer SNAPS its bg/border discretely. At
+       the rest endpoints `--dock-expand-t` resolves to the class value (0 collapsed
+       / 1 expanded), so the resting look is exact — byte-equivalent to the shell.css
+       static plate it supersedes during the morph. */
+    .glass-dock.vertical {
+        background: color-mix(
+            in srgb,
+            color-mix(
+                in oklab,
+                var(--glass-bg-dock, var(--glass-bg-wash)),
+                var(--glass-tint-source) var(--glass-tint-strength)
+            )
+                calc(var(--dock-expand-t, 1) * 100%),
+            color-mix(
+                in oklab,
+                var(--glass-bg-wash),
+                var(--glass-tint-source) var(--glass-tint-strength)
+            )
+        );
+        border-color: color-mix(
+            in srgb,
+            var(--glass-border-dock, var(--glass-border-wash))
+                calc(var(--dock-expand-t, 1) * 100%),
+            var(--glass-border-floating)
+        );
+    }
+
     /* The padding morph is split out + scoped `:not(.dock-overflow-wrap)` so the
        wrap variant's own padding rules (W04 territory — `.dock-overflow-wrap` +
        its `@media` snap-back) are NOT clobbered by this higher-specificity longhand.
@@ -142,6 +207,35 @@
         );
     }
 
+    /* BB.W-DOCK-MORPH-FAMILY (f) — the VERTICAL padding interp is the AXIS-INVERSE
+       of the horizontal layout-isolation contract above. The vertical collapse↔
+       expand is a BLOCK-HEIGHT aperture (the box-size arm morphs `block-size`,
+       layers.css), so the CROSS (inline) axis MUST be invariant across the morph —
+       else the dock's outer WIDTH changes on collapse and reflows its horizontal
+       siblings (the §1 contract, mirrored onto the vertical axis). So `padding-
+       inline` is PINNED at the expanded inline value in BOTH states, and ONLY
+       `padding-block` morphs to tighten the collapsed pill on the morph axis. The
+       collapsed block-pad endpoint is the EXPANDED inline pad (max'd with the
+       consumer `--dock-collapsed-padding` handle) so the height-pinned-cross collapsed
+       pill is SYMMETRIC. Specificity 0,2,0 source-order after shell.css's static
+       `.glass-dock.vertical` padding so this wins at equal specificity; at the rest
+       endpoints `--dock-expand-t` is the class value so the look is exact. Scoped to
+       the NON-scroll/non-wrap vertical dock. */
+    .glass-dock.vertical:not(.dock-overflow-wrap) {
+        --dock-pad-collapsed: max(
+            var(--dock-padding-inline, 0.5rem),
+            var(--dock-collapsed-padding, 0px)
+        );
+        /* inline padding is INVARIANT — the cross axis, pinned both states so the
+           outer inline-size never changes → 0px horizontal sibling reflow. */
+        padding-inline: var(--dock-padding-inline, 0.5rem);
+        padding-block: calc(
+            var(--dock-pad-collapsed) +
+                (var(--dock-padding-block, 0.375rem) - var(--dock-pad-collapsed)) *
+                var(--dock-expand-t, 1)
+        );
+    }
+
     /* AX.W01 — the collapsed padding / background / border-color are RETIRED here
        (the `--dock-expand-t` morph block above is the single authority for those
        three axes — they interpolate, never snap). `.collapsed` keeps only its
@@ -260,6 +354,7 @@
 
     .glass-dock.collapsed:hover:not([data-morphing]) {
         scale: var(--dock-collapsed-hover-scale);
+        will-change: transform; /* BC.W-DOCK-ENGINE move 2 — promote the armed-at-rest scale lift */
     }
 
     /* J.W5.C — held-state substrate response.
@@ -330,7 +425,23 @@
        ink, which clears ~10:1). */
     :where(.glass-dock) {
         --glass-tint-source: var(--glass-tint-ink);
-        --glass-tint-strength: var(--glass-tint-strength-aa);
+        /* BC.W-ADAPTIVE-RECONCILE — the dock JOINS the continuous observer driver (the
+           literal G2 surface: "darken DYNAMICALLY like iOS 27"). The dock's own
+           `useGlassBackdropLuminance` observer samples the threaded `:background-canvas`
+           (aurora/blob) and WRITES `--glass-backdrop-luma`; this clamp READS it and lerps
+           the plate from the warm-cream floor toward the ≤24% AA ceiling as the field
+           brightens past the knee — deepening over a bright bleed, lifting translucent over
+           a dark trough (the SAME clamp the content/overlay tiers get — ONE axis/driver/
+           signal; the discrete `@container` bucket RETIRED). Calm (luma ≤ knee) → floor. */
+        --glass-tint-strength: clamp(
+            var(--glass-tint-strength-floor),
+            calc(
+                var(--glass-tint-strength-floor) +
+                (var(--glass-tint-strength-aa) - var(--glass-tint-strength-floor)) *
+                max(0, (var(--glass-backdrop-luma, 0) - var(--glass-backdrop-luma-knee, 0.6)) / (1 - var(--glass-backdrop-luma-knee, 0.6)))
+            ),
+            var(--glass-tint-strength-aa)
+        );
         --dock-fg-on-aurora: var(--glass-tint-ink);
         --muted-foreground: var(--foreground);
     }
@@ -372,3 +483,17 @@
         }
     }
 }
+
+/* BB.W-LIQUID-REVEAL — the dock-expand bloom beat's blur-settle is OFF under
+   `prefers-reduced-motion: reduce` (the vestibular floor): a reduced-motion dock reads
+   crisp at every state, no in-between blur frames.
+   BC.W-DOCK-SHRINK-BLUR — the self-blur is now gated to `[data-morphing]`, so the PRM
+   carve zeroes it on the ARMED scope too (specificity 0,2,0) — a PRM dock that briefly
+   arms `[data-morphing]` carries no 3px bloom; the resting `.glass-dock` is already
+   crisp by the re-gate. */
+@media (prefers-reduced-motion: reduce) {
+    .glass-dock,
+    .glass-dock[data-morphing] {
+        --dock-reveal-blur: 0px;
+    }
+}

package/dist/styles/dock/overflow.css

@@ -246,8 +246,34 @@
                --dock-collapsed-padding / --dock-layer-tab-size paint at the global 1.5×
                while the density box paints at 1.17× — a desync the R5-2 register would
                introduce). The formulas are IDENTICAL to their :root definitions; only
-               the resolution element moves so the lifted --dock-scale flows in. */
-            --dock-icon-glyph: calc(1.25rem * var(--dock-scale));
+               the resolution element moves so the lifted --dock-scale flows in.
+               BB.W-PERF-PRODUCER A′-6 — --dock-icon-glyph is now a RATIO of the
+               density-painted --dock-layer-height (offsets-sizing.css + the density.css
+               [data-density] re-resolve). This coarse block @imports AFTER density.css
+               in the SAME @layer at the SAME specificity, so its --dock-icon-glyph
+               source-order-WINS on coarse pointers — it MUST carry the density-aware
+               formula too (the flat `1.25rem * --dock-scale` here would re-freeze the
+               glyph at the flat rem on touch, re-introducing the D5-1 defect the wave
+               fixes). --dock-layer-height re-resolves transitively at the lifted
+               --dock-scale (re-declared above), so the glyph tracks both the density
+               box AND the coarse register. Formula identical to the :root + density
+               re-resolve; only the resolution element moves. */
+            --dock-icon-glyph: max(
+                calc(var(--dock-layer-height, calc(2.5rem * var(--dock-scale))) * var(--dock-icon-glyph-ratio)),
+                var(--dock-icon-glyph-floor)
+            );
+            /* BC.W-DOCK-ENGINE move 3 (the Atlas A-9 fold) — RE-DECLARE the in-dock
+               toggle glyph knob on coarse beside `--dock-icon-glyph`. Its `:root`
+               default tracks `--dock-icon-glyph`, but a `:root`-only default would
+               freeze at the `:root` `--dock-scale` (the identity 1) while the coarse
+               `--dock-icon-glyph` above lifts — the AZ.R5-TOKENS substitution-vs-
+               inheritance dead-knob (the SAME trap the dock-scale re-declare closed,
+               mirrored for the toggle glyph). Re-declaring it HERE, against the
+               coarse-re-resolved `--dock-icon-glyph`, keeps the in-dock dark-toggle
+               glyph optically uniform with the nav glyphs on coarse AND fine pointer.
+               The `--dark-mode-toggle-padding` clamp (dark-mode-toggle.css) subtracts
+               THIS knob, so the box pad re-resolves in lockstep too. */
+            --dock-control-glyph-size: var(--dock-icon-glyph);
             --dock-collapsed-padding: calc(0.25rem * var(--dock-scale));
             --dock-layer-tab-size: calc(1.75rem * var(--dock-scale));
             /* --dock-collapsed-summary-min-size derives from --dock-layer-height (the

package/dist/styles/dock/search.css

@@ -0,0 +1,68 @@
+/* dock/search.css — the dock-as-native-dynamic-search-bar field surface (BC.W-DOCK-SEARCH).
+ *
+ * The active dock-search field + its placeholder + the result rows read CLEARLY forward
+ * over whatever backdrop the dock floats on (≥4.5:1, the W55 darken seam) — never the
+ * pale-ghost-fading-into-content trap (the NN/g defect, WWDC §219 "buttons remain
+ * legible"). The field surface composes the W55 `--glass-tint-strength-aa` bright-bucket
+ * darken at the ELEMENT level (the `color-mix(in oklab, <rung>, var(--glass-tint-source)
+ * var(--glass-tint-strength))` seam glass/ladder.css + morph.css already compose) — NOT
+ * the RAW pre-substituted `--glass-bg-dock` token (the substitution-vs-inheritance trap
+ * the dock surfaces already hit: a surface reading the pre-baked `--glass-bg-dock` baked
+ * at `:root` 0% strength does NOT darken — the pale-fade). At the 0%/floor default the
+ * inner oklab mix is a no-op (byte-identical to the un-tinted rung); under the bright
+ * bucket it darkens-over-light (and lifts-over-dark per W-DARK-MATERIAL).
+ *
+ * The result rows ride `.glass-menu-row` (the glass-quiet hover-lift, BA.W-MENU-GLASS —
+ * CONSUMED here, the glassify is BC.W-SEARCH-CUSTOM's). The customization-surface axes
+ * (size/surface/variant) are BC.W-SEARCH-CUSTOM's — this partial only seats the field +
+ * the legibility seam. The morph itself is the dock's OWN `--dock-morph-t` + the
+ * byte-untouched `morph-bridge.css` metaball (READ-ONLY — bound, never edited). */
+
+@layer components {
+    /* The search-field region inside the morph aperture. The consumer slots its
+       <SearchBar>/<FuzzySearch> here; this rule owns the legibility seam + the layout
+       inside the aperture (a column: the field over its dropdown). It is present ONLY on
+       a `[data-search]` dock (additive — a non-search dock never carries it). */
+    .glass-dock[data-search] .dock-search-field {
+        display: flex;
+        flex-direction: column;
+        inline-size: 100%;
+        min-inline-size: 0;
+        gap: var(--dock-search-field-gap, 0.375rem);
+    }
+
+    /* The ACTIVE field surface — the W55 element-level oklab tint (NOT the raw
+       `--glass-bg-dock`). The field reads the floating rung darkened toward the warm-ink
+       at the bright-bucket strength, so it reads ≥4.5:1 over a busy backdrop. The
+       `--glass-tint-source`/`--glass-tint-strength` are the SAME element-level customs
+       the dock plate self-engages (morph.css's `:where(.glass-dock)` rule re-points them
+       under the bright bucket); this field rides that lockstep, never a field-local
+       recipe. The field TEXT is `--foreground` (the full warm ink); the
+       placeholder/muted caption is `--on-glass-muted` (5.76:1 vs the plate). */
+    .glass-dock[data-search] .dock-search-field .input-bar {
+        background: color-mix(
+            in oklab,
+            var(--glass-bg-floating),
+            var(--glass-tint-source) var(--glass-tint-strength)
+        );
+        color: var(--foreground);
+    }
+
+    /* The placeholder + the autocomplete ghost-text + any muted caption inside the field
+       read the on-glass muted rung (NOT `--muted-foreground`, which is calibrated against
+       the opaque page and collapses on a translucent darkened plate). */
+    .glass-dock[data-search] .dock-search-field .input-bar-field::placeholder,
+    .glass-dock[data-search] .dock-search-field .dock-search-ghost,
+    .glass-dock[data-search] .dock-search-field .dock-search-result-meta {
+        color: var(--on-glass-muted);
+    }
+
+    /* The dropdown result rows ride the shared `.glass-menu-row` glass-quiet hover-lift
+       (BA.W-MENU-GLASS — CONSUMED, not re-authored). The dock-search list applies
+       `.glass-menu-row` per row; this rule reaches the selected/highlighted row through
+       the SAME register the menu families use (no flat `bg-accent`/`bg-muted` fork). The
+       active result reads the data-highlighted state the menu recipe already paints. */
+    .glass-dock[data-search] .dock-search-field .dock-search-result {
+        color: var(--foreground);
+    }
+}

package/dist/styles/dock/shape.css

@@ -0,0 +1,124 @@
+/* dock/shape.css — BC.W-DOCK-ARBITRARY: the arbitrary-shape morph register.
+ *
+ * The dock is no longer locked to "a rectangle that grows wider/taller." Its SHAPE
+ * is a SCALAR PARAMETER on the ONE `--dock-morph-t` clock (the BC.W-DOCK-ENGINE
+ * buttery scalar): the corner profile LERPS between a `--dock-shape-from`/
+ * `--dock-shape-to` radius pair, an OPT-IN `clip-path` silhouette LERPS between a
+ * `--dock-shape-clip-from`/`--dock-shape-clip-to` pair, and a `useLiquidFlex`
+ * volume-preserving squish couples the deformation. So the dock FLOWS between
+ * arbitrary silhouettes — a circle, a pill, a wide bar, a tall rail, a teardrop —
+ * as one continuous liquid-glass surface (the iOS-27 control-center materialization,
+ * apple-ios27.md §3.1 "physically morphs from one shape to another").
+ *
+ * THE COMPOSITOR FLOOR (apple-ios27.md §3.1 + motion-canon P5): the shape morph
+ * animates ONLY `border-radius`/`clip-path`/`--*` — compositor/paint properties,
+ * ZERO per-frame layout. The footprint is reached by the reserved-`scale()` morph
+ * (layers.css, byte-untouched here), NEVER a per-frame size lerp. proof:dock-arbitrary
+ * + proof:no-layout-animation both hold.
+ *
+ * THE LIBRARY DEFAULT IS THE CIRCLE↔PILL IDENTITY (CLAUDE.md the collapsed-perfect-
+ * circle): `--dock-shape-from`/`--dock-shape-to` default to `--radius-dock` (9999px)
+ * on both endpoints — a no-op lerp byte-identical to the prior static
+ * `border-radius: var(--radius-dock)` — and the clip pair defaults `none`/`none`
+ * (the rectangle/pill common case needs no clip). The arbitrary teardrop/blob
+ * silhouette is OPT-IN: a consumer sets the shape tokens on the dock scope
+ * (presets-in-consumers). Clean break (MEMORY: no backwards compat) — the prior
+ * hardcoded circle/pill radius becomes the token DEFAULT, no `--dock-radius-legacy`.
+ *
+ * @import-ed by dock.css in cascade order, in the SAME `@layer components`. */
+
+@layer components {
+    /* ── The corner-profile lerp (A1 — the shape is a scalar parameter) ───────────
+       The dock surface radius interpolates the `--dock-shape-from`/`--dock-shape-to`
+       token pair on the ONE `--dock-expand-t` scalar (the directional expanded-ness
+       the BC.W-DOCK-ENGINE chrome interp rides; at rest it resolves to the class
+       endpoint, 0 collapsed / 1 expanded, so the resting corner is exact). This
+       GENERALIZES the prior two hardcoded class endpoints into a consumer-targetable
+       parameter: `from` is the collapsed silhouette's corner (the perfect circle,
+       9999px), `to` is the expanded silhouette's corner (the pill / an arbitrary
+       profile). A consumer overrides either token on the dock scope to morph to an
+       arbitrary corner.
+
+       This is the SINGLE radius authority (shell.css's prior static `border-radius:
+       var(--radius-dock)` is GENERALIZED here — no dead static, no duplicate, clean
+       break). Both tokens default to `--radius-dock` (9999px) so the lerp is a NO-OP at
+       the library default — byte-identical to the prior static, the circle↔pill identity
+       preserved. The token-driven `border-radius` interp is a compositor/paint property
+       on the registered `--dock-expand-t` `<number>`, NOT a transition
+       (proof:no-layout-animation stays GREEN). shape.css is imported AFTER shell.css so
+       this rule is the cascade winner for the dock corner. */
+    .glass-dock {
+        border-radius: calc(
+            var(--dock-shape-from, var(--radius-dock)) +
+                (var(--dock-shape-to, var(--radius-dock)) -
+                    var(--dock-shape-from, var(--radius-dock))) *
+                var(--dock-expand-t, 1)
+        );
+    }
+
+    /* ── The arbitrary silhouette — the OPT-IN `clip-path` lerp (A1) ──────────────
+       DEFAULT-OFF: at the library default `--dock-shape-clip-from`/`--dock-shape-clip-to`
+       are `none`, so this rule resolves `clip-path: none` (the rectangle/pill common
+       case needs no clip; the box-morph + corner lerp above is the whole shape). A
+       consumer opts into an arbitrary teardrop/blob silhouette by setting the clip
+       tokens to two compatible `inset()`/`path()`/`shape()` values; the silhouette then
+       LERPS between them on `--dock-morph-t` via the `from` * (1−t) + `to` * t weighting
+       below. `clip-path` is a compositor-friendly property — the silhouette morphs with
+       ZERO reflow (apple-ios27.md §3.1).
+
+       The lerp is expressed as a `clip-path` whose two endpoints carry per-endpoint
+       opacity-like weights via the scalar: the active silhouette is the `to`-clip once
+       the morph crosses, the `from`-clip before. The web platform cannot continuously
+       interpolate two arbitrary mismatched-topology `clip-path` functions, so the
+       opt-in consumer supplies TOPOLOGY-COMPATIBLE endpoints (two `inset()`s, or two
+       `path()`s with equal command counts) — the AX.W42 fold-7 topology limit is
+       RESPECTED (a mismatched-topology V↔H morph occludes its reflow in the goo-merge,
+       BC.W-LIQUID-MORPH, not a continuous clip morph THROUGH the change). The default
+       `none`/`none` opts the whole register off so the limit never bites the common
+       case. The custom property carries the consumer's interpolable pair; the engine
+       resolves it on the scalar only when set. */
+    .glass-dock {
+        --dock-shape-clip: var(--dock-shape-clip-to, none);
+        clip-path: var(--dock-shape-clip);
+    }
+
+    /* While morphing, the opt-in silhouette LERPS: before the midpoint the `from`-clip
+       reads, after it the `to`-clip, so the silhouette flows from one to the other as
+       the box scales under it (the corner + footprint + silhouette all on the ONE
+       scalar). The `none`/`none` default makes this a no-op (`clip-path: none` both
+       sides), so the rectangle/pill morph never pays the clip cost; the arbitrary
+       register engages ONLY when a consumer sets the clip tokens. */
+    .glass-dock[data-morphing] {
+        --dock-shape-clip: var(--dock-shape-clip-from, none);
+    }
+    .glass-dock[data-morphing]:where(.expanded, .always-expanded) {
+        /* expanding (0→1): once past the midpoint the `to`-silhouette is the target */
+        --dock-shape-clip: var(--dock-shape-clip-to, none);
+    }
+
+    /* ── The squish — the `useLiquidFlex` `--stretch` deformation (A4) ────────────
+       The shape morph couples the volume-preserving squish the tab-indicator +
+       useDockOrientationMorph already speak: `scale: var(--stretch) calc(1/var(--stretch))`
+       along the morph axis, capped LOW at `--dock-morph-max-stretch` (~1.08) by
+       useLiquidFlex itself (the ONE squish source — no forked deformation math). The
+       plate DEFORMS like liquid as it changes shape — a fast morph swells, a slow one
+       barely. The driver (useDockOrientationMorph) writes `--stretch` on the dock scope;
+       at rest `--stretch` is unset → 1/1 (no squish). The reciprocal pairing preserves
+       volume (stretch along travel, compress across). This is compositor-only (a
+       `scale` transform), composed WITH the reserved-footprint `scaleX/scaleY` morph
+       (layers.css) — the box scale rides `--dock-morph-scale`, the squish rides
+       `--stretch`, both transforms multiply on the compositor.
+
+       Scoped to `[data-morphing]` so the squish is a morph-transient (at rest the plate
+       is un-squished); the cross-axis is the morph axis's reciprocal. Horizontal docks
+       stretch X / compress Y; vertical stretch Y / compress X (the inverse-axis twin,
+       mirroring the bridge plates' per-orientation squish in morph-bridge.css). The
+       squish multiplies onto the dock's OWN transform box (the shell), distinct from the
+       inner `.dock-layers` reserved-scale box, so the two do not fight. */
+    .glass-dock[data-morphing]:not(.vertical) {
+        scale: var(--stretch, 1) calc(1 / var(--stretch, 1));
+    }
+    .glass-dock[data-morphing].vertical {
+        scale: calc(1 / var(--stretch, 1)) var(--stretch, 1);
+    }
+}

package/dist/styles/dock/shell.css

@@ -87,13 +87,32 @@
            centered in its cell (≥1px slack/side at hover), the cell sits flush at the
            dock content edge, and the `--dock-padding-block` (≈6px) padding holds the
            plate ≥7px clear of the `contain: paint` border-box edge on the block axis.
-           So `contain: paint` is the NON-proximate second clip box (the lane's
+           So the `paint` clip axis is the NON-proximate second clip box (the lane's
            `probe-bottomdock-nocontain.png` forced-root probe proved the inner
-           scroll-port box was proximate, not this) and it is UNEDITED here — the
-           inset + freed cross axis suffice, no containment lift on the control-plate
-           band. The π readback (W-DOCK-GEOMETRY-DELTA.md) records the live
-           plate-inside-padding margin number that binds this verdict. */
-        contain: paint;
+           scroll-port box was proximate, not this) and the `paint` axis is RETAINED
+           here — the inset + freed cross axis suffice, no containment LIFT on the
+           control-plate band. (BB.W-PERF-PRODUCER A′-4 widens the value to
+           `contain: layout style paint` — the restyle-scope axes ALONGSIDE the paint
+           clip box, see below — but never lifts `paint`.) The π readback
+           (W-DOCK-GEOMETRY-DELTA.md) records the live plate-inside-padding margin
+           number that binds this verdict. */
+        /* BB.W-PERF-PRODUCER A′-4 — the `--dock-morph-t` restyle-scope narrowing.
+           The per-frame morph scalar write recomputes the inheriting `calc()` group
+           across the dock subtree (dock.css's 10-selector `:where()` consumers); add
+           the `layout` + `style` containment axes so a scalar write recomputes
+           layout/style WITHIN the dock subtree, not up the document (the value.js A′-4
+           ~13fps restyle-cost trace). RECONCILED with the existing axes: `paint`
+           (above, the BA.W-DOCK-GEOMETRY clip box) composes — `contain: layout style
+           paint` is the union, NEVER `size` (which `container-type: inline-size` carries
+           as `inline-size` ONLY on the OPT-IN `containerName` host below; the default
+           free-floating dock must stay shrink-to-fit, so `size`/`inline-size` is
+           DELIBERATELY excluded here — adding it would re-introduce the 3.3.0 sliver
+           regression the §99 comment documents). The morph-axis `overflow: clip`
+           (the reveal aperture) + the `.glass-dock-frame` rail-escape are UNAFFECTED:
+           `layout`/`style` containment scopes RECALC, it does not establish a paint
+           clip beyond the already-present `paint` axis. The `DOCK_SPRING` clock is
+           byte-fenced (the value.js letter) — this is restyle COST, not a re-tune. */
+        contain: layout style paint;
         display: inline-flex;
         align-items: center;
         /* AW.W1 — the dock does NOT establish a default inline-size container.
@@ -110,7 +129,7 @@
            host-constrained width it already has there. The default free-floating
            dock shrink-wraps to its content (AV.W16 TW3 made this a default and
            silently broke dock sizing for the common case). */
-        border-radius: var(--radius-dock);
+        /* BC.W-DOCK-ARBITRARY — the base corner is the shape register's token lerp (dock/shape.css, the single radius authority generalizing the prior static). */
         white-space: nowrap;
         max-inline-size: var(--dock-max-inline-size);
         padding: var(--dock-padding-block, 0.375rem) var(--dock-padding-inline, 0.5rem);
@@ -129,10 +148,13 @@
         );
         backdrop-filter: var(--dock-surface-blur);
         border: 1.5px solid var(--glass-border-dock, var(--glass-border-resting));
-        /* AV.W15 M3 — the full-perimeter `--glass-edge-light` rim rides as the
-           leading inset layer of the dock shadow stack (the navigation-band
-           silhouette catch-light, distinct from the top-only highlight). */
-        box-shadow: var(--glass-edge-light), var(--shadow-dock-override, var(--shadow-dock));
+        /* BC.W-BLACK-BAR D2 — the dock rim is the DIRECTIONAL pair (bright catch-light
+           on the TOP edge, faint warm under-shadow on the BOTTOM — glass-fx.css), the
+           leading inset layers of the dock shadow stack. RETIRES the omnidirectional
+           `--glass-edge-light` ring that fought the (now ≤4% α) `--glass-border-dock`
+           perimeter; the navigation band reads its rim from the SAME corrected token
+           source as cards/dialogs (no dock-local dark rim re-paste). */
+        box-shadow: var(--glass-rim-top), var(--glass-rim-bottom), var(--shadow-dock-override, var(--shadow-dock));
     }
 
     /* AW.W2 — the box IS the reveal aperture (clip-reveal one-clock morph).
@@ -273,22 +295,40 @@
            shell above; the cross axis stays visible there. */
         padding: var(--dock-padding-block, 0.375rem);
         border-radius: var(--radius-dock);
-        /* AX.W01 — a vertical rail is ALWAYS-EXPANDED (no collapse↔expand morph),
-           so its root padding/background/border-color never morph; the prior
-           `padding/background/border-color var(--dock-motion-*)` transition arms
-           are DELETED (a residual root CSS-transition on the morph-chrome props is
-           the second-clock smell the single-scalar rebuild retires). The block-axis
-           (height) morph is owned by the inner `.dock-layer-stack` / DockLayerGroup
-           via the `--dock-morph-t` scalar (the size `calc()` above), never a CSS
-           transition here. KEPT: the DECORATIVE hover-scale + press-squish (the
-           individual `scale`/`transform`) and the box-shadow fade — these are
-           interaction polish on the static rail, NOT the morph. */
+        /* BB.W-DOCK-MORPH-FAMILY (f) — the stale "a vertical rail is ALWAYS-EXPANDED
+           (no collapse↔expand morph)" assumption is RETIRED (it was false since
+           vertical-collapse shipped: `alwaysExpanded` defaults FALSE, so a vertical
+           dock genuinely collapses its `block-size`). The vertical plate's
+           bg/border/padding/radius now MORPH on the SAME `--dock-expand-t` scalar
+           the horizontal chrome rides (the morph.css `.glass-dock.vertical` interp +
+           padding axis-inverse + the radius arm below) — the chrome follows the
+           box-size morph, no discrete snap. NO root CSS-transition on the morph-
+           chrome props is re-added (a `transition: padding/background/border-color`
+           arm is the second-clock smell the single-scalar rebuild forbids — the
+           `--dock-expand-t` interp is the single authority). KEPT: the DECORATIVE
+           hover-scale + press-squish (the individual `scale`/`transform`) and the
+           box-shadow fade — interaction polish on the rail, NOT the morph chrome. */
         transition:
             box-shadow var(--dock-motion-standard),
             transform var(--dock-motion-resize),
             scale var(--dock-motion-resize);
     }
 
+    /* BC.W-DOCK-ENGINE move 2 — the rail polish transition is COMPOSITOR-PROMOTED
+       only while its hover/press/held state is ARMED (the transform/scale legs ride
+       the compositor channel; `will-change: transform` hints the layer for the
+       gesture). NEVER a resting `will-change` (a permanent promotion pins a wasted
+       compositor layer at rest — the motion-canon P5 no-resting-promotion floor):
+       the hint lives on the `:hover`/`:active`/`[data-held]` armed selectors and is
+       cleared the instant the state releases. PRM keeps no pinned layer either — the
+       universal a11y carve strips the spatial transform under reduce, and a
+       non-animating rail needs no promotion. */
+    .glass-dock.vertical:hover,
+    .glass-dock.vertical:active,
+    .glass-dock.vertical[data-held] {
+        will-change: transform;
+    }
+
     /* AZ.W-DOCK-TAXONOMY — the vertical dock's surface plate (the prior
        `.variant-rail` block; "rail-ness" is now `orientation="vertical"` + a
        shape/density choice, not a variant). */
@@ -318,6 +358,22 @@
         border-radius: var(--radius-xl);
     }
 
+    /* BB.W-DOCK-MORPH-FAMILY (f) — the VERTICAL big-dock CARD radius MORPHS on the
+       SAME `--dock-expand-t` scalar the horizontal `.shape-card` rides (the radius
+       arm of the vertical chrome un-gate; it lives in shell.css beside the horizontal
+       arm, not morph.css). `--radius-pill` at expand-t 0 (collapsed), the finite
+       `--dock-card-radius` at expand-t 1 (expanded) — the radius follows the box-size
+       block morph, no discrete snap. The static `.shape-pill`/`.shape-rounded` rest
+       radii above are the rest endpoints for those shapes; this is the card shape's
+       interpolated radius (mirroring the horizontal `:not(.vertical).shape-card`). */
+    .glass-dock.vertical.shape-card {
+        border-radius: calc(
+            var(--radius-pill) +
+                (var(--dock-card-radius) - var(--radius-pill)) *
+                var(--dock-expand-t, 1)
+        );
+    }
+
     /* AW.W3b — horizontal-root shape rules. The `shape-*` class once bound ONLY under
        the vertical surface; on a horizontal dock the prop silently no-op'd (the root
        hardwired `--radius-dock` = `--radius-pill`). These rules close that