diff --git a/src/app/components/nav/styles.css.ts b/src/app/components/nav/styles.css.ts
index 48b2a4d3..a7f3053d 100644
--- a/src/app/components/nav/styles.css.ts
+++ b/src/app/components/nav/styles.css.ts
@@ -1,6 +1,7 @@
 import { ComplexStyleRule, createVar, style } from '@vanilla-extract/css';
 import { RecipeVariants, recipe } from '@vanilla-extract/recipes';
 import { ContainerColor, DefaultReset, Disabled, RadiiVariant, color, config, toRem } from 'folds';
+import { surfaceInk } from '../../features/scene/sceneShell.css';
 
 export const NavCategory = style([
   DefaultReset,
@@ -61,6 +62,16 @@ const NavItemBase = style({
     '&[data-hover=true]': {
       backgroundColor: ContainerHover,
     },
+    // While the background scene runs the shell is clear (sceneShell.css.ts); a row is a steady
+    // scrim of the theme's own surface, so ridges never show through its text. Hover and the
+    // selected row strengthen it.
+    ':root[data-scene] &': {
+      backgroundColor: `color-mix(in srgb, ${surfaceInk} 62%, transparent)`,
+    },
+    ':root[data-scene] &:hover, :root[data-scene] &:focus-visible, :root[data-scene] &[data-hover=true], :root[data-scene] &[aria-selected=true]':
+      {
+        backgroundColor: `color-mix(in srgb, ${surfaceInk} 80%, transparent)`,
+      },
     [`&:has(.${NavLink}:active)`]: {
       backgroundColor: ContainerActive,
     },
diff --git a/src/app/features/estate/EstateNavigator.tsx b/src/app/features/estate/EstateNavigator.tsx
index 6fa4bf48..29451c92 100644
--- a/src/app/features/estate/EstateNavigator.tsx
+++ b/src/app/features/estate/EstateNavigator.tsx
@@ -1,7 +1,7 @@
 import React, { MouseEventHandler, ReactNode, useCallback, useMemo, useRef } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { useAtom, useAtomValue, useSetAtom } from 'jotai';
-import { Avatar, Box, Chip, Icon, IconButton, Icons, Spinner, Text, color } from 'folds';
+import { Avatar, Box, Chip, Icon, IconButton, Icons, Spinner, Text, color, config } from 'folds';
 import { PageNav, PageNavContent, PageNavHeader } from '../../components/page';
 import {
   NavButton,
@@ -76,9 +76,14 @@ function JoinRow({ room }: { room: EstateRoom }) {
     <NavItem variant="Background" radii="400">
       <Box grow="Yes" alignItems="Center" gap="200" style={{ padding: '0 8px', minHeight: 38 }}>
         <NavItemContent>
-          <Text as="span" size="Inherit" truncate>
-            {room.name}
-          </Text>
+          <Box as="span" grow="Yes" alignItems="Center" gap="200">
+            <Avatar size="200" radii="400">
+              <Icon src={Icons.Hash} size="100" style={{ opacity: config.opacity.P300 }} />
+            </Avatar>
+            <Text as="span" size="Inherit" truncate>
+              {room.name}
+            </Text>
+          </Box>
         </NavItemContent>
         {state.status === AsyncStatus.Error && (
           <Text