From 0fea856846fa49e90d29f0aa9e427e6bebfddc58 Mon Sep 17 00:00:00 2001
From: Flatlogic Bot <support@flatlogic.com>
Date: Tue, 17 Feb 2026 16:41:16 +0000
Subject: [PATCH] Auto commit: 2026-02-17T16:41:16.640Z

---
 index.php | 92 +++++++++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 86 insertions(+), 6 deletions(-)

diff --git a/index.php b/index.php
index 803e236..7c55906 100644
--- a/index.php
+++ b/index.php
@@ -833,7 +833,7 @@ $facebook_link = "https://www.facebook.com/profile.php?id=61587890927489";
                 flex-direction: column;
                 height: auto;
                 overflow-y: auto;
-                padding-top: 4rem;
+                padding: 2rem 1rem;
             }
             .player-section, .interaction-center {
                 max-width: 100% !important;
@@ -842,26 +842,106 @@ $facebook_link = "https://www.facebook.com/profile.php?id=61587890927489";
             .interaction-center {
                 grid-template-columns: 1fr !important;
             }
-            .chat-window, .ranking-window {
-                height: 400px !important;
+            .chat-window {
+                height: 500px !important;
             }
             .image-section {
                 padding-left: 0;
                 width: 100%;
             }
             .featured-img-container {
-                aspect-ratio: 1 / 1;
+                aspect-ratio: 16 / 9;
             }
         }
+
         @media (max-width: 600px) {
+            .app-container {
+                padding: 1rem 0.8rem;
+                gap: 1rem;
+            }
             .form-row {
                 grid-template-columns: 1fr;
+                gap: 1rem;
             }
             .glass-card {
-                padding: 1.5rem;
+                padding: 1.5rem 1.2rem;
+                border-radius: 24px;
+            }
+            .glass-card::before {
+                border-radius: 24px;
             }
             .brand h1 {
-                font-size: 2rem;
+                font-size: 1.8rem;
+            }
+            .brand-logo {
+                width: 100px;
+                height: 100px;
+            }
+            .logo-wrapper {
+                gap: 1rem;
+                margin-bottom: 1rem;
+            }
+            .now-playing {
+                padding: 1rem;
+                gap: 0.8rem;
+                flex-direction: column;
+                text-align: center;
+            }
+            .track-cover-container {
+                width: 120px;
+                height: 120px;
+                margin: 0 auto;
+            }
+            .track-title {
+                font-size: 1.3rem;
+                white-space: normal;
+                word-break: break-word;
+            }
+            .controls {
+                justify-content: center;
+                gap: 1.2rem;
+                flex-wrap: wrap;
+            }
+            .play-btn {
+                width: 80px;
+                height: 80px;
+                font-size: 2.5rem;
+            }
+            .volume-slider {
+                width: 100%;
+                order: 4;
+                margin-top: 10px;
+            }
+            .chat-window {
+                height: 450px !important;
+            }
+            .social-float-container {
+                bottom: 1rem;
+                right: 1rem;
+            }
+            .social-float {
+                width: 50px;
+                height: 50px;
+                font-size: 22px;
+            }
+            .chat-input-area button {
+                padding: 0 0.8rem;
+            }
+            #chat-msg {
+                font-size: 1rem; /* Prevent zoom on iOS */
+            }
+        }
+
+        @media (max-width: 400px) {
+            .brand h1 {
+                font-size: 1.5rem;
+            }
+            .play-btn {
+                width: 70px;
+                height: 70px;
+            }
+            .track-title {
+                font-size: 1.1rem;
             }
         }
     </style>