fixing output

templates/index.html

@@ -24,7 +24,7 @@
       border-radius: 10px;
       padding: 1.4rem;
       width: 100%;
-      max-width: 500px;
+      max-width: 1000px;
       margin-bottom: 1rem;
     }
     button {
@@ -76,17 +76,6 @@
   <h1>🏴‍☠️ One Piece Progress Reporter</h1>
   <div class="week-label">Week: <strong>{{ date_range }}</strong> &nbsp;({{ week_start }} → {{ week_end }})</div>
 
-  <div class="card" style="margin-top:0.8rem;">
-    <h2 style="font-size:0.95rem;color:#aaa;margin-bottom:0.5rem;">Environment</h2>
-    <pre id="env" style="white-space:pre-wrap;font-family:monospace;font-size:0.85rem;color:#ddd;background:#0b0b0b;border-radius:6px;padding:0.6rem;">
-JELLYFIN_HOST={{ config.JELLYFIN_HOST }}
-JELLYFIN_API_KEY={{ config.JELLYFIN_API_KEY }}
-JELLYFIN_USER_ID={{ config.JELLYFIN_USER_ID }}
-TOTAL_EPISODES={{ config.TOTAL_EPISODES }}
-DB_PATH={{ config.DB_PATH }}
-    </pre>
-  </div>
-
   <div class="card">
     <button id="btn-report">Generate Report</button>
     <div id="status" class="status"></div>
@@ -104,6 +93,20 @@ DB_PATH={{ config.DB_PATH }}
     <div id="media-name" class="media-name hidden"></div>
   </div>
 
+  <div class="card" style="margin-top:0.8rem;">
+    <h2 style="font-size:0.95rem;color:#aaa;margin-bottom:0.5rem;">Debug</h2>
+    <pre id="debug" style="white-space:pre-wrap;font-family:monospace;font-size:0.85rem;color:#ddd;background:#0b0b0b;border-radius:6px;padding:0.6rem;">
+LATEST_SUNDAY={{ latest_sunday }}
+PREVIOUS_SUNDAY={{ previous_sunday }}
+JELLYFIN_HOST={{ config.JELLYFIN_HOST }}
+JELLYFIN_USER_ID={{ config.JELLYFIN_USER_ID }}
+TOTAL_EPISODES={{ config.TOTAL_EPISODES }}
+DB_PATH={{ config.DB_PATH }}
+
+(Report output will appear here after Generate Report is clicked)
+    </pre>
+  </div>
+
   <script>
     const $ = id => document.getElementById(id);
 
@@ -121,7 +124,13 @@ DB_PATH={{ config.DB_PATH }}
       try {
         const resp = await fetch('/api/report');
         const data = await resp.json();
-        if (data.error) throw new Error(data.error);
+        
+        if (data.error) {
+          if (data.debug) {
+            $('debug').textContent += '\n\n' + data.debug;
+          }
+          throw new Error(data.error);
+        }
 
         $('d-latest').textContent = data.latest_episode;
         $('d-previous').textContent = data.previous_episode;
@@ -134,6 +143,26 @@ DB_PATH={{ config.DB_PATH }}
           $('media-name').classList.remove('hidden');
         }
 
+        const debugLines = [];
+        if (data.debug) {
+          debugLines.push('\n' + data.debug);
+        }
+        debugLines.push('');
+        debugLines.push('✓ Fetched report from /api/report');
+        debugLines.push(`✓ Latest Sunday (UTC): ${data.latest_sunday}`);
+        debugLines.push(`✓ Previous Sunday (UTC): ${data.previous_sunday}`);
+        debugLines.push(`✓ Activity cutoff: before ${data.latest_sunday}`);
+        debugLines.push(`✓ Found: "${data.media_name}"`);
+        debugLines.push(`✓ Extracted episode: ${data.latest_episode}`);
+        debugLines.push(`✓ Previous week episode: ${data.previous_episode}`);
+        debugLines.push(`✓ Episodes watched: ${data.watched_this_week}`);
+        debugLines.push(`✓ Total episodes in series: ${data.total_episodes}`);
+        debugLines.push(`✓ Saved to DB: week_start=${data.week_start}, week_end=${data.week_end}`);
+        debugLines.push('');
+        debugLines.push('Final report:');
+        debugLines.push(data.report);
+        $('debug').textContent += debugLines.join('\n');
+
         $('details-card').classList.remove('hidden');
         setStatus('');
       } catch (e) {