Fix wasted empty space in Read Aloud tuning panel layout (v1.13.6)

The backend hint box sat beside the 4 tuning rows via grid-row: 1 /
span 4, forcing it to stretch to their combined height no matter how
short its own text was - usually leaving a large empty gap below a
1-3 line hint. Moved it full-width below the rows instead, sized to
its own content, and dropped the now-redundant two-column grid and
mobile-breakpoint overrides that existed only to manage it.

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

CHANGELOG.md

@@ -9,6 +9,13 @@ Follows [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) · versioned wi
 
 ---
 
+## [1.13.6] — 2026-07-06
+
+### Fixed
+- **Large empty gap in Read Aloud's tuning panel** — the backend hint box sat beside the 4 tuning rows (Speed/Seed/Temperature/Native speed) and was forced to stretch to their combined height regardless of how short its own text was, leaving a big empty area below a 1-3 line hint. Moved it to full width below the rows, sized to its own content.
+
+---
+
 ## [1.13.5] — 2026-07-06
 
 ### Added

VERSION

@@ -1 +1 @@
-1.13.5
+1.13.6

static/index.html

@@ -10,7 +10,7 @@
   <meta name="format-detection" content="telephone=no">
   <meta name="color-scheme" content="light dark">
   <meta name="theme-color" content="#2563EB">
-  <meta name="app-version" content="1.13.5">
+  <meta name="app-version" content="1.13.6">
   <link rel="manifest" href="/manifest.webmanifest">
   <link rel="icon" href="/static/icon.svg" type="image/svg+xml">
   <link rel="apple-touch-icon" href="/static/icon.svg">
@@ -27,7 +27,7 @@
 
   <!-- ── Core styles (local — no CDN dependency for first paint) ────────── -->
   <link rel="stylesheet" href="/static/vendor/mdi/materialdesignicons.min.css">
-  <link rel="stylesheet" href="/static/style.css?v=1.13.5">
+  <link rel="stylesheet" href="/static/style.css?v=1.13.6">
 
 
   <!-- ── Flag icons — non-blocking (loaded async, icons appear after JS) ── -->
@@ -365,7 +365,7 @@ window.toggleNavTree = function(treeId, chevronId) {
 </script>
 
 <!-- loader.js: fetches sections → loads JS modules → removes skeleton -->
-<script src="/static/loader.js?v=1.13.5"></script>
+<script src="/static/loader.js?v=1.13.6"></script>
 
 </body>
 </html>

static/style.css

@@ -4833,13 +4833,12 @@ code { background: var(--panel); border-radius: 4px; padding: 1px 5px; font-fami
 #s-reader .reader-tuning-panel {
   margin-top: 12px;
   display: grid;
-  grid-template-columns: minmax(520px, 680px) minmax(260px, 1fr);
+  grid-template-columns: 1fr;
   gap: 8px;
   padding: 10px 12px;
   border: 1px solid var(--border);
   border-radius: 8px;
   background: var(--bg);
-  align-items: stretch;
 }
 #s-reader .reader-tuning-row {
   grid-column: 1;
@@ -4868,20 +4867,19 @@ code { background: var(--panel); border-radius: 4px; padding: 1px 5px; font-fami
   line-height: 1.35;
 }
 #s-reader .reader-tuning-panel .reader-backend-hint {
-  grid-column: 2;
+  /* Used to sit beside the 4 tuning rows, forced to stretch to their
-  grid-row: 1 / span 4;
+     combined height (grid-row: 1 / span 4) regardless of how short its own
-  align-self: stretch;
+     text was — most of the time that left a large empty gap below a
-  margin: 0;
+     1-3 line hint. Full-width below the rows instead, sized to its own
-  padding: 12px;
+     content, so there's no reserved space to be empty in the first place. */
+  margin: 4px 0 0;
+  padding: 10px 12px;
   border: 1px solid var(--border);
   border-radius: 8px;
   background: var(--surface);
   min-width: 0;
 }
-#s-reader .reader-tuning-panel .reader-backend-hint:empty { display: none; }
+#s-reader .reader-tuning-panel .reader-backend-hint:empty { display: none; margin: 0; }
-#s-reader .reader-tuning-panel:has(.reader-backend-hint:empty) {
-  grid-template-columns: 1fr;
-}
 
 #s-reader .reader-source-panel {
   margin-top: 12px;
@@ -5021,9 +5019,7 @@ code { background: var(--panel); border-radius: 4px; padding: 1px 5px; font-fami
 
 @media (max-width: 860px) {
   #s-reader .reader-source-grid { grid-template-columns: 1fr; }
-  #s-reader .reader-tuning-panel { grid-template-columns: 1fr; }
   #s-reader .reader-tuning-row { grid-template-columns: 1fr; gap: 5px; }
-  #s-reader .reader-tuning-panel .reader-backend-hint { grid-column: 1; grid-row: auto; }
 }
 
 .reader-transport {