feat(ui): add phase indicators to school list rows

Add coloured left-border and phase label pill to visually differentiate
school phases (Primary, Secondary, All-through, Post-16, Nursery) in
search result lists. Colours are accessible (WCAG AA) and don't clash
with existing Ofsted/trend semantic colours.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

nextjs-app/components/SchoolRow.tsx

@@ -9,7 +9,7 @@
  */
 
 import type { School } from '@/lib/types';
-import { formatPercentage, formatProgress, calculateTrend, schoolUrl } from '@/lib/utils';
+import { formatPercentage, formatProgress, calculateTrend, getPhaseStyle, schoolUrl } from '@/lib/utils';
 import { progressBand } from '@/lib/metrics';
 import styles from './SchoolRow.module.css';
 
@@ -36,6 +36,7 @@ export function SchoolRow({
   onRemoveFromCompare,
 }: SchoolRowProps) {
   const trend = calculateTrend(school.rwm_expected_pct, school.prev_rwm_expected_pct);
+  const phase = getPhaseStyle(school.phase);
 
   // Use reading progress as representative; fall back to writing, then maths
   const progressScore =
@@ -55,7 +56,7 @@ export function SchoolRow({
     school.religious_denomination !== 'Does not apply';
 
   return (
-    <div className={`${styles.row} ${isInCompare ? styles.rowInCompare : ''}`}>
+    <div className={`${styles.row} ${phase.key ? styles[`phase${phase.key}`] : ''} ${isInCompare ? styles.rowInCompare : ''}`}>
       {/* Left: four content lines */}
       <div className={styles.rowContent}>
 
@@ -78,6 +79,11 @@ export function SchoolRow({
 
         {/* Line 2: Context tags */}
         <div className={styles.line2}>
+          {phase.label && (
+            <span className={`${styles.phaseLabel} ${styles[`phaseLabel${phase.key}`]}`}>
+              {phase.label}
+            </span>
+          )}
           {school.school_type && <span>{school.school_type}</span>}
           {school.age_range && <span>{school.age_range}</span>}
           {showDenomination && <span>{school.religious_denomination}</span>}