From aca13edec61e5bb52dd690704375ff5a288711e3 Mon Sep 17 00:00:00 2001
From: Void <void@minds.void.gamecult.org>
Date: Mon, 9 Nov 2026 22:38:25 +0000
Subject: [PATCH] Plate the upload board, scroll-to-top chip, welcome hero and
 nav tabs

They join the shared plate rule under the scene (same fill, ink and link tokens, so
the pinned plate ratios hold). The unread and inbox tabs in the room list's footer
take the SkyPlate class. The lobby already rides on PageContent.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
---
 src/app/features/estate/EstateNavigator.tsx |  4 +++-
 src/app/features/scene/skyPlate.css.ts      |  9 ++++++++-
 src/app/features/scene/skyTheme.test.ts     | 10 +++++++++-
 3 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/src/app/features/estate/EstateNavigator.tsx b/src/app/features/estate/EstateNavigator.tsx
index 2cbbfe4a..b8c74f40 100644
--- a/src/app/features/estate/EstateNavigator.tsx
+++ b/src/app/features/estate/EstateNavigator.tsx
@@ -2,6 +2,7 @@ import React, { MouseEventHandler, ReactNode, useCallback, useMemo, useRef } fro
 import { useNavigate } from 'react-router-dom';
 import { useAtom, useAtomValue, useSetAtom } from 'jotai';
 import { Avatar, Box, Chip, Icon, IconButton, Icons, Spinner, Text, color, config } from 'folds';
+import classNames from 'classnames';
 import { PageNav, PageNavContent, PageNavHeader } from '../../components/page';
 import {
   NavButton,
@@ -41,6 +42,7 @@ import { AsyncStatus, useAsyncCallback } from '../../hooks/useAsyncCallback';
 import { EstateRoom, EstateTier } from './buildEstate';
 import { activateEstateRoom, awaitMyJoin } from './joinEstateRoom';
 import { useEstate, useEstateRootId } from './useEstate';
+import { SkyPlate } from '../scene/skyPlate.css';
 import * as css from './EstateNavigator.css';
 import { SkyStateControl } from '../scene/SkyStateControl';
 
@@ -326,7 +328,7 @@ export function EstateNavigator() {
         justifyContent="Center"
         gap="200"
         style={{ padding: 8 }}
-        className={css.Targets}
+        className={classNames(css.Targets, SkyPlate)}
       >
         <UnverifiedTab />
         <InboxTab />
diff --git a/src/app/features/scene/skyPlate.css.ts b/src/app/features/scene/skyPlate.css.ts
index a3c0c567..e06fef8f 100644
--- a/src/app/features/scene/skyPlate.css.ts
+++ b/src/app/features/scene/skyPlate.css.ts
@@ -1,7 +1,9 @@
 import { globalStyle, style } from '@vanilla-extract/css';
 import { color, config } from 'folds';
 import { MessageBase, BubbleContent } from '../../components/message/layout/layout.css';
-import { PageContent, PageNavContent } from '../../components/page/style.css';
+import { UploadBoard } from '../../components/upload-board/UploadBoard.css';
+import { ScrollTopContainer } from '../../components/scroll-top-container/style.css';
+import { PageContent, PageHeroSection, PageNavContent } from '../../components/page/style.css';
 import { Editor } from '../../components/editor/Editor.css';
 import { MembersDrawer } from '../room/MembersDrawer.css';
 import { CallStatus } from '../call-status/styles.css';
@@ -35,6 +37,11 @@ export const plateRegions = [
   `.${Editor}`,
   `.${MembersDrawer}`,
   `.${CallStatus}`,
+  // Floating panes: the upload board, the scroll-to-top chip.
+  `.${UploadBoard}`,
+  `.${ScrollTopContainer}`,
+  // The welcome page's hero.
+  `.${PageHeroSection}`,
   // The bars over the composer.
   `.${RoomViewTyping}`,
   base(RoomViewFollowing),
diff --git a/src/app/features/scene/skyTheme.test.ts b/src/app/features/scene/skyTheme.test.ts
index 3fd06875..c376a802 100644
--- a/src/app/features/scene/skyTheme.test.ts
+++ b/src/app/features/scene/skyTheme.test.ts
@@ -2,7 +2,9 @@ import { describe, expect, it } from 'vitest';
 import { baked } from '../../../sky/baked';
 import { AA, contrast, luminance } from '../../../sky/skyTokens.js';
 import { Editor } from '../../components/editor/Editor.css';
-import { PageContent, PageNavContent } from '../../components/page/style.css';
+import { UploadBoard } from '../../components/upload-board/UploadBoard.css';
+import { ScrollTopContainer } from '../../components/scroll-top-container/style.css';
+import { PageContent, PageHeroSection, PageNavContent } from '../../components/page/style.css';
 import { CallStatus } from '../call-status/styles.css';
 import { MembersDrawer } from '../room/MembersDrawer.css';
 import { RoomViewTyping } from '../room/RoomViewTyping.css';
@@ -101,6 +103,12 @@ describe('the plate, where text cannot rest on bare sky', () => {
 });
 
 describe('regions that sit on the plate', () => {
+  it('plates the upload board, the scroll-to-top chip and the welcome hero', () => {
+    [UploadBoard, ScrollTopContainer, PageHeroSection].forEach((c) =>
+      expect(plateRegions).toContain(`.${c}`)
+    );
+  });
+
   // Every region whose text would otherwise rest on bare sky joins the one plate rule. The ink
   // and link of that plate are pinned above; this pins who is on it.
   const on = (cls: string) => expect(plateRegions).toContain(cls);
-- 
2.47.3