fix: style; feat: AGENTS.md

src/app/home/home.component.html

@@ -57,13 +57,12 @@
             <div class="portrait-media" [class.portrait-media-switching]="isPortraitSwitching">
               <img
                 class="hero-feature-image"
-                [ngSrc]="currentPortraitHighlight.image"
+                [src]="currentPortraitHighlight.image"
                 [attr.srcset]="currentPortraitHighlight.imageSrcset"
                 [attr.sizes]="currentPortraitHighlight.imageSizes"
                 [width]="currentPortraitHighlight.imageWidth"
                 [height]="currentPortraitHighlight.imageHeight"
-                disableOptimizedSrcset
-                priority
+                fetchpriority="high"
                 decoding="async"
                 [alt]="currentPortraitHighlight.text + ' ' + content().home.portraitAltSuffix"
               />

src/app/home/home.component.spec.ts

@@ -33,6 +33,7 @@ describe('HomeComponent', (): void => {
     scheduleNameGradientUpdate(): void;
     scheduleProjectEntryRevealUpdate(): void;
     scheduleAboutSectionScrollAnimationUpdate(): void;
+    shouldEnableScrollEffects(): boolean;
     toggleBio(): void;
     showNextPortraitHighlight(): void;
     scrollToAboutSection(): void;
@@ -428,6 +429,29 @@ describe('HomeComponent', (): void => {
   // ── RAF debouncing (performance) ───────────────────────────────────────────
 
   describe('Performance', (): void => {
+    it('should keep scroll effects enabled on small viewports when motion is allowed', (): void => {
+      spyOnProperty(window, 'innerWidth').and.returnValue(390);
+      spyOn(window, 'matchMedia').and.callFake(
+        (query: string): MediaQueryList =>
+          ({
+            matches: query === '(prefers-reduced-motion: reduce)' ? false : true,
+          }) as MediaQueryList,
+      );
+
+      expect(comp.shouldEnableScrollEffects()).toBeTrue();
+    });
+
+    it('should disable scroll effects when reduced motion is requested', (): void => {
+      spyOn(window, 'matchMedia').and.callFake(
+        (query: string): MediaQueryList =>
+          ({
+            matches: query === '(prefers-reduced-motion: reduce)',
+          }) as MediaQueryList,
+      );
+
+      expect(comp.shouldEnableScrollEffects()).toBeFalse();
+    });
+
     it('should create and run initial change detection within 200 ms', (): void => {
       const start = performance.now();
       const f = TestBed.createComponent(HomeComponent);

src/app/home/home.component.ts

@@ -220,13 +220,11 @@ export class HomeComponent implements OnInit, AfterViewInit, OnDestroy {
   private shouldEnableScrollEffects(): boolean {
     if (typeof window === 'undefined') return false;
 
-    const isSmallViewport: boolean = window.innerWidth <= 700;
     const prefersReducedMotion: boolean = window.matchMedia(
       '(prefers-reduced-motion: reduce)',
     ).matches;
-    const isCoarsePointer: boolean = window.matchMedia('(pointer: coarse)').matches;
 
-    return !isSmallViewport && !prefersReducedMotion && !isCoarsePointer;
+    return !prefersReducedMotion;
   }
 
   private initNameGradientScrollAnimation(): void {