fix: changed frontend workflow and fixed login reference matching for real

features/login_card_conformance.feature

@@ -0,0 +1,102 @@
+Feature: Log-in card sizing, alert placement and focus behavior match the Auth board
+
+  As the maintainer of RenewCMS
+  I want AuthShell's card padding, control heights, "Forgot password?" styling, field-error
+    presentation, theme select and h1 focus timing built exactly to the AuthCard board
+    (docs/design/source/AuthCard.dc.html) instead of Nuxt UI's untouched defaults
+  So that /login (and every other AuthShell-based public screen) matches the design board pixel
+    for pixel, at desktop and mobile, in light and dark
+
+  This complements features/auth_shell_login_conformance.feature, which covers AppLogo, the
+  UPageCard title/description wiring, the muted-background breakpoint and the neutral/error input
+  edge. This feature covers what that one doesn't: exact card/control measurements, the "Forgot
+  password?" link's own styling, the field-error icon and halo behavior, the theme select's
+  chevron, where the alert sits relative to the card, and when the h1 receives focus.
+
+  Background:
+    Given AuthShell is the layout for every public route, per docs/design/routes.md
+    And the card's padding, control heights and title size come from
+      docs/design/source/AuthCard.dc.html's renderVals(): pad "40px" and control height "40px"
+      from the sm breakpoint up; pad "8px 20px 0" (with a separate footer padding of
+      "0 20px 24px") and control height "44px" below sm; the title is always "font:600 20px/28px"
+    And the Password UFormField's "Forgot password?" link is styled color var(--ui-text-toned)
+      (muted), text-decoration underline, underline-offset 3px, per AuthCard.dc.html's f.link span
+    And a field error renders with the i-lucide-circle-alert icon in var(--ui-error), and the
+      field's edge/shadow is computed error-first, so an errored field that is also focused shows
+      only the single error-colored inset ring, never a focus ring stacked under or around it
+    And AuthShell's notice slot (the alert) renders inside the card's own layout, after the
+      title/description block and before the form — not as a sibling element above the card
+    And the footer's UColorModeSelect renders with no chevron/dropdown-arrow icon, as the last
+      (right-hand) child of the footer's space-between row, per AuthCard.dc.html's theme span
+    And on first paint, AuthShell's h1 (tabindex="-1") does not receive focus; focus moves to it
+      only when the title changes while AuthShell stays mounted (an in-app navigation between
+      public screens, e.g. /login to /register/reset/request), per components.md's AuthShell a11y
+      line ("On route change, focus moves to the h1")
+    And the h1 never shows a visible focus outline, since it is only ever focused programmatically
+      and is not part of the visible keyboard-tab order
+
+  Scenario: Card padding and control heights at sm and up
+    Given the user is on /login at a viewport of sm or wider
+    When AuthShell and the login form render
+    Then the card's own padding is 40px on every side
+    And the Username input, the Password input and the submit button are each 40px tall
+    And input text renders at 14px
+
+  Scenario: Card padding and control heights below sm
+    Given the user is on /login at a viewport below sm
+    When AuthShell and the login form render
+    Then the card's own padding is 8px top, 20px left and right, 0 bottom
+    And the footer (outside the card) has its own padding of 0 top, 20px left and right, 24px bottom
+    And the Username input, the Password input and the submit button are each 44px tall
+    And input text renders at 16px
+
+  Scenario: "Forgot password?" is underlined and muted
+    Given the user is on /login
+    When the Password field renders
+    Then the "Forgot password?" link uses the muted text color (--ui-text-toned)
+    And the link is underlined with a 3px underline offset
+    And the link carries no other emphasis (not bold, not the primary color)
+
+  Scenario: A field error shows the circle-alert icon with no extra focus halo
+    Given the user is on /login
+    When the user submits with Username "ma" and Password empty (the Validation errors state)
+    Then the Username field's error message is preceded by the i-lucide-circle-alert icon in the
+      error color
+    And the Password field's error message is preceded by the same icon in the same color
+    When the user tabs into the still-errored Username field so it is both errored and focused
+    Then the field shows exactly one inset ring, in the error color
+    And no second, differently colored focus ring is layered under or around it
+
+  Scenario: The theme select is right-aligned in the footer with no chevron
+    Given the user is on /login
+    When AuthShell's footer renders
+    Then the UColorModeSelect is the last (right-most) element in the footer's row
+    And it renders only its mode icon and label ("System", "Light" or "Dark")
+    And it renders no trailing chevron or dropdown-arrow icon
+
+  Scenario Outline: The alert renders inside the card, under the description
+    Given the user is redirected to <path>
+    When /login renders with its <state> alert
+    Then the alert is a child of the same card element that contains the title and description,
+      not a sibling positioned above the card
+    And the alert sits after the title/description block and before the Username field
+    And the alert's background uses UAlert's soft variant, which is dark-tinted automatically in
+      dark mode
+
+    Examples:
+      | path                                             | state                |
+      | /login?redirect=/article/12/edit&reason=expired   | Session expired      |
+      | /login?reason=password-changed                    | Password changed     |
+
+  Scenario: The h1 is not focused on first load
+    Given the user navigates directly to /login (a fresh page load)
+    When AuthShell mounts and the h1 renders
+    Then the h1 does not receive focus
+    And focus remains on the document body (or wherever the browser places it on load)
+
+  Scenario: Focus moves to the h1 only on an in-app navigation between public screens
+    Given the user is on /login with AuthShell already mounted
+    When the user follows the "Forgot password?" link to /register/reset/request without a full
+      page reload
+    Then AuthShell's h1 receives focus once ResetRequestPage's title renders
+    And the h1 shows no visible outline when it receives this focus