feat: unread markers for channels and DMs

- Read states store: smarter hasUnread compares against latest message
- ConversationList: orange dot + bold name for unread DMs
- DMChat: auto-mark-read when viewing conversation
- WS handler: mark DM read on new message while active+focused

web/src/stores/ws.ts

@@ -7,6 +7,7 @@ import { useTypingStore } from './typing.ts';
 import { useVoiceStore } from './voice.ts';
 import { useAuthStore } from './auth.ts';
 import { useConversationStore } from './conversation.ts';
+import { useReadStatesStore } from './readStates.ts';
 import type { Message } from './message.ts';
 import type { ConversationMessage } from './conversation.ts';
 import type { Channel } from './channel.ts';
@@ -132,6 +133,11 @@ export const useWebSocketStore = create<WebSocketState>((set, get) => ({
             if (payload.conversation_id) {
               const msg = payload as unknown as ConversationMessage;
               useConversationStore.getState().addMessage(msg);
+              // auto-mark DM as read if this conversation is active
+              const activeConvId = useConversationStore.getState().activeConversationId;
+              if (msg.conversation_id === activeConvId && document.hasFocus()) {
+                useReadStatesStore.getState().markConvRead(msg.conversation_id, msg.id);
+              }
             } else {
               const msg = payload as unknown as Message;
               addMessage(msg);