v1.2 scaffold

frontend/src/routes/scenarios/+page.svelte

@@ -0,0 +1,65 @@
+<script lang="ts">
+  let { data } = $props();
+</script>
+
+<section class="panel">
+  <h2>Scenarios</h2>
+  <p>Simulation workspaces for raw cost, freight, process, and margin changes.</p>
+
+  <div class="scenario-list">
+    {#each data.scenarios as scenario}
+      <article>
+        <header>
+          <div>
+            <h3>{scenario.name}</h3>
+            <p>{scenario.description ?? 'No description'}</p>
+          </div>
+          <span>{scenario.status}</span>
+        </header>
+        <pre>{JSON.stringify(scenario.overrides, null, 2)}</pre>
+      </article>
+    {/each}
+  </div>
+</section>
+
+<style>
+  .panel {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+  }
+
+  .scenario-list {
+    display: grid;
+    gap: 1rem;
+  }
+
+  article {
+    background: rgba(255, 251, 244, 0.82);
+    border-radius: 1.2rem;
+    padding: 1.1rem;
+    border: 1px solid rgba(91, 69, 40, 0.12);
+  }
+
+  header {
+    display: flex;
+    justify-content: space-between;
+    gap: 1rem;
+    align-items: start;
+  }
+
+  h2,
+  h3,
+  p,
+  pre {
+    margin: 0;
+  }
+
+  pre {
+    margin-top: 0.75rem;
+    padding: 0.85rem;
+    border-radius: 0.9rem;
+    background: rgba(53, 42, 29, 0.08);
+    overflow: auto;
+  }
+</style>

frontend/src/routes/scenarios/+page.ts

@@ -0,0 +1,8 @@
+import { api } from '$lib/api';
+
+export async function load() {
+  return {
+    scenarios: await api.scenarios()
+  };
+}
+