diff --git a/TaikoWebUI/Pages/PlayResults.razor b/TaikoWebUI/Pages/PlayResults.razor
index 9beaea4..64a6d1b 100644
--- a/TaikoWebUI/Pages/PlayResults.razor
+++ b/TaikoWebUI/Pages/PlayResults.razor
@@ -30,52 +30,69 @@
                 @foreach (var genre in Enum.GetValues<SongGenre>())
                 {
                     <MudTabPanel Text="@genre.ToString()">
-                        <MudDataGrid Items="@response.SongBestData.Where(data => GameDataService.GetMusicGenreBySongId(data.SongId) == genre)">
-                            <Columns>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.SongId)" Title="Song">
-                                    <CellTemplate>
-                                        <MudText Typo="Typo.body2" Style="font-weight:bold">@GameDataService.GetMusicNameBySongId(context.Item.SongId)</MudText>
-                                        <MudText Typo="Typo.caption">@GameDataService.GetMusicArtistBySongId(context.Item.SongId)</MudText>
-                                    </CellTemplate>
-                                </Column>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.Difficulty)" Title="Difficulty">
-                                    <CellTemplate>
-                                        <MudTooltip Text="@(context.Item.Difficulty.ToString())" Arrow="true" Placement="Placement.Top">
-                                            <img src="@($"/images/{context.Item.Difficulty}.png")" alt="@(context.Item.Difficulty)" style="@ICON_STYLE"/>
-                                        </MudTooltip>
-                                    </CellTemplate>
-                                </Column>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.BestScore)" Title="Best Score"/>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.BestCrown)" Title="Best Crown">
-                                    <CellTemplate>
-                                        <MudTooltip Text="@(GetCrownText(context.Item.BestCrown))" Arrow="true" Placement="Placement.Top">
-                                            <img src="@($"/images/crown_{context.Item.BestCrown}.png")" alt="@(context.Item.BestCrown)" style="@ICON_STYLE"/>
-                                        </MudTooltip>
-                                    </CellTemplate>
-                                </Column>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.BestScoreRank)" Title="Best Rank"/>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.BestRate)" Title="Best Rate"/>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.GoodCount)" Title="Good"/>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.OkCount)" Title="Ok"/>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.MissCount)" Title="Miss"/>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.ComboCount)" Title="Max Combo"/>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.DrumrollCount)" Title="Drum Rolls"/>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.HitCount)" Title="Hit"/>
-                                <Column T="SongBestData" Field="@nameof(SongBestData.IsFavorite)" Title="Favorite">
-                                    <CellTemplate>
-                                        <MudToggleIconButton Toggled="@context.Item.IsFavorite"
-                                                             ToggledChanged="@(async () => await OnFavoriteToggled(context.Item))"
-                                                             Icon="@Icons.Material.Filled.FavoriteBorder" Color="@Color.Secondary"
-                                                             Title="Add to favorites"
-                                                             ToggledIcon="@Icons.Material.Filled.Favorite" ToggledColor="@Color.Secondary"
-                                                             ToggledTitle="Remove from favorites"/>
-                                    </CellTemplate>
-                                </Column>
-                            </Columns>
-                            <PagerContent>
-                                <MudDataGridPager T="SongBestData"/>
-                            </PagerContent>
-                        </MudDataGrid>
+                               <MudDataGrid Items="@response.SongBestData" ColumnResizeMode="ResizeMode.Container">
+                                   <Columns>
+                                           <Column T="SongBestData" Field="@nameof(SongBestData.SongId)" Title="Song" StickyLeft="true" Class="clm-row-large">
+                                           <CellTemplate>
+                                               <MudGrid Justify="Justify.Center">
+                                                   <MudItem xs="10">
+                                                       <MudStack Spacing="0">
+                                                           <MudText Typo="Typo.body2" Style="font-weight:bold">@GameDataService.GetMusicNameBySongId(context.Item.SongId)</MudText>
+                                                           <MudText Typo="Typo.caption">@GameDataService.GetMusicArtistBySongId(context.Item.SongId)</MudText>
+                                                       </MudStack>
+                                                   </MudItem>
+                                                   <MudItem xs="2">
+                                                       <MudStack Justify="Justify.Center" AlignItems="AlignItems.End" Style="height:100%">
+                                                           <MudToggleIconButton Toggled="@context.Item.IsFavorite"
+                                                                            ToggledChanged="@(async () => await OnFavoriteToggled(context.Item))"
+                                                                            Icon="@Icons.Material.Filled.FavoriteBorder" Color="@Color.Secondary"
+                                                                            Title="Add to favorites"
+                                                                            ToggledIcon="@Icons.Material.Filled.Favorite" ToggledColor="@Color.Secondary"
+                                                                            ToggledTitle="Remove from favorites"
+                                                                            Size="Size.Small"
+                                                                            ToggledSize="Size.Small" />
+                                                       </MudStack>
+                                                   </MudItem>
+                                               </MudGrid>
+                                           </CellTemplate>
+                                       </Column>
+                                       <Column T="SongBestData" Field="@nameof(SongBestData.Difficulty)" Title="Course">
+                                           <CellTemplate>
+                                                   <MudTooltip Text="@(context.Item.Difficulty.ToString())" Arrow="true" Placement="Placement.Top">
+                                                   <img src="@($"/images/{context.Item.Difficulty}.png")" alt="@(context.Item.Difficulty)" style="@ICON_STYLE" />
+                                               </MudTooltip>
+                                           </CellTemplate>
+                                       </Column>
+                                       <Column T="SongBestData" Field="@nameof(SongBestData.BestScore)" Title="Best Score"/>
+                                       <Column T="SongBestData" Field="@nameof(SongBestData.BestCrown)" Title="Best Crown">
+                                           <CellTemplate>
+                                               <MudTooltip Text="@(GetCrownText(context.Item.BestCrown))" Arrow="true" Placement="Placement.Top">
+                                                   <img src="@($"/images/crown_{context.Item.BestCrown}.png")" alt="@(context.Item.BestCrown)" style="@ICON_STYLE" />
+                                               </MudTooltip>
+                                           </CellTemplate>
+                                       </Column>
+                                       <Column T="SongBestData" Field="@nameof(SongBestData.BestScoreRank)" Title="Best Rank">
+                                           <CellTemplate>
+                                               @if (context.Item.BestScoreRank is not ScoreRank.None)
+                                               {
+                                                   <MudTooltip Text="@(getRankText(context.Item.BestScoreRank))" Arrow="true" Placement="Placement.Top">
+                                                       <img src="@($"/images/rank_{context.Item.BestScoreRank}.png")" alt="@(context.Item.BestScoreRank)" style="@ICON_STYLE" />
+                                                   </MudTooltip>
+                                               }
+                                           </CellTemplate>
+                                       </Column>
+                                       <Column T="SongBestData" Field="@nameof(SongBestData.GoodCount)" Title="Good" Sortable="false"/>
+                                       <Column T="SongBestData" Field="@nameof(SongBestData.OkCount)" Title="Ok" Sortable="false" />
+                                       <Column T="SongBestData" Field="@nameof(SongBestData.MissCount)" Title="Bad" Sortable="false"/>
+                                       <Column T="SongBestData" Field="@nameof(SongBestData.DrumrollCount)" Title="Drum Roll" Sortable="false"/>
+                                       <Column T="SongBestData" Field="@nameof(SongBestData.ComboCount)" Title="Max Combo" Sortable="false" />
+                                       @*<Column T="SongBestData" Field="@nameof(SongBestData.HitCount)" Title="Hit" />*@
+                                       @*<Column T="SongBestData" Field="@nameof(SongBestData.BestRate)" Title="Best Rate"/>*@
+                                   </Columns>
+                                   <PagerContent>
+                                       <MudDataGridPager T="SongBestData"/>
+                                   </PagerContent>
+                               </MudDataGrid>
                     </MudTabPanel>
                 }
             </MudTabs>
