Align intake windows with dashboard mockup position and styling

app.py

@@ -597,6 +597,50 @@ TOTEM_CSS = """
   border-color: rgba(224, 75, 69, 0.35);
 }
 
+.totem-intake-host {
+  margin: 14px 0 12px;
+}
+
+#totem-intake-mount #intake-row {
+  display: grid !important;
+  grid-template-columns: repeat(2, minmax(280px, 1fr));
+  gap: 14px;
+  margin: 0;
+}
+
+#totem-intake-mount #intake-row > .gr-column {
+  border: 1px solid rgba(205, 123, 255, 0.42);
+  border-radius: 14px;
+  background:
+    radial-gradient(600px 180px at 100% 0%, rgba(125, 68, 209, 0.24), transparent 62%),
+    linear-gradient(180deg, rgba(13, 22, 58, 0.95), rgba(8, 14, 40, 0.95));
+  box-shadow: inset 0 0 0 1px rgba(255, 216, 126, 0.12);
+  padding: 10px 12px 12px !important;
+}
+
+#totem-intake-mount #intake-row .gr-markdown p {
+  margin: 2px 0 8px !important;
+  color: #f8e6b7 !important;
+  letter-spacing: 0.02em;
+}
+
+#totem-intake-mount #intake-row .gr-file {
+  border: 1px dashed rgba(202, 125, 255, 0.45) !important;
+  border-radius: 12px !important;
+  background: rgba(10, 19, 52, 0.82) !important;
+  min-height: 102px;
+}
+
+#totem-intake-mount #intake-row button {
+  border-radius: 10px !important;
+}
+
+@media (max-width: 1080px) {
+  #totem-intake-mount #intake-row {
+    grid-template-columns: 1fr;
+  }
+}
+
 .totem-run-btn {
   min-height: 34px;
   border-radius: 8px;
@@ -1179,6 +1223,15 @@ HEAD = """
     return true;
   };
 
+  const mountIntakeRow = () => {
+    const mount = document.getElementById('totem-intake-mount');
+    const row = document.getElementById('intake-row');
+    if (!mount || !row) return;
+    if (row.parentElement !== mount) {
+      mount.appendChild(row);
+    }
+  };
+
   const bindSidebarCodexLinks = () => {
     const bindings = [
       { selector: '.js-open-dashboard', handler: switchToDashboardTab },
@@ -1205,14 +1258,22 @@ HEAD = """
     });
   };
 
-  const observer = new MutationObserver(() => bindSidebarCodexLinks());
+  const observer = new MutationObserver(() => {
+    bindSidebarCodexLinks();
+    mountIntakeRow();
+  });
   observer.observe(document.documentElement, { childList: true, subtree: true });
 
   if (document.readyState === 'loading') {
-    document.addEventListener('DOMContentLoaded', bindSidebarCodexLinks);
+    document.addEventListener('DOMContentLoaded', () => {
+      bindSidebarCodexLinks();
+      mountIntakeRow();
+    });
   } else {
     bindSidebarCodexLinks();
+    mountIntakeRow();
   }
+  setInterval(mountIntakeRow, 1000);
 })();
 </script>
 """
@@ -1817,6 +1878,9 @@ def render_dashboard(state: dict) -> str:
           {render_topbar(s)}
           {render_hero(s)}
           {render_status_row(s)}
+          <section class="totem-intake-host">
+            <div id="totem-intake-mount"></div>
+          </section>
           {render_metric_cards(s)}
           <section class="totem-lower-grid">
             {render_revision_queue(s)}