@godxjp/ui 18.9.0 → 18.10.0

package/dist/styles/table-layout.css

@@ -284,8 +284,23 @@
 
   .ui-table-collection :is([data-slot="table-head"], [data-slot="table-cell"]) {
     /* The column measure comes from `priority`; an unmarked column takes what is left (`auto`),
-     * which is the free-text column. */
-    inline-size: var(--table-action-collection-column-width, auto);
+     * which is the free-text column — EXCEPT past the seven-column budget below the collapse
+     * step, where the `:has()` tier re-points the middle fallback at the flex floor (gh#262):
+     * the fixed algorithm hands an auto column 0px once the marked columns over-constrain the
+     * table, which is the one-character-per-line shredding this preset must never produce.
+     * There every column carries a rem floor-measure; once the floors outgrow the container the
+     * table's used width grows past its specified 100% (CSS 2.1 §17.5.2.1) and the DIRECT
+     * wrapper's keyboard-reachable overflow-x region scrolls — the SC 1.4.10-permitted
+     * one-dimensional scroll, instead of unreadable shredding (see tokens/components/table.css). */
+    inline-size: var(
+      --table-action-collection-column-width,
+      var(--table-action-collection-flex-width, auto)
+    );
+    /* Wrapping guard, considered for gh#262: this stays `overflow-wrap: anywhere`, NOT
+     * `word-break: keep-all`. Under `table-layout: fixed` a column cannot grow to fit an
+     * unbreakable CJK run, so keep-all would overflow/clip a long JA header instead of widening
+     * its column. With the floors guaranteeing a ~5-glyph measure, a wrapped JA header is two
+     * readable lines — never a vertical character column — and losing no text beats clipping. */
     overflow-wrap: anywhere;
     white-space: normal;
     vertical-align: top;
@@ -307,18 +322,7 @@
     --table-action-collection-column-width: var(--table-action-collection-actions-width);
     text-align: end;
   }
-}
 
