From 22a03652784b00f353b6519dd252f877502c5115 Mon Sep 17 00:00:00 2001
From: Maria Garcia Luque <mfgarcialuque@gmail.com>
Date: Wed, 22 Jul 2026 14:09:23 +0200
Subject: [PATCH 1/5] [FIR-318] Move the playground e2e port from 4300 to 4310

Avoids colliding with dev servers commonly left running on 4300.
---
 apps/playground-e2e/playwright.config.ts | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/apps/playground-e2e/playwright.config.ts b/apps/playground-e2e/playwright.config.ts
index 12115dd..37d8449 100644
--- a/apps/playground-e2e/playwright.config.ts
+++ b/apps/playground-e2e/playwright.config.ts
@@ -6,8 +6,10 @@ import { workspaceRoot } from '@nx/devkit';
  * Dedicated port: 4200 is the default `nx serve playground` port, so a
  * developer's already-running dev server (of this app or any other) would be
  * silently reused and the suite would screenshot the wrong application.
+ * 4310 (not 4300) additionally keeps clear of other dev servers commonly
+ * left running on 4300 during local work.
  */
-const baseURL = process.env['BASE_URL'] || 'http://localhost:4300';
+const baseURL = process.env['BASE_URL'] || 'http://localhost:4310';
 
 /**
  * Read environment variables from file.
@@ -28,8 +30,8 @@ export default defineConfig({
   },
   /* Run your local dev server before starting the tests */
   webServer: {
-    command: 'pnpm exec nx run playground:serve --port 4300',
-    url: 'http://localhost:4300',
+    command: 'pnpm exec nx run playground:serve --port 4310',
+    url: 'http://localhost:4310',
     reuseExistingServer: true,
     cwd: workspaceRoot,
   },

From 472ca1a5b237bc436aafa491a644f1c4fd1b01c1 Mon Sep 17 00:00:00 2001
From: Maria Garcia Luque <mfgarcialuque@gmail.com>
Date: Wed, 22 Jul 2026 14:09:54 +0200
Subject: [PATCH 2/5] [FIR-318] Pin the flydocs input focus-ring token to the
 product's translucent halo

ff-input already reads --ff-input-focus-ring for its wrapper box-shadow
with a solid-color fallback; the flydocs theme previously left it unset,
so focus fell back to a hard-edged outline instead of the product's
translucent ring. Pin it to the product's own rgba value in light and
dark, and record the resolved parity delta.
---
 .../src/app/themes/_flydocs-theme-dark.scss   |  3 +-
 .../src/app/themes/_flydocs-theme.scss        |  7 +++--
 docs/flydocs-parity-report.md                 | 28 ++++++++++---------
 docs/flydocs-theme-token-equivalence.md       |  3 +-
 4 files changed, 23 insertions(+), 18 deletions(-)

diff --git a/apps/playground/src/app/themes/_flydocs-theme-dark.scss b/apps/playground/src/app/themes/_flydocs-theme-dark.scss
index 1dee954..dd7e042 100644
--- a/apps/playground/src/app/themes/_flydocs-theme-dark.scss
+++ b/apps/playground/src/app/themes/_flydocs-theme-dark.scss
@@ -19,8 +19,9 @@
 
   --ff-color-surface: #161826;
   --ff-color-border: #363b4e;
-  /* Same alpha-drop reasoning as the light theme, over the dark ring hue. */
   --ff-color-border-focus: #6378ff;
+  /* Dark counterpart of the light halo above, over the lifted dark ring hue. */
+  --ff-input-focus-ring: rgba(99, 120, 255, 0.3);
 
   --ff-color-on-surface: #f6f7fa;
   --ff-text-primary: #f6f7fa;
diff --git a/apps/playground/src/app/themes/_flydocs-theme.scss b/apps/playground/src/app/themes/_flydocs-theme.scss
index 2be60a6..5b2ee52 100644
--- a/apps/playground/src/app/themes/_flydocs-theme.scss
+++ b/apps/playground/src/app/themes/_flydocs-theme.scss
@@ -27,10 +27,11 @@
   /* ---- Surfaces / structure ---- */
   --ff-color-surface: #ffffff;
   --ff-color-border: #e1e4ec;
