Fix feed-item overflow and flex shrink bug causing mobile horizontal scroll

The previous fix (overflow-x:hidden on .main-content and .item-description)
was insufficient because mobile Safari ignores overflow-x:hidden on elements
with overflow-y:auto. The real fix is item-level containment:

- .feed-item: add overflow:hidden to create a BFC so no child content can
  push the viewport wider, even during async image load reflows
- .item-title: add min-width:0 (fixes flex min-width:auto bug that prevents
  shrinking below content width) and overflow-wrap:break-word for long titles

https://claude.ai/code/session_0141nhxmYfoFPVPZ813K1XFD

1 files changed, 3 insertions, 0 deletions

diff --git a/frontend-vanilla/src/style.css b/frontend-vanilla/src/style.css
index 4d69390..47b2de2 100644
--- a/frontend-vanilla/src/style.css
+++ b/frontend-vanilla/src/style.css
@@ -452,6 +452,7 @@ select:focus {
   border-bottom: none;
   border-radius: 8px;
   transition: background-color 0.2s ease, opacity 0.3s ease;
+  overflow: hidden;
 }
 
 
@@ -471,6 +472,8 @@ select:focus {
   color: var(--link-color);
   display: block;
   flex: 1;
+  min-width: 0;
+  overflow-wrap: break-word;
   cursor: pointer;
 }