-/* The compact tier lives in `godxjp-ui-responsive` — the LAST layer, declared after Tailwind in
- * styles/base.css — not in `@layer components`. `<table>` carries `text-sm`, a Tailwind utility,
- * and `utilities` outranks `components` by LAYER ORDER, so a `font-size:` re-point written here as
- * a component rule can never apply however specific it is: that is exactly why
- * `--table-action-collection-font-size-compact` was dead at every width (gh#412), leaving the
- * narrow frame at 14px where a 5–6 character Japanese label overflows its column measure. The
- * column measures move with it so the whole compact tier is decided in ONE place, and so a
- * consumer utility on the table can't half-collapse it either. See styles/base.css · THE LAYER
- * CONTRACT. */
-@layer godxjp-ui-responsive {
   /* Below the step the SOURCE measures are re-pointed to their compact tier (and the type / row
    * density with them); nothing else moves. One block per canonical step — a media/container
    * query cannot read a `var()`, so the tokenized scale is written out (sm 40rem · md 48rem ·
@@ -335,10 +339,6 @@
       --table-cell-space-x: var(--table-action-collection-cell-space-x-compact);
       --table-cell-padding-y: var(--table-action-collection-cell-padding-y-compact);
       font-size: var(--table-action-collection-font-size-compact);
-      /* The legibility floor. Default `0` keeps the table fitted to its container exactly as
-       * before; a consumer whose column count exceeds the priority budget raises it and the
-       * surrounding scroll region takes the overflow instead of the cells. */
-      min-inline-size: var(--table-action-collection-min-inline-size-compact);
     }
 
     /* A nowrap child (a Badge pill, a chip) would otherwise bleed into the next column at the
@@ -346,6 +346,21 @@
     [data-collapse-below="sm"] [data-slot="table-cell"] * {
       white-space: normal;
     }
+
+    /* SEVEN columns and up — the wide-collection floor tier (gh#262). Percent shares are
+     * guaranteed to sum past 100% here and fixed layout would normalize them into sub-glyph
+     * columns, so every column (the unmarked free-text one included) takes its rem floor
+     * instead; the over-constrained table grows past 100% and its wrapper scrolls. Up to six
+     * columns this rule never matches and the percent tier above keeps the canonical queues
+     * scroll-free — the preset's documented column-count ceiling. */
+    [data-collapse-below="sm"] [data-slot="table"]:has([data-slot="table-head"]:nth-child(7)) {
+      --table-action-collection-primary-width: var(--table-action-collection-primary-width-floor);
+      --table-action-collection-secondary-width: var(
+        --table-action-collection-secondary-width-floor
+      );
+      --table-action-collection-meta-width: var(--table-action-collection-meta-width-floor);
+      --table-action-collection-flex-width: var(--table-action-collection-flex-width-floor);
+    }
   }
 
   @container ui-table-collection (width < 48rem) {
@@ -360,10 +375,6 @@
       --table-cell-space-x: var(--table-action-collection-cell-space-x-compact);
       --table-cell-padding-y: var(--table-action-collection-cell-padding-y-compact);
       font-size: var(--table-action-collection-font-size-compact);
-      /* The legibility floor. Default `0` keeps the table fitted to its container exactly as
-       * before; a consumer whose column count exceeds the priority budget raises it and the
-       * surrounding scroll region takes the overflow instead of the cells. */
-      min-inline-size: var(--table-action-collection-min-inline-size-compact);
     }
 
     /* A nowrap child (a Badge pill, a chip) would otherwise bleed into the next column at the
@@ -371,6 +382,21 @@
     [data-collapse-below="md"] [data-slot="table-cell"] * {
       white-space: normal;
     }
+
+    /* SEVEN columns and up — the wide-collection floor tier (gh#262). Percent shares are
+     * guaranteed to sum past 100% here and fixed layout would normalize them into sub-glyph
+     * columns, so every column (the unmarked free-text one included) takes its rem floor
+     * instead; the over-constrained table grows past 100% and its wrapper scrolls. Up to six
+     * columns this rule never matches and the percent tier above keeps the canonical queues
+     * scroll-free — the preset's documented column-count ceiling. */
+    [data-collapse-below="md"] [data-slot="table"]:has([data-slot="table-head"]:nth-child(7)) {
+      --table-action-collection-primary-width: var(--table-action-collection-primary-width-floor);
+      --table-action-collection-secondary-width: var(
+        --table-action-collection-secondary-width-floor
+      );
+      --table-action-collection-meta-width: var(--table-action-collection-meta-width-floor);
+      --table-action-collection-flex-width: var(--table-action-collection-flex-width-floor);
+    }
   }
 
   @container ui-table-collection (width < 64rem) {
@@ -385,10 +411,6 @@
       --table-cell-space-x: var(--table-action-collection-cell-space-x-compact);
       --table-cell-padding-y: var(--table-action-collection-cell-padding-y-compact);
       font-size: var(--table-action-collection-font-size-compact);
-      /* The legibility floor. Default `0` keeps the table fitted to its container exactly as
-       * before; a consumer whose column count exceeds the priority budget raises it and the
-       * surrounding scroll region takes the overflow instead of the cells. */
-      min-inline-size: var(--table-action-collection-min-inline-size-compact);
     }
 
     /* A nowrap child (a Badge pill, a chip) would otherwise bleed into the next column at the
@@ -396,6 +418,21 @@
     [data-collapse-below="lg"] [data-slot="table-cell"] * {
       white-space: normal;
     }
+
+    /* SEVEN columns and up — the wide-collection floor tier (gh#262). Percent shares are
+     * guaranteed to sum past 100% here and fixed layout would normalize them into sub-glyph
+     * columns, so every column (the unmarked free-text one included) takes its rem floor
+     * instead; the over-constrained table grows past 100% and its wrapper scrolls. Up to six
+     * columns this rule never matches and the percent tier above keeps the canonical queues
+     * scroll-free — the preset's documented column-count ceiling. */
+    [data-collapse-below="lg"] [data-slot="table"]:has([data-slot="table-head"]:nth-child(7)) {
+      --table-action-collection-primary-width: var(--table-action-collection-primary-width-floor);
+      --table-action-collection-secondary-width: var(
+        --table-action-collection-secondary-width-floor
+      );
+      --table-action-collection-meta-width: var(--table-action-collection-meta-width-floor);
+      --table-action-collection-flex-width: var(--table-action-collection-flex-width-floor);
+    }
   }
 
   @container ui-table-collection (width < 80rem) {
@@ -410,10 +447,6 @@
       --table-cell-space-x: var(--table-action-collection-cell-space-x-compact);
       --table-cell-padding-y: var(--table-action-collection-cell-padding-y-compact);
       font-size: var(--table-action-collection-font-size-compact);
-      /* The legibility floor. Default `0` keeps the table fitted to its container exactly as
-       * before; a consumer whose column count exceeds the priority budget raises it and the
-       * surrounding scroll region takes the overflow instead of the cells. */
-      min-inline-size: var(--table-action-collection-min-inline-size-compact);
     }
 
     /* A nowrap child (a Badge pill, a chip) would otherwise bleed into the next column at the
@@ -421,5 +454,20 @@
     [data-collapse-below="xl"] [data-slot="table-cell"] * {
       white-space: normal;
     }
+
+    /* SEVEN columns and up — the wide-collection floor tier (gh#262). Percent shares are
+     * guaranteed to sum past 100% here and fixed layout would normalize them into sub-glyph
+     * columns, so every column (the unmarked free-text one included) takes its rem floor
+     * instead; the over-constrained table grows past 100% and its wrapper scrolls. Up to six
+     * columns this rule never matches and the percent tier above keeps the canonical queues
+     * scroll-free — the preset's documented column-count ceiling. */
+    [data-collapse-below="xl"] [data-slot="table"]:has([data-slot="table-head"]:nth-child(7)) {
+      --table-action-collection-primary-width: var(--table-action-collection-primary-width-floor);
+      --table-action-collection-secondary-width: var(
+        --table-action-collection-secondary-width-floor
+      );
+      --table-action-collection-meta-width: var(--table-action-collection-meta-width-floor);
+      --table-action-collection-flex-width: var(--table-action-collection-flex-width-floor);
+    }
   }
 }

