[object Object]

← back to Wallco Ai

header: heavier wordmark + iOS safe-area FAB inset

4193c705e8b394d7922bedd7fb492f669d66453a · 2026-05-12 16:08:16 -0700 · SteveStudio2

Wallco.ai brand glyph 22px/500/0.04em → 26px/600/0.06em per
graphic-designer P2 finding. Stays luxury-restrained (Canva's 1.6× scale
recommendation was too big for a sitewide nav bar).

Chat FAB on <480px viewports now respects env(safe-area-inset-bottom)
and clamps max-width to 100vw-28px so it can't overlap the texture
grid on iOS landscape or push horizontal scroll. Four-horsemen Canva
flag.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Files touched

Diff

commit 4193c705e8b394d7922bedd7fb492f669d66453a
Author: SteveStudio2 <stevestudio2@SteveStacStudio.lan>
Date:   Tue May 12 16:08:16 2026 -0700

    header: heavier wordmark + iOS safe-area FAB inset
    
    Wallco.ai brand glyph 22px/500/0.04em → 26px/600/0.06em per
    graphic-designer P2 finding. Stays luxury-restrained (Canva's 1.6× scale
    recommendation was too big for a sitewide nav bar).
    
    Chat FAB on <480px viewports now respects env(safe-area-inset-bottom)
    and clamps max-width to 100vw-28px so it can't overlap the texture
    grid on iOS landscape or push horizontal scroll. Four-horsemen Canva
    flag.
    
    Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 public/css/chat.css | 10 +++++++++-
 public/css/site.css |  6 +++---
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/public/css/chat.css b/public/css/chat.css
index e1393f8..d1abc14 100644
--- a/public/css/chat.css
+++ b/public/css/chat.css
@@ -219,6 +219,14 @@
 /* ── mobile ───────────────────────────────────────────────────────── */
 @media (max-width: 480px) {
   #wallco-chat-panel { right: 8px; left: 8px; width: auto; bottom: 8px; height: calc(100vh - 16px); border-radius: 12px; }
-  #wallco-chat-fab { bottom: 14px; right: 14px; padding: 12px 18px; }
+  /* FAB respects iOS home-indicator safe-area + leaves clearance above
+     content. Four-horsemen Canva flag: was overlapping the texture grid
+     on /studio without inset. */
+  #wallco-chat-fab {
+    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
+    right: 14px;
+    padding: 12px 18px;
+    max-width: calc(100vw - 28px);
+  }
   .wc-actions { grid-template-columns: repeat(2, 1fr); }
 }
diff --git a/public/css/site.css b/public/css/site.css
index c22c02d..2b4168f 100644
--- a/public/css/site.css
+++ b/public/css/site.css
@@ -96,9 +96,9 @@ img { max-width: 100%; display: block; }
 }
 .brand {
   font-family: var(--serif);
-  font-size: 22px;
-  font-weight: 500;
-  letter-spacing: 0.04em;
+  font-size: 26px;
+  font-weight: 600;
+  letter-spacing: 0.06em;
   color: var(--ink);
   text-decoration: none;
 }

← 2750b1e studio: P1 mobile + display-weight title (from graphic-desig  ·  back to Wallco Ai  ·  studio: hard single-column mobile stack + trade-nav clip fix c68a4c1 →