-  /* Focus ring hue only: Flydocs models focus as a translucent ring
-     (rgba brand-blue at 25%); ff consumes it as a solid 2px outline,
-     so the hue is kept and the alpha dropped. */
+  /* Focus border hue, consumed by ff-input as a solid 2px border-color. */
   --ff-color-border-focus: #3b59f5;
+  /* Focus ring, consumed by ff-input as the wrapper's focus box-shadow
+     (translucent brand-blue halo, not a hard-edged outline). */
+  --ff-input-focus-ring: rgba(59, 89, 245, 0.25);
 
   /* ---- Text-on-surface roles ----
      `on-surface` has no named Flydocs counterpart; it plays the same
diff --git a/docs/flydocs-parity-report.md b/docs/flydocs-parity-report.md
index 6239050..0f65b6c 100644
--- a/docs/flydocs-parity-report.md
+++ b/docs/flydocs-parity-report.md
@@ -44,7 +44,7 @@ zoom**.
 | 4 | `ff-panel` | alert warning/danger, default with heading/footer | ✅ Pass |
 | 4 | `ff-card` | basic, md shadow | ✅ Pass |
 | 4 | `ff-tab-bar` | underline/pills, active not-first, badge+icon tabs | ✅ Pass |
-| 5 | `ff-input` | rest / hover / **focus** / error / disabled | ⚠️ Pass with one flagged delta (focus-ring rendering) |
+| 5 | `ff-input` | rest / hover / **focus** / error / disabled | ✅ Pass (focus-ring delta resolved, see FIR-318) |
 | 5 | `ff-checkbox` | unchecked / checked / disabled-checked | ✅ Pass |
 | 5 | `ff-radio` | group with selected option | ✅ Pass |
 
@@ -52,21 +52,23 @@ zoom**.
 
 Per the gate's contract, components that fail the comparison are **not**
 fixed inside FF-CAT-20 — each perceptible delta generates its own issue.
-One delta is flagged, borderline-perceptible and pre-documented in the
-equivalence doc:
-
-1. **Input focus ring: solid outline vs translucent halo.** Flydocs models
-   focus as a translucent box-shadow ring (brand blue at 25% alpha);
-   `ff-input` consumes `--ff-color-border-focus` as a solid 2px outline on
-   the field wrapper (`:focus-within`, after the FIR-289 refactor moved it
-   off the native control). The hue matches; the rendering mechanism does
-   not. At 100% zoom the difference is visible on direct comparison
-   (hard edge vs soft glow). Changing it means teaching the component a
-   ring-style focus treatment — a component change, out of this gate's
-   scope.
+No delta is currently flagged.
 
 ## Resolved deltas
 
+- **Input focus ring: solid outline vs translucent halo — resolved (FIR-318).**
+  `ff-input`'s field wrapper already rendered its focus indicator through a
+  dedicated component token, `--ff-input-focus-ring` (falling back to
+  `--ff-color-border-focus` when unset). The Flydocs theme now pins that
+  token to the product's own translucent halo value
+  (`--hub-sys-focus-ring-color`, `rgba(59, 89, 245, 0.25)` in light,
+  `rgba(99, 120, 255, 0.3)` in dark), instead of leaving it to fall back to
+  the solid focus border color. The wrapper's `border-color` (driven by
+  `--ff-color-border-focus`) still changes on focus alongside the ring, so
+  the focus indicator carries two independent visual cues (border color
+  step-up + halo), keeping it perceptible at the reduced ring alpha. See
+  `docs/flydocs-theme-token-equivalence.md` for the full reasoning.
+
 - **Neutral badge chip runs cool, Flydocs' runs warm — resolved (FIR-317).**
   `ff-badge`'s neutral chip background now resolves through its own
   component token, `--ff-badge-neutral-bg` (falling back to
diff --git a/docs/flydocs-theme-token-equivalence.md b/docs/flydocs-theme-token-equivalence.md
index d76eee6..adae51e 100644
--- a/docs/flydocs-theme-token-equivalence.md
+++ b/docs/flydocs-theme-token-equivalence.md
@@ -69,7 +69,8 @@ published theme.
 |---|---|---|---|---|
 | `--ff-color-surface` | Default component chrome background (card, header, nav, panel) | `--hub-sys-color-surface-default` (= `--hub-ref-color-neutral-0`) | `#ffffff` | Direct |
 | `--ff-color-border` | Default hairline border (cards, tables, dividers) | `--hub-sys-border-color-default` (= `--hub-ref-color-neutral-200`) | `#e1e4ec` | Direct |
-| `--ff-color-border-focus` | Solid 2px focus outline | `--hub-sys-focus-ring-color` (`rgba(59,89,245,.25)`, i.e. brand blue) | `#3b59f5` | Derived — Flydocs models focus as a translucent ring meant for `box-shadow`; ff consumes it as a solid `outline`. The hue (brand blue = `--hub-ref-color-blue-500`) is kept, the alpha dropped so the stroke stays visible as a hard outline. |
+| `--ff-color-border-focus` | Solid 2px focus border-color on the input wrapper | `--hub-sys-focus-ring-color` (`rgba(59,89,245,.25)`, i.e. brand blue) | `#3b59f5` | Derived — the border-color role only ever needs the ring's hue (brand blue = `--hub-ref-color-blue-500`); the alpha channel is not applicable to a `border-color` and is carried instead by `--ff-input-focus-ring` below. |
+| `--ff-input-focus-ring` (component-scoped, `ff-input`) | Translucent focus halo on the input wrapper's `box-shadow` | `--hub-sys-focus-ring-color` | `rgba(59, 89, 245, 0.25)` (dark: `rgba(99, 120, 255, 0.3)`, `--hub-sys-focus-ring-color` re-pinned in `_theme-dark.scss`) | Direct — `ff-input` already renders its focus indicator as a `box-shadow` ring (`var(--ff-input-focus-ring, var(--ff-color-border-focus))`), so the full rgba value (hue + alpha) is ported as-is instead of being lossily collapsed into a solid color. |
 | `--ff-color-on-primary` | Text/icon color atop a primary-filled surface (button label, checked radio dot, checkbox mark) | `--hub-sys-color-primary-on` / `-on-default` | `#ffffff` | Direct |
 | `--ff-color-on-surface` | Text/icon color atop the default surface (menu item text) | no named counterpart | `#161826` | Derived — no Flydocs token is called "on-surface"; the role (primary reading text over the default surface) is identical to `text-primary`, so it takes that value. |
 

From fbffc10e94420808d2dc80eacf3b0e351b15e4a7 Mon Sep 17 00:00:00 2001
From: Maria Garcia Luque <mfgarcialuque@gmail.com>
Date: Wed, 22 Jul 2026 14:14:31 +0200
Subject: [PATCH 3/5] [FIR-318] Regenerate the input focused-state VR baseline
 for the ring halo

Only the focused specimen's darwin baseline changes pixels; every other
input state and wave-5 baseline is unaffected. Drops the stale linux
baseline so CI reseeds it against the new rendering.
---
 .../input-default-focused-chromium-darwin.png | Bin 4511 -> 4547 bytes
 .../input-default-focused-chromium-linux.png  | Bin 4555 -> 0 bytes
 2 files changed, 0 insertions(+), 0 deletions(-)
 delete mode 100644 apps/playground-e2e/src/parity.spec.ts-snapshots/input-default-focused-chromium-linux.png

diff --git a/apps/playground-e2e/src/parity.spec.ts-snapshots/input-default-focused-chromium-darwin.png b/apps/playground-e2e/src/parity.spec.ts-snapshots/input-default-focused-chromium-darwin.png
index d6c4b6ffcb3f56ca380f39df524fd6e352dbff41..673d6b70ec7e1bfbc0828a377b3ad639016b6fcf 100644
GIT binary patch
delta 4538
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
Y0B$W7caQgPr2qf`07*qoM6N<$f?~hXp8x;=

delta 4502
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

diff --git a/apps/playground-e2e/src/parity.spec.ts-snapshots/input-default-focused-chromium-linux.png b/apps/playground-e2e/src/parity.spec.ts-snapshots/input-default-focused-chromium-linux.png
deleted file mode 100644
index 127c4e95e61a5e6dcc0d74d440b8c027c607a22a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 4555
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


From 82933e6e30571f779e094df4d890814ba18a4e27 Mon Sep 17 00:00:00 2001
From: Maria Garcia Luque <mfgarcialuque@gmail.com>
Date: Wed, 22 Jul 2026 14:19:03 +0200
Subject: [PATCH 4/5] [FIR-318] Trim the port and dark-ring comments to their
 contracts

---
 apps/playground-e2e/playwright.config.ts                | 8 +++-----
 apps/playground/src/app/themes/_flydocs-theme-dark.scss | 3 ++-
 2 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/apps/playground-e2e/playwright.config.ts b/apps/playground-e2e/playwright.config.ts
index 37d8449..3ebf88d 100644
--- a/apps/playground-e2e/playwright.config.ts
+++ b/apps/playground-e2e/playwright.config.ts
@@ -3,11 +3,9 @@ import { nxE2EPreset } from '@nx/playwright/preset';
 import { workspaceRoot } from '@nx/devkit';
 
 /*
- * Dedicated port: 4200 is the default `nx serve playground` port, so a
- * developer's already-running dev server (of this app or any other) would be
- * silently reused and the suite would screenshot the wrong application.
- * 4310 (not 4300) additionally keeps clear of other dev servers commonly
- * left running on 4300 during local work.
+ * Dedicated e2e port, distinct from common local dev-server ports: an
+ * already-running dev server (of this app or any other) would be silently
+ * reused and the suite would screenshot the wrong application.
  */
 const baseURL = process.env['BASE_URL'] || 'http://localhost:4310';
 