package/dist/styles/text-layout.css

@@ -107,6 +107,19 @@
      * having to add `min-w-0` — the documented flex-truncate idiom (issue #114). */
     min-width: 0;
   }
+  /* Multi-line clamp (`clamp` prop, issue #261) — the token-owned line-clamp so consumers never
+   * write a page-local `line-clamp-N` utility. Visual-only: the full text stays in the DOM and
+   * the accessible name. `--text-clamp` is set inline by the component from the prop value. */
+  [data-slot="text"][data-clamp] {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: var(--text-clamp, 2);
+    line-clamp: var(--text-clamp, 2);
+    overflow: hidden;
+    /* Same flex-shrink contract as truncate (issue #114): clamps inside a flex row without
+     * the consumer adding `min-w-0`. */
+    min-width: 0;
+  }
   [data-slot="text"][data-tabular] {
     font-variant-numeric: tabular-nums;
   }

package/dist/tokens/base.css

@@ -13,6 +13,7 @@
 @import "./components/descriptions.css";
 @import "./components/table.css";
 @import "./components/feedback.css";
+@import "./components/banner.css";
 @import "./components/sheet.css";
 @import "./components/badge.css";
 @import "./components/navigation.css";

package/dist/tokens/components/badge.css

@@ -7,4 +7,9 @@
   /* Small-by-design (badge/pill/counter). A knob (rule #45) so a service can
    * re-tune badge text without touching the global --font-size-xs step. */
   --badge-font-size: var(--font-size-xs);
+  /* Companion to --badge-font-size (gh#260). The cva's old `text-xs` utility also set
+   * line-height via Tailwind's default `--text-xs--line-height: calc(1 / 0.75)` (the theme
+   * remaps --text-xs but never that companion). Same unitless ratio here keeps the default
+   * badge pixel-identical now that badge-layout.css owns the type metrics. */
+  --badge-line-height: calc(1 / 0.75);
 }

package/dist/tokens/components/banner.css

@@ -0,0 +1,16 @@
+/* Banner — the full-bleed attention strip (<Banner> = Alert variant="banner").
+ * Colour stays with the alert tone rules; these tokens own ONLY the strip geometry,
+ * so a service retunes the banner once here instead of forking alert-layout.css
+ * (rule #45 — every service-tunable constant gets a knob). */
+
+:root {
+  /* Square corners — a strip spans its container edge-to-edge, so it carries no radius. */
+  --banner-radius: 0;
+  /* The strip keeps a single hairline block-end rule (tone-coloured via the alert
+   * border rules); inline/block-start edges are open so it reads as part of the frame. */
+  --banner-border-width: 1px;
+  /* Strip inset. Block is denser than the inline Alert card; inline defaults to the
+   * page gutter so banner text aligns with page content under AppShell/PageContainer. */
+  --banner-space-inset-block: var(--space-3);
+  --banner-space-inset-inline: var(--space-page-active-x, var(--space-6));
+}

package/dist/tokens/components/card.css

@@ -74,18 +74,6 @@
    * The slot padding compensation in card-layout.css subtracts the same token,
    * so content stays aligned on the shell whatever the rail width. */
   --card-accent-rail-width: 6px;
-  /* Accent placement `perimeter` (gh#12) — the FULL attention border. Two knobs so a service can
-   * tune the edge weight and the outer ring independently; the defaults reproduce the optical
-   * weight of `variant="featured"` (1px border + 1px ring) in the card's own semantic accent tone
-   * instead of --primary. Structural 1px literals, like the base card hairline. */
-  --card-accent-perimeter-width: 1px;
-  --card-accent-perimeter-ring-width: 1px;
-  /* `variant="featured"` edge — role-mirror knob (docs/TOKENS.md). `initial` so the --primary
-   * default resolves at the CALL SITE and a scoped [data-tenant]/.dark override of --primary
-   * reaches it; a service points it anywhere (e.g. var(--attention)) to retint every featured card
-   * at once. Default = hsl(var(--primary)). */
-  --card-featured-border-color: initial;
-  --card-featured-ring-width: 1px;
   --stat-card-label-font-size: var(--font-size-xs);
   --stat-card-label-font-weight: var(--font-weight-medium);
   --stat-card-label-letter-spacing: 0.04em;

