@mkbabb/glass-ui 5.0.0 → 7.0.0

package/src/styles/transitions.css

@@ -1,228 +0,0 @@
-/* Reusable Vue <Transition> class sets.
- *
- * Q.W4 Lane C (Q-sty-4): these class rules are wrapped in
- * `@layer components` so they share the cascade layer of every other
- * recipe sheet. Unlayered rules land in the implicit unlayered origin,
- * which outranks every `@layer` block at equal specificity — an
- * asymmetry that let a Vue <Transition> class silently outrank a
- * `@layer components` recipe. `animations.css` stays unlayered (pure
- * `@keyframes`, layer-agnostic by spec). */
-
-@layer components {
-    /* ── Fade (symmetric, fast) ── */
-    .fade-enter-active,
-    .fade-leave-active {
-        transition: opacity var(--duration-fast) var(--ease-standard);
-    }
-    .fade-enter-from,
-    .fade-leave-to {
-        opacity: 0;
-    }
-
-    /* BI.W-REGISTER-TABLE — `fade-slide` RETIRED (census-dead: 0 src/ consumers; the
-       demo showcase tile is deleted with it). Clean break, no alias — an overlay
-       entrance rides `.glass-reveal` + its `data-reveal` register, not a hand-rolled
-       Vue-<Transition> recipe. */
-
-    /* ── Route-enter (BG.W-ROUTE-TRANSITION — the bare keyed atomic swap entrance) ──
-     *
-     * The AppShell route swap is a bare keyed `<component :is :key="route.path"
-     * class="route-enter">` — NO Vue `<Transition>` wrapper (the swap unmounts the old +
-     * mounts the new in ONE atomic patch, so it cannot wedge by construction; the
-     * leave-window race + the `.scroll-build`×`<Transition>` collision that froze the
-     * route are structurally impossible). The liquid enter is therefore a pure ON-MOUNT
-     * `@keyframes` on the keyed component — it lands on EVERY route root (StoryPage,
-     * SectionLanding, hero, intro, auth-shell, NotFound), closing the old
-     * `.story-page-article`-only selector gap. The iOS-NavStack vertical settle: a
-     * SPATIAL spring rise (snappy, P2/P4), fade COUPLED to the transform (P3),
-     * `backwards` fill-mode so the from-state holds before the first frame (no
-     * flash-of-final).
-     *
-     * BG.W-CORNER-ALIAS-KILL — the fill is `backwards`, NEVER `both`/`forwards`.
-     * The route root is the universal ancestor: a `both` fill keeps APPLYING the
-     * `to` keyframe's transform forever (the engine reports a filled identity
-     * `matrix(1,0,0,1,0,0)` — a computed transform ≠ `none`), which makes the
-     * route root a PERMANENT fixed-position containing block (CSS Transforms
-     * §containing-block) and silently re-parents every `position: fixed`
-     * descendant (the full-bleed field wash trapped to the article box — the
-     * white square-corner wedge behind every rounded card). `to` ≡ base
-     * (opacity 1 / transform none), so `backwards` is paint-identical at rest
-     * and RELEASES the transform channel at settle.
-     *
-     * ── BI.W-E10-AURORA-ENTRANCE — THE FIELD / CONTENT SPLIT ──────────────────
-     * `gl-route-enter` is the CONTENT-enter register ONLY — the opacity fade is
-     * COUPLED to the transform rise (P3), so it is a content settle, NEVER an
-     * atomic whole-root neutral fade of the FIELD. The full-bleed page FIELD is a
-     * frame-0 PERSISTENT layer that lives OUTSIDE this animated subtree: the shell
-     * `<Aurora>` mounts at the AppShell root ABOVE the keyed route component, and a
-     * hero route's own full-bleed field `<Teleport>`s to `<body>` (the same
-     * corner-alias escape above). So the field paints its palette-derived GROUND
-     * from frame 0 and the CONTENT enters OVER the already-colored field — the
-     * content fades/rises, the field does NOT fade in from a repulsive gray
-     * (UF-E10 / value.js T-60). This register must never be re-scoped to fade a
-     * `position: fixed` full-bleed field: keep the field a persistent frame-0
-     * layer and the enter content-only. */
-    .route-enter {
-        animation: gl-route-enter var(--spring-snappy-duration) var(--spring-snappy) backwards;
-    }
-
-    /* BI.W-REGISTER-TABLE — `dialog-scale` / `pop` / `dropdown` RETIRED (census-dead:
-       0 src/ consumers each; the demo showcase tiles are deleted with them). Clean
-       break, no alias. The overlay/menu entrances they duplicated now ride the ONE
-       `.glass-reveal` recipe bound by `data-reveal` (enter-overlay / enter-menu) — the
-       register table replaces the per-recipe fork. `pane-swap` (below, live dock
-       consumer) + `fade` / `tab-fade` / `metric-swap` are KEPT. */
-
-    /* ── Tab fade ── */
-    .tab-fade-enter-active,
-    .tab-fade-leave-active {
-        transition: opacity var(--duration-fast) var(--ease-standard);
-    }
-    .tab-fade-enter-from,
-    .tab-fade-leave-to {
-        opacity: 0;
-    }
-
-    /* ── Pane swap (horizontal content replacement, mode="out-in") ── */
-    .pane-swap-enter-active {
-        transition:
-            opacity var(--duration-normal) var(--ease-out),
-            transform var(--spring-smooth-duration) var(--spring-smooth);
-    }
-    .pane-swap-leave-active {
-        transition:
-            opacity var(--duration-normal) var(--ease-out),
-            transform var(--duration-normal) var(--ease-out);
-    }
-    .pane-swap-enter-from {
-        opacity: 0;
-        transform: translateX(0.75rem);
-    }
-    .pane-swap-leave-to {
-        opacity: 0;
-        transform: translateX(-0.75rem);
-    }
-
-    /* ── Metric swap (compact number/value crossfade) ── */
-    .metric-swap-enter-active {
-        transition:
-            opacity var(--duration-normal) var(--ease-out),
-            transform var(--spring-smooth-duration) var(--spring-smooth);
-    }
-    .metric-swap-leave-active {
-        transition:
-            opacity var(--duration-fast) var(--ease-standard),
-            transform var(--duration-fast) var(--ease-standard);
-    }
-    .metric-swap-enter-from,
-    .metric-swap-leave-to {
-        opacity: 0;
-        transform: translateY(0.375rem) scale(0.95);
-    }
-
-    /* ── Dock entrance utility ── */
-    .dock-in {
-        animation: dock-in var(--spring-snappy-duration) var(--spring-snappy) both;
-        transform-origin: center bottom;
-    }
-
-    /* ── Toast contract (BI.W-REGISTER-TABLE — the enter-transient binding) ──
-     *
-     * `<Toast>` (reka-ui `ToastRoot`, components/toast/Toast.vue) MATERIALIZES via
-     * the `enter-transient` register — `.glass-reveal[data-reveal="transient"]` — a
-     * CENTER-SEED bloom (scale-from ~0.5, decongest-blur, fade, on the gentle transient
-     * spring; MOTION-LADDER M5), NOT the retired slide-in-from-viewport-edge. The reka
-     * `tw-animate-css` data-state choreography (`data-[state=open]:animate-in` /
-     * `animate-out` / `slide-in-from-*-full` / `fade-out-80`) + the Toast's own
-     * `transition-[opacity,transform]` are RETIRED (clean break, no alias). The prior
-     * AY.W-MOTION "§6 DELIBERATE KEEP" exemption is SUPERSEDED: every glass-ui overlay now
-     * speaks ONE enter grammar, the register table. `.glass-reveal` owns:
-     *
-     *   • ENTRANCE — the @starting-style bloom (transform-origin center → the surface
-     *     coalesces from its own seed), on the transient spring + its 2%-settle clock.
-     *   • DWELL — no motion (the READING window; default 5000ms via use-toast.ts).
-     *   • EXIT — the `glass-reveal-out` keyframe reka's `usePresence` awaits, on the tight
-     *     `--exit-transient-duration` (100ms) no-overshoot `--ease-out`.
-     *
-     * The swipe-drag gesture is PRESERVED — reka drives the `translate-x` (with
-     * `transition-none` during the active move); the reveal's own `translate` leg springs
-     * the cancel/settle back. `tw-animate-css` stays a shipped optionalPeer for the other
-     * overlays' animate-in paths, but the Toast no longer depends on it. PRM is honoured
-     * by `.glass-reveal`'s own reduced-motion carve (glass/reveal.css) — scale/translate/
-     * blur snap, the fade survives. This block IS the closure for the toast contract row.
-     */
-
-    /* ── Reduced motion: preserve fades, remove transform/scale motion ── */
-    @media (prefers-reduced-motion: reduce) {
-        .fade-enter-active,
-        .fade-leave-active,
-        .tab-fade-enter-active,
-        .tab-fade-leave-active,
-        .pane-swap-enter-active,
-        .pane-swap-leave-active,
-        .metric-swap-enter-active,
-        .metric-swap-leave-active {
-            /* Fades are safe — keep them but shorten */
-            transition-duration: 0.1s !important;
-        }
-
-        .pane-swap-enter-active,
-        .pane-swap-leave-active,
-        .metric-swap-enter-active,
-        .metric-swap-leave-active {
-            /* Keep opacity transition, eliminate transform motion */
-            transition-property: opacity !important;
-            transition-duration: 0.15s !important;
-            animation-duration: 0.01ms !important;
-        }
-
-        .pane-swap-enter-from,
-        .pane-swap-leave-to,
-        .metric-swap-enter-from,
-        .metric-swap-leave-to {
-            transform: none !important;
-        }
-
-        .dock-in {
-            animation-duration: 0.01ms !important;
-            transform: none !important;
-        }
-
-        /* P6 — route-enter KEEPS the fade, DROPS the spatial rise (the vestibular
-           floor; the page settles to its terminal state with zero transform frames).
-           `backwards` fill (BG.W-CORNER-ALIAS-KILL — the same release discipline;
-           opacity-only here, but ONE fill register across both arms). */
-        .route-enter {
-            animation: gl-route-fade var(--duration-fast) var(--ease-out) backwards;
-        }
-    }
-}
-
-/* The route-enter keyframes — unlayered (pure `@keyframes`, layer-agnostic, the
-   animations.css convention). Referenced by the `.route-enter` recipe above.
-
-   BG.W-ROUTE-ENTER-VISIBLE (fix b) — the rise lifts 0.75rem (12px) → 1.25rem (20px),
-   the perceptible 16–24px band the §2.6 fix names. 12px was sub-perceptual once the
-   route-chunk stall (now pre-resolved off the beat, router.ts fix a) is out of the
-   clock — the surviving rise-tail read as a plain fade. 20px on --spring-snappy +
-   `backwards` (P2/P4 — the SPATIAL leg on the spring, the from-state held before the
-   first composited frame) makes the decelerating vertical settle READ in paint. The
-   distance is the sole change; the spring clock + fill register are untouched. */
-@keyframes gl-route-enter {
-    from {
-        opacity: 0;
-        transform: translateY(1.25rem);
-    }
-    to {
-        opacity: 1;
-        transform: none;
-    }
-}
-@keyframes gl-route-fade {
-    from {
-        opacity: 0;
-    }
-    to {
-        opacity: 1;
-    }
-}

