Refactor mobile layout in app.py to enhance salary display by adjusting column alignment and improving HTML formatting. This change ensures consistent presentation of per player salary and leftover amounts across different screen sizes.

app.py

@@ -1034,27 +1034,39 @@ with tab4:
             })
             summary_row = summary_row[['Salary', 'Median', 'Own%']].head(10)
             
+            col1, col2, col3 = st.columns([2, 1, 3])
             if screen_width < 700:
-                # Mobile: Only two columns
-                col1, col3 = st.columns([2, 3])
-                col2 = None
+                with col1:
+                    if (10 - len(filled_lineup)) > 0:
+                        st.markdown(f"""
+                                <div style='text-align: right; vertical-align: top; margin-top: 0; padding-top: 0;''>
+                                    <b>💰 Per Player:</b> ${round((50000 - total_salary) / (10 - len(filled_lineup)), 0)} &nbsp;
+                                </div>
+                                """,
+                                unsafe_allow_html=True)
+                    else:
+                        st.markdown(f"""
+                                <div style='text-align: right; vertical-align: top; margin-top: 0; padding-top: 0;''>
+                                    <b>💰 Leftover:</b> ${round(50000 - total_salary, 0)} &nbsp;
+                                </div>
+                                """,
+                                unsafe_allow_html=True)
             else:
-                col1, col2, col3 = st.columns([2, 1, 3])
-            with col1:
-                if (10 - len(filled_lineup)) > 0:
-                    st.markdown(f"""
-                            <div style='text-align: left; vertical-align: top; margin-top: 0; padding-top: 0;''>
-                                <b>💰 Per Player:</b> ${round((50000 - total_salary) / (10 - len(filled_lineup)), 0)} &nbsp;
-                            </div>
-                            """,
-                            unsafe_allow_html=True)
-                else:
-                    st.markdown(f"""
-                            <div style='text-align: left; vertical-align: top; margin-top: 0; padding-top: 0;''>
-                                <b>💰 Leftover:</b> ${round(50000 - total_salary, 0)} &nbsp;
-                            </div>
-                            """,
-                            unsafe_allow_html=True)
+                with col1:
+                    if (10 - len(filled_lineup)) > 0:
+                        st.markdown(f"""
+                                <div style='text-align: left; vertical-align: top; margin-top: 0; padding-top: 0;''>
+                                    <b>💰 Per Player:</b> ${round((50000 - total_salary) / (10 - len(filled_lineup)), 0)} &nbsp;
+                                </div>
+                                """,
+                                unsafe_allow_html=True)
+                    else:
+                        st.markdown(f"""
+                                <div style='text-align: left; vertical-align: top; margin-top: 0; padding-top: 0;''>
+                                    <b>💰 Leftover:</b> ${round(50000 - total_salary, 0)} &nbsp;
+                                </div>
+                                """,
+                                unsafe_allow_html=True)
 
             with col3:
                 if total_salary <= 50000: