diff --git a/doc/pizero.md b/doc/pizero.md
index 53c0abbc..b1168051 100644
--- a/doc/pizero.md
+++ b/doc/pizero.md
@@ -61,7 +61,7 @@ These instructions assume you have the following setup:
 ## Step 8: download the webapp
   // because the react toolchain isn't available for the pi zero, the webapp is built in a github action<br/>
   Download webapp.zip from the most recent build:<br/>
-    https://github.com/balzack/databag/actions/runs/3758970117<br/>
+    https://github.com/balzack/databag/actions/runs/4033318007<br/>
   SCP webapp.zip into the pi<br/>
   Extract it into the web/build directory<br/>
     mkdir /app/databag/net/web/build<br/>
diff --git a/net/web/src/session/cards/Cards.jsx b/net/web/src/session/cards/Cards.jsx
index c690672d..58662dab 100644
--- a/net/web/src/session/cards/Cards.jsx
+++ b/net/web/src/session/cards/Cards.jsx
@@ -1,4 +1,4 @@
-import { Input, List } from 'antd';
+import { Input, List, Button } from 'antd';
 import { CardsWrapper } from './Cards.styled';
 import { SortAscendingOutlined, UpOutlined, DoubleRightOutlined, UserOutlined, SearchOutlined } from '@ant-design/icons';
 import { useCards } from './useCards.hook';
@@ -27,10 +27,7 @@ export function Cards({ closeCards, openContact, openListing }) {
         </div>
         { state.display === 'small' && (
           <div className="inline">
-            <div className="add" onClick={openListing}>
-              <UserOutlined />
-              <div className="label">New</div>
-            </div>
+            <Button type="primary" icon={<UserOutlined />} onClick={openListing}>Add</Button>
           </div>
         )}
         { state.display !== 'small' && (
diff --git a/net/web/src/session/cards/useCards.hook.js b/net/web/src/session/cards/useCards.hook.js
index b09e6dbf..02ef1fe5 100644
--- a/net/web/src/session/cards/useCards.hook.js
+++ b/net/web/src/session/cards/useCards.hook.js
@@ -10,7 +10,7 @@ export function useCards() {
   const [state, setState] = useState({
     tooltip: false,
     sorted: false,
-    display: null,
+    display: 'small',
     cards: [],
   });
 
@@ -22,6 +22,11 @@ export function useCards() {
     setState((s) => ({ ...s, ...value }));
   }
 
+  useEffect(() => {
+    const { display } = viewport.state;
+    updateState({ display });
+  }, [viewport.state]);
+
   useEffect(() => {
     const contacts = Array.from(card.state.cards.values()).map(item => {
       const profile = item?.data?.cardProfile;
diff --git a/net/web/src/session/conversation/channelHeader/useChannelHeader.hook.js b/net/web/src/session/conversation/channelHeader/useChannelHeader.hook.js
index 03e735e5..8cb32456 100644
--- a/net/web/src/session/conversation/channelHeader/useChannelHeader.hook.js
+++ b/net/web/src/session/conversation/channelHeader/useChannelHeader.hook.js
@@ -99,9 +99,14 @@ export function useChannelHeader(contentKey) {
       let title;
       try {
         const detail = channelValue?.data?.channelDetail;
-        if (detail?.dataType === 'sealed' && contentKey) {
-          const unsealed = decryptChannelSubject(detail.data, contentKey);
-          title = unsealed.subject;
+        if (detail?.dataType === 'sealed') {
+          if (contentKey) {
+            const unsealed = decryptChannelSubject(detail.data, contentKey);
+            title = unsealed.subject;
+          }
+          else {
+            title = '...';
+          }
         }
         else if (detail?.dataType === 'superbasic') {
           const data = JSON.parse(detail.data);
diff --git a/net/web/src/session/conversation/useConversation.hook.js b/net/web/src/session/conversation/useConversation.hook.js
index b56b3a2a..02c16da5 100644
--- a/net/web/src/session/conversation/useConversation.hook.js
+++ b/net/web/src/session/conversation/useConversation.hook.js
@@ -51,7 +51,7 @@ export function useConversation(cardId, channelId) {
         const seals = getChannelSeals(data);
         if (isUnsealed(seals, sealKey)) {
           const contentKey = getContentKey(seals, sealKey);
-          updateState({ sealed: true, contentKey });
+          updateState({ sealed: true, wtf: true, contentKey });
         }
         else {
           updateState({ sealed: true, contentKey: null });
@@ -105,7 +105,6 @@ export function useConversation(cardId, channelId) {
       const { card, channel } = conversationId.current;
       loading.current = true;
       conversationId.current = null;
-      updateState({ contentKey: null });
       await conversation.actions.setChannel(card, channel);
       loading.current = false;
       await setChannel();
@@ -258,7 +257,6 @@ export function useConversation(cardId, channelId) {
     updateTopic: async (topic, text) => {
       const { assets, textSize, textColor } = topic;
       const message = { text, textSize, textColor, assets };
-      console.log("UPDATE", message);
       
       if (!state.busy) {
         updateState({ busy: true });
diff --git a/net/web/src/session/details/Details.jsx b/net/web/src/session/details/Details.jsx
index 3dbb3577..01671a24 100644
--- a/net/web/src/session/details/Details.jsx
+++ b/net/web/src/session/details/Details.jsx
@@ -129,7 +129,7 @@ export function Details({ closeDetails, closeConversation, openContact }) {
     <DetailsWrapper>
       { modalContext }
       <div class="header">
-        <div class="label">Topic</div>
+        <div class="label">Topic Details</div>
         { state.display === 'xlarge' && (
           <div class="dismiss" onClick={closeConversation}>
             <DoubleRightOutlined />
diff --git a/net/web/src/session/details/useDetails.hook.js b/net/web/src/session/details/useDetails.hook.js
index 2e00b1fb..75400ddf 100644
--- a/net/web/src/session/details/useDetails.hook.js
+++ b/net/web/src/session/details/useDetails.hook.js
@@ -25,7 +25,7 @@ export function useDetails() {
     showEditSubject: false,
     editSubject: null,
 
-    display: null,
+    display: 'small',
     sealed: false,
     contentKey: null,
     seals: null,
@@ -167,9 +167,14 @@ export function useDetails() {
       let title;
       try {
         const detail = channelValue?.data?.channelDetail;
-        if (detail?.dataType === 'sealed' && state.contentKey) {
-          const unsealed = decryptChannelSubject(detail.data, state.contentKey);
-          title = unsealed.subject;
+        if (detail?.dataType === 'sealed') {
+          if (state.contentKey) {
+            const unsealed = decryptChannelSubject(detail.data, state.contentKey);
+            title = unsealed.subject;
+          }
+          else {
+            title = '...';
+          }
         }
         else if (detail?.dataType === 'superbasic') {
           const data = JSON.parse(detail.data);