performance updates

resources/themes/backend/assets/css/auth.css

@@ -4,5 +4,9 @@
 .field-row{min-height:48px;margin-bottom:12px}
 .field-row .link{min-width:44px;min-height:44px;padding:0 10px;margin-right:0;font-weight:600;text-decoration-line:underline;text-decoration-thickness:2px;text-underline-offset:4px}
 .signup .link{display:inline-flex;min-width:44px;min-height:44px;justify-content:center;color:#1e40af;border:2px solid currentColor;text-decoration-line:underline;text-decoration-thickness:2px;text-underline-offset:4px}
-.auth-card{min-height:488px}
+
-#passkey-area{min-height:0}
+/* Final Lighthouse stability fixes */
+.auth-card{position:relative}
+#passkey-area[hidden]{display:none!important}
+#passkey-area:not([hidden]){margin-top:16px}
+.auth-brand img{display:block;aspect-ratio:1/1}

resources/themes/backend/views/livewire/auth/login.blade.php

@@ -8,6 +8,11 @@
     <title>{{ __('Log in') }} - {{ config('app.name', 'Systems Helpdesk') }}</title>
     <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicon-32x32.png') }}">
     <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('apple-touch-icon.png') }}">
+    <script>
+        if (window.PublicKeyCredential) {
+            document.documentElement.classList.add('passkeys-capable');
+        }
+    </script>
     <style>
 {!! file_get_contents(resource_path('themes/backend/assets/css/auth.css')) !!}
     </style>
@@ -16,7 +21,7 @@
 <main class="auth-main">
     <div class="auth-wrap">
         <a class="auth-brand" href="{{ route('home') }}" aria-label="{{ config('app.name', 'Systems Helpdesk') }}">
-            <img src="{{ asset('favicon-96x96.webp') }}" srcset="{{ asset('favicon-48x48.webp') }} 1x, {{ asset('favicon-96x96.webp') }} 2x, {{ asset('favicon-144x144.webp') }} 3x" width="48" height="48" alt="" decoding="async">
+            <img src="{{ asset('favicon-96x96.webp') }}" srcset="{{ asset('favicon-48x48.webp') }} 1x, {{ asset('favicon-96x96.webp') }} 2x, {{ asset('favicon-144x144.webp') }} 3x" width="48" height="48" alt="" decoding="async" fetchpriority="high">
         </a>
 
         <section class="auth-card" aria-labelledby="login-heading">