Update app.py

app.py

@@ -79,55 +79,39 @@ def course_correction(correction, state):
 # ==============================
 css = """
 /* ============================= */
-/* 🌌 طبقة الفضاء */
+/* 🌌 خلفية الفضاء */
 /* ============================= */
 #space-background {
     position: fixed;
     inset: 0;
     z-index: 0;
     overflow: hidden;
-    background: radial-gradient(circle at bottom, #0b0f0c 0%, #050705 70%);
+    background: radial-gradient(circle at bottom, #0b0f0c 0%, #020302 70%);
     pointer-events: none;
 }
 
 /* ============================= */
-/* ✨ النجوم – 3 طبقات */
+/* ✨ نجوم كثيفة متحركة */
 /* ============================= */
 .stars {
     position: absolute;
-    inset: -50%;
-    background-repeat: repeat;
-    opacity: 0.6;
-}
-
-/* نجوم بعيدة */
-.layer1 {
-    background-image:
-        radial-gradient(1px 1px at 20% 30%, #9fa97a, transparent),
-        radial-gradient(1px 1px at 80% 70%, #8e955f, transparent);
-    background-size: 300px 300px;
-    animation: starsSlow 180s linear infinite;
-    opacity: 0.3;
-}
-
-/* نجوم متوسطة */
-.layer2 {
-    background-image:
-        radial-gradient(1px 1px at 40% 60%, #b7c28b, transparent),
-        radial-gradient(1px 1px at 70% 20%, #aab37a, transparent);
-    background-size: 200px 200px;
-    animation: starsMedium 120s linear infinite;
-    opacity: 0.5;
-}
-
-/* نجوم قريبة */
-.layer3 {
+    inset: -100%;
     background-image:
-        radial-gradient(2px 2px at 50% 50%, #cfd6b5, transparent),
-        radial-gradient(1px 1px at 10% 90%, #d6ddb8, transparent);
-    background-size: 120px 120px;
-    animation: starsFast 80s linear infinite;
-    opacity: 0.7;
+        radial-gradient(1px 1px at 10% 20%, #cfd6b5, transparent),
+        radial-gradient(1px 1px at 30% 80%, #b7c28b, transparent),
+        radial-gradient(1px 1px at 50% 40%, #d6ddb8, transparent),
+        radial-gradient(1px 1px at 70% 60%, #aab37a, transparent),
+        radial-gradient(1px 1px at 90% 10%, #e5ecd2, transparent),
+        radial-gradient(2px 2px at 20% 50%, #f0f4dc, transparent),
+        radial-gradient(1px 1px at 60% 90%, #cfd6b5, transparent);
+    background-size: 150px 150px;
+    animation: starMove 120s linear infinite;
+    opacity: 0.9;
+}
+
+@keyframes starMove {
+    from { transform: translate(0, 0); }
+    to   { transform: translate(25%, 25%); }
 }
 
 /* ============================= */
@@ -135,41 +119,23 @@ css = """
 /* ============================= */
 .planet {
     position: absolute;
-    top: 15%;
-    right: -180px;
-    width: 420px;
-    height: 420px;
-    background: radial-gradient(circle at 30% 30%, #7a8450, #1b1f14 70%);
+    top: 20%;
+    right: -160px;
+    width: 380px;
+    height: 380px;
+    background: radial-gradient(circle at 30% 30%, #7a8450, #15190f 70%);
     border-radius: 50%;
-    opacity: 0.4;
-    animation: planetFloat 90s ease-in-out infinite alternate;
-}
-
-/* ============================= */
-/* 🎞️ الحركات */
-/* ============================= */
-@keyframes starsSlow {
-    from { transform: translate(0, 0); }
-    to   { transform: translate(10%, 10%); }
-}
-
-@keyframes starsMedium {
-    from { transform: translate(0, 0); }
-    to   { transform: translate(20%, 15%); }
-}
-
-@keyframes starsFast {
-    from { transform: translate(0, 0); }
-    to   { transform: translate(30%, 25%); }
+    opacity: 0.45;
+    animation: planetFloat 80s ease-in-out infinite alternate;
 }
 
 @keyframes planetFloat {
-    from { transform: translateY(-20px); }
-    to   { transform: translateY(20px); }
+    from { transform: translateY(-30px); }
+    to   { transform: translateY(30px); }
 }
 
 /* ============================= */
-/* 🧭 دعم العربية RTL */
+/* 🧭 RTL صحيح (بدون قلب) */
 /* ============================= */
 .gradio-container {
     direction: rtl;
@@ -179,23 +145,23 @@ css = """
     background: transparent !important;
 }
 
-/* محاذاة الأعمدة */
-.gradio-container .row {
-    flex-direction: row-reverse;
+/* لا نقلب الـ flex */
+.row {
+    flex-direction: row;
 }
 
 /* ============================= */
-/* 🎨 عناصر الواجهة */
+/* 🎨 النصوص */
 /* ============================= */
-h1, h2, h3, label {
-    color: #7a8450;
+h1, h2, h3, label, .markdown {
+    color: #cfd6b5;
     text-align: right;
 }
 
 textarea, input {
-    background-color: #101412 !important;
-    color: #d6ddb8 !important;
-    border: 1px solid #4f5632 !important;
+    background-color: #0f130f !important;
+    color: #e5ecd2 !important;
+    border: 1px solid #556b2f !important;
     text-align: right;
 }
 
@@ -204,19 +170,7 @@ button {
     color: black !important;
     border-radius: 10px !important;
     font-weight: bold;
-}
-
-button:hover {
-    background-color: #6b8e23 !important;
-}
-
-.markdown {
-    color: #d6ddb8;
-    font-family: monospace;
-    line-height: 1.9;
-    text-align: right;
-}
-"""
+}"""
 
 
 # ==============================