feat: CSS Grid editor with OCR-measured column widths and row heights

Backend: add layout_metrics (avg_row_height_px, font_size_suggestion_px)
to build-grid response for faithful grid reconstruction.

Frontend: rewrite GridTable from HTML <table> to CSS Grid layout.
Column widths are now proportional to the OCR-measured x_min/x_max
positions. Row heights use the average content row height from the
scan. Column and row resize via drag handles (Excel-like).

Font: add Noto Sans (supports IPA characters) via next/font/google.

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

klausur-service/backend/grid_editor_api.py

@@ -991,6 +991,20 @@ async def build_grid(session_id: str):
                 cn = wb.get("color_name", "black")
                 color_stats[cn] = color_stats.get(cn, 0) + 1
 
+    # Compute layout metrics for faithful grid reconstruction
+    all_content_row_heights: List[float] = []
+    for z in zones_data:
+        for row in z.get("rows", []):
+            if not row.get("is_header", False):
+                h = row.get("y_max_px", 0) - row.get("y_min_px", 0)
+                if h > 0:
+                    all_content_row_heights.append(h)
+    avg_row_height = (
+        sum(all_content_row_heights) / len(all_content_row_heights)
+        if all_content_row_heights else 30.0
+    )
+    font_size_suggestion = max(10, int(avg_row_height * 0.6))
+
     result = {
         "session_id": session_id,
         "image_width": img_w,
@@ -1010,6 +1024,12 @@ async def build_grid(session_id: str):
             "bold_columns": [],
             "header_rows": [],
         },
+        "layout_metrics": {
+            "page_width_px": img_w,
+            "page_height_px": img_h,
+            "avg_row_height_px": round(avg_row_height, 1),
+            "font_size_suggestion_px": font_size_suggestion,
+        },
         "duration_seconds": round(duration, 2),
     }