refactor(detail): extract sections as server components

Moves ~1,300 lines of section markup out of the two client views into
components/school/, mirroring the components/compare/ layout. Twelve section
components plus shared primitives, all server components. The only client
file is AdmissionsViewToggle, which owns the hidden/aria-pressed state and
receives both views as server-rendered children.

JSX was extracted mechanically rather than retyped, so the markup the CSS
modules depend on is verbatim.

Sharing follows measured similarity, not assumption:
- Finances (91%) shared. The secondary premises-cost card is gated behind a
  prop so primary pages are unchanged; enabling it is a one-line follow-up.
- Ofsted (80%) shared, but behind a variant prop. The headline similarity hid
  a real fork: on a school with no overall grade the primary page shows a
  "Not rated" badge while the secondary shows a four-area OEIF panel, and the
  disclaimer copy differs. Both preserved exactly; reconciling them is a
  human decision, not a side effect of a move.
- Admissions (14%) and History (40%) kept separate.

Not yet wired up -- the old views still render.

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

nextjs-app/components/school/FinancesSection.tsx

@@ -0,0 +1,57 @@
+/**
+ * FinancesSection — shared between the primary and secondary detail pages
+ * (the two versions were 91% identical).
+ *
+ * Server component.
+ */
+
+import type { SchoolFinance } from '@/lib/types';
+import { formatAcademicYear } from '@/lib/utils';
+import { Section, sectionStyles as styles } from './sectionShared';
+
+export function FinancesSection({
+  finance,
+  showPremises = false,
+}: {
+  finance: SchoolFinance;
+  /**
+   * The secondary page shows a premises-cost card the primary page never had.
+   * Gated rather than enabled everywhere so this refactor makes no visible
+   * change; enabling it for primary is a one-line follow-up.
+   */
+  showPremises?: boolean;
+}) {
+  return (
+    <Section id="finances">
+      <h2 className={styles.sectionTitle}>School Finances ({formatAcademicYear(finance.year)})</h2>
+      <p className={styles.sectionSubtitle}>
+        Per-pupil spending shows how much the school has to spend on each child&apos;s education.
+      </p>
+      <div className={styles.metricsGrid}>
+        <div className={styles.metricCard}>
+          <div className={styles.metricLabel}>Total spend per pupil per year</div>
+          <div className={styles.metricValue}>£{Math.round(finance.per_pupil_spend!).toLocaleString()}</div>
+          <div className={styles.metricHint}>How much the school has to spend on each pupil annually</div>
+        </div>
+        {finance.teacher_cost_pct != null && (
+          <div className={styles.metricCard}>
+            <div className={styles.metricLabel}>Share of budget spent on teachers</div>
+            <div className={styles.metricValue}>{finance.teacher_cost_pct.toFixed(1)}%</div>
+          </div>
+        )}
+        {finance.staff_cost_pct != null && (
+          <div className={styles.metricCard}>
+            <div className={styles.metricLabel}>Share of budget spent on all staff</div>
+            <div className={styles.metricValue}>{finance.staff_cost_pct.toFixed(1)}%</div>
+          </div>
+        )}
+        {showPremises && finance.premises_cost_pct != null && (
+          <div className={styles.metricCard}>
+            <div className={styles.metricLabel}>Share of budget spent on premises</div>
+            <div className={styles.metricValue}>{finance.premises_cost_pct.toFixed(1)}%</div>
+          </div>
+        )}
+      </div>
+    </Section>
+  );
+}