@@ -90,7 +107,7 @@
     public int Baid { get; set; }
 
     private SongBestResponse? response;
-        
+
     private const string ICON_STYLE = "width:25px; height:25px;";
 
     private readonly List<BreadcrumbItem> breadcrumbs = new()
@@ -137,7 +154,23 @@
             CrownType.Gold => "Full Combo",
             CrownType.Dondaful => "Donderful Combo",
             _ => ""
-            };
+        };
+    }
+
+    private string getRankText(ScoreRank rank)
+    {
+        return rank switch
+        {
+            ScoreRank.None => "None",
+            ScoreRank.White => "Stylish (White)",
+            ScoreRank.Bronze => "Stylish (Bronze)",
+            ScoreRank.Silver => "Stylish (Silver)",
+            ScoreRank.Gold => "Graceful (Gold)",
+            ScoreRank.Sakura => "Graceful (Sakura)",
+            ScoreRank.Purple => "Graceful (Purple)",
+            ScoreRank.Dondaful => "Top Class (Donderful)",
+            _ => ""
+        };
     }
 
 }
\ No newline at end of file
diff --git a/TaikoWebUI/wwwroot/images/rank_Bronze.png b/TaikoWebUI/wwwroot/images/rank_Bronze.png
new file mode 100644
index 0000000..8ca2d55
Binary files /dev/null and b/TaikoWebUI/wwwroot/images/rank_Bronze.png differ
diff --git a/TaikoWebUI/wwwroot/images/rank_Dondaful.png b/TaikoWebUI/wwwroot/images/rank_Dondaful.png
new file mode 100644
index 0000000..b43316d
Binary files /dev/null and b/TaikoWebUI/wwwroot/images/rank_Dondaful.png differ
diff --git a/TaikoWebUI/wwwroot/images/rank_Gold.png b/TaikoWebUI/wwwroot/images/rank_Gold.png
new file mode 100644
index 0000000..7e36cf0
Binary files /dev/null and b/TaikoWebUI/wwwroot/images/rank_Gold.png differ
diff --git a/TaikoWebUI/wwwroot/images/rank_Purple.png b/TaikoWebUI/wwwroot/images/rank_Purple.png
new file mode 100644
index 0000000..821ffd1
Binary files /dev/null and b/TaikoWebUI/wwwroot/images/rank_Purple.png differ
diff --git a/TaikoWebUI/wwwroot/images/rank_Sakura.png b/TaikoWebUI/wwwroot/images/rank_Sakura.png
new file mode 100644
index 0000000..565a722
Binary files /dev/null and b/TaikoWebUI/wwwroot/images/rank_Sakura.png differ
diff --git a/TaikoWebUI/wwwroot/images/rank_Silver.png b/TaikoWebUI/wwwroot/images/rank_Silver.png
new file mode 100644
index 0000000..d4b977a
Binary files /dev/null and b/TaikoWebUI/wwwroot/images/rank_Silver.png differ
diff --git a/TaikoWebUI/wwwroot/images/rank_White.png b/TaikoWebUI/wwwroot/images/rank_White.png
new file mode 100644
index 0000000..587b8d8
Binary files /dev/null and b/TaikoWebUI/wwwroot/images/rank_White.png differ