@mkbabb/glass-ui 4.0.0 → 4.1.0

package/src/styles/tokens/offsets.css

@@ -0,0 +1,143 @@
+/* tokens/offsets.css
+   §9 animation offsets — hover-lift offsets, the layout tokens, the public
+   --fade-scroll-width ramp, the dock content-overflow caps, the chassis
+   max-block-size/mobile dial-reserve, the popover width, the panel inner-padding
+   rung, the chart geometry.
+   Carved (BB.W-CARVE3) from the former tokens/offsets-sizing.css §9/§10 split;
+   @import-ed by tokens.css at offsets-sizing's old cascade slot, immediately
+   before sizing.css — adjacent same-selector :root blocks resolve identically,
+   so the dist is byte-isomorphic. See docs/precepts/design-idioms.md
+   §cohesion-aware partials. */
+:root {
+    /* ═══════════════════════════════════════════════
+       §9  ANIMATION OFFSETS
+       ═══════════════════════════════════════════════ */
+    /* Hover lift offsets */
+    --lift-sm: -1px;
+    --lift-md: -2px;
+    --lift-lg: -4px;
+
+    /* Layout tokens */
+    /* BA.W-FADING-SCROLL — `--fade-scroll-width` is the public edge-fade ramp
+       width knob for `<FadingScroll>` (inheriting, retunable on any ancestor).
+       It superseded the scroll-BLIND `.scroll-fade-*` static masks' knob
+       `--mask-fade-width`, which retired in a CLEAN BREAK (no alias) at the
+       4.1.0 cut — BB.W-SCROLL-FADE-RETIRE — alongside the static utilities. */
+    --fade-scroll-width: 1rem;
+    /* J.W3.C — dock content overflow caps. When dock content exceeds
+       these dimensions, the inner `.dock-layers` (horizontal) /
+       `.glass-dock.vertical` (rail) container scrolls with a
+       `.scroll-fade-{x,y}` mask-fade so the boundary feathers rather
+       than cliffs. Defaults clamp to 80vw / 80vh capped at sensible
+       desktop widths; consumers override per-dock by setting either
+       token directly on a `.glass-dock` instance. User findings 1 + 5a. */
+    /* AX.W04 — `--dock-max-inline-size` is the canonical inline cap EVERY overflow
+       strategy reads: `overflow="scroll"` scrolls past it, and `overflow="wrap"`
+       wraps to N rows on the over-cap crossing (the dock shrink-wraps to content,
+       `max-inline-size` caps that intrinsic width at this token). The prior
+       `--dock-overflow-bp: 640px` viewport-breakpoint token (the magic-640
+       snap-back) is DELETED — the wrap is content-driven, not viewport-coupled, so
+       there is no breakpoint threshold to name. */
+    --dock-max-inline-size: min(80vw, 64rem);
+    --dock-max-block-size: min(80vh, 48rem);
+
+    /* AB.W1.T1 — chassis max-block-size guardrail.
+       Maximum block size a centred consumer-app card may consume while
+       preserving the inline dock footprint. The recipe subtracts the
+       consumer-owned `--dock-footer-space` (dock height + dock inset +
+       card-edge inset) and `--page-padding-top` from the dynamic viewport,
+       then takes one further rem of breathing room so the card never
+       butts the dock — the user mandate is `≥ 1rem visible gap above
+       dock`. Both consumer tokens carry safe fallbacks for callers that
+       have not declared them.
+
+       Consumers should shrink internal regions (meter, readout, timeline)
+       before falling back to scroll. This token is a guardrail against
+       chassis overflow, NOT a license to make the card scroll as the
+       default solution; clamp-first / no-scroll-first is the canon.
+       See DESIGN.md `## Chassis sizing — dock-adjusted viewport`. */
+    --chassis-max-block-size: calc(
+        100dvh
+        - var(--dock-footer-space, 5.75rem)
+        - var(--page-padding-top, 0rem)
+        - 1rem
+    );
+    /* R0G-2 (AO.W3/W4) — chassis mobile dial-reserve canon. instrument-
+       chassis.css's mobile breakpoint reserves the dial's final box from
+       frame 0 via these vars (with the same values as inline fallbacks, the
+       safety net). Token-first home so the vars resolve canonically. */
+    --instrument-dial-min-height-mobile: 24rem;
+    --instrument-dial-meter-reserve-mobile: minmax(0, 1fr);
+    /* BB.W-DESKTOP-RESERVE (B3) — the chassis WIDE-AXIS (desktop) dial reserve
+       canon, the complement of the mobile rung above. The mobile reflow
+       reserves the dial box from frame 0 via the rung above; the WIDE box axis
+       had NO library reserve, so on desktop a `1fr` meter row collapsed to its
+       pre-hydration intrinsic `<canvas>` size and grew on hydration, pushing
+       the results card + dock down (the measured desktop-1440 CLS the speedtest
+       App.vue interim authored a local `min-block-size` to cure). This rung is
+       the library home: the dial cell reserves its settled height from frame 0
+       on the wide axis, so the inner card mounts into an already-correct
+       envelope (CLS≈0, no post-hydration growth).
+
+       The default IS `--chassis-max-block-size` — the library's own
+       chassis-sizing guardrail (the dock-adjusted dynamic-viewport budget a
+       centred consumer card clamps to), a pure CSS calc that resolves at first
+       paint with NO JS. This is the DESKTOP DIAL: a consumer whose meter is a
+       different block-size retunes THIS token (the speedtest-specific value
+       stays in speedtest — presets-in-consumers). A consumer deletes its local
+       App.vue wide-axis interim once it consumes this rung. Both knobs are CSS
+       custom properties (token-first), the inline fallback in
+       instrument-chassis.css carries the contract if the token is unset. */
+    --instrument-dial-min-block-size-desktop: var(--chassis-max-block-size);
+
+    --max-width-input: 24rem;
+    --input-min-width-sm: 5rem;
+    --min-width-input-sm: var(--input-min-width-sm);
+    /* AU.W8b.4 — canonical popover width (Combobox list + anchor). Lifts the
+       `w-[200px]` arbitrary-value wrap to the `w-popover` @theme utility. */
+    --popover-width: 200px;
+    /* AZ.R5-4 — the ONE panel inner-padding rung (the consumer-verified "the
+       popover/dropdown content reads TIGHT" finding). The floating-panel +
+       DropdownMenuContent recipes read THIS token for their inner pad instead of
+       the prior hand-set `p-1`/literal, so a consumer retunes every teleported
+       menu/panel surface from one override. The comfortable default is `0.375rem`
+       (a half-rung over the prior 0.25rem tight floor — comfortable both modes
+       without over-padding a dense menu list). BB.W-CARD-PAD — the dead
+       `--panel-padding-roomy` (1rem) is DELETED here (clean break, no alias): it
+       had ZERO `var(--panel-padding-roomy)` consumers (the prose-popover register
+       it claimed to back never read it — PopoverContent paints `p-4` directly), so
+       it was an orphan declaration the golden-padding cut prunes. */
+    --panel-padding:       0.375rem;
+
+    /* BC.W-OVERLAY-UNIFORM — the token-BACKING of the raw floating-overlay
+       literals (the token-beats-prop seam). Each defaults to the byte-identical
+       HEAD magnitude so a bare overlay is pixel-unchanged; a consumer retunes
+       EVERY overlay's min-width / max-block / tooltip type / select chevron from
+       ONE `:root` override (the uniformity payoff). These are token-backings of
+       EXISTING raw literals (`min-w-32` / `max-h-[60vh]` / tooltip `text-sm` /
+       chevron `opacity-50`) — NOT a new compositing register (the `surface` axis
+       + the φ `--overlay-pad-*` ladder are THREADED, not re-minted). */
+    /* `min-w-32` = 32 × 0.25rem = 8rem — the dropdown/select/context-menu min-width. */
+    --overlay-min-width: 8rem;
+    /* The collision-bounded max-block ceiling the dropdown (`max-h-[60vh]`) +
+       command list (`max-h-[300px]`) read. Defaults to 60vh — the viewport-
+       relative ceiling so a long menu scrolls inside the overlay rather than
+       running off-screen. (The Select precompiled `[data-slot="select-content"]`
+       max-height in select.css is the BA.W-EMISSION consumer-reach floor — KEPT,
+       not threaded here; see the census on-the-line row.) */
+    --overlay-max-block: 60vh;
+    /* The tooltip type rung — the golden quiet caption register (√φ ladder), the
+       token-backing of the bare `text-sm` on TooltipContent (the overlay share of
+       class 3). Defaults to `--type-caption` so the compact tooltip chip reads the
+       house caption scale; a consumer retunes the tooltip type from `:root`. */
+    --tooltip-text: var(--type-caption);
+    /* The Select trigger chevron opacity — the token-backing of the bare
+       `opacity-50` so a consumer retunes the affordance prominence from `:root`. */
+    --select-chevron-opacity: 0.5;
+
+    --chart-height-compact: 15rem;
+    --chart-height-default: 22.5rem;
+    --chart-height-large: 25rem;
+    --chart-margin: 1.25rem;
+    --paper-texture-size: 200px 200px;
+}