package/dist/tokens/components/control.css

@@ -67,22 +67,6 @@
    * re-scopes --control-height to 36px, would silently shrink. Verified in Chromium: 36px before
    * and after. A service opts in with a NAMED tier (`var(--control-height-lg)`), never a calc. */
   --otp-slot-size: initial; /* default = var(--control-height) at the call site */
-  /* Per-AXIS overrides of the slot box (gh#12). --otp-slot-size stays the square shorthand; these
-   * two win over it when set, so a code field can be WIDER-than-tall or TALLER-than-wide without
-   * abandoning the token. A canonical device-grant code field is 27.5x52 per slot (a 4-slot
-   * `appearance="grouped"` box of 112x54 with its 1px group border) — not expressible with one
-   * square knob, which is why grouped OTP measured 146x38 against that artboard. `initial` for the
-   * same tier-mirror reason as --otp-slot-size: the whole fallback chain
-   * (axis → square → --control-height) must resolve at the CALL SITE so a shell that re-scopes
-   * --control-height still reaches an OTP row that sets neither axis. */
-  --otp-slot-inline-size: initial; /* default = var(--otp-slot-size, var(--control-height)) */
-  --otp-slot-block-size: initial; /* default = var(--otp-slot-size, var(--control-height)) */
-  /* Main-axis alignment of the whole OTP row (rule #44/#45 — chrome is a token, default quiet).
-   * `flex-start` is the historical behaviour, so an existing field is byte-identical; a centred
-   * code field is `align="center"` on InputOTP (which wins over this knob) or this token set once
-   * in a service theme. It exists because EVERY consumer was wrapping .ui-otp-container in a
-   * flex-centring div to get a centred challenge. */
-  --otp-container-align: flex-start;
 
   /* Checked/on/active fills — `initial` so the --primary default re-resolves at the call site
    * under a scoped theme (a :root binding to var(--primary) freezes at the :root value and a scoped

package/dist/tokens/components/data-display.css

@@ -28,18 +28,6 @@
   --avatar-square-background: initial;
   --avatar-square-foreground: initial;
 
-  /* Capability medallion — `<Avatar appearance="tinted">` (gh#12): the tinted plate a capability /
-     feature glyph sits on, as opposed to the SOLID entity mark above. Pair it with shape="square"
-     for the canonical rounded square. --avatar-tinted-background / --avatar-tinted-foreground are
-     role-mirror knobs (`initial`, docs/TOKENS.md) so the --primary defaults resolve at the CALL
-     SITE and a scoped [data-tenant]/.dark override of --primary reaches them — the exact reason
-     this is a token and not the `hsl(var(--primary) / 0.1)` literal consumers were writing in page
-     CSS. Defaults = hsl(var(--primary) / 0.1) wash · hsl(var(--primary)) glyph ·
-     --control-icon-size glyph box. */
-  --avatar-tinted-background: initial;
-  --avatar-tinted-foreground: initial;
-  --avatar-tinted-glyph-size: var(--control-icon-size);
-
   /* Progress track + fill — `initial` so the role defaults re-resolve under a scoped theme.
      Track reads --secondary, fill reads --success; a service re-tones once.
      Defaults = hsl(var(--secondary)) track · hsl(var(--success)) fill. */

package/dist/tokens/components/email.css

@@ -63,14 +63,8 @@
   --email-heading-font-weight: 500; /* mirrors --font-weight-medium — an email title is calm, not bold */
 
   /* ── Primary CTA — the one action button ────────────────────────────────────────────────── */
-  /* TOUCH TARGET, deliberately DECOUPLED from --control-height-lg (36px). Do not "restore" the
-   * mirror: email is a mobile-first, touch-only medium. There is no hover state, no precise
-   * pointer, and mail clients do not reliably offer zoom or a focus affordance — so the web's AA
-   * floor (SC 2.5.8, 24x24, which 36px clears) is the wrong bar here. 44px is the AAA target size
-   * (SC 2.5.5, 44x44) and the Apple HIG 44pt / Material 48dp convention. A service that must keep
-   * the old box sets --email-cta-height + --email-cta-line-height in its own theme. */
-  --email-cta-height: 44px;
-  --email-cta-line-height: 44px; /* equal to the height: bulletproof vertical centring in Outlook */
+  --email-cta-height: 36px; /* mirrors --control-height-lg (2.25rem) — the canonical CTA box */
+  --email-cta-line-height: 36px; /* equal to the height: bulletproof vertical centring in Outlook */
   --email-cta-padding-x: 16px; /* mirrors --space-4 */
   --email-cta-radius: 6px; /* mirrors the --radius base (0.375rem) */
   --email-cta-font-size: 14px; /* mirrors --font-size-base */

package/dist/tokens/components/feedback.css

