From f32aac106cd91dfaf965d5d938ed4e64c7a1330b Mon Sep 17 00:00:00 2001
From: Antisophy <293439221+Antisophy@users.noreply.github.com>
Date: Thu, 20 Aug 2026 21:09:54 -0700
Subject: [PATCH] fix(web): tighten the composer on narrow screens

The composer keeps its desktop spacing on a phone, where it takes a
noticeable slice of the screen: 12px/16px around the box, 10px/14px inside
the textarea, and buttons padded 10px/20px.

Halve that below 768px and give the buttons equal padding on all sides. The
textarea's 40px floor is one line's worth at the full padding, so it drops to
30px to match; left alone it would hold open roughly ten pixels of dead space
under a single line, disappearing only once wrapping outgrew the floor.
---
 web/src/styles.css | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/web/src/styles.css b/web/src/styles.css
index cea89215..fbe1df2d 100644
--- a/web/src/styles.css
+++ b/web/src/styles.css
@@ -3747,6 +3747,25 @@ pre.extra-field-value {
 
 /* Responsive: narrow screens */
 @media (max-width: 768px) {
+  /* the composer eats a lot of a phone screen, so halve its spacing and give
+     the buttons equal padding on all four sides */
+  .input-box {
+    gap: 4px;
+    padding: 6px 8px;
+  }
+
+  .input-textarea {
+    padding: 5px 7px;
+    /* the 40px floor is one line's worth at the full padding; at half the
+       padding it would leave dead space under a single line until wrapping
+       outgrew it */
+    min-height: 30px;
+  }
+
+  .input-box .btn {
+    padding: 5px;
+  }
+
   .banner-usage {
     width: 132px;
     flex-basis: 132px;