package/src/styles/tokens/on-glass-fg.css

@@ -0,0 +1,39 @@
+/* tokens/on-glass-fg.css
+   The surface-aware FOREGROUND register (BB.W-ON-GLASS-FG — N13). Carved out of
+   tokens/glass.css to keep that partial under the no-god-module bound; @import-ed
+   by tokens.css in cascade order AFTER glass.css (the rungs derive against the
+   glass-bg-quiet composite, so they must resolve after the §8 ladder). Same :root
+   cascade context as its sibling token partials.
+
+   A THREE-RUNG on-glass family whose contrast TARGET is the COMPOSITED content-
+   tier glass FILL, not the canvas. The glass-first MAXIMAL default (AX.W54) makes
+   a caption/well/track rendering over a TRANSLUCENT content plate the common case;
+   --muted-foreground (= --neutral-5, "AA vs page") collapses on its OWN surface
+   (the speedtest ask measured 1.15-3.29:1 in dark theme — the "whisper collapse").
+
+   This is the THIRD state the BA adaptive-glass seam never expressed (the SAME
+   --glass-tint-* cascade context, NOT a fork): (a) bright/darkened plate → full
+   ink (the @container bright bucket + the overlay band, shipped — glass/ladder.css);
+   (b) opaque canvas → page-muted (--neutral-5, kept); (c) THIS — calm translucent
+   glass plate → a register BETWEEN page-muted and full-ink (legible-AND-subordinate;
+   a caption stays quieter than body ink WHILE clearing AA on the composited plate).
+
+   The values are DERIVED against the LIBRARY composite (--card over --neutral-0
+   through --glass-bg-quiet at --glass-tint-strength-floor), warm-amber (the BA.W-
+   NO-GRAY identity, OKLab gray floor cleared at the warm hue) — NOT copied from
+   the slides deck.css §1 reference (the deck's NC-State-red warm-cream literals
+   hsl(24 6% 44%)/hsl(45 12% 64%) are a CONSUMER divergence; the library re-derives).
+   NO ppmycota/demo hue. The page-muted register (--muted-foreground/-strong) is
+   UNTOUCHED — the on-glass rungs are NET-NEW; the glass/ladder.css calm-tier rule
+   re-points --muted-foreground → these on the engaged plate, no per-site edit.
+
+   PLAIN PER-MODE ARM idiom (light here, dark in tokens/dark-arm.css) — NOT
+   light-dark(): the house pattern every explicit-color token follows (a re-
+   resolution under .dark, not a single-declaration light-dark() that an inset-
+   shadow downstream could collapse — the light-dark() inset-shadow trap). */
+:root {
+    --on-glass-muted:        hsl(30 26% 35%);   /* the muted caption rung over the composited cream plate (5.76:1 vs plate; darker than --neutral-5 L40) */
+    --on-glass-muted-strong: hsl(28 28% 28%);   /* the -strong secondary rung, one step more present (7.79:1 vs plate) */
+    --input-on-glass:        hsl(36 40% 92%);   /* the form-well fill over glass — grounded warm so the input TEXT (--foreground) reads against a stable base (14.9:1) */
+    --progress-track-on-glass: hsl(34 24% 84%); /* the recessed meter track over glass — a warm channel distinct from the fill silhouette */
+}

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