package/src/styles/typography/scale.css

@@ -1,163 +0,0 @@
-/* typography/scale.css — the OFL face FILES + the :root --type-* SCALE tokens.
- *
- * Carved from typography.css (BA.W-CARVE2) — the FACE declarations (the
- * calibrated `local()` fallback faces for Plus Jakarta Sans + Fira Code) and
- * the √φ scale-number :root block. @import-ed FIRST by the typography.css thin
- * root (the faces + scale numbers must precede the semantic classes that read
- * them). The carve moves rules in the SAME cascade position → byte-isomorphic
- * dist (the no-god-module import-order gate is the witness). */
-
-/* ═══════════════════════════════════════════════
-   OFL FACE FILES — Plus Jakarta Sans (brand display)
-   ═══════════════════════════════════════════════ */
-
-/* The payload-bearing "Plus Jakarta Sans" faces live in `fonts.css`
-   (`@mkbabb/glass-ui/styles/fonts`), split off the critical entry path so
-   `./styles` does not carry the ~99 KB-gzipped font binary. The calibrated
-   `local()` fallback face below carries NO payload, stays on the critical
-   path, and paints during the `font-display: optional` window. Its metric
-   overrides (per system face) were derived via @capsizecss/core's
-   `createFontStack` against the bundled latin woff2 — the swap is metrically
-   neutral (no CLS). */
-@font-face {
-    font-family: "Plus Jakarta Sans Fallback";
-    src:
-        local("System Font"), local(".SFNS-Regular"), local(".SFNSText-Regular"),
-        local("-apple-system");
-    ascent-override: 92.3784%;
-    descent-override: 19.7572%;
-    size-adjust: 112.3639%;
-}
-@font-face {
-    font-family: "Plus Jakarta Sans Fallback";
-    src: local("Segoe UI"), local("SegoeUI");
-    ascent-override: 98.3348%;
-    descent-override: 21.0311%;
-    size-adjust: 105.5577%;
-}
-@font-face {
-    font-family: "Plus Jakarta Sans Fallback";
-    src: local("Roboto Regular"), local("Roboto-Regular");
-    ascent-override: 98.6597%;
-    descent-override: 21.1006%;
-    size-adjust: 105.2101%;
-}
-@font-face {
-    font-family: "Plus Jakarta Sans Fallback";
-    src: local("Arial"), local("ArialMT");
-    ascent-override: 98.8763%;
-    descent-override: 21.147%;
-    line-gap-override: 0%;
-    size-adjust: 104.9796%;
-}
-
-/* ═══════════════════════════════════════════════
-   OFL FACE FILES — Fira Code (canonical mono)
-   ═══════════════════════════════════════════════ */
-
-/* The payload-bearing "Fira Code" faces live in `fonts.css`
-   (`@mkbabb/glass-ui/styles/fonts`), split off the critical entry path. The
-   calibrated `local()` fallback face below carries NO payload, stays on the
-   critical path, and covers the `font-display: swap` window. Its metric
-   overrides reference Roboto Mono (the platform monos cluster within ~2%);
-   size-adjust ≈ 1.0 makes the swap geometrically transparent. */
-@font-face {
-    font-family: "Fira Code Fallback";
-    src:
-        local("SF Mono"), local("SFMono-Regular"), local("Menlo"), local("Consolas"),
-        local("Courier New"), local("Roboto Mono Regular");
-    ascent-override: 99.0161%;
-    descent-override: 32.2052%;
-    size-adjust: 99.9837%;
-}
-
-:root {
-    /* Font family tokens. `--font-text` / `--font-display` / `--font-serif` /
-       `--font-mono` are NOT declared here — their source-of-truth lives in
-       tokens.css §0 (`--font-stack-*`), bridged to Tailwind via theme.css's
-       `@theme` block; declaring `:root` literals here would shadow consumer
-       `@theme` overrides (un-layered `:root` wins over `@layer theme`). The
-       self-hosted faces above expose `"Plus Jakarta Sans"` + `"Fira Code"`,
-       each pairing with a calibrated `"... Fallback"`. The brand text register
-       (Plus Jakarta Sans) engages by default for every consumer; --font-mono
-       references `"Fira Code"` first then the fallback chain. */
-
-    /* Scale tokens */
-    --type-admin-label: 0.625rem; /* 10px — fixed sub-control micro (NOT fluid) */
-    --type-micro: 0.6875rem; /* 11px — fixed sub-control micro (NOT fluid) */
-    /* BODY/CONTROL register (AY.W-SCALE1 — the desktop-fluid half of corpus #4):
-       a GENTLE clamp() viewport base so the control/body register grows ~1-2 steps
-       on a wide display (the 27" "font too small" the user flagged) WITHOUT a
-       media-query staircase. The <min> of every clamp is the rung's prior fixed rem
-       — byte-identical at narrow/mobile (no shipped-narrow reflow; the coarse 1.5×
-       --ui-scale still lifts the comfort axis ON TOP). The vw slope is the body
-       register's GENTLE slope (not the φ-display ladder's aggressive vw) — the
-       "non-contrived" bar. The vw fluid term lives HERE (the typographic base),
-       exactly ONCE; the --ui-scale comfort scalar multiplies it exactly ONCE LATER
-       (tokens.css --control-text/-sm) — NO double-vw under coarse. The φ-identity
-       rungs below (--type-subheading/-heading/-title + the --type-display-* ladder)
-       are EXCLUDED — a hero/title is a typographic identity, not a control. */
-    --type-caption: clamp(
-        0.75rem,
-        0.71rem + 0.21vw,
-        1rem
-    ); /* 12px floor — --control-text-sm source */
-    --type-small: clamp(
-        0.875rem,
-        0.8rem + 0.25vw,
-        1.25rem
-    ); /* 14px floor — --control-text source (the workhorse) */
-    --type-body: clamp(
-        1rem,
-        0.92rem + 0.27vw,
-        1.375rem
-    ); /* 16px floor — global body cascade */
-    --type-prose: clamp(
-        1.125rem,
-        1.04rem + 0.28vw,
-        1.5rem
-    ); /* 18px floor — long-form prose */
-    --type-subheading: 1.272rem; /* 20.4px — √φ */
-    --type-heading: 1.618rem; /* 25.9px — φ */
-    --type-title: 2.058rem; /* 32.9px — φ^(3/2) */
-    --type-display-1: clamp(1.618rem, 1.2rem + 1.6vw, 2.618rem); /* φ^2 */
-    --type-display-2: clamp(2.058rem, 1.5rem + 2.2vw, 3.33rem); /* φ^(5/2) */
-    --type-display-3: clamp(2.618rem, 2rem + 3vw, 4.236rem); /* φ^3 */
-    --type-display-4: clamp(3.33rem, 2.5rem + 4vw, 5.382rem); /* φ^(7/2) */
-    --type-display-5: clamp(4.236rem, 3.5rem + 6vw, 6.854rem); /* φ^4 */
-    /* Audacious display tier (v1.0.3). Extends the φ-ladder three rungs
-       beyond display-5 for poster-type consumers (speedtest hero,
-       dashboard pane titles when the consumer wants the number to win).
-       Same vw-axis as display-1..5 — consumer-agnostic. */
-    --type-display-mega: clamp(
-        5.382rem,
-        4rem + 9vw,
-        11.089rem
-    ); /* φ^(9/2) — peak 177px */
-    --type-display-hero: clamp(
-        6.854rem,
-        4.5rem + 12vw,
-        17.942rem
-    ); /* φ^5    — peak 287px */
-    --type-display-audacious: clamp(
-        8.728rem,
-        5rem + 16vw,
-        22rem
-    ); /* φ^(11/2) — peak 352px (fast.com peg) */
-
-    /* X7 (value.js P10/T-40) — the DISPLAY/HEADING/TITLE weight axis, tokenised.
-       The three emphatic registers each hard-coded their font-weight literal, so a
-       consumer tuning the bold-letterform character (a lighter title, a heavier
-       display) had to fork every @utility. These name the weight the way the size
-       ladder names --type-*: the semantic.css utilities read them; the literals are
-       byte-identical defaults (display 600, heading/title 700). */
-    --type-weight-display: 600;
-    --type-weight-heading: 700;
-    --type-weight-title: 700;
-
-    /* Line heights & letter spacing live at tokens.css §0 as the canonical
-       --type-leading-* / --type-tracking-* rungs. theme.css bridges them
-       to Tailwind's `leading-*` / `tracking-*` utilities. The duplicate
-       --leading-* / --tracking-* declarations that previously sat here
-       were retired in v0.8.6 (audit U.W0.C-c §1.1 / Union 2). */
-}

