@mkbabb/glass-ui 4.0.1 → 4.2.0

package/dist/styles/tokens/property-regs.css

@@ -56,6 +56,44 @@
     initial-value: 0%;
 }
 
+/* BD.W-GOO-CAROUSEL-DECK — the ONE goo-morph travel scalar (the de-dup of the pager
+   WORM's `--worm-t`). The morph silhouette (dot worm / carousel slide plate / deck
+   slide plate) travels between MEASURED slot centers driven by a continuous page-space
+   float the host `transition`s on a `--{prefix}-flow` `linear()` curve. A bare
+   unregistered `var()` would SNAP `--goo-t` (no spring glide); the typed `<number>`
+   registration lets the engine interpolate the scalar so the silhouette's two-edge
+   geometry (useGooMorph.ts) springs past then settles. `inherits: true` — the host
+   transitions it, the rAF projection reads it off the host. `initial-value: 0` is the
+   resting slot (a non-supporting engine snaps onto the active slot, the floor). ONE
+   shared registration: the worm, the carousel plate, and the deck plate all read it. */
+@property --goo-t {
+    syntax: "<number>";
+    inherits: true;
+    initial-value: 0;
+}
+
+/* BD.W-TABS-LIQUID — the area-inflation scalar (the 5-beat blob's grow→overshoot
+   →shrink envelope) + the one-shot commit accent-flood progress. BOTH are driven
+   IMPERATIVELY: the 2nd `useLiquidFlex` channel in `useTabIndicator.ts` writes
+   `--tab-blob` every frame (it is NOT added to a CSS `transition` list — the
+   composed `scale` write the indicator already transitions carries the glide). The
+   `@property` registration exists ONLY so the discrete release-frame write
+   (`--tab-blob` snapping back to 1 at arrival) interpolates instead of snap-
+   flickering — the SAME role the `--stretch`/`--glass-accent` registered-scalar
+   precedent serves. `inherits: false` — each indicator owns its own blob (a blobbed
+   parent must not push inflation onto a child). `initial-value: 1`/`0` are the safe
+   rest (a non-supporting engine slides with no inflation/flood, never broken). */
+@property --tab-blob {
+    syntax: "<number>";
+    inherits: false;
+    initial-value: 1;
+}
+@property --tab-flood-t {
+    syntax: "<number>";
+    inherits: false;
+    initial-value: 0;
+}
+
 @property --phase-tint-amount {
     syntax: "<percentage>";
     inherits: true;
@@ -119,6 +157,91 @@
     initial-value: 0deg;
 }
 
