From 920dc835ad72ec81dc57262b18c2da27ac798246 Mon Sep 17 00:00:00 2001
From: diondiondion <mail@diondiondion.com>
Date: Tue, 1 Sep 2026 17:45:06 +0200
Subject: [PATCH] Redesign: Update global CSS size variables (#40348)

---
 app/javascript/styles/mastodon/basics.scss    | 25 +++++++++++--------
 .../styles/mastodon/components.scss           |  1 -
 2 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/app/javascript/styles/mastodon/basics.scss b/app/javascript/styles/mastodon/basics.scss
index b4990326a7c..599a353a268 100644
--- a/app/javascript/styles/mastodon/basics.scss
+++ b/app/javascript/styles/mastodon/basics.scss
@@ -11,17 +11,25 @@ html {
   --font-body: mastodon-font-sans-serif, sans-serif;
   --font-heading: Cal Sans UI, sans-serif;
   --font-monospace: mastodon-font-monospace, monospace;
-
-  &[data-redesign='true'] {
-    --font-body: Inter, sans-serif;
-
-    background: var(--color-bg-blend-solid);
-  }
-
   --outline-focus-default: 2px solid var(--color-border-brand);
   --avatar-border-radius: 8px;
   --max-media-height-small: 460px;
   --max-media-height-large: 566px;
+  --mobile-bottom-nav-height: 55px;
+
+  // Compensate for column header height when scrolling elements into view
+  --column-header-height: 62px;
+
+  &[data-redesign='true'] {
+    --font-body: Inter, sans-serif;
+    --avatar-border-radius: var(--radius-round);
+    --mobile-bottom-nav-height: calc(58px + var(--space-md));
+
+    // Compensate for column header height when scrolling elements into view
+    --column-header-height: 74px;
+
+    background: var(--color-bg-blend-solid);
+  }
 
   // Variable for easily inverting directional UI elements,
   --text-x-direction: 1;
@@ -30,9 +38,6 @@ html {
     --text-x-direction: -1;
   }
 
-  // Compensate for column header height when scrolling elements into view
-  --column-header-height: 62px;
-
   scroll-padding-top: var(--column-header-height);
 
   &:has(.layout-multi-column) {
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index eba69b6b7fd..9de3cd386be 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -3219,7 +3219,6 @@ a.account__display-name {
 }
 
 .ui {
-  --mobile-bottom-nav-height: 55px;
   --last-content-item-border-width: 2px;
 
   flex: 0 0 auto;