feat: add Backspace design prototype and rebrand from Opencord

- Add Backspace-design-prototype.html: finalized "Aether Drift" design
  language with warm matte surfaces and subtle frosted glass accents
- Update CLAUDE.md with DESIGN SYSTEM section and remove Discord clone references
- Rename all Opencord references to Backspace across the full codebase
- Archive outdated design experiments and Discord-specific assets
- Add science-backed accessibility fallback (prefers-reduced-transparency)

packages/web/src/components/chat/Embed.tsx

@@ -22,7 +22,7 @@ export function Embed({ url }: EmbedProps) {
     // Simple fetch from our new API
     fetch(`/api/utils/metadata?url=${encodeURIComponent(url)}`, {
       headers: {
-        'Authorization': `Bearer ${localStorage.getItem('opencord_token')}`
+        'Authorization': `Bearer ${localStorage.getItem('backspace_token')}`
       }
     })
       .then(res => res.json())

packages/web/src/components/chat/FriendsPage.test.tsx

@@ -5,7 +5,7 @@ import { MemoryRouter } from 'react-router-dom';
 import { FriendsPage } from './FriendsPage';
 import { useSocialStore } from '../../stores/socialStore';
 import { useServerStore } from '../../stores/serverStore';
-import type { Friend, FriendRequest } from '@opencord/shared';
+import type { Friend, FriendRequest } from '@backspace/shared';
 
 // Mock the api module
 vi.mock('../../api/client', () => ({

packages/web/src/components/chat/FriendsPage.tsx

@@ -6,7 +6,7 @@ import { Avatar } from '../ui/Avatar';
 import { MemberListToggleButton } from '../layout/MemberListToggleButton';
 import { LoadingSpinner } from '../ui/LoadingSpinner';
 import { api } from '../../api/client';
-import type { Friend, FriendRequest } from '@opencord/shared';
+import type { Friend, FriendRequest } from '@backspace/shared';
 
 type Tab = 'online' | 'all' | 'pending' | 'add';
 
@@ -143,7 +143,7 @@ export function FriendsPage() {
         return (
           <div className="flex-1 p-8">
             <h2 className="text-base font-bold text-discord-text-primary uppercase mb-2">Add Friend</h2>
-            <p className="text-sm text-discord-text-muted mb-4">You can add friends with their Opencord username.</p>
+            <p className="text-sm text-discord-text-muted mb-4">You can add friends with their Backspace username.</p>
             <form onSubmit={handleAddFriend} className="relative mb-8">
               <input
                 type="text"

packages/web/src/components/chat/MentionPopover.tsx

@@ -1,5 +1,5 @@
 import React, { useMemo, useRef, useEffect } from 'react';
-import type { MemberWithUser } from '@opencord/shared';
+import type { MemberWithUser } from '@backspace/shared';
 import { Avatar } from '../ui/Avatar';
 import { useServerStore } from '../../stores/serverStore';
 

packages/web/src/components/chat/Message.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import type { MessageWithUser } from '@opencord/shared';
+import type { MessageWithUser } from '@backspace/shared';
 import { MarkdownRenderer } from './MarkdownRenderer';
 import { Avatar } from '../ui/Avatar';
 import { ContextMenu } from '../ui/ContextMenu';

packages/web/src/components/chat/MessageInput.tsx

@@ -4,7 +4,7 @@ import { isDmChannel, useServerStore } from '../../stores/serverStore';
 import { wsSend } from '../../hooks/useWebSocket';
 import { api } from '../../api/client';
 import { MentionPopover } from './MentionPopover';
-import type { MemberWithUser } from '@opencord/shared';
+import type { MemberWithUser } from '@backspace/shared';
 
 interface MessageInputProps {
   channelId: string;

packages/web/src/components/chat/MessageList.tsx

@@ -6,7 +6,7 @@ import { useAuthStore } from '../../stores/authStore';
 import { useSocialStore } from '../../stores/socialStore';
 import { Avatar } from '../ui/Avatar';
 import { LoadingSpinner } from '../ui/LoadingSpinner';
-import type { MessageWithUser } from '@opencord/shared';
+import type { MessageWithUser } from '@backspace/shared';
 
 const EMPTY_MESSAGES: MessageWithUser[] = [];