diff --git a/public/screenshots/compact_widget.png b/public/screenshots/compact_widget.png
index 8d2f2dc..a537d90 100644
Binary files a/public/screenshots/compact_widget.png and b/public/screenshots/compact_widget.png differ
diff --git a/src/App.tsx b/src/App.tsx
index fac364d..7dab571 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2240,6 +2240,7 @@ export const App: React.FC = () => {
               emotion={currentEmotion}
               isSpeaking={isSpeaking}
               avatarId={avatarId}
+              isFloatingMode={isFloatingMode}
             />
             {avatarId !== 'eve' && activeAvatar.assetPath && (
               <div style={{ position: 'absolute', top: '16px', left: '50%', transform: 'translateX(-50%)', padding: '7px 14px', borderRadius: '18px', backgroundColor: 'var(--bg-secondary)', border: '1px solid rgba(0,212,245,0.25)', boxShadow: '0 0 20px rgba(0,212,245,0.1)', fontSize: '9px', fontFamily: 'var(--font-mono)', fontWeight: 800, letterSpacing: '0.8px', color: 'var(--text-secondary)', textTransform: 'uppercase', pointerEvents: 'none' }}>
diff --git a/src/components/ThreeCanvas.tsx b/src/components/ThreeCanvas.tsx
index cf8d30b..45a9d93 100644
--- a/src/components/ThreeCanvas.tsx
+++ b/src/components/ThreeCanvas.tsx
@@ -17,6 +17,7 @@ interface ThreeCanvasProps {
   emotion: EveEmotion;
   isSpeaking: boolean;
   avatarId?: EveAvatar;
+  isFloatingMode?: boolean;
 }
 
 interface HologramProjectionProps {
@@ -574,11 +575,11 @@ const HologramProjection: React.FC<HologramProjectionProps> = ({ emotion, isSpea
   );
 };
 
-export const ThreeCanvas: React.FC<ThreeCanvasProps> = ({ emotion, isSpeaking, avatarId = 'eve' }) => {
+export const ThreeCanvas: React.FC<ThreeCanvasProps> = ({ emotion, isSpeaking, avatarId = 'eve', isFloatingMode = false }) => {
   return (
     <div style={{ width: '100%', height: '100%', position: 'relative' }}>
       <Canvas
-        camera={{ position: [0, 1.1, 5.8], fov: 36 }}
+        camera={{ position: isFloatingMode ? [0, 0.72, 3.7] : [0, 1.1, 5.8], fov: isFloatingMode ? 30 : 36 }}
         gl={{ alpha: true, antialias: true, premultipliedAlpha: false }}
         onCreated={({ gl }) => {
           gl.setClearColor(0x000000, 0);
@@ -615,8 +616,8 @@ export const ThreeCanvas: React.FC<ThreeCanvasProps> = ({ emotion, isSpeaking, a
         {/* OrbitControls calibrated to prevent clipping or losing focus */}
         <OrbitControls 
           enableZoom={true} 
-          minDistance={4.8}
-          maxDistance={6.8}
+          minDistance={isFloatingMode ? 2.4 : 4.8}
+          maxDistance={isFloatingMode ? 4.7 : 6.8}
           enablePan={false} 
           autoRotate={false}
           maxPolarAngle={Math.PI / 1.7}