diff --git a/app/views/pages/dashboard/_investment_summary.html.erb b/app/views/pages/dashboard/_investment_summary.html.erb
index f10f0d776..c6396e1dd 100644
--- a/app/views/pages/dashboard/_investment_summary.html.erb
+++ b/app/views/pages/dashboard/_investment_summary.html.erb
@@ -27,50 +27,52 @@
 
     <% holdings = investment_statement.top_holdings(limit: 5) %>
     <% if holdings.any? %>
-      <div class="bg-container-inset rounded-xl p-1 mx-4">
-        <div class="px-4 py-2 flex items-center uppercase text-xs font-medium text-secondary">
-          <div class="flex-1"><%= t(".holding") %></div>
-          <div class="w-20 text-right"><%= t(".weight") %></div>
-          <div class="w-28 text-right"><%= t(".value") %></div>
-          <div class="w-24 text-right"><%= t(".return") %></div>
-        </div>
+      <div class="bg-container-inset rounded-xl p-1 mx-4 overflow-x-auto">
+        <div class="w-max sm:w-full">
+          <div class="px-4 py-2 grid grid-cols-4 items-center uppercase text-xs font-medium text-secondary">
+            <div class="flex-1"><%= t(".holding") %></div>
+            <div class="text-right"><%= t(".weight") %></div>
+            <div class="text-right"><%= t(".value") %></div>
+            <div class="text-right"><%= t(".return") %></div>
+          </div>
 
-        <div class="shadow-border-xs rounded-lg bg-container font-medium text-sm">
-          <% holdings.each_with_index do |holding, idx| %>
-            <div class="p-4 flex items-center <%= idx < holdings.size - 1 ? "border-b border-primary" : "" %>">
-              <div class="flex-1 flex items-center gap-3">
-                <% if holding.security.logo_url.present? %>
-                  <img src="<%= holding.security.logo_url %>" alt="<%= holding.ticker %>" class="w-8 h-8 rounded-full">
-                <% else %>
-                  <div class="w-8 h-8 rounded-full bg-container-inset flex items-center justify-center text-xs font-medium text-secondary">
-                    <%= holding.ticker[0..1] %>
+          <div class="shadow-border-xs rounded-lg bg-container font-medium text-sm">
+            <% holdings.each_with_index do |holding, idx| %>
+              <div class="p-4 grid grid-cols-4 items-center <%= idx < holdings.size - 1 ? "border-b border-primary" : "" %>">
+                <div class="flex-1 flex items-center gap-3">
+                  <% if holding.security.logo_url.present? %>
+                    <img src="<%= holding.security.logo_url %>" alt="<%= holding.ticker %>" class="w-8 h-8 rounded-full">
+                  <% else %>
+                    <div class="w-8 h-8 rounded-full bg-container-inset flex items-center justify-center text-xs font-medium text-secondary">
+                      <%= holding.ticker.to_s.first(2).presence || "—" %>
+                    </div>
+                  <% end %>
+                  <div class="max-w-32">
+                    <p class="font-medium truncate"><%= holding.ticker %></p>
+                    <p class="text-xs text-secondary"><%= truncate(holding.name, length: 20) %></p>
                   </div>
-                <% end %>
-                <div>
-                  <p class="font-medium"><%= holding.ticker %></p>
-                  <p class="text-xs text-secondary"><%= truncate(holding.name, length: 20) %></p>
+                </div>
+
+                <div class="text-right text-secondary">
+                  <%= number_to_percentage(holding.weight || 0, precision: 1) %>
+                </div>
+
+                <div class="text-right">
+                  <%= format_money(holding.amount_money) %>
+                </div>
+
+                <div class="text-right">
+                  <% if holding.trend %>
+                    <span style="color: <%= holding.trend.color %>">
+                      <%= holding.trend.percent_formatted %>
+                    </span>
+                  <% else %>
+                    <span class="text-secondary">-</span>
+                  <% end %>
                 </div>
               </div>
-
-              <div class="w-20 text-right text-secondary">
-                <%= number_to_percentage(holding.weight || 0, precision: 1) %>
-              </div>
-
-              <div class="w-28 text-right">
-                <%= format_money(holding.amount_money) %>
-              </div>
-
-              <div class="w-24 text-right">
-                <% if holding.trend %>
-                  <span style="color: <%= holding.trend.color %>">
-                    <%= holding.trend.percent_formatted %>
-                  </span>
-                <% else %>
-                  <span class="text-secondary">-</span>
-                <% end %>
-              </div>
-            </div>
-          <% end %>
+            <% end %>
+          </div>
         </div>
       </div>
     <% end %>
diff --git a/app/views/reports/_investment_performance.html.erb b/app/views/reports/_investment_performance.html.erb
index aa63cbf4d..88fa6f979 100644
--- a/app/views/reports/_investment_performance.html.erb
+++ b/app/views/reports/_investment_performance.html.erb
@@ -58,48 +58,49 @@
     <% if investment_metrics[:top_holdings].any? %>
       <div class="space-y-3">
         <h4 class="text-lg font-medium"><%= t("reports.investment_performance.top_holdings") %></h4>
-
         <div class="bg-container-inset rounded-xl p-1 overflow-x-auto">
