diff --git a/web/src/components/MessageInput.tsx b/web/src/components/MessageInput.tsx
index 16c1bb8..53175d9 100644
--- a/web/src/components/MessageInput.tsx
+++ b/web/src/components/MessageInput.tsx
@@ -610,8 +610,8 @@ export const MessageInput = forwardRef<HTMLTextAreaElement, MessageInputProps>(f
             <button type="button" disabled={disabled || uploading}
               onClick={() => fileInputRef.current?.click()}
               title="Upload file"
-              className="text-gb-fg-f hover:text-gb-orange p-1 disabled:opacity-50">
-              <FontAwesomeIcon icon={faPlus} className={`w-3.5 h-3.5 ${uploading ? "animate-pulse" : ""}`} />
+              className="text-gb-fg-f hover:text-gb-orange p-1.5 disabled:opacity-50">
+              <FontAwesomeIcon icon={faPlus} className={`w-4 h-4 ${uploading ? "animate-pulse" : ""}`} />
             </button>
 
             <span className="text-gb-bg-t mx-1">│</span>
@@ -619,28 +619,28 @@ export const MessageInput = forwardRef<HTMLTextAreaElement, MessageInputProps>(f
             {/* block formatting */}
             <button type="button" disabled={disabled}
               onClick={() => execBlock("ul")} title="Unordered list"
-              className="text-gb-fg-f hover:text-gb-orange p-1 disabled:opacity-50">
-              <FontAwesomeIcon icon={faListUl} className="w-3 h-3" />
+              className="text-gb-fg-f hover:text-gb-orange p-1.5 disabled:opacity-50">
+              <FontAwesomeIcon icon={faListUl} className="w-4 h-4" />
             </button>
             <button type="button" disabled={disabled}
               onClick={() => execBlock("ol")} title="Ordered list"
-              className="text-gb-fg-f hover:text-gb-orange p-1 disabled:opacity-50">
-              <FontAwesomeIcon icon={faListOl} className="w-3 h-3" />
+              className="text-gb-fg-f hover:text-gb-orange p-1.5 disabled:opacity-50">
+              <FontAwesomeIcon icon={faListOl} className="w-4 h-4" />
             </button>
             <button type="button" disabled={disabled}
               onClick={() => execBlock("blockquote")} title="Blockquote"
-              className="text-gb-fg-f hover:text-gb-orange p-1 disabled:opacity-50">
-              <FontAwesomeIcon icon={faQuoteRight} className="w-3 h-3" />
+              className="text-gb-fg-f hover:text-gb-orange p-1.5 disabled:opacity-50">
+              <FontAwesomeIcon icon={faQuoteRight} className="w-4 h-4" />
             </button>
             <button type="button" disabled={disabled}
               onClick={execLink} title="Insert link"
-              className="text-gb-fg-f hover:text-gb-orange p-1 disabled:opacity-50">
-              <FontAwesomeIcon icon={faLink} className="w-3 h-3" />
+              className="text-gb-fg-f hover:text-gb-orange p-1.5 disabled:opacity-50">
+              <FontAwesomeIcon icon={faLink} className="w-4 h-4" />
             </button>
             <button type="button" disabled={disabled}
               onClick={() => execBlock("h2")} title="Heading"
-              className="text-gb-fg-f hover:text-gb-orange p-1 disabled:opacity-50">
-              <FontAwesomeIcon icon={faHeading} className="w-3 h-3" />
+              className="text-gb-fg-f hover:text-gb-orange p-1.5 disabled:opacity-50">
+              <FontAwesomeIcon icon={faHeading} className="w-4 h-4" />
             </button>
 
             <span className="text-gb-bg-t mx-1">│</span>
@@ -648,43 +648,43 @@ export const MessageInput = forwardRef<HTMLTextAreaElement, MessageInputProps>(f
             {/* inline formatting */}
             <button type="button" disabled={disabled}
               onClick={() => execInline("**", "**")} title="Bold"
-              className="text-gb-fg-f hover:text-gb-orange p-1 disabled:opacity-50">
-              <FontAwesomeIcon icon={faBold} className="w-3 h-3" />
+              className="text-gb-fg-f hover:text-gb-orange p-1.5 disabled:opacity-50">
+              <FontAwesomeIcon icon={faBold} className="w-4 h-4" />
             </button>
             <button type="button" disabled={disabled}
               onClick={() => execInline("*", "*")} title="Italic"
-              className="text-gb-fg-f hover:text-gb-orange p-1 disabled:opacity-50">
-              <FontAwesomeIcon icon={faItalic} className="w-3 h-3" />
+              className="text-gb-fg-f hover:text-gb-orange p-1.5 disabled:opacity-50">
+              <FontAwesomeIcon icon={faItalic} className="w-4 h-4" />
             </button>
             <button type="button" disabled={disabled}
               onClick={() => execInline("~~", "~~")} title="Strikethrough"
-              className="text-gb-fg-f hover:text-gb-orange p-1 disabled:opacity-50">
-              <FontAwesomeIcon icon={faStrikethrough} className="w-3 h-3" />
+              className="text-gb-fg-f hover:text-gb-orange p-1.5 disabled:opacity-50">
+              <FontAwesomeIcon icon={faStrikethrough} className="w-4 h-4" />
             </button>
             <button type="button" disabled={disabled}
               onClick={() => execInline("`", "`")} title="Code"
-              className="text-gb-fg-f hover:text-gb-orange p-1 disabled:opacity-50">
-              <FontAwesomeIcon icon={faCode} className="w-3 h-3" />
+              className="text-gb-fg-f hover:text-gb-orange p-1.5 disabled:opacity-50">
+              <FontAwesomeIcon icon={faCode} className="w-4 h-4" />
             </button>
             <button type="button" disabled={disabled}
               onClick={() => execInline("||", "||")} title="Spoiler"
-              className="text-gb-fg-f hover:text-gb-orange p-1 disabled:opacity-50">
-              <FontAwesomeIcon icon={faEyeSlash} className="w-3 h-3" />
+              className="text-gb-fg-f hover:text-gb-orange p-1.5 disabled:opacity-50">
+              <FontAwesomeIcon icon={faEyeSlash} className="w-4 h-4" />
             </button>
 
             <span className="text-gb-bg-t mx-1">│</span>
 
             {/* emoji / kaomoji / gif */}
             <button type="button" disabled={disabled} onClick={toggleEmoji} title="Emoji"
-              className={`p-1 disabled:opacity-50 ${showEmoji ? "text-gb-orange" : "text-gb-fg-f hover:text-gb-orange"}`}>
+              className={`p-1.5 disabled:opacity-50 ${showEmoji ? "text-gb-orange" : "text-gb-fg-f hover:text-gb-orange"}`}>
               <FontAwesomeIcon icon={faSmile} className="w-4 h-4" />
             </button>
             <button type="button" disabled={disabled} onClick={toggleKaomoji} title="Kaomoji"
-              className={`p-1 disabled:opacity-50 ${showKaomoji ? "text-gb-orange" : "text-gb-fg-f hover:text-gb-orange"}`}>
+              className={`p-1.5 disabled:opacity-50 ${showKaomoji ? "text-gb-orange" : "text-gb-fg-f hover:text-gb-orange"}`}>
               <FontAwesomeIcon icon={faGrin} className="w-4 h-4" />
             </button>
             <button type="button" disabled={disabled} onClick={toggleGif} title="GIF"
-              className={`p-1 disabled:opacity-50 ${showGif ? "text-gb-orange" : "text-gb-fg-f hover:text-gb-orange"}`}>
+              className={`p-1.5 disabled:opacity-50 ${showGif ? "text-gb-orange" : "text-gb-fg-f hover:text-gb-orange"}`}>
               <FontAwesomeIcon icon={faFilm} className="w-4 h-4" />
             </button>
 
diff --git a/web/src/main.tsx b/web/src/main.tsx
index 431c658..6275c6d 100644
--- a/web/src/main.tsx
+++ b/web/src/main.tsx
@@ -8,7 +8,7 @@ if (isTauri) {
   // WebView safe-area fallbacks: Android doesn't support CSS env(), and
   // Linux WebKitGTK chokes on env() inside var(). Set explicit values via JS.
   if (navigator.userAgent.includes('Android')) {
-    document.documentElement.style.setProperty('--safe-top', '1.5rem');
+    document.documentElement.style.setProperty('--safe-top', '2rem');
     document.documentElement.style.setProperty('--safe-bottom', '0.75rem');
     document.documentElement.style.setProperty('--safe-left', '0px');
     document.documentElement.style.setProperty('--safe-right', '0px');