§H/§F: port eagle watermark branding into the desktop GUI

Brand identity per the plan (dark theme + eagle). Ported faithfully from the
current ostp-gui:

- assets/logo.svg + logo.png (the eagle vector/raster).
- .watermark layer: centered, 80%/max-600px, opacity 0.05, behind the
  screens (z-index 0, pointer-events none), with a light-theme invert.
- Watermark div added after the ambient blobs in index.html.

Dark theme already existed in styles.css; this adds the eagle the plan calls
for. Backend-independent (pure HTML/CSS/asset).

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

ostp-gui/src/index.html

@@ -18,6 +18,11 @@
       <div class="blob blob-2"></div>
     </div>
 
+    <!-- Eagle watermark (brand) -->
+    <div class="watermark" aria-hidden="true">
+      <img src="assets/logo.svg" alt="" />
+    </div>
+
     <!-- ── HOME SCREEN ──────────────────────────────────────────── -->
     <div id="home-screen" class="screen active">
 

ostp-gui/src/styles.css

@@ -235,6 +235,34 @@ input, textarea { font-family: inherit; }
   to   { transform: translate(30px, 20px); }
 }
 
+/* ── Eagle watermark (brand) ──────────────────────────────────────────────── */
+.watermark {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 80%;
+  max-width: 600px;
+  pointer-events: none;
+  z-index: 0;
+  opacity: 0.05;
+  user-select: none;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.watermark img {
+  width: 100%;
+  height: auto;
+  object-fit: contain;
+}
+
+html[data-theme="light"] .watermark {
+  opacity: 0.06;
+  filter: invert(1);
+}
+
 /* ── Screen system ────────────────────────────────────────────────────────── */
 .screen {
   position: absolute;