@godxjp/ui 18.12.13 → 18.12.14

package/dist/styles/shell-layout.css

@@ -1282,8 +1282,8 @@
     overflow-y: visible;
     /* Ring headroom on the clipped axis: the end rail sits flush against this
      * box, so without a margin the LAST control's ring loses its outer edge.
-     * 2x the ring token — open/focus rings paint up to 3px (gh#291 follow-up). */
-    overflow-clip-margin: calc(2 * var(--focus-ring-width));
+     * Bare var() only — Chromium drops any calc() in overflow-clip-margin. */
+    overflow-clip-margin: var(--focus-ring-clip-margin);
   }
   .ui-topbar-start,
   .ui-topbar-center,
@@ -1299,10 +1299,11 @@
      * ring headroom where supported. */
     overflow-x: clip;
     overflow-y: visible;
-    /* 2x the ring token, NOT 1x: focus/open rings paint up to 3px while the
-     * token is 2px, so a flush-edge control (the locale picker is the first
-     * child of `end`) lost 1px of ring on the clipped axis (gh#291 follow-up). */
-    overflow-clip-margin: calc(2 * var(--focus-ring-width));
+    /* 4px headroom, NOT the 2px ring token: focus/open rings paint up to 3px,
+     * so 1x shaved a flush-edge control's ring (the locale picker is the first
+     * child of `end`). Bare var() only — Chromium drops any calc() in
+     * overflow-clip-margin at parse time, degrading the margin to 0. */
+    overflow-clip-margin: var(--focus-ring-clip-margin);
   }
   .ui-topbar-start {
     flex: 0 1 auto;

package/dist/tokens/foundation.css

@@ -153,6 +153,11 @@
    * default re-resolves at the element that paints the ring while an explicit override still wins. */
   --focus-ring-color: initial; /* default = the live --ring role */
   --focus-ring-width: 2px;
+  /* Ring headroom for clipped chrome (`overflow-clip-margin` on the topbar family, gh#291).
+   * MUST stay a plain length consumed via a bare var(): Chromium rejects any calc() in
+   * overflow-clip-margin at parse time (even calc(2 * 2px)), silently dropping the
+   * declaration to 0. Value = max ring paint (3px open/focus) + 1px breathing. */
+  --focus-ring-clip-margin: 4px;
   /* REGION focus ring — the keyboard-scroll affordance on large scroll REGIONS (`.app-main`,
    * gh#271/gh#276), separate from the control ring above. A control-strength 2px brand frame
    * around the entire content area reads as a glitch to mouse-first users (`:focus-visible`

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@godxjp/ui",
-  "version": "18.12.13",
-  "godxUiMcp": "18.12.13",
+  "version": "18.12.14",
+  "godxUiMcp": "18.12.14",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",