-          <div class="grid grid-cols-4 items-center uppercase text-xs font-medium text-secondary px-4 py-2">
-            <div class="font-medium text-secondary"><%= t("reports.investment_performance.holding") %></div>
-            <div class="text-right font-medium text-secondary"><%= t("reports.investment_performance.weight") %></div>
-            <div class="text-right font-medium text-secondary"><%= t("reports.investment_performance.value") %></div>
-            <div class="text-right font-medium text-secondary"><%= t("reports.investment_performance.return") %></div>
-          </div>
-          <div class="bg-container rounded-lg shadow-border-xs">
-            <% investment_metrics[:top_holdings].each_with_index do |holding, idx| %>
-              <div class="grid grid-cols-4 items-center text-secondary text-sm py-3 px-4 lg:px-6">
-                <div class="flex items-center gap-3">
-                  <% if holding.security.brandfetch_icon_url.present? %>
-                    <img src="<%= holding.security.brandfetch_icon_url %>" alt="<%= holding.ticker %>" class="w-6 h-6 rounded-full">
-                  <% elsif holding.security.logo_url.present? %>
-                    <img src="<%= Setting.transform_brand_fetch_url(holding.security.logo_url) %>" alt="<%= holding.ticker %>" class="w-6 h-6 rounded-full">
-                  <% else %>
-                    <div class="w-8 h-8 rounded-full bg-container-inset flex items-center justify-center text-xs font-medium text-secondary">
-                      <%= holding.ticker[0..1] %>
+          <div class="w-max sm:w-full">
+            <div role="columnheader" class="grid grid-cols-4 items-center uppercase text-xs font-medium text-secondary px-4 py-2">
+              <div class="font-medium text-secondary"><%= t("reports.investment_performance.holding") %></div>
+              <div class="text-right font-medium text-secondary"><%= t("reports.investment_performance.weight") %></div>
+              <div class="text-right font-medium text-secondary"><%= t("reports.investment_performance.value") %></div>
+              <div class="text-right font-medium text-secondary"><%= t("reports.investment_performance.return") %></div>
+            </div>
+            <div class="bg-container rounded-lg shadow-border-xs">
+              <% investment_metrics[:top_holdings].each_with_index do |holding, idx| %>
+                <div class="grid grid-cols-4 items-center text-secondary text-sm py-3 px-4 lg:px-6">
+                  <div class="flex items-center gap-3">
+                    <% if holding.security.brandfetch_icon_url.present? %>
+                      <img src="<%= holding.security.brandfetch_icon_url %>" alt="<%= holding.ticker %>" class="w-6 h-6 rounded-full">
+                    <% elsif holding.security.logo_url.present? %>
+                      <img src="<%= Setting.transform_brand_fetch_url(holding.security.logo_url) %>" alt="<%= holding.ticker %>" class="w-6 h-6 rounded-full">
+                    <% else %>
+                      <div class="w-8 h-8 rounded-full bg-container-inset flex items-center justify-center text-xs font-medium text-secondary">
+                        <%= holding.ticker[0..1] %>
+                      </div>
+                    <% end %>
+                    <div>
+                      <p class="font-medium text-primary"><%= holding.ticker %></p>
+                      <p class="text-xs text-secondary"><%= truncate(holding.name, length: 25) %></p>
                     </div>
-                  <% end %>
-                  <div>
-                    <p class="font-medium text-primary"><%= holding.ticker %></p>
-                    <p class="text-xs text-secondary"><%= truncate(holding.name, length: 25) %></p>
+                  </div>
+                  <div class="text-right text-secondary"><%= number_to_percentage(holding.weight || 0, precision: 1) %></div>
+                  <div class="text-right font-medium text-primary"><%= format_money(holding.amount_money) %></div>
+                  <div class="text-right">
+                    <% if holding.trend %>
+                      <span style="color: <%= holding.trend.color %>">
+                        <%= holding.trend.percent_formatted %>
+                      </span>
+                    <% else %>
+                      <span class="text-secondary"><%= t("reports.investment_performance.no_data") %></span>
+                    <% end %>
                   </div>
                 </div>
-                <div class="text-right text-secondary"><%= number_to_percentage(holding.weight || 0, precision: 1) %></div>
-                <div class="text-right font-medium text-primary"><%= format_money(holding.amount_money) %></div>
-                <div class="text-right">
-                  <% if holding.trend %>
-                    <span style="color: <%= holding.trend.color %>">
-                      <%= holding.trend.percent_formatted %>
-                    </span>
-                  <% else %>
-                    <span class="text-secondary"><%= t("reports.investment_performance.no_data") %></span>
-                  <% end %>
-                </div>
-              </div>
-              <% if idx < investment_metrics[:top_holdings].size - 1 %>
-                <%= render "shared/ruler", classes: "mx-3 lg:mx-4" %>
+                <% if idx < investment_metrics[:top_holdings].size - 1 %>
+                  <%= render "shared/ruler", classes: "mx-3 lg:mx-4" %>
+                <% end %>
               <% end %>
-            <% end %>
+            </div>
           </div>
         </div>
       </div>
diff --git a/app/views/reports/index.html.erb b/app/views/reports/index.html.erb
index 888271567..d3bd12b37 100644
--- a/app/views/reports/index.html.erb
+++ b/app/views/reports/index.html.erb
@@ -153,7 +153,7 @@
               <%= icon("grip-vertical", size: "sm") %>
             </button>
           </div>
-          <div class="py-4 px-6" data-reports-section-target="content">
+          <div class="p-4" data-reports-section-target="content">
             <%= render partial: section[:partial], locals: section[:locals] %>
           </div>
         </section>