@@ -41,6 +41,21 @@
     initial-value: 0%;
 }
 
+/* BB.W-BORDER-PROGRESS — the masked-conic BORDER ring's sweep fill. The conic
+   gradient (border-progress.css) reads `--border-progress-fill` as the swept
+   extent (`conic-gradient(…, transparent var(--border-progress-fill), …)`), so a
+   determinate progress INTERPOLATES the border ring (a bare unregistered var()
+   snaps the sweep; the registered typed <percentage> lets the engine animate the
+   gradient stop). `inherits: false` — each ring owns its own fill (the per-surface
+   ownership the specular cohort uses; a ringed parent must not push its fill onto a
+   child). `initial-value: 0%` is the safe resting ring (the unregistered fallback
+   paints it; the cross-fade collapses to it on a non-supporting engine). */
+@property --border-progress-fill {
+    syntax: "<percentage>";
+    inherits: false;
+    initial-value: 0%;
+}
+
 @property --phase-tint-amount {
     syntax: "<percentage>";
     inherits: true;
@@ -91,6 +106,84 @@
     initial-value: 0;
 }
 
+/* BB.W-LENSING — the per-surface EDGE-glint angle channel. `--specular-angle` is
+   the pointer angle-from-center the edge-glint conic sweep reads (material.css);
+   `useSpecularPointer` writes it (the angle feed). `inherits: false` — the
+   per-element ownership discipline of the specular cohort above (each pseudo owns
+   its typed value; a parent's angle must never bleed into a child glass surface).
+   `initial-value: 0deg` is the static rest position (the rim glint sits top when
+   unwired — no ambient drift, no blowout). */
+@property --specular-angle {
+    syntax: "<angle>";
+    inherits: false;
+    initial-value: 0deg;
+}
+
+/* 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
+   `backdrop-filter` (it emitted three tokens, not one url) AND broke consumer bundlers
+   (the tail `url("'…")` mis-resolved as a file path); a CSS url() string token cannot
+   carry a substituted `var()`, so a dynamic `scale` inside the mandatory single
+   self-contained data-URI is structurally impossible. The `scale` is now BAKED at 28
+   (the resting bend, byte-identical) — no axis, no `@property` reg. */
+
+/* BB.W-GLASS-ACCENT — the THIRD disjoint glass axis: the per-INSTANCE
+   CHROMATIC-RIM tint. `--glass-accent` is a complete `<color>` (a consumer DATA
+   hue) that OKLab-tints a glass surface's RIM (the `--glass-material-rim` inset
+   ring + the per-rung `--glass-border-*`) and the `::before` specular catch-light
+   CORE — so the §F1 data-keyed colored hover (a chart cell whose surface glows
+   with that datum's series hue) is a ONE-LINE seam (`--glass-accent: <hue>;
+   --glass-accent-strength: <N%>` on the instance), not a hand-threaded
+   `border-color` + inline catch-light per consumer.
+
+   DISTINCT-not-fork of W55's `--glass-tint-source` (the WHOLE-PLATE BACKGROUND
+   legibility darken toward `--glass-tint-ink`): the accent is the RIM+GLINT
+   chromatic DECORATION axis (toward a consumer DATA hue, per-instance), it NEVER
+   writes the W55 cohort and NEVER tints the plate background. Three disjoint glass
+   axes: LEVEL (opacity+blur, AX.W54) · TINT (whole-plate legibility, W55) · ACCENT
+   (per-instance chromatic rim+glint, this wave).
+
+   • --glass-accent (<color>) — the consumer data hue. `inherits: true` (the
+     `--glass-level`-style cascading scalar — a host sets it on an ancestor to tint
+     a sub-tree; a consumer sets it per-INSTANCE on the surface). `initial-value:
+     transparent` is the NEUTRAL IDENTITY: a `color-mix(in oklab, X, transparent N)`
+     is byte-identical X at the resting end, so an UNSET surface paints exactly
+     today's warm-ink rim + warm-cream catch-light (the W2 neutral-fallback floor).
+
+   • --glass-accent-strength (<percentage>) — the bounded knob. `inherits: true`
+     (rides the accent down the same sub-tree). `initial-value: 0%` so the mix is a
+     provable no-op when unset (`color-mix(in oklab, X, <accent> 0%)` === X). The
+     consumer-set ceiling is a WHISPER at the rim, not a flooded plate — the demo
+     specimens engage ~40-55% (the rim/glint reads the hue while the warm-cream core
+     + the AA legibility survive; the `--glass-tint-strength-aa` ≤24% bounding
+     precedent, lifted here because the accent rides the THIN rim/glint not the
+     whole plate). A malformed override CLAMPS to 0% (the typed fail-safe). */
+@property --glass-accent {
+    syntax: "<color>";
+    inherits: true;
+    initial-value: transparent;
+}
+
+@property --glass-accent-strength {
+    syntax: "<percentage>";
+    inherits: true;
+    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,
@@ -114,6 +207,47 @@
     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
+   idiom, distinct from the per-element `inherits: false` specular cohort). The
+   deep recipe (tokens/glass-deep.css) LERPs both the blur radius AND the saturate
+   between the calm `floating` endpoint (depth 0 ≡ the calm ceiling) and the Apple-
+   deep endpoint (depth 1 ≡ saturate 1.5 / blur 16px), so the deep blur is
+   `--glass-depth`-DRIVEN (the D1 axis assert — never a baked literal) and animates
+   smoothly. `initial-value: 1` is the resting deep magnitude: a `.glass-deep`
+   surface paints at the full Apple-deep register by default; a consumer dials
+   `--glass-depth: 0.5` to land it half-way to the calm floating rung. SEPARATE
+   from `--glass-level` (opacity+blur clarity), `--glass-tint-*` (legibility), and
+   `--glass-refract` (lens displacement) — the disjoint depth axis. The deep tier
+   COMPOSES `--glass-level` too (the deep blur scales it), so the opaque escape +
+   the a11y brackets reach the deep plate through the ONE level path. */
+@property --glass-depth {
+    syntax: "<number>";
+    inherits: true;
+    initial-value: 1;
+}
+
 /* AX.W51 D18 — the master comfortable-sizing scalar registered typed. The
    `<number>` syntax guarantees `calc(<base> * var(--ui-scale))` is always valid (a
    malformed override CLAMPS to the initial value 1, not an invalidated calc — the
@@ -152,6 +286,13 @@
     --glass-specular-intensity-rest: 0;
     --glass-specular-intensity-hover: 0.1;
     --glass-specular-intensity-active: 0.16;
+    /* BB.W-BUTTON-GLASS (d) — the BUTTON-SCOPED hover gleam bump. The lit glass
+       button should read a notch brighter at the grazing edge than the global
+       hover whisper (0.10). `.btn-glass` re-points its own
+       `--glass-specular-intensity-hover` to this knob (surfaces.css), so ONLY the
+       button lifts — the global cohort above is UNTOUCHED. A consumer retints the
+       button gleam from this ONE override. */
+    --glass-specular-btn-hover: 0.14;
 }
 
 /* Over the deep canvas `plus-lighter` still lifts, so the dark arm runs a touch
@@ -159,4 +300,123 @@
 .dark {
     --glass-specular-intensity-hover: 0.08;
     --glass-specular-intensity-active: 0.12;
+    /* The button bump rides a touch softer in dark too (the dark hover is 0.08;
+       the button reads ~0.11, still a notch above the global whisper). */
+    --glass-specular-btn-hover: 0.11;
+}
+
+/* BB.W-BUTTON-GLASS (b)/(e) — the press DRIVE scalar. ONE typed 0..1 custom
+   property Button.vue writes off the `useSpringPress` spring (0 released → 1
+   pressed, with the ~5% overshoot the spring carries). It is the SINGLE drive the
+   press SQUISH (the `useLiquidFlex` reciprocal X/Y deform), the coupled specular/
+   brightness lift, and the optional `.glass-refract` lens-swell all read — the "one
+   drive, the glass deforms under press" read. Registered typed so a `transition`/
+   downstream `calc()` interpolates the VALUE (number), not the text. `inherits:
+   true` so the host-written value reaches the `.glass-material::before` pseudo +
+   the coupled rules. `initial-value: 0` so an unwired/SSR button is the static
+   rest frame (the no-JS CSS `.tap-squish` scale floor still presses). */
+@property --glass-btn-press-t {
+    syntax: "<number>";
+    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;
 }