fix: reposition 'Show thoughts' button above avatar on mobile

Previously, the thought icon button was positioned to the left of the
character avatar on mobile, causing it to appear partially off-screen
due to lack of left padding around avatars.

Changes:
- Add mobile-specific positioning logic in index.js to detect viewport
  width <= 1000px and calculate centered horizontal position
- Add CSS transform in mobile media query to shift icon 50px right
  and 45px upward from calculated position
- Center thought panel horizontally on mobile when opened
- Add debug logging to verify mobile detection

Result: On mobile, the thought icon now appears above and to the right
of the avatar, fully visible and accessible.

style.css

@@ -3392,6 +3392,17 @@ body:has(.rpg-panel.rpg-position-left) #sheld {
         justify-content: center;
         padding: 0;
     }
+
+    /* ========================================
+       MOBILE THOUGHT ICON POSITIONING
+       ======================================== */
+
+    /* Position thought icon above avatar on mobile to prevent off-screen clipping */
+    /* JavaScript will calculate position, but add transform to move it above and right */
+    #rpg-thought-icon {
+        /* Use transform to shift icon above and to the right of avatar */
+        transform: translate(50px, -45px) !important;
+    }
 }
 
 /* Extra small screens - adjust FAB position */