@@ -29,26 +29,6 @@
    * (a brand's success-bg/-border are often more present than the faint 5%/30% default). */
   --alert-bg-alpha: 0.05;
   --alert-border-alpha: 0.3;
-  /* BANNER — the page-level Alert treatment (gh#255). Every constant a service would want to
-   * match to its page grid is a knob (rule #45): a banner that must keep the app's rounded card
-   * language sets --banner-radius, one that rules its top edge too sets --banner-border-width.
-   * The inline inset tracks the live page gutter, so a banner mounted above a PageContainer lines
-   * its text up with the page title instead of sitting at a second, unrelated margin. */
-  --banner-radius: 0;
-  --banner-border-width: 0;
-  --banner-border-block-end-width: 1px;
-  --banner-space-block: var(--space-3);
-  /* Inline inset tracks the page gutter so a banner's text lines up with the page title.
-   * `--space-page-active-x` steps down to the compact gutter on `.ui-page-container` only, and
-   * custom properties inherit — so a banner rendered INSIDE the container picks the compact value
-   * up for free, while the normal case (a banner mounted ABOVE the container, or in AppShell) would
-   * keep the desktop gutter and sit 8px out at 390px. The compact step below is what actually keeps
-   * the two aligned; retune it rather than hard-coding a mobile inset at the call site. */
-  --banner-space-inline: var(--space-page-active-x);
-  --banner-space-inline-compact: var(--space-page-compact-x);
-  /* Dismiss offset is measured from the banner's own (shorter) block inset, so the ✕ stays
-   * optically centred on a one-line strip instead of floating at the inline-alert offset. */
-  --banner-dismiss-space-offset: var(--space-2);
   /* Brand glow layer for the raised dialog/sheet panel — invisible no-op at rest (rule #44).
    * Paired AFTER --shadow-lg in the surface box-shadow so a service can wash the overlay with the
    * global glow, e.g. --dialog-content-glow: var(--shadow-glow), with no markup change. */

package/dist/tokens/components/navigation.css

@@ -14,15 +14,6 @@
   --steps-inline-item-gap: var(--space-1);
   --steps-inline-font-size: var(--font-size-xs);
   --steps-inline-separator-size: var(--control-icon-size-sm);
-  /* Inline-step emphasis (gh#12). The step number's weight and tint are separate knobs so a
-   * service can express progression the canonical way — an accent TINT at normal weight — instead
-   * of the original bold. --steps-inline-index-color / --steps-inline-separator-color are
-   * role-mirror knobs (docs/TOKENS.md): `initial` so their defaults (the inherited step colour and
-   * the --muted-foreground role) resolve at the CALL SITE and a scoped [data-tenant]/.dark
-   * override still reaches them. Defaults reproduce today's row byte for byte. */
-  --steps-inline-index-font-weight: var(--font-weight-bold);
-  --steps-inline-index-color: initial; /* default = currentColor at the call site */
-  --steps-inline-separator-color: initial; /* default = hsl(var(--muted-foreground)) */
 
   /* AppSettingPicker `compact` (gh#217) — the small, content-hugging labelled trigger used in an
    * auth/legal footer, where the square icon-only default reads as a stray button and the full
@@ -65,29 +56,14 @@
    * (0 on an overlay-scrollbar platform). */
   --filter-bar-scroll-padding-y: var(--space-1);
 
-  /* FilterBar typed model (#258) — the search / chip / result-count regions the bar now OWNS, so a
-   * list page never re-decides them. Every constant is a knob (rule #45): a service matches its own
-   * grid by retuning these once instead of per page.
-   *
-   * Search MEASURE — the whole point of the `search` slot. Below the 640px step the control is
-   * full-width (a bounded search box on a 390px screen wastes the row), so this binds only at and
-   * above it. 18rem = 288px: comfortable for a JA/VI query without crowding the filter groups. */
-  --filter-bar-search-width: 18rem;
-
-  /* Applied-filter chips. */
-  --filter-bar-chip-gap: var(--space-inline-xs);
-  --filter-bar-chip-row-gap: var(--space-inline-xs);
-  --filter-bar-chip-padding-inline: var(--space-2);
-  --filter-bar-chip-padding-block: var(--space-1);
-  --filter-bar-chip-radius: var(--radius-sm);
-  --filter-bar-chip-font-size: var(--font-size-xs);
-  /* Role-mirror knobs (docs/TOKENS.md) — `initial` at :root so --muted / --muted-foreground
-   * re-resolve at the CALL SITE under a scoped [data-tenant]/.dark theme. Binding a role var here
-   * would freeze the chip at the :root palette and a tenant override would never reach it. */
-  --filter-bar-chip-background: initial;
-  --filter-bar-chip-foreground: initial;
-
-  /* Result-count live region. */
-  --filter-bar-count-font-size: var(--font-size-xs);
-  --filter-bar-count-foreground: initial;
+  /* FilterBar typed model (gh#258) — token-owned geometry so every list page gets the SAME
+   * search width, filter width, chip rhythm and section stacking without page-local CSS.
+   * All are rule-#45 knobs: a service theme retunes them once, props/className override per
+   * instance. Below 640px the strip stacks (search/filters full-width); the widths apply from
+   * the 640px breakpoint up, always clamped by min(100%, …) so a narrow container never
+   * overflows at 390px with long JA/EN/VI labels. */
+  --filter-bar-search-width: 20rem;
+  --filter-bar-filter-width: var(--filter-picker-width-md);
+  --filter-bar-chip-gap: var(--space-2);
+  --filter-bar-section-gap: var(--space-2);
 }