+/* BD.W-MOTION-WEIGHT — the LIVE velocity channel. `useLiquidFlex` writes this
+   per-frame off the SAME saturating velocity term it already computes
+   (`tanh(|ṫ|·k) ∈ [0,1]`); the consumer's `writeVelocityWeight` helper folds it
+   into a transient `--motion-weight: calc(0.618 + 0.382 * var(--flex-vel))` boost
+   so a driver in active fast motion deepens its own squish/punch/shadow-travel and
+   self-extinguishes back to rest as it settles ("elements morph MORE the faster
+   they move"). `inherits: false` is LOAD-BEARING (the C2·R1 subtree-storm bite): a
+   per-frame write invalidates exactly ONE element, never a subtree — an inheriting
+   velocity channel would re-paint every descendant on every frame. `initial-value:
+   0` is the still rest (no boost when unwired). */
+@property --flex-vel {
+    syntax: "<number>";
+    inherits: false;
+    initial-value: 0;
+}
+
+/* BD.W-CARTOON-CASTER — the cartoon cel-cast drive props (H1: proven-live-DEAD
+   without these — the calc chain falls back to initials → no punch). The cast
+   travel/spread READ `--motion-weight × --cartoon-press-t`, so the inert
+   `.cartoon-cast` child plate moves on the compositor as the body presses.
+   • --cartoon-press-t (<number>, inherits:true) — the 0→1 press ramp the existing
+     `useLiquidPress` writes (aliased onto `--card-press-t` on `.cartoon-surface`);
+     inherits so the inert child reads its host's press scalar.
+   • --cast-travel (<length>, inherits:false) / --cast-spread (<number>,
+     inherits:false) — the per-caster derived offset + scale; non-inheriting (each
+     caster owns its own, never bleeds onto a nested cartoon child).
+   • --cartoon-cast-dx/dy (<length>, inherits:true) — the OPT-IN drag-track delta
+     (0 at rest; a future `useCartoonCast` DOM bridge writes them). Inherits so the
+     host can set them for the child. Typed so the gap INTERPOLATES on the
+     compositor; a non-supporting engine snaps rather than eases (the gap still
+     reads). */
+@property --cartoon-press-t {
+    syntax: "<number>";
+    inherits: true;
+    initial-value: 0;
+}
+
+@property --cast-travel {
+    syntax: "<length>";
+    inherits: false;
+    initial-value: 0px;
+}
+
+@property --cast-spread {
+    syntax: "<number>";
+    inherits: false;
+    initial-value: 1;
+}
+
+@property --cartoon-cast-dx {
+    syntax: "<length>";
+    inherits: true;
+    initial-value: 0px;
+}
+
+@property --cartoon-cast-dy {
+    syntax: "<length>";
+    inherits: true;
+    initial-value: 0px;
+}
+
+/* BD.W-PAGE-FIELD — the warm colorful FIELD drive props (paper.css `.paper-field`).
+   The chassis writes ONE per-route hue (`--field-h-raw`) on the `[data-paper-field]`
+   wrapper; `.paper-field` CLAMPS it warm IN THE CSS (`clamp(25, raw, 95)`) so an
+   inline `--field-h-raw:210` paint-CANNOT go teal — the warm-bound is a paint-layer
+   invariant, not a TS-only convention.
+   • --field-h-raw (<number>, inherits:true) — the route's raw hue request. Inherits so
+     the wrapper sets it once and every `.paper-field` descendant resolves it. Initial 62
+     (warm amber — the canonical cream identity).
+   • --field-intensity (<number>, inherits:true) — the ground/hero rung scalar (0.85
+     ground, 1.0 vivid hero, 0 under prefers-reduced-transparency → the warm stops drop
+     and the decoupled --neutral-0 floor shows). Inherits so a hero surface can lift it
+     on a sub-tree. */
+@property --field-h-raw {
+    syntax: "<number>";
+    inherits: true;
+    initial-value: 62;
+}
+
+@property --field-intensity {
+    syntax: "<number>";
+    inherits: true;
+    initial-value: 0.85;
+}
+
 /* BB.W-LENSING `--glass-refract` axis — RETIRED (DDR-LENS-BAKE, glass-refract.css).
    The axis drove the `feDisplacementMap` `scale` by splicing `var(--glass-refract)`
    between a head/tail `url()` pair. That construction never parsed as a
@@ -171,6 +294,19 @@
     initial-value: 0%;
 }
 
+/* BC.W-GLASS-GLOW-FIX (Atlas A-8) — the Pulse aura breath SCALE. The `ambient-pulse`
+   keyframe runs on `.pulse-aura` and writes this property; the `.pulse-aura::before`
+   child (the radial paint) reads it via `transform: scale(var(--pulse-aura-breath-
+   scale))`. Typed `<number>` so the keyframe INTERPOLATES it per-frame (a bare
+   unregistered var would snap min↔max). INHERITS so the pseudo-element picks it up
+   from its originating `.pulse-aura` (the aura has no content descendants — it is
+   `aria-hidden` + empty — so the inherit only reaches the `::before` halo). */
+@property --pulse-aura-breath-scale {
+    syntax: "<number>";
+    inherits: true;
+    initial-value: 1;
+}
+
 /* AX.W54 — the GLASS-FIRST single knob. `--glass-level` is the ONE clarity
    scalar threaded through BOTH glass ladders at their single sites (the
    `--glass-bg-*` opacity recipe + the `--glass-blur-*` radii). It is a typed,
@@ -194,6 +330,26 @@
     initial-value: 1;
 }
 
+/* BC.W-ADAPTIVE-RECONCILE — the OBSERVER's measured backdrop relative-luminance, now
+   LOAD-BEARING. `useGlassBackdropLuminance` WRITES `--glass-backdrop-luma` (0..1) on
+   the glass target; the content/overlay/dock `:where()` rules READ it on the RHS of the
+   `--glass-tint-strength` clamp (glass/ladder.css, dock/morph.css) — the continuous
+   driver that lifts the calm 4% floor toward the ≤24% AA ceiling as the measured
+   backdrop brightens past the knee (the iOS-27 dynamic-range shift; apple-ios27.md §1.5).
+   Registered as a typed INHERITING `<number>` (the `--glass-level`/`--progress-crescendo`
+   precedent) so a bare `var()` INTERPOLATES smoothly between sample frames instead of
+   snapping (a per-sample re-paint would flicker the plate). `inherits: true` so the
+   observer's write on the target reaches every descendant glass surface that reads the
+   clamp. `initial-value: 0` is the calm-dark rest: with luma 0 the clamp's luma-ramp is
+   `max(0, …) = 0`, so an unwired surface resolves EXACTLY the floor (the zero-delta calm
+   identity GLASS-IDENTITY pins). This replaces the empty `--glass-backdrop-luma: ;`
+   placeholder declaration (the dead-knob's write-only stub) — the loop now READS. */
+@property --glass-backdrop-luma {
+    syntax: "<number>";
+    inherits: true;
+    initial-value: 0;
+}
+
 /* BB.W-DEEP-GLASS — the OPT-IN deep-glass DEPTH scalar. `--glass-depth` is the
    `--glass-level` TWIN for the deep tier: a typed INHERITING <number> so a host
    sets it on any ancestor to retune the deep tier's depth (the cascading-scalar
@@ -230,6 +386,27 @@
     initial-value: 1;
 }
 
+/* BD.W-MOTION-WEIGHT — the GOVERNING motion scalar (the iOS-27 register-triangle
+   centroid). ONE number co-scales the squash depth, the overshoot share, the
+   anticipation pull-back, and the cartoon-shadow travel so they read as ONE
+   proportioned deformation, never four unrelated tics. Registered with the EXACT
+   `--ui-scale`/`--glass-level` typed cascading-scalar idiom — `inherits: true` is
+   the whole mechanism: a DRIVER ancestor (`.dock`, a celebrating card, a sheet)
+   locally pushes `--motion-weight: 1`; an OBSERVER subtree (`<CarouselContent>`
+   auto-advance, `[data-reorder]` lists) pins `--motion-weight: 0` — everything
+   below reads the local value with zero prop-drilling. `initial-value: 0.618`
+   (1/φ, design.md §L6 golden-proportion law): not 0 (dead), not 1 (manic) —
+   present, alive, never cartoonish-by-default. The `:root` rest decl + the PRM
+   carve live in scheme-motion.css §2 (the Feature-token-home, beside the
+   `--spring-*` clocks it co-governs). A non-supporting engine reads the safe
+   0.618 fallback (the squish still reads, just non-animatable — the same fail-safe
+   `--ui-scale` documents). */
+@property --motion-weight {
+    syntax: "<number>";
+    inherits: true;
+    initial-value: 0.618;
+}
+
 /* ── The specular-intensity magnitude cohort (AX.W09) ──────────────────────
    The catch-light alpha multiplier at each interaction state, as a SINGLE
    overridable token cohort (was three buried literals across glass.css —
@@ -287,3 +464,103 @@
     inherits: true;
     initial-value: 0;
 }
+
+/* BC.W-AX-COMPLETION-SEAL — the 4 motion drives of the hero-scale earned-GOLD
+   completion seal (completion-seal.css consumes them). Registered typed so the
+   one-shot draw INTERPOLATES (a bare unregistered var() snaps; the §18 typed-property
+   idiom lets the engine animate the stroke-reveal / settle / glint). The seal is the
+   visual seal of the W-PHASE-PALETTE completion event — its ink reads the earned-gold
+   register; its glint composes the W-AX-METAL-GLOW catch-light. One-shot, PRM-gated,
+   compositor-only.
+
+   • --seal-draw (<percentage>) — the stroke-reveal extent (the stroke-dashoffset wipe
+     drive: 0% undrawn → 100% fully drawn). `inherits: false` (each seal owns its own
+     draw, the per-surface ownership of the specular/border-progress cohort — a sealed
+     parent must not push its draw onto a child seal). `initial-value: 100%` is the
+     SAFE fully-drawn resting seal: on a non-supporting engine (no @property) the seal
+     paints fully drawn, NEVER a blank — the editorial draw-on degrades to the finished
+     mark, never to nothing.
+
+   • --seal-scale (<number>) — the settle scale (the draw-on lands with a small spring
+     overshoot on the seal's own --spring-snappy/--spring-bouncy clock — the SPATIAL
+     leg, W-MOTION-CANON P2 enter-bouncy). `inherits: false` (per-seal). `initial-value:
+     1` is the resting settled scale.
+
+   • --seal-glint (<number>) — the gold catch-light intensity (the one-pass glint that
+     fires once on settle, reading --metal-glow-opacity from W-AX-METAL-GLOW — a glint,
+     not a loop). `inherits: false` (per-seal). `initial-value: 0` so an unwired seal is
+     un-glinting at rest (the calm floor; the glint wakes only on the draw).
+
+   • --seal-ink (<color>) — the seal stroke color. `inherits: true` (the cascading-scalar
+     idiom — a consumer scope re-inks the seal in lockstep with the completion register).
+     The @property `initial-value` MUST be a CONCRETE var-free <color> (the typed-property
+     rule: a registration fallback cannot be a var()), so it is the LITERAL light-gold
+     `oklch(0.751 0.147 84.2)` (scale-paper.css's `--gold` value) — the engine fallback
+     when no cascaded value exists. The RUNTIME cascade default is the TOKEN form the
+     recipe sets: `--seal-ink: var(--phase-complete-color, var(--color-gold))` — the
+     EARNED-gold completion register (Q2: gold is earned at completion, NEVER the running
+     phase spectrum). */
+@property --seal-draw {
+    syntax: "<percentage>";
+    inherits: false;
+    initial-value: 100%;
+}
+
+@property --seal-scale {
+    syntax: "<number>";
+    inherits: false;
+    initial-value: 1;
+}
+
+@property --seal-glint {
+    syntax: "<number>";
+    inherits: false;
+    initial-value: 0;
+}
+
+@property --seal-ink {
+    syntax: "<color>";
+    inherits: true;
+    initial-value: oklch(0.751 0.147 84.2);
+}
+
+/* BC.W-SCROLL-TRIGGER — the native scroll-ramp custom. The continuous 0..1 scroll
+   progress the `useScrollTrigger` reader exposes rides this registered custom on a
+   `supportsScrollTimeline()` engine: a `.scroll-progress`-style recipe writes it via
+   `animation-timeline: scroll(self)` so a consumer's CSS ramp (the BC.W-SCROLL-CHROME
+   shrink/opacity) reads `--scroll-t` with ZERO JS (the dual-path single-writer — the JS
+   `progress` ref attaches NOTHING on a supporting engine). `inherits: true` (the
+   cascading-scalar idiom — a scroll-driven ancestor exposes the ramp to descendant
+   chrome, the `--ui-scale`/`--glass-level` pattern), distinct from the per-element
+   non-inheriting specular/progress cohort. `initial-value: 0` is the safe resting ramp
+   (the unregistered fallback paints it; on a non-supporting engine the JS reader writes
+   `progress.value` and the consumer reads the ref, not this custom). The typed
+   `<number>` lets the engine interpolate the ramp rather than the textual rep (a bare
+   unregistered var() snaps — the `--border-progress-fill`/`--dock-morph-t` precedent). */
+@property --scroll-t {
+    syntax: "<number>";
+    inherits: true;
+    initial-value: 0;
+}
+
+/* BC.W-SCROLL-CHROME — the floating-chrome COLLAPSE fraction. `--chrome-collapse-t`
+   is the 0..1 collapse scalar `useScrollChrome` ramps off the scroll reader's
+   direction + range (0 = fully expanded, 1 = fully collapsed). The `.scroll-chrome`
+   recipe (scroll-chrome.css) reads it for the COMPOSITOR shrink/quiet ramp:
+   `transform: scale()/translateY()` (the SPATIAL leg), `opacity` (bounded above a
+   never-invisible floor — the NN/g pale-fade trap forbidden), and the shadow LIFT as
+   content scrolls under (Apple "as text scrolls underneath, shadows become more
+   prominent"). It NEVER drives the resting `backdrop-filter` blur (the
+   W-DOCK-SHRINK-BLUR fence — the shrunken bar is crisp glass, not a blurry mess).
+   Registered typed so a bare `var()` INTERPOLATES the ramp rather than snapping (the
+   `--scroll-t`/`--dock-morph-t` precedent); `inherits: true` (the cascading-scalar
+   idiom — a scroll-driven ancestor exposes the collapse to descendant chrome, the
+   `--scroll-t`/`--glass-level` pattern, distinct from the per-element non-inheriting
+   specular cohort). `initial-value: 0` is the PERSISTENT rest (the iOS-27 default — a
+   bare chrome does NOT collapse; the unregistered fallback paints it too, so the
+   recipe is byte-identical to the expanded chrome when unwired). */
+@property --chrome-collapse-t {
+    syntax: "<number>";
+    inherits: true;
+    initial-value: 0;
+}

