Add a feed without Popular; a phone shows an item's files above its notes

- The Add a feed dialog no longer lists Popular; the sidebar has it (#30).
- On a phone the files, with play and delete, come before the show notes. Below
  them, long notes buried the delete button and it looked missing on iOS (#21).

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

web/index.html

@@ -296,6 +296,7 @@ input:focus,select:focus{outline:0;border-color:var(--accent)}
 .dt{font-size:18px;font-weight:650;margin:0 0 5px;line-height:1.3;overflow-wrap:anywhere}
 .dmeta{color:var(--faint);font-size:12.5px;display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
 .dmeta .btn{padding:3px 9px;font-size:12px}
+#detail .encbox{margin:0 0 10px}
 .dbody{font-size:14.5px;line-height:1.65;overflow-wrap:anywhere;color:var(--fg)}
 .dbody img{max-width:100%;height:auto;border-radius:6px}
 .dbody a{color:var(--accent)}
@@ -549,7 +550,7 @@ input[type=range]::-moz-range-thumb{width:12px;height:12px;border:0;border-radiu
 
   /* One pane at a time: the list, then the item over it. */
   #split{grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:"list"}
-  /* Title and date only; the files follow the item's text in the reader instead. */
+  /* Title and date only; the files sit above the item's text in the reader instead. */
   #files,.ephead,.ep .fd,.ep .file,.ep .size,.ep .rowacts{display:none}
   .ep,#split.one .ep{grid-template-columns:20px 20px minmax(0,1fr) auto}
   #grab{display:none}
@@ -1396,7 +1397,9 @@ function showDetail(e){
     return;
   }
   const encs=e.enclosures.map(encBox).join('')||'<p class="empty">No files</p>';
-  // A phone has no room for the files pane, so the files follow the text there instead.
+  // A phone has no room for the files pane, so the files go above the text there instead.
+  // Below it, a long set of show notes pushed play and delete screens down, and on an iPhone
+  // it looked as if a downloaded file could not be deleted at all (issue #21).
   const narrow=!!window.matchMedia?.('(max-width:820px)')?.matches;
   const f=S.feeds.find(x=>x.id===e.feed_id);
   const num=[e.season?`S${e.season}`:'',e.episode?`E${e.episode}`:''].filter(Boolean).join('');
@@ -1414,8 +1417,8 @@ function showDetail(e){
       ${e.link?`<a class="btn ico" href="${esc(e.link)}" target="_blank" rel="noopener noreferrer"
         title="Open the original" aria-label="Open the original">${ICON.open}</a>`:''}
     </div>
-    <div class="dbody">${(e.description&&e.description.trim())||'<em>No show notes.</em>'}</div>
-    ${narrow?encs:''}`;
+    ${narrow?encs:''}
+    <div class="dbody">${(e.description&&e.description.trim())||'<em>No show notes.</em>'}</div>`;
   if(files) files.innerHTML=narrow?'':`<div class="fhd">Files</div>${encs}`;
   // description was sanitized server-side with ammonia before it ever reached here
   $('#dback').onclick=()=>showDetail(null);
@@ -1794,12 +1797,9 @@ $('#addFeed').onclick=()=>{
     <div class="field"><label>Keywords (optional, comma separated)</label>
       <input type="text" id="nkw"><span class="hint">Only items matching a keyword are downloaded.</span></div>
     <label class="check"><input type="checkbox" id="nexp"> Allow items marked explicit</label>
-    <div class="field"><label>Popular on this server</label>
-      <div class="childlist" id="npopular"><p class="hint">Loading…</p></div></div>
     <div class="cardacts"><button class="btn ico" onclick="closeModal()" title="Cancel" aria-label="Cancel">${ICON.close}</button>
       <button class="btn ico primary" id="nsave" title="Add feed" aria-label="Add feed">${ICON.plus}</button></div>`);
   $('#nurl').focus();
-  listFeeds('/api/popular',$('#npopular'));
   $('#nsave').onclick=async()=>{
     const url=$('#nurl').value.trim(); if(!url) return;
     $('#nsave').disabled=true; $('#nsave').title='Adding…';
@@ -1814,8 +1814,7 @@ $('#addFeed').onclick=()=>{
 };
 
 // What everyone here reads, you included, as a place to start. The rows carry an id, never a
-// URL, so a key in someone's feed address never reaches this page. The caller hands over the
-// box: looked up by id, the Add a feed dialog's list landed in the Directory pane behind it.
+// URL, so a key in someone's feed address never reaches this page.
 const NONE_LISTED='<p class="hint">Nothing yet. Feeds people here subscribe to show up here.</p>';
 async function listFeeds(url,box){
   let rows=[];