package/dist/tokens/components/shell.css

@@ -81,21 +81,10 @@
   --topbar-height: auto;
   --topbar-inset: 0px;
   --topbar-gap: var(--space-2);
-  /* ⚠ THIS KNOB DELETES CONTENT AT 1100px AND BELOW — read before you ship a center slot.
-   * At compact desktop/tablet widths the docked sidebar leaves too little inline room for three
-   * intrinsically-sized clusters, so the package hides the optional center slot before it can
-   * cover the breadcrumb/title or end utilities (gh#244). The default is `none`, which means a
-   * global search trigger placed in `center` is INVISIBLE from 1100px down — including on every
-   * phone — unless the consumer opts back in. That default arrived in 18.6.0 and removed the slot
-   * for consumers who never changed a line of their own code (gh#12); it stays because the
-   * overlap it prevents is a real defect and flipping a shipped default twice is worse than
-   * documenting it once, but it is a DECISION, not an accident:
-   *
-   *   :root { --topbar-center-compact-display: flex; }   ← restore the slot at every width
-   *
-   * Opt back in only once the center content has a compact presentation of its own (an icon-only
-   * search trigger, a collapsing field). A page-local media query is the anti-pattern this knob
-   * replaces. */
+  /* At compact desktop/tablet widths the docked sidebar leaves too little inline room for three
+   * intrinsically-sized clusters. The package hides the optional center slot before it can cover
+   * the breadcrumb/title or end utilities. Consumers may opt back into another display strategy
+   * (for example `flex`) once their center content has its own compact presentation. */
   --topbar-center-compact-display: none;
   --org-switcher-trigger-height: 2.75rem;
   --org-switcher-trigger-padding-x: var(--space-2);
@@ -183,27 +172,17 @@
   --auth-shell-login-main-padding-block-end: 1rem;
   --auth-shell-login-identity-slot-block-size: 7rem;
   --auth-shell-login-card-stack-gap: 1.25rem;
-  --auth-shell-login-card-padding-block-compact: calc(
-    var(--auth-shell-compact-card-inset) + var(--control-border-width) + var(--control-border-width)
-  );
+  /* Canonical SCR-001 block inset is a FLAT 24px — the same measure as the inline inset. The card
+   * draws its own 1px border and a border-box rect already contains it, so the former
+   * `+ 2 x --control-border-width` double-counted the border and pushed the passkey CTA to y=390
+   * instead of the canonical y=388 (gh#263). */
+  --auth-shell-login-card-padding-block-compact: var(--auth-shell-compact-card-inset);
 
   /* Device-authorization preset — 380px card measure, 15px block · 5px inline mobile gutter
    * (at a 390px viewport the card is x=5px, width=380px). */
   --auth-shell-device-card-max-width: 23.75rem;
   --auth-shell-device-main-padding: 1rem;
   --auth-shell-device-main-padding-mobile: 0.9375rem 0.3125rem;
-  /* CODE FIELD measure — the preset owns it (gh#12). A device grant is the one canonical flow whose
-   * PRIMARY control is the code field, so leaving it on the generic square --otp-slot-size made the
-   * preset own the page but not its own subject: two 4-slot `appearance="grouped"` boxes rendered
-   * 146x38 (4 x the canonical 36px control tier + the 1px group border) against a 112x54 artboard.
-   * These are the per-slot boxes that ADD UP to that artboard group:
-   *   inline  27.5px x 4 + 2 x 1px group border = 112px
-   *   block   52px       + 2 x 1px group border =  54px
-   * Literal artboard lengths, like every other preset measure here — they must not drift with
-   * --scaling. A service that groups its code differently overrides --otp-slot-inline-size /
-   * --otp-slot-block-size on its own field; the generic square knob is untouched everywhere else. */
-  --auth-shell-device-otp-slot-inline-size: 1.71875rem;
-  --auth-shell-device-otp-slot-block-size: 3.25rem;
 
   /* Context-selection preset — 25rem card measure on desktop/tablet, edge-to-edge on mobile
    * (0 inline gutter) with a 16px rhythm between the intro, the card and the remember row. */