package/dist/styles/tokens/scale-paper.css

@@ -44,13 +44,30 @@
        (segmented/pill slider OR the underline rule) STRETCHES along its travel
        axis as it glides between tabs, then settles to fit — the Material 3
        ELASTIC / Apple Liquid-Glass "controls insist on animating themselves"
-       register, kept RESTRAINED. The deform is volume-preserving (stretch X,
-       compress Y in lockstep: `scale: var(--stretch) calc(1 / var(--stretch))`)
-       so it reads as an elastic warp, never a size pump. The cap holds the peak
-       LOW (1.08 ≈ +8%) — iOS 26.2 dialed motion DOWN; a high-frequency control
-       wants a whisper of squish, not a bounce. A consumer dials the elasticity
-       (or to 1 for none) without touching source. */
-    --tab-indicator-max-stretch: 1.08;
+       register. The deform is volume-preserving (stretch X, compress Y in lockstep:
+       `scale: var(--stretch) calc(1 / var(--stretch))`) so it reads as an elastic
+       warp, never a size pump. A consumer dials the elasticity (or to 1 for none)
+       without touching source.
+       The click travel-squish AND the liquid-tab pull-morph read this ONE cap (in
+       lockstep with the no-token floor DEFAULT_INDICATOR_MAX_STRETCH, the SOLE cap
+       source — constant + token never fork); a FAST pull visibly swells the pill so
+       the gel-squish READS as liquid — still capped LOW (the anti-taffy-pull bar;
+       the pill swells, never taffy-pulls).
+       BD.W-TABS-LIQUID — re-tuned 1.18 → 1.11. The `--tab-blob` area-inflation
+       channel now carries the "grow" (the 5-beat overshoot), so the per-axis stretch
+       drops: the FENCE is the COMPOSED visible bbox area `blob × stretch` ≤ ~1.14,
+       NOT the bare per-axis scalar. At blob ~1.045 (peak) × stretch ~1.11 (far jump)
+       the composed long-axis peak lands ≤ ~1.16 and the AREA (blob² since the squish
+       is volume-preserving) stays ≤ ~1.14 — lively, not taffy. */
+    --tab-indicator-max-stretch: 1.11;
+
+    /* BD.W-TABS-LIQUID — the area-inflation cap (the 5-beat blob's overshoot peak).
+       The 2nd `useLiquidFlex` channel drives `--tab-blob` toward this on the
+       grow-overshoot beat, then de-inflates to 1 at arrival (shrink-to-fit). Kept
+       LOW (~1.045) so the COMPOSED bbox area (blob × stretch, the volume-preserving
+       squish makes the area ≈ blob²) clears the ≤ ~1.14 anti-taffy fence. A consumer
+       dials it (or to 1 for no inflation) without touching source. */
+    --tab-indicator-blob-max: 1.045;
     /* BA.W-TABS — the indicator's OWN travel clock, re-pointed off the generic
        `--duration-normal` (0.3s, which dragged a ~190ms sub-pixel undershoot tail
        past the ~100ms 90%-travel point — the R10-2 "too slow" read) onto the
@@ -81,6 +98,26 @@
     --invalid-ring: 0 0 0 var(--focus-ring-width)
         color-mix(in srgb, var(--destructive) var(--invalid-ring-tint), transparent);
 
+    /* BC.W-RADIO-FIX — the selection-control STATE register (the `--focus-ring-shadow`
+       / `--invalid-ring` precedent: one named register, read everywhere — never a
+       per-control magic literal). The checks family (Checkbox + RadioGroupItem) reads
+       these TWO tokens so a re-tint is ONE edit, library-wide.
+
+       • `--control-ring` — the UNCHECKED outline. Post-BC.W-BLACK-BAR the general glass
+         rim is ≤4% warm-ink (`--glass-border-resting`), which reads as a near-invisible
+         hairline on a 16px circle — too faint to tell a rest radio from its siblings. So
+         the selection atoms are the NAMED exception (recorded in BC.W-BLACK-BAR's fences):
+         a slightly-stronger ~12% warm-ink outline that reads as a DEFINED circle at 16px
+         without re-introducing the dark `--primary` hairline. Warm-ink-derived (no gray,
+         BA.W-NO-GRAY).
+       • `--control-checked-bg` — the SELECTED glass-tinted fill. The recipe is minted
+         ONCE here (the anti-paste bite: a second inline `color-mix(... --primary 88% ...)`
+         literal on a checks atom reds — the recipe IS the token). Mirrors the
+         glass-`--primary` over the floating tier the Checkbox already speaks, so the ring
+         goes outline → filled glass disc (a real material step), warm-not-saturated. */
+    --control-ring: color-mix(in srgb, var(--foreground) 12%, transparent);
+    --control-checked-bg: color-mix(in srgb, var(--primary) 88%, var(--glass-bg-floating));
+
     /* ═══════════════════════════════════════════════
        §12 PAPER TEXTURES
        ═══════════════════════════════════════════════ */
