diff --git a/static/index.html b/static/index.html
index c514093..2c57e4d 100644
--- a/static/index.html
+++ b/static/index.html
@@ -1,67 +1,115 @@
 <!doctype html>
 <html>
 <head>
-  <title>Document Generator</title>
-  <link rel="stylesheet" href="/static/styles.css?v=picker1">
+  <title>Utility App</title>
+  <link rel="stylesheet" href="/static/styles.css?v=shell1">
 </head>
 <body>
-  <div class="container">
-    <div class="heading">
-      <h1>Document Generator</h1>
+  <header class="app-header">
+    <div class="app-header-inner">
+      <div class="app-title">Utility App</div>
+
+      <nav class="app-nav">
+        <button class="nav-button active" type="button" data-view="homeView">Home</button>
+        <button class="nav-button" type="button" data-view="docGeneratorView">Document Generator</button>
+        <button class="nav-button" type="button" data-view="pdfAnnotatorView">PDF Annotator</button>
+      </nav>
     </div>
+  </header>
 
-    <button id="clearFormButton" type="button">Clear Form</button>
-
-    <label class="file-button">
-      Upload JSON
-      <input type="file" id="presetFileInput" accept=".json,application/json">
-    </label>
-
-    <button id="downloadJsonButton" type="button">Download JSON</button>
-
-    <label class="file-button">
-      Upload Data CSV
-      <input type="file" id="dataFileInput" accept=".csv,text/csv">
-    </label>
-
-    <button id="downloadDataButton" type="button">Download Data CSV</button>
-
-    <h2>Document Type</h2>
-
-    <input type="hidden" id="documentTypeSelect">
-
-    <div class="document-picker dropdown-picker">
-      <button id="documentPickerToggle" class="document-picker-toggle" type="button">
-        <span id="selectedDocumentLabel">Select Document Type</span>
-        <span class="dropdown-arrow">▼</span>
-      </button>
-
-      <div id="documentPickerMenu" class="document-picker-menu">
-        <h3>Default Templates</h3>
-        <div id="defaultDocumentOptions" class="picker-list"></div>
-
-        <h3>Uploaded JSONs</h3>
-        <div id="uploadedJsonOptions" class="picker-list"></div>
+  <main class="container">
+    <section id="homeView" class="app-view active">
+      <div class="heading">
+        <h1 id="mainPageTitle">Utility App</h1>
       </div>
-    </div>
 
-    <div id="documentDescription"></div>
+      <div id="mainPageContent" class="main-page-content" contenteditable="true">
+        <p>Select a tool above. This main page text is editable in the browser for quick notes, instructions, or workflow reminders.</p>
+        <p><strong>Current tools:</strong> Document Generator and PDF Annotator.</p>
+      </div>
 
-    <form id="docForm">
-      <div id="fieldsContainer"></div>
+      <div class="home-actions">
+        <button id="saveMainPageButton" type="button">Save Main Page Text</button>
+        <button id="resetMainPageButton" type="button">Reset Main Page Text</button>
+      </div>
+    </section>
 
-      <h2>Generate Documents</h2>
+    <section id="docGeneratorView" class="app-view">
+      <div class="heading">
+        <h1>Document Generator</h1>
+      </div>
 
-      <div class="form-row">
-        <div class="form-group">
-          <input type="submit" value="Generate DOCX">
+      <div class="tool-button-row">
+        <button id="clearFormButton" class="tool-action-button" type="button">Clear Form</button>
+
+        <label class="file-button tool-action-button">
+          Upload JSON
+          <input type="file" id="presetFileInput" accept=".json,application/json">
+        </label>
+
+        <button id="downloadJsonButton" class="tool-action-button" type="button">Download JSON</button>
+
+        <label class="file-button tool-action-button">
+          Upload Data CSV
+          <input type="file" id="dataFileInput" accept=".csv,text/csv">
+        </label>
+
+        <button id="downloadDataButton" class="tool-action-button" type="button">Download Data CSV</button>
+      </div>
+
+      <h2>Document Type</h2>
+
+      <input type="hidden" id="documentTypeSelect">
+
+      <div class="document-picker dropdown-picker">
+        <button id="documentPickerToggle" class="document-picker-toggle" type="button">
+          <span id="selectedDocumentLabel">Select Document Type</span>
+          <span class="dropdown-arrow">▼</span>
+        </button>
+
+        <div id="documentPickerMenu" class="document-picker-menu">
+          <h3>Default Templates</h3>
+          <div id="defaultDocumentOptions" class="picker-list"></div>
+
+          <h3>Uploaded JSONs</h3>
+          <div id="uploadedJsonOptions" class="picker-list"></div>
         </div>
       </div>