@@ -256,14 +235,19 @@
   --auth-shell-registration-main-padding-block-end-mobile: 2rem;
   --auth-shell-registration-card-stack-gap: 1.25rem;
   /* Fixed identity track, the same 112px `login` proved (gh#237). Without it the card anchor moves
-   * with the title/requester line count — measured here at 82.69px for one wrapped requester — so
-   * the canonical y above would hold for exactly one copy length and drift for every other. The
-   * slot absorbs absent / one-line / two-line identity content instead. */
+   * with the title/requester line count, so the canonical y above would hold for exactly one copy
+   * length and drift for every other. The slot absorbs absent / one-line / two-line identity
+   * content instead. */
   --auth-shell-registration-identity-slot-block-size: 7rem;
 
-  /* Labelled auth divider geometry. */
+  /* Labelled auth divider geometry. The canonical SCR-001 divider row is 19px tall at the 11px
+   * label (the artboard label inherits the page's line-height instead of collapsing to a 1.0 line
+   * box). 19/11 pins the row at exactly 19px and keeps it proportional if a service retunes the
+   * label font-size. The previous hardcoded `line-height: 1` rendered an 11px row, sitting the
+   * whole lower half of the Login card 8px high (gh#263). */
   --auth-shell-divider-gap: 0.625rem;
   --auth-shell-divider-label-font-size: 0.6875rem;
+  --auth-shell-divider-label-line-height: calc(19 / 11);
   --auth-shell-divider-rule-color: var(--border);
   --auth-shell-divider-label-color: var(--muted-foreground);
   --auth-identity-gap: 0.375rem;
@@ -281,8 +265,12 @@
   --auth-footer-text-font-size: 0.6875rem;
   --auth-stack-gap: var(--space-3);
   --auth-shell-field-label-gap: var(--space-1);
-  --auth-shell-field-label-font-size: var(--font-size-xs);
-  --auth-shell-field-label-line-height: 1.25;
+  /* Canonical SCR-001 field label: a LITERAL 12px (the golden-ratio --font-size-xs ≈ 12.47px would
+   * drift the 18px line box to 18.7px and push the email input off its y=489 anchor) with a 1.5
+   * line box = 18px. The former var(--font-size-xs)/1.25 pair rendered a 14px box, sitting the
+   * email input 4px high (gh#263). */
+  --auth-shell-field-label-font-size: 0.75rem;
+  --auth-shell-field-label-line-height: 1.5;
 
   /* CenteredShell — authenticated, no-sidebar, centred-column page shell (hosted-ID "My Page",
    * account, standalone settings). The bar mirrors AppShell's `.app-topbar` chrome (fixed height +

package/dist/tokens/components/table.css

@@ -59,34 +59,53 @@
   --table-action-collection-secondary-width: 22%; /* target / resource */
   --table-action-collection-meta-width: 12%; /* timestamps, ids — lowest priority */
   --table-action-collection-actions-width: 3.5rem; /* row-action affordance, never clipped */
-  /* Compact tier, applied below the collapse step (the 390px acceptance frame). */
+  /* Compact tier, applied below the collapse step (the 390px acceptance frame). Percentages,
+   * like the desktop tier: while the priority ratios FIT (the canonical queues up to the
+   * six-column budget below), they keep the table filling its container edge-to-edge with no
+   * horizontal scroll — the gh#253 acceptance. */
   --table-action-collection-primary-width-compact: 24%;
   --table-action-collection-secondary-width-compact: 22%;
   --table-action-collection-meta-width-compact: 20%;
   --table-action-collection-actions-width-compact: 2.75rem;
