ui: visual polish — animations, icons, and interaction improvements

- Spin animation on ⟳ delivery status during SENDING/ENCRYPTING states
- Pulsing ● dot on PTT LIVE badge (pttLivePulse keyframe)
- Read receipt pill: hover scale/opacity transition, symmetric padding
- PiP resize handles: larger dots (5px), wider hit area (24px), higher contrast
- ForwardMessageDialog: position:relative on scroll container, spinner overlay 0.35 opacity
- Boot sequence: 45ms interval (was 65ms), brighter ESC hint (0.55 opacity)
- Location button: Icons.Pin → Icons.SpaceGlobe (globe icon)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/app/features/call/CallControls.tsx

@@ -218,7 +218,21 @@ export function CallControls({ callEmbed }: CallControlsProps) {
                 fontFamily: 'JetBrains Mono, monospace',
               }}
             >
-              {pttActive ? '● LIVE' : `PTT — Hold ${pttKeyLabel}`}
+              {pttActive ? (
+                <>
+                  <span
+                    style={{
+                      display: 'inline-block',
+                      animation: 'pttLivePulse 900ms ease-in-out infinite',
+                    }}
+                  >
+                    ●
+                  </span>
+                  {' LIVE'}
+                </>
+              ) : (
+                `PTT — Hold ${pttKeyLabel}`
+              )}
             </Text>
           </Box>
         ) : (

src/app/features/room/RoomInput.tsx

@@ -879,7 +879,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
                     ...
                   </Text>
                 ) : (
-                  <Icon src={Icons.Pin} size="100" />
+                  <Icon src={Icons.SpaceGlobe} size="100" />
                 )}
               </IconButton>
               <VoiceMessageRecorder onSend={handleVoiceSend} />

src/app/features/room/message/ForwardMessageDialog.tsx

@@ -162,7 +162,7 @@ export function ForwardMessageDialog({ mEvent, onClose }: Props) {
                 <Text size="T300">✓ Forwarded to {sentTo}</Text>
               </Box>
             ) : (
-              <Box grow="Yes" style={{ minHeight: 0 }}>
+              <Box grow="Yes" style={{ minHeight: 0, position: 'relative' }}>
                 <Scroll size="300" hideTrack visibility="Hover">
                   <Box direction="Column" gap="100" style={{ padding: config.space.S200 }}>
                     {filtered.slice(0, 60).map((room) => (
@@ -195,7 +195,7 @@ export function ForwardMessageDialog({ mEvent, onClose }: Props) {
                     style={{
                       position: 'absolute',
                       inset: 0,
-                      background: 'rgba(0,0,0,0.18)',
+                      background: 'rgba(0,0,0,0.35)',
                       borderRadius: config.radii.R500,
                     }}
                   >

src/app/features/room/message/Message.tsx

@@ -58,6 +58,7 @@ import { MessageLayout, MessageSpacing } from '../../../state/settings';
 import { useMatrixClient } from '../../../hooks/useMatrixClient';
 import { useRecentEmoji } from '../../../hooks/useRecentEmoji';
 import * as css from './styles.css';
+import { SendingSpinClass } from '../../../styles/Animations.css';
 import { EventReaders } from '../../../components/event-readers';
 import { ReadReceiptAvatars } from '../../../components/read-receipt-avatars';
 import { useReadPositions } from '../ReadPositionsContext';
@@ -127,7 +128,15 @@ function DeliveryStatus({
           : {}),
       }}
     >
-      {icon}
+      <span
+        className={
+          status === EventStatus.SENDING || status === EventStatus.ENCRYPTING
+            ? SendingSpinClass
+            : undefined
+        }
+      >
+        {icon}
+      </span>
     </Box>
   );
 }