diff --git a/apps/playground/src/app/themes/_flydocs-theme-dark.scss b/apps/playground/src/app/themes/_flydocs-theme-dark.scss
index dd7e042..320aa49 100644
--- a/apps/playground/src/app/themes/_flydocs-theme-dark.scss
+++ b/apps/playground/src/app/themes/_flydocs-theme-dark.scss
@@ -20,7 +20,8 @@
   --ff-color-surface: #161826;
   --ff-color-border: #363b4e;
   --ff-color-border-focus: #6378ff;
-  /* Dark counterpart of the light halo above, over the lifted dark ring hue. */
+  /* Focus ring, consumed by ff-input as the wrapper's focus box-shadow
+     (translucent brand-blue halo, not a hard-edged outline). */
   --ff-input-focus-ring: rgba(99, 120, 255, 0.3);
 
   --ff-color-on-surface: #f6f7fa;

From 6a5673990070bde76233a4759d16b17cec174f32 Mon Sep 17 00:00:00 2001
From: Maria Garcia Luque <mfgarcialuque@gmail.com>
Date: Wed, 22 Jul 2026 14:23:41 +0200
Subject: [PATCH 5/5] [FIR-318] Commit the reseeded focused-state linux
 baseline

---
 .../input-default-focused-chromium-linux.png     | Bin 0 -> 4574 bytes
 1 file changed, 0 insertions(+), 0 deletions(-)
 create mode 100644 apps/playground-e2e/src/parity.spec.ts-snapshots/input-default-focused-chromium-linux.png

diff --git a/apps/playground-e2e/src/parity.spec.ts-snapshots/input-default-focused-chromium-linux.png b/apps/playground-e2e/src/parity.spec.ts-snapshots/input-default-focused-chromium-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..a3cd7ba559d04be6ae1c2f4a772672afed20822d
GIT binary patch
literal 4574
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
IM6N<$f<2SVeE<Le

literal 0
HcmV?d00001