Copilot/fix trusted language implementations job

README.md

@@ -8,7 +8,7 @@ The application is an educational simulator, not a navigation service. Its built
 
 - **Story Mode (`/`)** introduces graphs, route objectives, search strategies, source concepts, scenarios, and trace architecture through responsive interactive demonstrations.
 - **Algorithm Lab (`/lab`)** runs one of seven algorithms with scenario, cost-model, heuristic, language, closure, speed, and timeline controls. It includes metrics, frontier/current-event inspection, node details, and an accessible graph table.
-- **Compare Mode (`/compare`)** synchronizes two to four compatible algorithms on the same graph and playback clock (two lanes by default).
+- **Compare Mode (`/compare`)** synchronizes two to four compatible algorithms on the same graph, with playback from 0.5× to 100× and a measured real-time option (two lanes by default).
 - **Code Explorer (`/code`)** presents curated read-only Dijkstra excerpts in six languages with conceptual line highlighting, copy, and download actions.
 - **Documentation (`/docs`)** provides an in-product guide; the [`docs/`](docs/) directory contains the detailed engineering reference.
 

app/layout.tsx

@@ -39,7 +39,10 @@ export async function generateMetadata(): Promise<Metadata> {
     authors: [{ name: "RouteLab" }],
     creator: "RouteLab",
     icons: {
-      icon: "/favicon.ico",
+      icon: [
+        { url: "/favicon.svg", type: "image/svg+xml" },
+        { url: "/favicon.ico", sizes: "any" },
+      ],
       shortcut: "/favicon.ico",
     },
     openGraph: {

components/CompareWorkspace.module.css

@@ -453,7 +453,9 @@
 
 .graphFrame {
   position: relative;
+  height: 266px;
   min-height: 266px;
+  overflow: hidden;
   border-block: 1px solid var(--line);
   background:
     linear-gradient(var(--bg-elevated) 1px, transparent 1px),
@@ -471,15 +473,19 @@
 
 .graphFrame :global(.graph-canvas),
 .graphFrame :global(.graph-visual) {
-  height: 266px;
+  height: 100%;
+  min-height: 0;
 }
 
 .graphFrame :global(.graph-visual) {
   position: relative;
 }
 
-.graphFrame svg {
+.graphFrame :global(.graph-visual) > svg {
+  position: absolute;
   display: block;
+  inset: 0;
+  box-sizing: border-box;
   width: 100%;
   height: 100%;
   padding: 18px;
@@ -721,7 +727,7 @@
 
 .timeline {
   display: grid;
-  grid-template-columns: auto minmax(220px, 1fr) 90px;
+  grid-template-columns: auto minmax(220px, 1fr) minmax(128px, auto);
   gap: 22px;
   align-items: center;
   width: min(1540px, calc(100% - 48px));
@@ -809,6 +815,15 @@
   font-size: 11px;
 }
 
+.speedField small {
+  margin-top: 2px;
+  color: var(--text-dim);
+  font-family: var(--font-geist-mono), monospace;
+  font-size: 7px;
+  line-height: 1.2;
+  white-space: nowrap;
+}
+
 @media (max-width: 1280px) {
   .intro,
   .configurationInner,
@@ -1001,9 +1016,7 @@
     text-overflow: ellipsis;
   }
 
-  .graphFrame,
-  .graphFrame :global(.graph-canvas),
-  .graphFrame :global(.graph-visual) {
+  .graphFrame {
     min-height: 235px;
     height: 235px;
   }