package/src/styles/typography/semantic.css

@@ -1,233 +0,0 @@
-/* typography/semantic.css — the BODY cascade + the DISPLAY / HEADING / BODY /
- * MICRO / ADMIN-LABEL semantic type classes.
- *
- * Carved from typography.css (BA.W-CARVE2) — the semantic register classes
- * that read the scale tokens declared in typography/scale.css. @import-ed
- * SECOND by the typography.css thin root (after the faces+scale, before the
- * aux/mono utilities). The carve moves rules in the SAME cascade position →
- * byte-isomorphic dist (the no-god-module import-order gate is the witness). */
-
-/* ═══════════════════════════════════════════════
-   BODY CASCADE — the brand text register inherits globally
-   ═══════════════════════════════════════════════ */
-body {
-    font-family: var(--font-text);
-    color: var(--foreground);
-    font-size: var(--type-body);
-    line-height: var(--type-leading-body);
-}
-
-/* ═══════════════════════════════════════════════
-   DISPLAY — Plus Jakarta Sans display, tracking-tight
-   ═══════════════════════════════════════════════ */
-@utility text-display-audacious {
-    font-family: var(--font-display);
-    font-size: var(--type-display-audacious);
-    line-height: var(--type-leading-display);
-    letter-spacing: var(--type-tracking-display);
-    font-optical-sizing: auto;
-    font-weight: 600;
-    /* AQ.W3 §W3.3 — balance multi-line display headlines. Text-only (no box) so
-       balance is safe; degrades to unbalanced wrapping with zero break. */
-    text-wrap: balance;
-}
-
-/* `.text-hero` — the poster-type hero register. Ceiling pegs to
-   `--type-display-audacious` (φ^(11/2) — peak 352px). Three knobs tune without
-   forking: `--text-hero-size` (total clamp), `--text-hero-leading` (line-height,
-   default 0.84), `--text-hero-tracking` (letter-spacing, default -0.03em).
-   `font-weight: 300` + `font-feature-settings: ss01, tnum, lnum` lock the
-   numeric/stylistic baseline; consumer data-attribute registers compose on top. */
-@utility text-hero {
-    font-family: var(--font-display);
-    font-size: var(--text-hero-size, var(--type-display-audacious));
-    line-height: var(--text-hero-leading, 0.84);
-    letter-spacing: var(--text-hero-tracking, -0.03em);
-    font-weight: 300;
-    font-feature-settings: "ss01", "tnum", "lnum";
-    font-variant-numeric: tabular-nums lining-nums;
-    font-optical-sizing: auto;
-    display: inline-block;
-    max-inline-size: 100%;
-    /* AQ.W3 §W3.3 — `text-wrap: nowrap` (modern) sits AFTER `white-space:
-       nowrap` (legacy fallback) so supporting engines honor the modern form and
-       older ones fall through to `white-space`. Forgiving parse, no `@supports`. */
-    white-space: nowrap;
-    text-wrap: nowrap;
-}
-
-@utility text-display-hero {
-    font-family: var(--font-display);
-    font-size: var(--type-display-hero);
-    line-height: var(--type-leading-display);
-    letter-spacing: var(--type-tracking-display);
-    font-optical-sizing: auto;
-    font-weight: 600;
-    text-wrap: balance; /* AQ.W3 §W3.3 */
-}
-
-@utility text-display-mega {
-    font-family: var(--font-display);
-    font-size: var(--type-display-mega);
-    line-height: var(--type-leading-display);
-    letter-spacing: var(--type-tracking-display);
-    font-optical-sizing: auto;
-    font-weight: 600;
-    text-wrap: balance; /* AQ.W3 §W3.3 */
-}
-
-@utility text-display-5 {
-    font-family: var(--font-display);
-    font-size: var(--type-display-5);
-    line-height: var(--type-leading-display);
-    letter-spacing: var(--type-tracking-display);
-    font-optical-sizing: auto;
-    font-weight: 600;
-    text-wrap: balance; /* AQ.W3 §W3.3 */
-}
-
-@utility text-display-4 {
-    font-family: var(--font-display);
-    font-size: var(--type-display-4);
-    line-height: var(--type-leading-display);
-    letter-spacing: var(--type-tracking-display);
-    font-optical-sizing: auto;
-    font-weight: 600;
-    text-wrap: balance; /* AQ.W3 §W3.3 */
-}
-
-@utility text-display-3 {
-    font-family: var(--font-display);
-    font-size: var(--type-display-3);
-    line-height: var(--type-leading-display);
-    letter-spacing: var(--type-tracking-display);
-    font-optical-sizing: auto;
-    font-weight: var(--type-weight-display);
-    text-wrap: balance; /* AQ.W3 §W3.3 */
-}
-
-@utility text-display-2 {
-    font-family: var(--font-display);
-    font-size: var(--type-display-2);
-    line-height: var(--type-leading-display);
-    letter-spacing: var(--type-tracking-display);
-    font-optical-sizing: auto;
-    font-weight: var(--type-weight-display);
-    text-wrap: balance; /* AQ.W3 §W3.3 */
-}
-
-@utility text-display {
-    font-family: var(--font-display);
-    font-size: var(--type-display-1);
-    line-height: var(--type-leading-display);
-    letter-spacing: var(--type-tracking-display);
-    font-optical-sizing: auto;
-    font-weight: var(--type-weight-display);
-    text-wrap: balance; /* AQ.W3 §W3.3 */
-}
-
-/* ═══════════════════════════════════════════════
-   HEADINGS / BODY — Plus Jakarta Sans text register
-   ═══════════════════════════════════════════════ */
-@utility text-title {
-    font-family: var(--font-text);
-    font-size: var(--type-title);
-    line-height: var(--type-leading-heading);
-    letter-spacing: var(--type-tracking-tight);
-    font-weight: var(--type-weight-title);
-    text-wrap: balance; /* AQ.W3 §W3.3 */
-}
-
-@utility text-heading {
-    font-family: var(--font-text);
-    font-size: var(--type-heading);
-    line-height: var(--type-leading-heading);
-    font-weight: var(--type-weight-heading);
-    text-wrap: balance; /* AQ.W3 §W3.3 */
-}
-
-@utility text-subheading {
-    font-family: var(--font-text);
-    font-size: var(--type-subheading);
-    line-height: var(--type-leading-body);
-    font-weight: 600;
-    text-wrap: balance; /* AQ.W3 §W3.3 */
-}
-
-/* Canonical dock control label register — text labels INSIDE
-   `.dock-tab-button` (Start, Next, Submit, …) that want an emphatic character
-   without `.text-heading`'s `font-weight: 700` (which reads as literal bold in
-   a dock pill). Weight 400 — Plus Jakarta reads heavier than its numeric weight
-   at pill size, so regular is the not-bold register.
-
-   BC.W-AX-DOCK-COCKPIT — the label TRACKS the control height by ratio (the
-   dock-oversize chronic close, speedtest A-9): the font is a PROPORTION of the
-   control (`calc(var(--dock-control-size) * var(--dock-label-ratio))`) so a
-   tighter control (the `[data-preset="cockpit"]` 2.75rem floor + compact chrome)
-   carries a proportionally tighter label — never the fixed `--type-subheading`
-   rung that read OVERSIZE on a tight pill. The explicit `--dock-label-size` knob
-   STILL wins when set (the dock.css audacious-mobile carve precedent, KEPT — the
-   ratio is the FALLBACK). The `--dock-label-ratio` default reproduces
-   `--type-subheading` at the comfortable `2.5rem` control (sizing.css), so the
-   bare default is byte-near-identical; the `--dock-control-size` fallback `2.5rem`
-   mirrors the comfortable rung for a label outside a density-painted scope. */
-@utility dock-label {
-    font-family: var(--font-text);
-    font-size: var(
-        --dock-label-size,
-        calc(var(--dock-control-size, 2.5rem) * var(--dock-label-ratio))
-    );
-    line-height: var(--type-leading-body);
-    font-weight: 400;
-    letter-spacing: var(--type-tracking-normal);
-}
-
-@utility text-prose {
-    font-family: var(--font-text);
-    font-size: var(--type-prose);
-    line-height: var(--type-leading-prose);
-    font-weight: 400;
-    /* AQ.W3 §W3.3 — `pretty` fixes orphans/rivers in prose. Prose registers
-       only (not every text class); degrades to default wrapping, zero break. */
-    text-wrap: pretty;
-}
-
-@utility text-body {
-    font-family: var(--font-text);
-    font-size: var(--type-body);
-    line-height: var(--type-leading-body);
-    font-weight: 400;
-    text-wrap: pretty; /* AQ.W3 §W3.3 */
-}
-
-@utility text-small {
-    font-family: var(--font-text);
-    font-size: var(--type-small);
-    line-height: var(--type-leading-small);
-    font-weight: 400;
-}
-
-@utility text-caption {
-    font-family: var(--font-text);
-    font-size: var(--type-caption);
-    line-height: var(--type-leading-caption);
-    font-style: italic;
-    font-weight: 400;
-}
-
-/* ═══════════════════════════════════════════════
-   MICRO / ADMIN LABEL — Fira Code
-   ═══════════════════════════════════════════════ */
-@utility text-micro {
-    font-size: var(--type-micro);
-    line-height: 1.25;
-}
-
-@utility text-admin-label {
-    font-family: var(--font-mono);
-    font-size: var(--type-admin-label);
-    line-height: 1;
-    text-transform: uppercase;
-    letter-spacing: var(--type-tracking-caps);
-    font-weight: 500;
-}