+  /* Wide-collection FLOORS — the compact measures from SEVEN columns up (gh#262).
+   *
+   * Percentage measures stop working once a queue carries enough columns for the shares to sum
+   * past 100%: `table-layout: fixed` NORMALIZES them back into the table's specified width, so at
+   * ~10 columns on a 390px frame a "24%" column really renders at a tenth of the frame, every
+   * column drops below one CJK glyph, and JA headers shred into a vertical one-character-per-line
+   * column (the failure mode WCAG 2.2 SC 1.4.10 Reflow exists to prevent). Cell `min-inline-size`
+   * and `max(%, length)` widths are equally inert in the fixed algorithm, and the intrinsic
+   * (max-content) size of a fixed-layout table is degenerate — all verified in Chromium — so a
+   * LENGTH is the only floor an engine respects: length columns are never squeezed, and when
+   * their sum outgrows the container the table's used width grows past its specified 100%
+   * (CSS 2.1 §17.5.2.1) into the keyboard-reachable overflow-x wrapper, which scrolls.
+   * ONE-dimensional scrolling of a data table is explicitly permitted by SC 1.4.10;
+   * one-character-per-line is not readable at all.
+   *
+   * The stylesheet switches tiers on a COLUMN BUDGET, not on width: up to six columns the
+   * percentage ratios above still resolve to readable measures at every acceptance artboard
+   * (320 · 375 · 390), so the canonical five-column approval queue keeps its documented
+   * scroll-free 390 frame byte-for-byte; from seven columns the shares are guaranteed to
+   * over-sum and the floors + intentional scroll take over. That budget is the preset's
+   * documented column-count ceiling (gh#262 expectation 3): past six columns the preset stops
+   * compressing and starts scrolling.
+   *
+   * Units are rem, not ch: `ch` tracks the "0" glyph (~half a CJK em), so a ch-denominated floor
+   * would silently halve for the JA copy these floors exist to protect. At the compact type tier
+   * (font-size-xs = 0.75rem, space-2 inline padding each side) the 5rem meta floor keeps a ~4rem
+   * text measure = 5 full-width glyphs per line — a JA header wraps to two readable lines, never
+   * a character column. */
+  --table-action-collection-primary-width-floor: 6rem;
+  --table-action-collection-secondary-width-floor: 5.5rem;
+  --table-action-collection-meta-width-floor: 5rem;
+  /* Floor for a column with NO `priority` (the free-text column, `auto` up to the budget). It
+   * cannot stay `auto` past the budget: once the marked columns over-constrain the table, the
+   * fixed algorithm hands an auto column exactly 0px (verified in Chromium) — the same
+   * shredding, moved to the free-text column. The actions floor is simply
+   * `--table-action-collection-actions-width-compact`, already an absolute measure. */
+  --table-action-collection-flex-width-floor: 5rem;
   --table-action-collection-font-size-compact: var(--font-size-xs);
   --table-action-collection-cell-space-x-compact: var(--space-2);
   --table-action-collection-cell-padding-y-compact: var(--space-2);
   --table-action-collection-row-height-compact: var(--table-row-height-compact);
-  /* Compact-tier LEGIBILITY FLOOR — the measure below which the preset stops fitting the table
-   * to its container and lets the scroll region it already owns take over.
-   *
-   * The percentage budget above is sized for ONE column per priority tier plus one free-text
-   * column. A queue that repeats a tier — two `secondary` columns, three `meta` columns, or an
-   * unmarked column beside them — asks for more than 100%, and under `table-layout: fixed` the
-   * surplus is taken out of the columns rather than out of the table: measured on a seven-column
-   * Japanese admin queue at 390, every column landed at 44–59px and CJK labels wrapped at ONE to
-   * TWO characters per line (dxs-platform/platform#680). That is a WCAG 2.2 SC 1.4.10 Reflow (AA)
-   * failure, and it is the failure mode this floor removes.
-   *
-   * Scrolling is the correct escape, not a concession: SC 1.4.10 exempts "parts of the content
-   * which require two-dimensional layout for usage or meaning", and its own note names data
-   * tables as the example. A table that scrolls horizontally inside its card conforms; a table
-   * whose cells are one character wide does not.
-   *
-   * Default `0` so nothing changes for any existing consumer: a queue that fits its priority
-   * budget keeps fitting. A consumer whose queue carries more columns than the budget sets this
-   * to the measure at which its narrowest column is still readable (roughly 5rem per column for
-   * Japanese at the compact type tier) and the table scrolls instead of crushing. */
-  --table-action-collection-min-inline-size-compact: 0;
 }

package/dist/tokens/semantic/layout.css

@@ -83,18 +83,11 @@
    * page moves. 11rem = 176px, i.e. the control ends flush with the compact page gutter. */
   --page-header-extra-measure: 11rem; /* 176px */
 
-  /* Inline gap between the `<h1>` and the PageHeader `meta` slot (a status Badge, a record ID) when
-   * they share the title band (gh#255). Only consumed when `meta` is passed — a header without it
-   * emits no band wrapper at all, so no existing page moves. */
-  --page-header-meta-gap: var(--space-inline-sm);
-
-  /* PageHeader `loading` placeholders (gh#255). The title/subtitle elements wear the shared
-   * `.ui-skeleton-block` skin, so they need only a MEASURE and a block size — a service retunes the
-   * pending band's proportions here instead of per page. */
-  --page-title-placeholder-measure: 14rem; /* 224px */
-  --page-title-placeholder-block-size: 1.5em;
-  --page-subtitle-placeholder-measure: 22rem; /* 352px */
-  --page-subtitle-placeholder-block-size: 1.25em;
+  /* Gap between the page title and its status/meta band (PageContainer `status`,
+   * godxjp-ui#255), and between the band's own items. One knob aligns the badge row
+   * to a service's grid; a page that never passes `status` reads neither the token
+   * nor the wrapping row. */
+  --page-header-status-gap: var(--space-inline-sm);
 
   /* Bounded page MEASURE (gh#245 / gh#247) — the shared inline cap applied to the page HEADER and
    * BODY together, so the header `extra` action ends on the same edge as the body surface (the