-    </form>
+
+      <div id="documentDescription"></div>
+
+      <form id="docForm">
+        <div id="fieldsContainer"></div>
+
+        <h2>Generate Documents</h2>
+
+        <div class="form-row">
+          <div class="form-group">
+            <input type="submit" value="Generate DOCX">
+          </div>
+        </div>
+      </form>
+    </section>
+
+    <section id="pdfAnnotatorView" class="app-view">
+      <div class="heading">
+        <h1>PDF Annotator</h1>
+      </div>
+
+      <p>This is a stub page for the PDF Annotator tool.</p>
+
+      <p>
+        <a class="tool-launch-link" href="http://192.168.1.21:3004/" target="_blank" rel="noopener">
+          Open PDF Annotator
+        </a>
+      </p>
+
+      <p>Later, this page can embed or proxy the PDF annotator workflow directly inside the Utility App.</p>
+    </section>
 
     <div id="status"></div>
-  </div>
+  </main>
 
-  <script src="/static/app.js?v=picker1"></script>
+  <script src="/static/app.js?v=shell1"></script>
 </body>
 </html>
diff --git a/static/styles.css b/static/styles.css
index 420de67..2450271 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -301,3 +301,121 @@ input[type="submit"] {
     font-style: italic;
     padding: 4px 0 8px;
 }
+
+.app-header {
+    background: #333;
+    color: #fff;
+    padding: 10px 0;
+}
+
+.app-header-inner {
+    max-width: 840px;
+    margin: 0 auto;
+    padding: 0 20px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
+.app-title {
+    font-size: 18px;
+    font-weight: bold;
+}
+
+.app-nav {
+    display: flex;
+    gap: 6px;
+}
+
+.nav-button {
+    background: #555;
+    color: #fff;
+    border: 1px solid #777;
+}
+
+.nav-button.active {
+    background: #007bff;
+    border-color: #007bff;
+}
+
+.app-view {
+    display: none;
+}
+
+.app-view.active {
+    display: block;
+}
+
+.main-page-content {
+    min-height: 180px;
+    padding: 14px;
+    border: 1px solid #ccc;
+    border-radius: 6px;
+    background: #fafafa;
+    line-height: 1.5;
+}
+
+.main-page-content:focus {
+    border-color: #007bff;
+    outline: none;
+}
+
+.home-actions {
+    margin-top: 12px;
+}
+
+.tool-launch-link {
+    display: inline-block;
+    padding: 8px 12px;
+    background: #007bff;
+    color: #fff;
+    border-radius: 5px;
+    text-decoration: none;
+}
+
+.tool-launch-link:hover {
+    background: #0056b3;
+}
+
+.tool-button-row {
+    display: flex;
+    flex-wrap: nowrap;
+    gap: 8px;
+    align-items: center;
+    margin: 10px 0 18px;
+}
+
+.tool-action-button,
+button.tool-action-button,
+label.tool-action-button {
+    width: 125px;
+    height: 34px;
+    box-sizing: border-box;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    padding: 6px 8px;
+    margin: 0;
+    font-size: 13px;
+    line-height: 1;
+    white-space: nowrap;
+    text-align: center;
+}
+
+.file-button.tool-action-button input {
+    display: none;
+}
+
+@media (max-width: 760px) {
+    .tool-button-row {
+        gap: 5px;
+    }
+
+    .tool-action-button,
+    button.tool-action-button,
+    label.tool-action-button {
+        width: 118px;
+        font-size: 12px;
+        padding: 5px 6px;
+    }
+}
