diff --git a/pwa/src/components/game/LocationView.css b/pwa/src/components/game/LocationView.css
index dd0712e..689a251 100644
--- a/pwa/src/components/game/LocationView.css
+++ b/pwa/src/components/game/LocationView.css
@@ -1,7 +1,7 @@
 /* Grid View Styles */
 .entity-list.grid-view {
     display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
+    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
     gap: 1rem;
     align-items: start;
 }
@@ -22,7 +22,9 @@
     cursor: pointer;
     position: relative;
     overflow: hidden;
-    height: 100%;
+    height: auto;
+    min-width: 0;
+    width: 100%;
 }
 
 .entity-card.grid-card:hover {
diff --git a/pwa/src/components/game/LocationView.tsx b/pwa/src/components/game/LocationView.tsx
index 6a66bf1..62d6b07 100644
--- a/pwa/src/components/game/LocationView.tsx
+++ b/pwa/src/components/game/LocationView.tsx
@@ -92,22 +92,10 @@ function LocationView({
   const { t } = useTranslation()
   const { playSfx } = useAudio()
 
-  // View Mode State
-  const [viewMode, setViewMode] = useState<'list' | 'grid'>(() => {
-    return (localStorage.getItem('locationViewMode') as 'list' | 'grid') || 'list'
-  })
-
   // Dropdown State
   const [activeDropdown, setActiveDropdown] = useState<string | null>(null)
   const [dropdownPos, setDropdownPos] = useState({ x: 0, y: 0 })
 
-  const toggleViewMode = () => {
-    const newMode = viewMode === 'list' ? 'grid' : 'list'
-    setViewMode(newMode)
-    localStorage.setItem('locationViewMode', newMode)
-    playSfx('/audio/sfx/click.wav')
-  }
-
   // Handle dropdown toggle
   const handleDropdownClick = (e: React.MouseEvent, id: string) => {
     e.stopPropagation()
@@ -115,9 +103,10 @@ function LocationView({
       setActiveDropdown(null)
     } else {
       const rect = e.currentTarget.getBoundingClientRect()
+      // Fix: GameDropdown uses fixed positioning, so we don't add scroll offsets
       setDropdownPos({
-        x: rect.left + window.scrollX,
-        y: rect.bottom + window.scrollY + 5
+        x: rect.left,
+        y: rect.bottom + 5
       })
       setActiveDropdown(id)
     }
@@ -147,15 +136,6 @@ function LocationView({
               </span>
             </GameTooltip>
           )}
-          <GameButton
-            variant="secondary"
-            size="sm"
-            onClick={(e) => { e.stopPropagation(); toggleViewMode(); }}
-            className="view-toggle-btn"
-            style={{ marginLeft: 'auto' }}
-          >
-            {viewMode === 'list' ? '📋' : '🔲'}
-          </GameButton>
         </h2>
 
         {location.tags && location.tags.length > 0 && (
@@ -235,12 +215,12 @@ function LocationView({
         {location.npcs.filter((npc: any) => npc.type === 'enemy').length > 0 && (
           <div className="entity-section enemies-section">
             <h3>{t('location.enemies')}</h3>
-            <div className={`entity-list ${viewMode === 'grid' ? 'grid-view' : ''}`}>
+            <div className="entity-list grid-view">
               {location.npcs.filter((npc: any) => npc.type === 'enemy').map((enemy: any, i: number) => {
                 const id = `enemy-${enemy.id || i}`;
                 return (
-                  <div key={i} className={`entity-card enemy-card ${viewMode === 'grid' ? 'grid-card' : ''}`}
-                    onClick={viewMode === 'grid' ? (e) => handleDropdownClick(e, id) : undefined}>
+                  <div key={i} className="entity-card enemy-card grid-card"
+                    onClick={(e) => handleDropdownClick(e, id)}>
                     {enemy.id && (
                       <div className="entity-image">
                         <img
@@ -251,37 +231,18 @@ function LocationView({
                       </div>
                     )}
 
-                    {viewMode === 'list' && (
-                      <>
-                        <div className="entity-info">
-                          <div className="entity-name enemy-name">{getTranslatedText(enemy.name)}</div>
-                          {enemy.level && <div className="entity-level">{t('location.level')} {enemy.level}</div>}
-                        </div>
-                        <GameButton
-                          variant="danger"
-                          size="sm"
-                          className="entity-action-btn combat-btn"
-                          onClick={() => onInitiateCombat(enemy.id)}
-                        >
-                          {t('common.fight')}
-                        </GameButton>
-                      </>
-                    )}
-
-                    {viewMode === 'grid' && (
-                      <GameTooltip content={
-                        <div>
-                          <div className="tooltip-title">{getTranslatedText(enemy.name)}</div>
-                          <div>{t('location.level')} {enemy.level}</div>
-                          <div style={{ color: '#f56565', fontSize: '0.8rem' }}>Click for actions</div>
-                        </div>
-                      }>
-                        <div className="grid-overlay"></div>
-                      </GameTooltip>
-                    )}
+                    <GameTooltip content={
+                      <div>
+                        <div className="tooltip-title">{getTranslatedText(enemy.name)}</div>
+                        <div>{t('location.level')} {enemy.level}</div>
+                        <div style={{ color: '#f56565', fontSize: '0.8rem' }}>Click for actions</div>
+                      </div>
+                    }>
+                      <div className="grid-overlay"></div>
+                    </GameTooltip>
 
                     {/* Dropdown for Grid View */}
-                    {viewMode === 'grid' && activeDropdown === id && (
+                    {activeDropdown === id && (
                       <GameDropdown
                         isOpen={true}
                         onClose={() => setActiveDropdown(null)}
@@ -314,46 +275,25 @@ function LocationView({
         {location.corpses && location.corpses.length > 0 && (
           <div className="entity-section corpses-section">
             <h3>{t('location.corpses')}</h3>
-            <div className="entity-list">
+            <div className="entity-list grid-view">
               {location.corpses.map((corpse: any) => (
                 <div key={corpse.id} className="corpse-container">
-                  <div className={`entity-card corpse-card ${viewMode === 'grid' ? 'grid-card' : ''}`}
-                    onClick={viewMode === 'grid' ? (e) => handleDropdownClick(e, `corpse-${corpse.id}`) : undefined}
+                  <div className="entity-card corpse-card grid-card"
+                    onClick={(e) => handleDropdownClick(e, `corpse-${corpse.id}`)}
                   >
-                    {viewMode === 'list' ? (
-                      <>
-                        <div className="entity-info">
-                          <div className="entity-name">{corpse.emoji} {getTranslatedText(corpse.name)}</div>
-                          <div className="corpse-loot-count">{corpse.loot_count} {t('location.items')}</div>
-                        </div>
-                        <GameButton
-                          variant="secondary"
-                          size="sm"
-                          className="entity-action-btn loot-btn"
-                          onClick={() => {
-                            playSfx('/audio/sfx/interact.wav')
-                            onLootCorpse(String(corpse.id))
-                          }}
-                          disabled={corpse.loot_count === 0}
-                        >
-                          🔍 {t('common.examine')}
-                        </GameButton>
-                      </>
-                    ) : (
-                      <GameTooltip content={
-                        <div>
-                          <div className="tooltip-title">{corpse.emoji} {getTranslatedText(corpse.name)}</div>
-                          <div>{corpse.loot_count} {t('location.items')}</div>
-                        </div>
-                      }>
-                        <div className="grid-corpse-content">
-                          <div style={{ fontSize: '2rem' }}>{corpse.emoji}</div>
-                          <div style={{ fontSize: '0.8rem', color: '#ce93d8' }}>{corpse.loot_count} items</div>
-                        </div>
-                      </GameTooltip>
-                    )}
+                    <GameTooltip content={
+                      <div>
+                        <div className="tooltip-title">{corpse.emoji} {getTranslatedText(corpse.name)}</div>
+                        <div>{corpse.loot_count} {t('location.items')}</div>
+                      </div>
+                    }>
+                      <div className="grid-corpse-content">
+                        <div style={{ fontSize: '2rem' }}>{corpse.emoji}</div>
+                        <div style={{ fontSize: '0.8rem', color: '#ce93d8' }}>{corpse.loot_count} items</div>
+                      </div>
+                    </GameTooltip>
 
-                    {viewMode === 'grid' && activeDropdown === `corpse-${corpse.id}` && (
+                    {activeDropdown === `corpse-${corpse.id}` && (
                       <GameDropdown
                         isOpen={true}
                         onClose={() => setActiveDropdown(null)}
@@ -437,33 +377,23 @@ function LocationView({
         {location.npcs.filter((npc: any) => npc.type !== 'enemy').length > 0 && (
           <div className="entity-section npcs-section">
             <h3>{t('location.npcs')}</h3>
-            <div className="entity-list">
+            <div className="entity-list grid-view">
               {location.npcs.filter((npc: any) => npc.type !== 'enemy').map((npc: any, i: number) => (
-                <div key={i} className={`entity-card npc-card ${viewMode === 'grid' ? 'grid-card' : ''}`}
-                  onClick={viewMode === 'grid' ? (e) => handleDropdownClick(e, `npc-${i}`) : undefined}
+                <div key={i} className="entity-card npc-card grid-card"
+                  onClick={(e) => handleDropdownClick(e, `npc-${i}`)}
                 >
-                  <span className="entity-icon" style={viewMode === 'grid' ? { fontSize: '2.5rem' } : {}}>🧑</span>
+                  <span className="entity-icon" style={{ fontSize: '2.5rem' }}>🧑</span>
 
-                  {viewMode === 'list' ? (
-                    <>
-                      <div className="entity-info">
-                        <div className="entity-name">{getTranslatedText(npc.name)}</div>
-                        {npc.level && <div className="entity-level">{t('location.level')} {npc.level}</div>}
-                      </div>
-                      <GameButton variant="primary" size="sm" className="entity-action-btn">{t('common.talk')}</GameButton>
-                    </>
-                  ) : (
-                    <GameTooltip content={
-                      <div>
-                        <div className="tooltip-title">{getTranslatedText(npc.name)}</div>
-                        <div>{t('location.level')} {npc.level}</div>
-                      </div>
-                    }>
-                      <div className="grid-overlay"></div>
-                    </GameTooltip>
-                  )}
+                  <GameTooltip content={
+                    <div>
+                      <div className="tooltip-title">{getTranslatedText(npc.name)}</div>
+                      <div>{t('location.level')} {npc.level}</div>
+                    </div>
+                  }>
+                    <div className="grid-overlay"></div>
+                  </GameTooltip>
 
-                  {viewMode === 'grid' && activeDropdown === `npc-${i}` && (
+                  {activeDropdown === `npc-${i}` && (
                     <GameDropdown
                       isOpen={true}
                       onClose={() => setActiveDropdown(null)}
@@ -485,14 +415,14 @@ function LocationView({
         {location.items.length > 0 && (
           <div className="entity-section items-section">
             <h3>{t('location.itemsOnGround')}</h3>
-            <div className="entity-list">
+            <div className="entity-list grid-view">
               {location.items.map((item: any, i: number) => {
                 // Use loose equality to handle potential string/number mismatches
                 const isShaking = failedActionItemId == item.id;
                 const itemId = `item-${item.id}-${i}`;
                 return (
-                  <div key={i} className={`entity-card item-card ${isShaking ? 'shake' : ''} ${viewMode === 'grid' ? 'grid-card' : ''}`}
-                    onClick={viewMode === 'grid' ? (e) => handleDropdownClick(e, itemId) : undefined}
+                  <div key={i} className={`entity-card item-card ${isShaking ? 'shake' : ''} grid-card`}
+                    onClick={(e) => handleDropdownClick(e, itemId)}
                   >
                     <GameTooltip content={
                       <div className="item-info-tooltip-content">
@@ -528,13 +458,13 @@ function LocationView({
                         )}
                       </div>
                     }>
-                      <div className={`entity-content-wrapper ${viewMode === 'grid' ? 'grid-content' : ''}`} style={viewMode === 'list' ? { display: 'flex', alignItems: 'center', gap: '1rem', flex: 1, cursor: 'help' } : {}}>
+                      <div className="entity-content-wrapper grid-content">
                         {item.image_path ? (
                           <img
                             src={getAssetPath(item.image_path)}
                             alt={getTranslatedText(item.name)}
                             className="entity-icon"
-                            style={viewMode === 'grid' ? { width: '100%', height: '100%', objectFit: 'contain' } : {}}
+                            style={{ width: '100%', height: '100%', objectFit: 'contain' }}
                             onError={(e) => {
                               (e.target as HTMLImageElement).style.display = 'none';
                               const icon = (e.target as HTMLImageElement).nextElementSibling;
@@ -542,71 +472,15 @@ function LocationView({
                             }}
                           />
                         ) : null}
-                        <span className={`entity-icon ${item.image_path ? 'hidden' : ''}`} style={viewMode === 'grid' && !item.image_path ? { fontSize: '2rem' } : {}}>{item.emoji || '📦'}</span>
+                        <span className={`entity-icon ${item.image_path ? 'hidden' : ''}`} style={!item.image_path ? { fontSize: '2rem' } : {}}>{item.emoji || '📦'}</span>
 
-                        {viewMode === 'list' && (
-                          <div className="entity-info">
-                            <div className={`entity-name ${item.tier ? `tier-${item.tier}` : ''}`}>
-                              {getTranslatedText(item.name) || 'Unknown Item'}
-                            </div>
-                            {item.quantity > 1 && <div className="entity-quantity">×{item.quantity}</div>}
-                          </div>
-                        )}
-                        {viewMode === 'grid' && item.quantity > 1 && (
+                        {item.quantity > 1 && (
                           <div className="grid-quantity">x{item.quantity}</div>
                         )}
                       </div>
                     </GameTooltip>
 
-                    {viewMode === 'list' && (
-                      <div className="item-actions-row">
-                        {item.quantity === 1 ? (
-                          <GameButton
-                            variant="success"
-                            size="sm"
-                            className="action-btn pickup single"
-                            onClick={() => {
-                              // Sound handled in useGameEngine
-                              onPickup(item.id, 1)
-                            }}
-                          >
-                            {t('common.pickUp')}
-                          </GameButton>
-                        ) : (
-                          <div className="pickup-actions-group">
-                            <GameButton variant="success" size="sm" className="action-btn pickup" onClick={() => {
-                              onPickup(item.id, 1)
-                            }}>
-                              x1
-                            </GameButton>
-
-                            {item.quantity >= 5 && (
-                              <GameButton variant="success" size="sm" className="action-btn pickup" onClick={() => {
-                                onPickup(item.id, 5)
-                              }}>
-                                x5
-                              </GameButton>
-                            )}
-
-                            {item.quantity >= 10 && (
-                              <GameButton variant="success" size="sm" className="action-btn pickup" onClick={() => {
-                                onPickup(item.id, 10)
-                              }}>
-                                x10
-                              </GameButton>
-                            )}
-
-                            <GameButton variant="success" size="sm" className="action-btn pickup" onClick={() => {
-                              onPickup(item.id, item.quantity)
-                            }}>
-                              {t('common.all') || 'All'}
-                            </GameButton>
-                          </div>
-                        )}
-                      </div>
-                    )}
-
-                    {viewMode === 'grid' && activeDropdown === itemId && (
+                    {activeDropdown === itemId && (
                       <GameDropdown
                         isOpen={true}
                         onClose={() => setActiveDropdown(null)}