From 796f84527f3c62f7466eeb59f362d0827d619e6d Mon Sep 17 00:00:00 2001
From: ulanch <alexander.ulanch@colorado.edu>
Date: Tue, 21 Oct 2025 17:34:40 -0700
Subject: [PATCH] fix(ui): prevent iOS Safari toolbar from covering input on
 initial load

---
 nanochat/ui.html | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)
diff --git a/nanochat/ui.html b/nanochat/ui.html
index b2b4605..0f625d9 100644
--- a/nanochat/ui.html
+++ b/nanochat/ui.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
     <title>NanoChat</title>
     <link rel="icon" type="image/svg+xml" href="/logo.svg">
     <style>
@@ -18,7 +18,7 @@
             font-family: ui-sans-serif, -apple-system, system-ui, "Segoe UI", Helvetica, "Apple Color Emoji", Arial, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol";
             background-color: #ffffff;
             color: #111827;
-            min-height: 100vh;
+            min-height: 100dvh;
             margin: 0;
             display: flex;
             flex-direction: column;
@@ -144,6 +144,7 @@
         .input-container {
             background-color: #ffffff;
             padding: 1rem;
+            padding-bottom: calc(1rem + env(safe-area-inset-bottom))
         }
 
         .input-wrapper {
