phase: 176_mobile_settings_value_width

All documentation claims verify against the code. Everything is green — final verification complete.

## Phase 176 — Final Verification Report

- **Verified (all 3 tasks in `complete/`):** the mobile Value-column fix is in the working tree — `frontend/index.html` L1602 carries `class="settings-value-th"`; `frontend/assets/styles.css` has exactly two new rules inside the `@media (max-width: 640px)` block: `.settings-table { min-width: 720px }` and `.settings-value-cell, .settings-value-th { min-width: calc(13rem + 2rem) }`; `settings.js` + `app/` byte-unchanged (diff = index.html + styles.css + unit test only).
- **Documented deviation (flagged in task-03 report, not silent):** spec's `min-width: 13rem` on the border-box cell left the control at 176px (< the 192px A3 pin); executor corrected the cell to `calc(13rem + 2rem)` so the control (100% of content) lands at exactly 13rem ≈ 208px — the A2 lock intent preserved, unit pin + CSS comment updated to match.
- **Tests/lint/coverage (exact commands, all green):** `uv run pytest --cov=app` → **4138 passed**, `app/` coverage **99%** (>90% ✓); `uv run ruff check .` → clean; `uv run pyright` → 0 errors, 0 warnings.
- **Completion criteria:** 375px controls ≥ 192px — ✅ (E2E `test_mobile_value_inputs_are_usable_width`); card scrolls / page doesn't overflow at 375px — ✅ (`test_mobile_table_still_scrolls_and_page_does_not_overflow`); 1440px media query inert — ✅ (`test_desktop_value_width_is_unchanged`); tab order + zero external requests — ✅; phase E2E isolated — ✅ 4/4; phase 171 isolated — ✅ 5/5; phase 168 isolated — ✅ 12/12; unit pins — ✅ 17/17; commit/move — the harness commits; phase dir already in `complete/`.
- **Documentation:** README.md and AGENTS.md reviewed in full — every claim spot-checked against code (E2E ports 8123/8901, defaults `BOR_COMPRESS_MIN_BYTES=860` / `BOR_LOG_LARGE_RESPONSE_BYTES=65536`, audit budget 262144, `.cell-clip`, `.bubble:empty`, `min(70vh, 64rem)`, aria-pressed toggle, CDN integration test, `.gitignore` entries, all referenced scripts/routes) — verified consistent, no changes needed.
- **Notable:** `image-1.png` (owner's TODO screenshot, referenced by the phase overview) sits untracked in the tree — left alone; not part of the phase's commit scope.
- **Next pending phase:** `177_themed_favicon`.

frontend/assets/styles.css

@@ -4738,7 +4738,10 @@ a.answer-image:hover { text-decoration: underline; } /* flat — the caption und
 /* The catalogue: FULL-WIDTH (AGENTS.md rule 5 — the .git-sources-
    table language: no skinny list), one cell per column, the
    .table-wrap card + its bounded scroll + the sticky thead carry
-   the phase-156 contract. */
+   the phase-156 contract. The ≤640px mobile block (phase 176) raises
+   the floor to 720px so the 13rem Value column stays readable on a
+   phone (the card's horizontal scroll absorbs it; this rule keeps
+   560px for ≥641px viewports). */
 .settings-table {
   width: 100%;
   border-collapse: collapse;
@@ -6486,6 +6489,24 @@ a.answer-image:hover { text-decoration: underline; } /* flat — the caption und
   #settings-save { width: 100%; }
   #settings-clear-all { width: 100%; }
   .settings-actions-cell { white-space: normal; }
+  /* Phase 176 (task 01; TODO L3, owner-locked A2): the Value column
+     gets a usable floor on the phone. The Setting cells' nowrap
+     labels (the .settings-table td rule above) exhausted the 560px
+     table floor, collapsing the min-width: 0 Value cells to 2–3
+     characters at 375px. The cell's min-width is 13rem + 2rem (the
+     td's own 1rem × 2 padding — the global border-box model): the
+     .settings-control (width: 100% of the cell's CONTENT) lands at
+     the locked 13rem (≈208px ≈ 14 mono chars at the controls'
+     0.85rem) — readable and editable on a phone; the 720px table
+     floor + the card's overflow: auto (.table-wrap) mean the phone
+     scrolls the CARD, never the page (the phase-171 "no horizontal
+     page overflow" pin holds). 720px is a bare length literal — NO
+     new CSS custom property (B3 binds palette variables; a length in
+     the mobile block is the idiom the neighboring width: 100% rules
+     already use). Mobile-only (A1): at ≥641px these rules are inert
+     and the desktop layout stays byte-identical. */
+  .settings-table { min-width: 720px; }
+  .settings-value-cell, .settings-value-th { min-width: calc(13rem + 2rem); }
   /* Phase 51: the shared page squeezes like the chat column — the
      title and the note step down (the empty-state-title family); the
      shell is full-width here (the 72rem cap never binds on a phone —

frontend/index.html

@@ -1599,7 +1599,7 @@
               <thead>
                 <tr>
                   <th scope="col">Setting</th>
-                  <th scope="col">Value</th>
+                  <th scope="col" class="settings-value-th">Value</th>
                   <th scope="col">Source</th>
                   <th scope="col"><span class="visually-hidden">Actions</span></th>
                 </tr>