@@ -94,29 +131,49 @@
     --paper-clean-texture: url("data:image/svg+xml,%3Csvg width='200' height='200' viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
     --paper-aged-texture: url("data:image/svg+xml,%3Csvg width='200' height='200' viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.5' numOctaves='5' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E");
 
-    /* BB.W-PAPER-GRID-TEXTURE — the GEOMETRIC half of the paper-cascade, the
-       peer of the organic turbulence above. Where `--paper-*-texture` are
-       feTurbulence grain fields, this is a two-frequency engineering-paper
-       grid: a 32px MINOR cell + a 128px MAJOR rule (the 4×-major blueprint
-       vocabulary the demo `.story-bg-grid` speaks, re-expressed as a library
-       token so a document-register card can opt its INTERIOR ground into the
-       line-field, not only the page margin). Unlike the organic SVG textures
-       (a baked-at-parse `opacity` URI), the grid is a STATIC `background-image`
-       gradient-STACK — a one-time compositor-cached paint, NEVER a per-frame
-       repaint. The line INK reads a `color-mix(… var(--foreground) N%, …)` so
-       it composes against the warm ink identity and re-tints with `--foreground`
-       in lockstep — never a hardcoded `hsl()` (the no-gray / token-first
-       floor). The ambient through-card strength is the ONE knob
-       `--paper-grid-opacity` (~0.08, the ask's "felt THROUGH the card ~0.08"):
-       the MINOR line ink scales off it directly and the MAJOR rule rides
-       `* 1.6` (the demo's 7%→12% engineering-paper weight step), so a consumer
-       retunes the whole grid from the single strength knob. (The strength lives
-       in the ink alpha, not a layer `opacity`, because the utility paints the
-       grid on the card's HOST `background-image` to avoid the two-pseudo-budget
-       contention with the grain `::after` / specular `::before` — see
-       cards.css.) */
+    /* BC.W-GRID-SIMPLE — the ONE engineering-graph-paper rhythm source. The
+       keyframes.js `EditorShell` magnitudes, re-expressed as `--grid-*` tokens:
+       a fine 1rem cell + a bolder 5rem major rule (the 5× engineering-graph
+       rhythm), each line a hairline-crisp single device-pixel. The pitch is
+       REM-RELATIVE — 1rem (16px at the default root) and 5rem (80px) divide
+       cleanly at DPR 1/2/3, so every line lands on a whole device-pixel column/
+       row (the anti-blur rule; the prior 28px/32px integer pitch landed on
+       sub-pixel boundaries at fractional-DPR zoom and the anti-aliaser softened
+       the 1px lines). The fine 3% is the user's "less busy substrate" — DELIBERATELY
+       BELOW the 10% legibility floor — and the major 11% is held STRICTLY ABOVE it
+       (the kf weight step). The line INK is a `color-mix(… var(--foreground) N%, …)`
+       so it re-tints with the theme by construction (warm-ink on light, lifting
+       off near-black on dark) — NO parallel `--grid-*-dark` family (the
+       `--foreground` flip re-resolves the mix; the cards.css dark-arm precedent).
+       A consumer dials it LARGER (`--grid-pitch: 1.25rem` / `--grid-major: 6.25rem`)
+       or quieter (the `--grid-line`/`--grid-line-major` strength knobs) at `:root`
+       — the token-first axis. This is the SINGLE rhythm source: the demo full-bleed
+       page grid (`.grid-bg`, story-hero.css) AND the library card-interior register
+       (`.paper-grid`, cards.css) both read it (the two-parallel-28px/32px-systems
+       fix). The LIQUID full-bleed sibling (`<PaperGrid>`, BC.W-VIZ-PAPERGRID)
+       re-uses the SAME rhythm — one pitch, two registers (static page-bg vs liquid). */
+    --grid-pitch: 1rem;
+    --grid-major: 5rem;
+    --grid-line: color-mix(in srgb, var(--foreground) 3%, transparent);
+    --grid-line-major: color-mix(in srgb, var(--foreground) 11%, transparent);
+
+    /* The library card-interior GEOMETRIC register (`.paper-grid`, cards.css) —
+       the document-register card's INTERIOR ground, felt THROUGH the glass tint.
+       It UNIFIES its pitch onto the shared `--grid-pitch` (the prior 32px literal
+       retired — ONE rhythm source) and keeps its OWN ambient through-card strength
+       register: the `--paper-grid-opacity` single knob (~0.08, the ask's "felt
+       THROUGH the card ~0.08"). DISTINCT from the page-bg 3%/11% tier above — a
+       card interior reads quieter than a full-bleed page wash — but the PITCH is
+       shared. The ink stays a `color-mix(… var(--foreground) N%, …)` (re-tints with
+       --foreground in lockstep, never a hardcoded literal — the no-gray floor); the
+       MAJOR rule rides `* 1.6` (the 0.08→0.128 weight step). The strength lives in
+       the ink alpha, not a layer `opacity`, because `.paper-grid` paints the grid on
+       the card's HOST `background-image` to avoid two-pseudo-budget contention with
+       the grain `::after` / specular `::before` (see cards.css). A STATIC raster —
+       gradient-stack `background-image`, one compositor-cached paint, never a
+       per-frame repaint. */
     --paper-grid-opacity: 0.08;
-    --paper-grid-texture-size: 32px;
+    --paper-grid-texture-size: var(--grid-pitch);
     --paper-grid-line: color-mix(
         in srgb,
         var(--foreground) calc(var(--paper-grid-opacity) * 100%),
@@ -245,7 +302,6 @@
 
     /* Heights — per-variant rail thickness */
     --timeline-scrubber-height: 0.5rem;       /*  8px — single-track scrubber */
-    --timeline-segmented-height: 0.625rem;    /* 10px — N adjacent bands */
     --timeline-continuous-height: 0.75rem;    /* 12px — ONE pill, N regions */
 
     /* Geometry — shared across all variants */